82 lines
2.1 KiB
JavaScript
82 lines
2.1 KiB
JavaScript
import React, { useState, useEffect } from "react";
|
|
import { Form, Input, InputNumber, Button, Select, DatePicker } from "antd";
|
|
import axios from "axios";
|
|
|
|
const { TextArea } = Input;
|
|
const { Option } = Select;
|
|
const dateFormat = "YYYY-MM-DD";
|
|
|
|
export const FormCreateItem = ({ onClose }) => {
|
|
const [form] = Form.useForm();
|
|
const [rooms, setRooms] = useState([]);
|
|
|
|
useEffect(() => {
|
|
const fetchRooms = async () => {
|
|
try {
|
|
const response = await axios.get(
|
|
`${import.meta.env.VITE_API_URL}/room`,
|
|
);
|
|
setRooms(response.data);
|
|
} catch (error) {
|
|
console.error(error);
|
|
}
|
|
};
|
|
|
|
fetchRooms();
|
|
}, []);
|
|
|
|
const onFinish = async (values) => {
|
|
try {
|
|
const response = await axios.post(
|
|
`${import.meta.env.VITE_API_URL}/item`,
|
|
values,
|
|
);
|
|
console.log(response.data);
|
|
// Fermer la fenêtre modale après soumission réussie
|
|
onClose();
|
|
} catch (error) {
|
|
console.error(error);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<Form form={form} onFinish={onFinish}>
|
|
<h1>Create Item</h1>
|
|
<Form.Item label="Brand" name="brand">
|
|
<Input />
|
|
</Form.Item>
|
|
<Form.Item label="Model" name="model">
|
|
<Input />
|
|
</Form.Item>
|
|
<Form.Item label="Room" name="room">
|
|
<Select placeholder="Select a room">
|
|
{rooms.map((room) => (
|
|
<Option key={room._id} value={room._id}>
|
|
{room.name}
|
|
</Option>
|
|
))}
|
|
</Select>
|
|
</Form.Item>
|
|
<Form.Item label="Price" name="price">
|
|
<InputNumber />
|
|
</Form.Item>
|
|
<Form.Item label="Purchase Date" name="purchaseDate">
|
|
<DatePicker format={dateFormat} />
|
|
</Form.Item>
|
|
<Form.Item label="Description" name="description">
|
|
<TextArea rows={4} />
|
|
</Form.Item>
|
|
<Form.Item label="Link" name="link">
|
|
<Input />
|
|
</Form.Item>
|
|
<Form.Item>
|
|
<Button type="primary" htmlType="submit">
|
|
Submit
|
|
</Button>
|
|
</Form.Item>
|
|
</Form>
|
|
);
|
|
};
|
|
|
|
export default FormCreateItem;
|