feat: 修改传参

src/pages/EmployeeManagement/components/viewDepartmentModal.jsx

@@ -54,8 +54,9 @@ const ViewDepartmentModal = ({ visible, onClose, enterpriseList }) => {
       const res = await apiDepartmentUpdate(params);
       if (res.businessCode === '0000') {
         message.success('修改成功');
+        refForm.resetFields();
         setNameVisible(false);
-        getDepartmentList({ data: { enterpriseId: values.enterpriseId }, ...pageInfo });
+        getDepartmentList({ data: { enterpriseId }, ...pageInfo });
       }
     });
   };
@@ -94,8 +95,9 @@ const ViewDepartmentModal = ({ visible, onClose, enterpriseList }) => {
     },
   ];
   const onCancel = () => {
-    setNameVisible(false);
+    refForm.resetFields();
     setName('');
+    setNameVisible(false);
   };
 
   const onChange = (page, size) => {
@@ -160,6 +162,7 @@ const ViewDepartmentModal = ({ visible, onClose, enterpriseList }) => {
         onCancel={onCancel}
       >
         <Form form={refForm}>
+          {name && (
             <Form.Item
               label="部门名称"
               name="name"
@@ -168,6 +171,7 @@ const ViewDepartmentModal = ({ visible, onClose, enterpriseList }) => {
             >
               <Input />
             </Form.Item>
+          )}
         </Form>
       </Modal>
     </Modal>

src/pages/EmployeeManagement/index.jsx

@@ -27,10 +27,14 @@ import {
 } from './service.js';
 import NewEmployeeModal from './components/newEmployeeModal';
 import DepartmentModal from './components/departmentModal';
-import ViewDepartmentModal from './components/ViewDepartmentModal';
-import BlacklistModal from './components/BlacklistModal';
+import ViewDepartmentModal from './components/viewDepartmentModal';
+import BlacklistModal from './components/blacklistModal';
 import RechargeDetailsModal from './components/RechargeDetailsModal';
 
+const layout = {
+  labelCol: { span: 6 },
+  wrapperCol: { span: 8 },
+};
 const { confirm } = Modal;
 const StoreManagement = () => {
   const [modalVisible, setModalVisible] = useState(false);
@@ -48,6 +52,7 @@ const StoreManagement = () => {
     page: 1,
     size: 10,
   });
+  const [total, setTotal] = useState(0);
   const [searchForm, setSearchForm] = useState({});
   const formRef = useRef(null);
   const [editVisible, setEditVisible] = useState(false);
@@ -55,10 +60,11 @@ const StoreManagement = () => {
   const [repastType, setRepastType] = useState([]);
   const [repastId, setRepastId] = useState(null);
 
-  const shopList = async () => {
-    const res = await apiStaffList({ ...page, data: searchForm });
+  const shopList = async params => {
+    const res = await apiStaffList(params);
     if (res.businessCode === '0000' && res.data?.records) {
       const list = res.data.records;
+      setTotal(res.data.total);
       setStaffList(list);
     }
   };
@@ -92,7 +98,7 @@ const StoreManagement = () => {
     setRechargeDetailsVisible(false);
     if (val) {
       getDepartmentList(searchForm.enterpriseId);
-      shopList();
+      shopList({ ...page, data: searchForm });
       setSelectedRowKeys([]);
     }
   };
@@ -111,8 +117,10 @@ const StoreManagement = () => {
       setFirstEnterprise(firstOption);
       getDepartmentList(firstOption);
       setSearchForm({ enterpriseId: firstOption });
+      shopList({ ...page, data: { enterpriseId: firstOption } });
     }
   };
+
   // 设置黑名单
   const getBlacklist = () => {
     if (!selectedRowKeys.length) {
@@ -124,17 +132,12 @@ const StoreManagement = () => {
   useEffect(() => {
     getEnterpriseList();
   }, []);
-  useEffect(() => {
-    if (searchForm.enterpriseId) {
-      shopList();
-    }
-  }, [searchForm, page]);
   // 删除
   const deleteEmployee = async id => {
     const res = await apiStaffDelete({ id, enterpriseId: searchForm.enterpriseId, state: 0 });
     if (res.businessCode === '0000') {
       message.success('删除成功！');
-      shopList();
+      shopList({ ...page, data: searchForm });
     }
   };
   // 删除
@@ -157,16 +160,27 @@ const StoreManagement = () => {
   // 搜索
   const onFinish = values => {
     setSearchForm(values);
-    setPage({ current: 1, pageSize: 10 });
+    const pageInfo = {
+      page: 1,
+      size: 10,
+    };
+    setPage(pageInfo);
+    shopList({ ...pageInfo, data: values });
   };
   // 重置
   const onReset = () => {
     formRef.current.resetFields();
     setSearchForm({ enterpriseId: firstEnterprise });
+    shopList({ ...page, data: { enterpriseId: firstEnterprise } });
   };
   // 分页
-  const handleTableChange = val => {
-    setPage(val);
+  const onChange = (pageNo, size) => {
+    const pageInfo = {
+      page: pageNo,
+      size,
+    };
+    setPage(pageInfo);
+    shopList({ data: searchForm, ...pageInfo });
   };
   const goDetails = async ({ staffNo }) => {
     setRechargeDetailsVisible(true);
@@ -184,7 +198,7 @@ const StoreManagement = () => {
     });
     if (res.businessCode === '0000') {
       message.success('设置成功');
-      shopList();
+      shopList({ ...page, data: searchForm });
     }
   };
   const enterpriseOnChange = val => {
@@ -195,11 +209,18 @@ const StoreManagement = () => {
     goDetails,
     handleLimitChange,
   };
+  const pagination = {
+    ...page,
+    total,
+    showTotal: t => `共 ${t} 项数据`,
+    onChange,
+    onShowSizeChange: onChange,
+  };
   return (
     <PageHeaderWrapper>
       <Card className={styles.card}>
         {firstEnterprise && (
-          <Form ref={formRef} onFinish={onFinish}>
+          <Form ref={formRef} onFinish={onFinish} {...layout}>
             <Row gutter={24}>
               <Col span={8}>
                 <Form.Item
@@ -270,7 +291,7 @@ const StoreManagement = () => {
                   <Input maxLength="8" allowClear />
                 </Form.Item>
               </Col>
-              <Col>
+              <Col span={24}>
                 <Form.Item>
                   <Button type="primary" htmlType="submit">
                     搜索
@@ -322,8 +343,8 @@ const StoreManagement = () => {
         dataSource={staffList}
         rowKey={r => r.id}
         bordered
-        onChange={handleTableChange}
         rowSelection={rowSelection}
+        pagination={pagination}
       />
       <NewEmployeeModal
         visible={modalVisible}