diff --git a/src/pages/deviceAdmin/DeviceDetailModal.jsx b/src/pages/deviceAdmin/DeviceDetailModal.jsx index 1cff3af..6472288 100644 --- a/src/pages/deviceAdmin/DeviceDetailModal.jsx +++ b/src/pages/deviceAdmin/DeviceDetailModal.jsx @@ -1,12 +1,24 @@ import { UploadOutlined } from "@ant-design/icons"; -import { Button, Form, Image, Input, Modal, Select, Upload } from "antd"; +import { + Button, + Form, + Image, + Input, + message, + Modal, + Select, + Upload, +} from "antd"; import TextArea from "antd/es/input/TextArea"; import { useEffect, useState } from "react"; +import { useSelector } from "react-redux"; import axiosInstance, { baseURL } from "../../api/axios"; import { deviceStatusOptions } from "../../config/DeviceStatusConfig"; +import { selectUserId } from "../../features/auth/authSlice"; export default function DeviceDetailModal({ visiable, + mode = "create", device, onclose, onSuccess, @@ -15,57 +27,74 @@ export default function DeviceDetailModal({ const [imageFile, setImageFile] = useState(null); const [initialValues, setInitialValues] = useState({}); const [fileList, setFileList] = useState(); + const userId = useSelector(selectUserId); useEffect(() => { - if (device) { - const values = { - name: device.name, - location: device.location, - usageRequirement: device.usageRequirement, - status: device.status, - }; - form.setFieldsValue(values); - setInitialValues(values); + if (visiable) { + setFileList([]); + if (mode === "edit") { + const values = { + name: device.name, + location: device.location, + usageRequirement: device.usageRequirement, + status: device.status, + }; + form.setFieldsValue(values); + setInitialValues(values); + } else { + const values = { + name: undefined, + location: undefined, + usageRequirement: undefined, + status: undefined, + }; + form.setFieldsValue(values); + setInitialValues(values); + } } - }, [device]); + }, [visiable, mode, device, form]); - const handleEdit = async () => { + const handleOk = async () => { const values = await form.validateFields(); - const updates = {}; + const data = {}; Object.keys(initialValues).forEach((key) => { if (values[key] !== initialValues[key]) { - updates[key] = values[key]; + data[key] = values[key]; } }); - if (Object.keys(updates).length > 0) { - await axiosInstance.put(`/device/${device.deviceId}`, updates); + if (Object.keys(data).length > 0) { + if (mode === "edit") { + await axiosInstance.put(`/device/${device.deviceId}`, data); + message.success("编辑成功"); + } else { + device = await axiosInstance.post(`/device/${userId}`, data); + console.log(device); + + message.success("添加成功"); + } } if (imageFile) { const formData = new FormData(); formData.append("image", imageFile); - await axiosInstance.post(`device/${device.deviceId}/image`, formData, { + await axiosInstance.post(`device/${device.id}/image`, formData, { headers: { "Content-Type": "multipart/form-data", }, }); } onSuccess(); - setFileList([]); - form.resetFields(); onclose(); }; return ( { - setFileList([]); - form.resetFields(); onclose(); }} - onOk={handleEdit} + onOk={handleOk} okText="保存" >
@@ -99,6 +128,7 @@ export default function DeviceDetailModal({ }} showUploadList={{ showRemoveIcon: true }} onChange={({ fileList }) => setFileList(fileList)} + maxCount={1} > diff --git a/src/pages/deviceAdmin/DeviceManage.jsx b/src/pages/deviceAdmin/DeviceManage.jsx index 16b3404..c686581 100644 --- a/src/pages/deviceAdmin/DeviceManage.jsx +++ b/src/pages/deviceAdmin/DeviceManage.jsx @@ -1,4 +1,4 @@ -import { Button, Input, message, Space, Table, Tag } from "antd"; +import { Button, Flex, Input, message, Space, Table, Tag } from "antd"; import Column from "antd/es/table/Column"; import { useEffect, useState } from "react"; import { useSelector } from "react-redux"; @@ -10,6 +10,8 @@ import DeviceDetailModal from "./DeviceDetailModal"; export default function DeviceManage() { const [devices, setDevices] = useState([]); const [selectedDevice, setSelectedDevice] = useState(null); + const [modalOpen, setModalOpen] = useState(false); + const [modalMode, setModalMode] = useState(null); const [searchName, setSearchName] = useState(null); const [pagination, setPagination] = useState({ current: 1, @@ -44,6 +46,7 @@ export default function DeviceManage() { const handleDelete = async (deviceId) => { await axiosInstance.delete(`/device/${deviceId}`); + message.success("删除成功"); const newPagination = { ...pagination, current: 1, @@ -65,13 +68,26 @@ export default function DeviceManage() { // 名称、使用要求、位置、状态 return ( <> - + + + + + { return ( -
setSelectedDevice(null)} + mode={modalMode} + onclose={() => { + setModalOpen(false); + setSelectedDevice(null); + }} onSuccess={async () => { - message.success("编辑成功"); await fetchData(pagination); }} /> diff --git a/src/pages/user/Reserve.jsx b/src/pages/user/Reserve.jsx index 0217f13..437d06d 100644 --- a/src/pages/user/Reserve.jsx +++ b/src/pages/user/Reserve.jsx @@ -59,7 +59,6 @@ export default function Reserve() { <>