diff --git a/src/components/LoginReg/LoginCard.jsx b/src/components/LoginReg/LoginCard.jsx
index 0a998ec9d29cb0dff5de8a32e1d64c70da7ba73e..dffb11ba885bac94c27c00621ee421242b7dd112 100644
--- a/src/components/LoginReg/LoginCard.jsx
+++ b/src/components/LoginReg/LoginCard.jsx
@@ -1,31 +1,76 @@
-import React, { useState } from "react";
-import { AiOutlineUser } from "react-icons/ai";
+import React, { useState, useEffect } from "react";
+import { AiOutlineUser, AiOutlineCheck } from "react-icons/ai";
 import { Navigate } from "react-router-dom";
+import { motion } from "framer-motion";
+
 import InputArea from "../InputArea";
 import LoginBtn from "./LoginBtn";
 import PwArea from "./PwArea";
 import RememberPw from "./RememberPw";
 import { onLogin } from "../../utils/adminCookie";
 import { accounts } from "../../utils/data";
+import axios from "axios";
 
 const LoginCard = () => {
   const [userInput, setUserInput] = useState("");
   const [pwInput, setPwInput] = useState("");
+  const [codeInput, setCodeInput] = useState("");
+
+  const [imgCode, setImgCode] = useState("");
+
   const [loginSucc, setLoginSucc] = useState(false);
+  const [loginFail, setLoginFail] = useState(false);
+
+  const getCode = (e) => {
+    e.stopPropagation();
+    axios
+      .get("http://localhost:8081/code", { withCredentials: true })
+      .then((res) => {
+        setImgCode(res.data);
+      })
+      .catch((error) => {
+        console.log(error);
+      });
+  };
+
   const handleSubmit = (e) => {
     e.preventDefault();
-    const [uname, upw] = document.forms[0];
+    const [uname, upw, ucode] = document.forms[0];
     if (uname.value === "12" && upw.value === "12") {
       setLoginSucc(true);
-      onLogin(accounts.filter(item=>item.username===uname.value))
-    }else if (uname.value === "34" && upw.value === "34"){
+      onLogin(accounts.filter((item) => item.username === uname.value));
+    } else if (uname.value === "34" && upw.value === "34") {
       setLoginSucc(true);
-      onLogin(accounts.filter(item=>item.username===uname.value))
+      onLogin(accounts.filter((item) => item.username === uname.value));
     }
+    axios
+      .get(
+        "http://localhost:8081/login",
+        { params: { username: uname, password: upw, code: ucode } },
+        { withCredentials: true }
+      )
+      .then((res) => {
+        setLoginSucc(true);
+      })
+      .catch((error) => {
+        setLoginFail(true);
+        console.log(error);
+      });
   };
 
+  useEffect(() => {
+    axios
+      .get("http://localhost:8081/code", { withCredentials: true })
+      .then((res) => {
+        setImgCode(res.data);
+      })
+      .catch((error) => {
+        console.log(error);
+      });
+  }, []);
+
   return loginSucc ? (
-    <Navigate replace to="/admin"/>
+    <Navigate replace to="/admin" />
   ) : (
     <form onSubmit={handleSubmit}>
       <div className="md:w-[600px] px-10 md:px-20 pt-4 pb-6 gap-4 flex flex-col justify-between">
@@ -44,7 +89,36 @@ const LoginCard = () => {
           value={pwInput}
           onChange={(e) => setPwInput(e.target.value)}
         ></PwArea>
+        <div className="relative">
+          <AiOutlineCheck className="w-4 h-4 text-gray-400 absolute m-2 translate-y-0.5"></AiOutlineCheck>
+          <InputArea
+            placeholder={"请输入验证码"}
+            value={codeInput}
+            onChange={(e) => setCodeInput(e.target.value)}
+          ></InputArea>
+          <img
+            src={`data:image/png;base64,${imgCode}`}
+            alt="验证码"
+            title="点击切换"
+            className="absolute top-0 right-0 w-20 h-full hover:cursor-pointer"
+            onClick={getCode}
+          />
+        </div>
         <RememberPw></RememberPw>
+        {/* Login Fail */}
+        {loginFail && (
+          <motion.div
+            initial={{ opacity: 0 }}
+            animate={{ opacity: 1 }}
+            exit={{ opacity: 0 }}
+            className="bg-pink-100 border-2 border-red-200 text-red-400 pl-1 py-1 text-sm before:content-['⚠'] before:text-red-600"
+          >
+            <label className="pl-1">
+              账号信息或验证码有误，请检查后重新输入
+            </label>
+          </motion.div>
+        )}
+
         <LoginBtn name={"登 录"}></LoginBtn>
       </div>
     </form>
diff --git a/src/components/Selector.jsx b/src/components/Selector.jsx
index 4d1b288366986ffb56b0357fd7e7fdb3cf493ca0..cf26efd5bda46badfcf93d39861edaa6be6d101a 100644
--- a/src/components/Selector.jsx
+++ b/src/components/Selector.jsx
@@ -3,6 +3,7 @@ import React from "react";
 const Selector = ({ value, onChange, className, categories }) => {
   return (
     <select
+      required={true}
       value={value}
       onChange={onChange}
       className={
@@ -10,9 +11,12 @@ const Selector = ({ value, onChange, className, categories }) => {
         "w-[90px] pl-1 py-1 outline-none border-gray-300 border-2 rounded text-gray-600 font-medium"
       }
     >
+      <option value="" selected hidden className="text-gray-500">
+        请选择
+      </option>
       {categories &&
         categories.map((item) => (
-          <option key={item.id} value={item.name}>
+          <option key={item.id} value={item.id}>
             {item.name}
           </option>
         ))}
diff --git a/src/components/System/AuthManage/AlterAuth.jsx b/src/components/System/AuthManage/AlterAuth.jsx
index be8cf76c637f4d338dd8ca4b4504f854de973e85..9fa8b261a70ccb9d7575f8a67a341f4e44a1ee06 100644
--- a/src/components/System/AuthManage/AlterAuth.jsx
+++ b/src/components/System/AuthManage/AlterAuth.jsx
@@ -1,9 +1,10 @@
 import React, { useState } from "react";
+
 import Selector from "../../Selector";
 import { adminCategories } from "../../../utils/data";
 
-const AlterAuth = ({ item }) => {
-  const [adminCategory, setAdminCategory] = useState("");
+const AlterAuth = ({ item, setFormPriority }) => {
+  const [adminCategory, setAdminCategory] = useState(null);
   return (
     <div className="flex flex-col items-start gap-4">
       <div>
@@ -14,7 +15,10 @@ const AlterAuth = ({ item }) => {
         <div className="w-16">权限：</div>
         <Selector
           value={adminCategory}
-          onChange={(e) => setAdminCategory(e.target.value)}
+          onChange={(e) => {
+            setAdminCategory(e.target.value);
+            setFormPriority(e.target.value);
+          }}
           className={
             "w-full py-1 outline-none border-gray-300 border-2 rounded-lg font-medium"
           }
diff --git a/src/components/System/AuthManage/Auth.jsx b/src/components/System/AuthManage/Auth.jsx
index 70fe3dceae101b579350860178d81ce93d040267..3cb686819437c87794246fe34c970e8542296eb9 100644
--- a/src/components/System/AuthManage/Auth.jsx
+++ b/src/components/System/AuthManage/Auth.jsx
@@ -9,15 +9,19 @@ const Auth = () => {
   const [curData, setCurData] = useState("");
   const [isModalVisible, setIsModalVisible] = useState(false);
   const [isCancelModalVisible, setIsCancelModalVisible] = useState(false);
-  const [mockEmployeeData, setMockEmployeeData] = useState([]);
+  const [employeeData, setEmployeeData] = useState([]);
+
+  const [formPriority, setFormPriority] = useState(null);
 
   const showModal = (item) => {
     setCurData(item);
+    setFormPriority(null);
     setIsModalVisible(true);
   };
 
-  const handleOk = () => {
+  const handleOk = (e) => {
     setIsModalVisible(false);
+    handleSubmit(e);
   };
 
   const handleCancel = () => {
@@ -33,9 +37,16 @@ const Auth = () => {
     setIsCancelModalVisible(false);
   };
 
+  const handleSubmit = (e) => {
+    e.preventDefault();
+    console.log(formPriority);
+    // const [priority] = document.forms[0];
+    // console.log(priority);
+  };
+
   useEffect(() => {
     axios.get("/admin/system/employee-manage").then((res) => {
-      setMockEmployeeData(res.data.result.list);
+      setEmployeeData(res.data.result.list);
     });
   }, []);
 
@@ -72,7 +83,7 @@ const Auth = () => {
         <TabPane tab="系统管理员" key="1">
           <Table
             columns={columns}
-            dataSource={mockEmployeeData
+            dataSource={employeeData
               .filter((item) => item.priority === 0)
               .map((item) => ({
                 ...item,
@@ -89,7 +100,7 @@ const Auth = () => {
         <TabPane tab="仓库员工" key="2">
           <Table
             columns={columns}
-            dataSource={mockEmployeeData
+            dataSource={employeeData
               .filter((item) => item.priority !== 0)
               .map((item) => ({
                 ...item,
@@ -104,27 +115,34 @@ const Auth = () => {
           />
         </TabPane>
       </Tabs>
-      <Modal
-        title="权限信息"
-        visible={isModalVisible}
-        closable={false}
-        onOk={handleOk}
-        onCancel={handleCancel}
-        okText={"确认"}
-        cancelText={"放弃修改"}
-      >
-        <AlterAuth item={curData} />
-      </Modal>
-      <Modal
-        visible={isCancelModalVisible}
-        closable={false}
-        onOk={secondHandleOk}
-        onCancel={secondHandleCancel}
-        okText={"是"}
-        cancelText={"否"}
-      >
-        ⚠️ 确定放弃修改吗？
-      </Modal>
+      {isModalVisible && (
+        <Modal
+          title="权限信息"
+          visible={isModalVisible}
+          closable={false}
+          onOk={handleOk}
+          onCancel={handleCancel}
+          okText={"确认"}
+          cancelText={"放弃修改"}
+        >
+          <form id="alterAuth" onSubmit={handleSubmit}>
+            <AlterAuth item={curData} setFormPriority={setFormPriority} />
+          </form>
+        </Modal>
+      )}
+
+      {isCancelModalVisible && (
+        <Modal
+          visible={isCancelModalVisible}
+          closable={false}
+          onOk={secondHandleOk}
+          onCancel={secondHandleCancel}
+          okText={"是"}
+          cancelText={"否"}
+        >
+          ⚠️ 确定放弃修改吗？
+        </Modal>
+      )}
     </div>
   );
 };
diff --git a/src/components/System/Customer/Custom.jsx b/src/components/System/Customer/Custom.jsx
index 6c53099fe1b42961b63749703d4fa0a184dbb5e8..3d74bd71a85caf76c29d317d5efc78e686be4f30 100644
--- a/src/components/System/Customer/Custom.jsx
+++ b/src/components/System/Customer/Custom.jsx
@@ -3,7 +3,7 @@ import axios from "axios";
 import InputArea from "../../InputArea";
 import { FiSearch } from "react-icons/fi";
 import { sex, status } from "../../../utils/data";
-import { Table, Modal } from "antd";
+import { Table, Modal, Button } from "antd";
 import EditCustomer from "./EditCustomer";
 
 const Custom = () => {
@@ -11,7 +11,10 @@ const Custom = () => {
   const [curData, setCurData] = useState("");
   const [searchRes, setSearchRes] = useState([]);
   const [mockUserData, setMockUserData] = useState([]);
+
+  const [loading, setLoading] = useState(false);
   const [isModalVisible, setIsModalVisible] = useState(false);
+  const [isDeleteModalVisible, setIsDeleteModalVisible] = useState(false);
   const [isCancelModalVisible, setIsCancelModalVisible] = useState(false);
 
   const [formSex, setFormSex] = useState(null);
@@ -33,7 +36,8 @@ const Custom = () => {
   };
 
   const handleOk = (e) => {
-    setIsModalVisible(false);
+    // setIsModalVisible(false);
+    setLoading(true);
     handleEditSubmit(e);
   };
 
@@ -50,6 +54,19 @@ const Custom = () => {
     setIsCancelModalVisible(false);
   };
 
+  const showDeleteModal = (item) => {
+    console.log(item);
+    setIsDeleteModalVisible(true);
+  };
+
+  const deleteHandleOk = () => {
+    setIsDeleteModalVisible(false);
+  };
+
+  const deleteHandleCancel = () => {
+    setIsDeleteModalVisible(false);
+  };
+
   const searchHandler = (e) => {
     e.preventDefault();
     const [userInfo] = document.forms[0];
@@ -72,6 +89,10 @@ const Custom = () => {
       phone.value,
       formStatus
     );
+    setTimeout(() => {
+      setLoading(false);
+      setIsModalVisible(false);
+    }, 1500);
   };
 
   useEffect(() => {
@@ -130,7 +151,12 @@ const Custom = () => {
             >
               编辑
             </button>
-            <button className={"text-red-500 hover:underline"}>注销</button>
+            <button
+              onClick={() => showDeleteModal(record)}
+              className={"text-red-500 hover:underline"}
+            >
+              注销
+            </button>
           </>
         );
       },
@@ -185,8 +211,21 @@ const Custom = () => {
           onOk={handleOk}
           onCancel={handleCancel}
           // destroyOnClose={true}
-          okText={"确认"}
-          cancelText={"放弃修改"}
+          // okText={"确认"}
+          // cancelText={"放弃修改"}
+          footer={[
+            <Button key="back" onClick={handleCancel}>
+              {"放弃修改"}
+            </Button>,
+            <Button
+              key="submit"
+              type="primary"
+              loading={loading}
+              onClick={handleOk}
+            >
+              {"确认"}
+            </Button>,
+          ]}
         >
           <form id="editForm" onSubmit={handleEditSubmit}>
             <EditCustomer
@@ -198,6 +237,21 @@ const Custom = () => {
         </Modal>
       )}
 
+      {/* Delete Modal */}
+      {isDeleteModalVisible && (
+        <Modal
+          visible={isDeleteModalVisible}
+          closable={false}
+          onOk={deleteHandleOk}
+          onCancel={deleteHandleCancel}
+          okText={"是"}
+          cancelText={"否"}
+        >
+          ⚠️ 确定注销该账号吗？
+        </Modal>
+      )}
+
+      {/* Cancel Modal */}
       {isCancelModalVisible && (
         <Modal
           visible={isCancelModalVisible}
diff --git a/src/components/System/Employee/AddEmployee.jsx b/src/components/System/Employee/AddEmployee.jsx
index 4bf000794234ad12fe7ea1ec9373900bbd0faed5..00111ca060688111a25ba2ff279835e13a17e119 100644
--- a/src/components/System/Employee/AddEmployee.jsx
+++ b/src/components/System/Employee/AddEmployee.jsx
@@ -1,22 +1,119 @@
-import React from "react";
+import React, { useState } from "react";
+
+import InputArea from "../../InputArea";
+
+const editCSS =
+  "pl-0 my-1 rounded border-2 border-b-blue-200 outline-none focus:ring focus:ring-blue-300 focus:border-white duration-150 ease-in";
+
+const AddEmployee = ({ addSex, addStatus }) => {
+  const [name, setName] = useState(null);
+  const [username, setUsername] = useState(null);
+  const [password, setPassword] = useState(null);
+  const [sex, setSex] = useState(0);
+  const [status, setStatus] = useState(0);
+
+  const handleSexChange = (e) => {
+    setSex(e.target.value);
+    addSex(e.target.value);
+  };
+
+  const handleStatusChange = (e) => {
+    setStatus(e.target.value);
+    addStatus(e.target.value);
+  };
 
-const AddEmployee = ({ onOk, onCancel }) => {
   return (
     <div>
-      <footer className="flex justify-end gap-2">
-        <button
-          onClick={onCancel}
-          className="w-20 py-1 rounded bg-white border-2"
-        >
-          取消
-        </button>
-        <button
-          onClick={onOk}
-          className="w-20 py-1 rounded bg-[#008df9] text-white"
-        >
-          OK
-        </button>
-      </footer>
+      <table>
+        <tbody>
+          <tr>
+            <th className="text-right px-4">员工姓名</th>
+            <td>
+              <InputArea
+                value={name}
+                onChange={(e) => setName(e.target.value)}
+                className={editCSS}
+              />
+            </td>
+          </tr>
+          <tr>
+            <th className="text-right px-4">登录账号</th>
+            <td>
+              <InputArea
+                value={username}
+                onChange={(e) => setUsername(e.target.value)}
+                className={editCSS}
+              />
+            </td>
+          </tr>
+          <tr>
+            <th className="text-right px-4">登录密码</th>
+            <td>
+              <InputArea
+                value={password}
+                onChange={(e) => setPassword(e.target.value)}
+                className={editCSS}
+              />
+            </td>
+          </tr>
+          <tr>
+            <th className="text-right px-4">性别</th>
+            <td>
+              <div className="flex items-center gap-2 my-1">
+                <label htmlFor="female">
+                  <input
+                    type="radio"
+                    name="sex"
+                    value={0}
+                    defaultChecked={sex === 0}
+                    onChange={handleSexChange}
+                  />
+                  female
+                </label>
+
+                <label htmlFor="male">
+                  <input
+                    type="radio"
+                    name="sex"
+                    value={1}
+                    defaultChecked={sex === 1}
+                    onChange={handleSexChange}
+                  />
+                  male
+                </label>
+              </div>
+            </td>
+          </tr>
+
+          <tr>
+            <th className="text-right px-4">账号状态</th>
+            <td>
+              <div className="flex items-center gap-2 my-1">
+                <div>
+                  <input
+                    type="radio"
+                    name="status"
+                    value={0}
+                    defaultChecked={status === 0}
+                    onChange={handleStatusChange}
+                  />
+                  <label htmlFor="inactive">inactive</label>
+                </div>
+                <div>
+                  <input
+                    type="radio"
+                    name="status"
+                    value={1}
+                    defaultChecked={status === 1}
+                    onChange={handleStatusChange}
+                  />
+                  <label htmlFor="active">active</label>
+                </div>
+              </div>
+            </td>
+          </tr>
+        </tbody>
+      </table>
     </div>
   );
 };
diff --git a/src/components/System/Employee/Employee.jsx b/src/components/System/Employee/Employee.jsx
index 8bf6bc806468578e16769db2c29387fe2e6d38bf..ae04bef353016a978f5c6374d2cb9f6c4a2af996 100644
--- a/src/components/System/Employee/Employee.jsx
+++ b/src/components/System/Employee/Employee.jsx
@@ -1,7 +1,7 @@
 import React, { useState, useEffect } from "react";
 import axios from "axios";
 import { FiSearch } from "react-icons/fi";
-import { Table, Modal } from "antd";
+import { Table, Modal, Button } from "antd";
 
 import InputArea from "../../InputArea";
 import AddEmployee from "./AddEmployee";
@@ -12,30 +12,43 @@ const Employee = () => {
   const [info, setInfo] = useState("");
   const [curData, setCurData] = useState("");
   const [searchRes, setSearchRes] = useState([]);
+  const [employeeData, setEmployeeData] = useState([]);
+
+  const [loading, setLoading] = useState(false);
   const [isModalVisible, setIsModalVisible] = useState(false);
+  const [isAddModalVisible, setIsAddModalVisible] = useState(false);
+  const [isDeleteModalVisible, setIsDeleteModalVisible] = useState(false);
   const [isCancelModalVisible, setIsCancelModalVisible] = useState(false);
-  const [mockEmployee, setMockEmployee] = useState([]);
 
-  const [formSex, setFormSex] = useState(null);
-  const [formStatus, setFormStatus] = useState(null);
+  const [editSex, setEditSex] = useState(0);
+  const [editStatus, setEditStatus] = useState(0);
+
+  const [addSex, setAddSex] = useState(null);
+  const [addStatus, setAddStatus] = useState(null);
 
   const updateSex = (sex) => {
-    setFormSex(sex);
+    setEditSex(sex);
   };
 
   const updateStatus = (status) => {
-    setFormStatus(status);
+    setEditStatus(status);
   };
 
   const showModal = (item) => {
     setCurData(item);
     setIsModalVisible(true);
-    setFormSex(item.sex);
-    setFormStatus(item.status);
+    setEditSex(item.sex);
+    setEditStatus(item.status);
+  };
+
+  const showAddModal = () => {
+    setAddSex(0);
+    setAddStatus(0);
+    setIsAddModalVisible(true);
   };
 
   const handleOk = (e) => {
-    setIsModalVisible(false);
+    setLoading(true);
     handleEditSubmit(e);
   };
 
@@ -46,44 +59,78 @@ const Employee = () => {
   const secondHandleOk = () => {
     setIsCancelModalVisible(false);
     setIsModalVisible(false);
+    setIsAddModalVisible(false);
   };
 
   const secondHandleCancel = () => {
     setIsCancelModalVisible(false);
   };
 
+  const showDeleteModal = (item) => {
+    console.log(item)
+    setIsDeleteModalVisible(true);
+  };
+
+  const deleteHandleOk = () => {
+    setIsDeleteModalVisible(false);
+  };
+
+  const deleteHandleCancel = () => {
+    setIsDeleteModalVisible(false);
+  };
+
+  const handleAddOk = (e) => {
+    // todo 输入为空阻止提交
+    setLoading(true);
+    handleAddSubmit(e);
+  };
+
   const searchHandler = (e) => {
     e.preventDefault();
     const [employeeInfo] = document.forms[0];
     // console.log(employeeInfo.value);
     if (employeeInfo.value !== "") {
       setSearchRes(
-        mockEmployee.filter(
+        employeeData.filter(
           (item) =>
             item.id === employeeInfo.value ||
             priority[item.priority] === employeeInfo.value
         )
       );
     } else {
-      setSearchRes(mockEmployee);
+      setSearchRes(employeeData);
     }
   };
 
   const handleEditSubmit = (e) => {
     e.preventDefault();
-    const [name, username, password, , ] = document.forms[1];
+    const [name, username, password, ,] = document.forms[1];
     console.log(
       name.value,
       username.value,
       password.value,
-      formSex,
-      formStatus
+      editSex,
+      editStatus
     );
+    setTimeout(() => {
+      setLoading(false);
+      setIsModalVisible(false);
+    }, 1500);
+  };
+
+  const handleAddSubmit = (e) => {
+    e.preventDefault();
+    const [name, username, password] = document.forms[1];
+    console.log(name.value, username.value, password.value, addSex, addStatus);
+    setTimeout(() => {
+      setLoading(false);
+      setIsAddModalVisible(false);
+    }, 1500);
   };
 
   useEffect(() => {
     axios.get("/admin/system/employee-manage").then((res) => {
-      setMockEmployee(res.data.result.list);
+      setEmployeeData(res.data.result.list);
       setSearchRes(res.data.result.list);
     });
   }, []);
@@ -142,7 +189,12 @@ const Employee = () => {
             >
               编辑
             </button>
-            <button className={"text-red-500 hover:underline"}>注销</button>
+            <button
+              onClick={() => showDeleteModal(record)}
+              className={"text-red-500 hover:underline"}
+            >
+              注销
+            </button>
           </>
         );
       },
@@ -169,7 +221,10 @@ const Employee = () => {
             <FiSearch className="text-gray-600 font-semibold" />
           </button>
         </form>
-        <button className="px-4 py-1 rounded bg-[#008df9] text-white">
+        <button
+          onClick={showAddModal}
+          className="px-4 py-1 rounded bg-[#008df9] text-white"
+        >
           {"员工开户"}
         </button>
       </div>
@@ -199,8 +254,21 @@ const Employee = () => {
           closable={false}
           onOk={handleOk}
           onCancel={handleCancel}
-          okText={"确认"}
-          cancelText={"放弃修改"}
+          // okText={"确认"}
+          // cancelText={"放弃修改"}
+          footer={[
+            <Button key="back" onClick={handleCancel}>
+              {"放弃修改"}
+            </Button>,
+            <Button
+              key="submit"
+              type="primary"
+              loading={loading}
+              onClick={handleOk}
+            >
+              {"确认"}
+            </Button>,
+          ]}
         >
           <form id="editForm" onSubmit={handleEditSubmit}>
             <EditEmployee
@@ -212,6 +280,56 @@ const Employee = () => {
         </Modal>
       )}
 
+      {/* Add Modal */}
+      {isAddModalVisible && (
+        <Modal
+          title="新员工信息"
+          visible={isAddModalVisible}
+          closable={false}
+          onOk={handleAddOk}
+          onCancel={handleCancel}
+          footer={[
+            <Button key="back" onClick={handleCancel}>
+              {"取消"}
+            </Button>,
+            <Button
+              key="submit"
+              type="primary"
+              loading={loading}
+              onClick={handleAddOk}
+            >
+              {"确认"}
+            </Button>,
+          ]}
+        >
+          <form id="addForm" onSubmit={handleAddSubmit}>
+            <AddEmployee
+              addSex={(sex) => {
+                setAddSex(sex);
+              }}
+              addStatus={(status) => {
+                setAddStatus(status);
+              }}
+            />
+          </form>
+        </Modal>
+      )}
+
+      {/* Delete Modal */}
+      {isDeleteModalVisible && (
+        <Modal
+          visible={isDeleteModalVisible}
+          closable={false}
+          onOk={deleteHandleOk}
+          onCancel={deleteHandleCancel}
+          okText={"是"}
+          cancelText={"否"}
+        >
+          ⚠️ 确定注销该账号吗？
+        </Modal>
+      )}
+
+      {/* Cancel Modal */}
       {isCancelModalVisible && (
         <Modal
           visible={isCancelModalVisible}
diff --git a/src/components/System/Order/Order.jsx b/src/components/System/Order/Order.jsx
index fabf869bc55ba6d99e277d1b90f2e2f5d23baad3..90360d64304a21baa8f9272c3c03004fc6f9a1ca 100644
--- a/src/components/System/Order/Order.jsx
+++ b/src/components/System/Order/Order.jsx
@@ -14,8 +14,8 @@ import InputArea from "../../InputArea";
 import EditOrder from "./EditOrder";
 
 const Order = () => {
-  const [cate, setCate] = useState("全部");
-  const [status, setStatus] = useState("全部");
+  const [cate, setCate] = useState(5);
+  const [status, setStatus] = useState(3);
   const [curData, setCurData] = useState("");
   const [searchRes, setSearchRes] = useState([]);
   const [mockOrderData, setMockOrderData] = useState([]);
@@ -48,15 +48,14 @@ const Order = () => {
   const searchHandler = (e) => {
     e.preventDefault();
     const [type, status, input] = document.forms[0];
+    console.log((type.value),status.value)
     // todo
-    if (type.value === "全部" && status.value === "全部") {
+    if (+(type.value) === 5 && +(status.value) === 3) {
       setSearchRes(mockOrderData);
-    } else if (type.value !== "全部" && status.value !== "全部") {
+    } else if (type.value !== 5 && status.value !== 3) {
       setSearchRes(
         mockOrderData.filter(
-          (data) =>
-            orderType[data.type] === type.value &&
-            orderStatus[data.status] === status.value
+          (data) => data.type === type.value && data.status === status.value
         )
       );
     }
diff --git a/src/components/WareManager/Analysis.jsx b/src/components/WareManager/Analysis.jsx
index 5d227754f0ec48ee595b58d5fcefc98e68334946..df775d45e209c052935965f77cf5c20a703998c3 100644
--- a/src/components/WareManager/Analysis.jsx
+++ b/src/components/WareManager/Analysis.jsx
@@ -1,123 +1,9 @@
-import React, { useState, useEffect, useRef } from "react";
+import React, { useEffect, useRef } from "react";
 import * as echarts from "echarts";
 
 const Analysis = () => {
   const inOutRef = useRef(null);
-  const data = [
-    {
-      type: "入库",
-      value: 65,
-    },
-    {
-      type: "出库",
-      value: 35,
-    },
-  ];
-  const config = {
-    appendPadding: 10,
-    data,
-    angleField: "value",
-    colorField: "type",
-    radius: 1,
-    innerRadius: 0.6,
-    label: {
-      type: "inner",
-      offset: "-50%",
-      content: function content(_ref) {
-        return "".concat(_ref.value, "%");
-      },
-      style: {
-        textAlign: "center",
-        fontSize: 14,
-      },
-    },
-    interactions: [
-      {
-        type: "element-selected",
-      },
-      {
-        type: "element-active",
-      },
-    ],
-    statistic: {
-      title: false,
-      content: {
-        style: {
-          whiteSpace: "pre-wrap",
-          overflow: "hidden",
-          textOverflow: "ellipsis",
-        },
-        content: "次数",
-      },
-    },
-  };
-
-  const data2 = [
-    {
-      type: "家具家电",
-      sales: 38,
-    },
-    {
-      type: "粮油副食",
-      sales: 52,
-    },
-    {
-      type: "生鲜水果",
-      sales: 61,
-    },
-    {
-      type: "美容洗护",
-      sales: 145,
-    },
-    {
-      type: "母婴用品",
-      sales: 48,
-    },
-    {
-      type: "进口食品",
-      sales: 38,
-    },
-    {
-      type: "食品饮料",
-      sales: 38,
-    },
-    {
-      type: "家庭清洁",
-      sales: 38,
-    },
-  ];
-  const config2 = {
-    data: data2,
-    xField: "type",
-    yField: "sales",
-    columnStyle: {
-      radius: [8, 8, 8, 8],
-    },
-    label: {
-      // 可手动配置 label 数据标签位置
-      position: "middle",
-      // 'top', 'bottom', 'middle',
-      // 配置样式
-      style: {
-        fill: "#FFFFFF",
-        opacity: 0.6,
-      },
-    },
-    xAxis: {
-      label: {
-        autoHide: true,
-        autoRotate: false,
-      },
-    },
-    meta: {
-      type: {
-        alias: "类别",
-      },
-      sales: {
-        alias: "销售额",
-      },
-    },
-  };
+  const inOutRefBar = useRef(null);
 
   useEffect(() => {
     let chartInstance = echarts.init(inOutRef.current);
@@ -158,6 +44,68 @@ const Analysis = () => {
       ],
     };
     chartInstance.setOption(option);
+
+    let chartInstanceBar = echarts.init(inOutRefBar.current);
+    const optionBar = {
+      tooltip: {
+        trigger: "axis",
+        backgroundColor: "rgba(32, 33, 36,.7)",
+        borderColor: "rgba(32, 33, 36,0.20)",
+        borderWidth: 1,
+        textStyle: {
+          // 文字提示样式
+          color: "#fff",
+          fontSize: "12",
+        },
+        formatter: "{c}%",
+      },
+      grid: {
+        top: "15%",
+
+        left: "15%",
+
+        right: "10%",
+
+        bottom: "10%",
+      },
+      xAxis: {
+        axisTick: {
+          show: false, //不显示坐标轴刻度线
+        },
+        axisLine: {
+          show: false, //不显示坐标轴线
+        },
+        type: "category",
+        data: ["01", "02", "03", "04", "05", "06", "07", "08"],
+      },
+      yAxis: {
+        type: "value",
+        max: 100,
+        splitNumber: 5,
+        axisLabel: {
+          show: true,
+          interval: 0,
+          formatter: "{value} %", // 给每个数值添加%
+        },
+      },
+      color: ["#5459BC"],
+      series: [
+        {
+          data: [26, 20, 16, 42, 90, 40, 65, 50],
+          type: "bar",
+          barWidth: 20,
+          itemStyle: {
+            emphasis: {
+              barBorderRadius: 6,
+            },
+            normal: {
+              barBorderRadius: 6,
+            },
+          },
+        },
+      ],
+    };
+    chartInstanceBar.setOption(optionBar);
   }, []);
 
   return (
@@ -185,8 +133,7 @@ const Analysis = () => {
           <label className="text-[#494A66] text-base font-normal">
             仓库使用率
           </label>
-          <h4 className="text-[#494A66] text-base pl-4 pt-2">13:00~14:00</h4>
-          {/* <Pie {...config} /> */}
+          <div ref={inOutRefBar} className="h-[250px]"></div>
         </div>
         <div className="w-1/2 p-4 bg-white rounded">
           <label className="text-[#494A66] text-base font-normal">
diff --git a/src/components/WareManager/Stock.jsx b/src/components/WareManager/Stock.jsx
index 12ca0c6a4fbabbcc86151b67e26a352ad8adaaf9..b321b9e86c275870ba134a5a9634682f851f909b 100644
--- a/src/components/WareManager/Stock.jsx
+++ b/src/components/WareManager/Stock.jsx
@@ -9,18 +9,23 @@ import { wareCategories } from "../../utils/data";
 import Selector from "../Selector";
 import InputArea from "../InputArea";
 
-const onChange = (date, dateString) => {
-  console.log(date, dateString);
-};
-
 const Stock = () => {
-  const [cate, setCate] = useState("全部");
-  const [status, setStatus] = useState("全部");
+  const onChange = (date, dateString) => {
+    setTime(dateString);
+    console.log(date, dateString);
+  };
+
+  const [cate, setCate] = useState(null);
+  const [time, setTime] = useState(null);
+  const [info, setInfo] = useState(null);
+
   const [mockStockData, setMockStockData] = useState([]);
+  const [dataSource, setDataSource] = useState([]);
 
   useEffect(() => {
     axios.get("/admin/ware-manager/stock").then((res) => {
       setMockStockData(res.data.result.list);
+      setDataSource(res.data.result.list);
       // setSearchRes(res.data.result.list);
     });
   }, []);
@@ -57,6 +62,58 @@ const Stock = () => {
     },
   ];
 
+  const query = (event) => {
+    if (cate == null && time == null && info == null) {
+      setMockStockData(dataSource);
+    } else if (cate != null && time == null && info == null) {
+      setMockStockData(dataSource.filter((item) => item.repository == cate));
+    } else if (cate == null && time != null && info == null) {
+      setMockStockData(dataSource.filter((item) => item.time == time));
+    } else if (cate == null && time == null && info != null) {
+      setMockStockData(
+        dataSource.filter(
+          (item) => item.ower == info || item.type == info || item.name == info
+        )
+      );
+    } else if (cate == null && time != null && info != null) {
+      setMockStockData(
+        dataSource.filter(
+          (item) =>
+            item.time == time &&
+            (item.ower == info || item.type == info || item.name == info)
+        )
+      );
+    } else if (cate != null && time != null && info == null) {
+      setMockStockData(
+        dataSource.filter(
+          (item) => item.time == time && item.repository == cate
+        )
+      );
+    } else if (cate != null && time == null && info != null) {
+      setMockStockData(
+        dataSource.filter(
+          (item) =>
+            item.repository == cate &&
+            (item.ower == info || item.type == info || item.name == info)
+        )
+      );
+    } else if (cate != null && time != null && info != null) {
+      setMockStockData(
+        dataSource.filter(
+          (item) =>
+            item.time == time &&
+            item.repository == cate &&
+            (item.ower == info || item.type == info || item.name == info)
+        )
+      );
+    }
+
+    //setMockStockData(dataSource.filter(item=>item.repository==cate&&item.time==time));
+    console.log(cate);
+    console.log(time);
+    event.preventDefault();
+  };
+
   return (
     <div>
       <div className="flex items-center px-6 pt-6 pb-4 gap-4">
@@ -65,7 +122,9 @@ const Stock = () => {
           <Selector
             value={cate}
             onChange={(e) => setCate(e.target.value)}
-            categories={wareCategories}
+            categories={mockStockData.map((item) =>
+              Object.assign({}, { id: item.repository, name: item.repository })
+            )}
           />
           <label className="text-sm font-semibold">入库时间</label>
 
@@ -79,12 +138,14 @@ const Stock = () => {
           </ConfigProvider>
 
           <InputArea
+            onChange={(e) => setInfo(e.target.value)}
             placeholder={"货主名称/货品名称/货品类型"}
             className={
               "w-[200px] pl-2 py-1 outline-none border-gray-300 border-2 rounded"
             }
           />
           <button
+            onClick={query}
             type="submit"
             className="p-2 flex justify-center items-center rounded bg-[#008df9]"
           >
@@ -92,6 +153,7 @@ const Stock = () => {
           </button>
         </form>
       </div>
+
       <div className="pl-6 pr-6 md:pr-10">
         <Table
           columns={columns}
diff --git a/src/components/WareManager/WareQuery.jsx b/src/components/WareManager/WareQuery.jsx
index 4f0d5dca622dc64eec02c1c4f0317264f058494d..ad7f466d92196345086ecf2354346b7f2e3b405b 100644
--- a/src/components/WareManager/WareQuery.jsx
+++ b/src/components/WareManager/WareQuery.jsx
@@ -1,12 +1,11 @@
 import React, { useState, useEffect } from "react";
-import { wareCategories, orderType, orderStatus } from "../../utils/data";
-import { Tabs, Modal, Table } from "antd";
-import Selector from "../Selector";
-import { DatePicker, Space, ConfigProvider } from "antd";
+import { Tabs, Table, DatePicker, Space, ConfigProvider } from "antd";
 import { FiSearch } from "react-icons/fi";
 import locale from "antd/lib/locale/zh_CN";
 import axios from "axios";
 
+import Selector from "../Selector";
+import { taskCategories } from "../../utils/data";
 const { TabPane } = Tabs;
 const onChange = (date, dateString) => {
   console.log(date, dateString);
@@ -14,7 +13,7 @@ const onChange = (date, dateString) => {
 
 const WareQuery = () => {
   const [cate, setCate] = useState("全部");
-  const [status, setStatus] = useState("全部");
+  // const [status, setStatus] = useState("全部");
   const [mockQueryData, setMockQueryData] = useState([]);
 
   useEffect(() => {
@@ -26,7 +25,9 @@ const WareQuery = () => {
   const columns = [
     {
       title: "类型",
-      dataIndex: "id",
+      dataIndex: "type",
+      render: (record) =>
+        record === 0 ? <label>入库</label> : <label>出库</label>,
     },
     {
       title: "仓库号",
@@ -37,16 +38,41 @@ const WareQuery = () => {
       dataIndex: "position",
     },
     {
-      title: "货主名称",
-      dataIndex: "owner",
+      title: "货品名称",
+      dataIndex: "name",
+    },
+    {
+      title: "入库时间",
+      dataIndex: "time",
+      render: (record) => record.split(" ")[0],
+    },
+    {
+      title: "出库时间",
+      dataIndex: "time",
+      render: (record) => record.split(" ")[0],
     },
+  ];
+
+  const column = [
     {
       title: "货品编号",
       dataIndex: "product",
     },
     {
-      title: "货品名称",
-      dataIndex: "name",
+      title: "原仓库号",
+      dataIndex: "repository",
+    },
+    {
+      title: "原仓位号",
+      dataIndex: "position",
+    },
+    {
+      title: "仓库号",
+      dataIndex: "repository",
+    },
+    {
+      title: "仓位号",
+      dataIndex: "position",
     },
     {
       title: "入库时间",
@@ -70,7 +96,7 @@ const WareQuery = () => {
               <Selector
                 value={cate}
                 onChange={(e) => setCate(e.target.value)}
-                categories={wareCategories}
+                categories={taskCategories}
               />
               <label className="text-sm font-semibold">入库时间</label>
               <ConfigProvider locale={locale}>
@@ -115,19 +141,49 @@ const WareQuery = () => {
           </div>
         </TabPane>
         <TabPane tab="移库流水" key="2">
-          <Table
-            columns={columns}
-            dataSource={mockQueryData.map((item) => ({
-              ...item,
-              key: item.id,
-            }))}
-            pagination={{
-              pageSize: 20,
-            }}
-            scroll={{
-              y: 440,
-            }}
-          />
+          <div className="pt-2">
+            <form className="flex items-center gap-2">
+              <label className="text-sm font-semibold">入库时间</label>
+              <ConfigProvider locale={locale}>
+                <Space
+                  className="border-gray-300 border rounded"
+                  direction="vertical"
+                >
+                  <DatePicker onChange={onChange} />
+                </Space>
+              </ConfigProvider>
+              <ConfigProvider locale={locale}>
+                <label className="text-sm font-semibold">出库时间</label>
+                <Space
+                  className="border-gray-300 border rounded"
+                  direction="vertical"
+                >
+                  <DatePicker onChange={onChange} />
+                </Space>
+              </ConfigProvider>
+              <button
+                type="submit"
+                className="p-2 flex justify-center items-center rounded bg-[#008df9]"
+              >
+                <FiSearch className="text-white font-semibold" />
+              </button>
+            </form>
+          </div>
+          <div className="pt-4">
+            <Table
+              columns={column}
+              dataSource={mockQueryData.map((item) => ({
+                ...item,
+                key: item.id,
+              }))}
+              pagination={{
+                pageSize: 20,
+              }}
+              scroll={{
+                y: 440,
+              }}
+            />
+          </div>
         </TabPane>
       </Tabs>
     </div>
diff --git a/src/mock/index.js b/src/mock/index.js
index 8049d341de913189f5963aa1438a38811ff2f469..803eb190c05c28282fbf5f375242d7bdf23afe1e 100644
--- a/src/mock/index.js
+++ b/src/mock/index.js
@@ -104,7 +104,7 @@ Mock.mock("/admin/ware-manager/query", {
   result: {
     "list|10": [
       {
-        "id|+1": 10001,
+        "type|1": [0,1],
         owner: /IC\d{4}/,
         repository: /\d{2}/,
         position: /\d{2}/,
diff --git a/src/pages/LoginReg.jsx b/src/pages/LoginReg.jsx
index 86c14c04ee7a9614d6f700daafc9e6103da37bb2..a21c7dbb226622a41579cd10be47a7a7037d3937 100644
--- a/src/pages/LoginReg.jsx
+++ b/src/pages/LoginReg.jsx
@@ -1,14 +1,15 @@
-import React, { useState } from "react";
-import AdminRegCard from "../components/LoginReg/AdminRegCard";
+import React from "react";
 import LoginCard from "../components/LoginReg/LoginCard";
 // import UserRegCard from "./UserRegCard";
+// import AdminRegCard from "../components/LoginReg/AdminRegCard";
 
 const showCSS =
   "text-blue-500 relative outline-none focus:outline-none before:absolute before:rounded-lg before:w-6 before:h-1 before:left-0 before:bg-gradient-to-tr from-orange-400 to-orange-600 transition-all ease-in-out duration-200";
 
 const LoginReg = () => {
-  const [loginShow, setLoginShow] = useState(true);
-  const [adminRegShow, setAdminRegShow] = useState(false);
+  // 只保留登录功能
+  // const [loginShow, setLoginShow] = useState(true);
+  // const [adminRegShow, setAdminRegShow] = useState(false);
   return (
     <div className="w-full min-w-[375px] h-full flex flex-col justify-start items-center bg-cover bg-login">
       <header className="px-20 pt-16 pb-6 text-center text-2xl cursor-default text-white">
@@ -19,15 +20,15 @@ const LoginReg = () => {
       <div className="w-80% md:w-[520px] px-6 mt-16 flex flex-col justify-start items-center bg-white rounded-xl">
         <nav className="flex justify-center gap-8 pt-4 pb-2 text-gray-500 font-semibold">
           <button
-            className={loginShow ? showCSS : "outline-none focus:outline-none"}
-            onClick={() => {
-              setLoginShow(true);
-              setAdminRegShow(false);
-            }}
+            className={showCSS}
+            // onClick={() => {
+            //   setLoginShow(true);
+            //   setAdminRegShow(false);
+            // }}
           >
             {"登 录"}
           </button>
-          <button
+          {/* <button
             className={
               adminRegShow ? showCSS : "outline-none focus:outline-none"
             }
@@ -37,11 +38,12 @@ const LoginReg = () => {
             }}
           >
             {"注 册"}
-          </button>
+          </button> */}
         </nav>
-        {loginShow && <LoginCard></LoginCard>}
+        <LoginCard></LoginCard>
+        {/* {loginShow && <LoginCard></LoginCard>} */}
         {/* {userRegShow && <UserRegCard></UserRegCard>} */}
-        {adminRegShow && <AdminRegCard></AdminRegCard>}
+        {/* {adminRegShow && <AdminRegCard></AdminRegCard>} */}
       </div>
     </div>
   );