feat: 代码优化

src/pages/EmployeeManagement/components/RechargeDetailsModal.jsx

@@ -5,29 +5,39 @@ const RechargeDetailsModal = ({ visible, onClose, list }) => {
   const columns = [
     {
       title: '员工ID',
-      dataIndex: 'id',
-      key: 'id',
+      dataIndex: 'staffNo',
+      key: 'staffNo',
+      align: 'center',
     },
     {
       title: '员工姓名',
       dataIndex: 'staffName',
       key: 'staffName',
+      align: 'center',
     },
     {
       title: '充值余额',
       dataIndex: 'rechargeAmount',
       key: 'rechargeAmount',
+      align: 'center',
     },
     {
       title: '充值时间',
       dataIndex: 'generateDate',
       key: 'generateDate',
+      align: 'center',
     },
   ];
 
   return (
-    <Modal visible={visible} title="充值明细" onCancel={onClose} footer={null}>
-      <Table dataSource={list} columns={columns} pagination={false} border />
+    <Modal
+      width="800px"
+      visible={visible}
+      title="充值明细"
+      onCancel={() => onClose(false, 'rechargeDetails')}
+      footer={null}
+    >
+      <Table dataSource={list} columns={columns} pagination={false} bordered />
     </Modal>
   );
 };

src/pages/EmployeeManagement/components/blacklistModal.jsx

@@ -19,14 +19,19 @@ const BlacklistModal = ({ visible, onClose, list, enterpriseId }) => {
       apiStaffBlack(params).then(res => {
         if (res.businessCode === '0000') {
           message.success('设置成功');
-          onClose(true);
+          onClose(true, 'blacklist');
         }
       });
     });
   };
 
   return (
-    <Modal visible={visible} title="设置员工黑名单" onCancel={onClose} onOk={handleSave}>
+    <Modal
+      visible={visible}
+      title="设置员工黑名单"
+      onCancel={() => onClose(false, 'blacklist')}
+      onOk={handleSave}
+    >
       <Form form={form} layout="vertical">
         <Item name="ids" label="您确定要把员工ID:">
           {list.length && list.map(item => <span>{item},</span>)}

src/pages/EmployeeManagement/components/departmentModal.jsx

@@ -17,7 +17,7 @@ const DepartmentModal = ({ visible, onClose, enterpriseList }) => {
   const handleCancel = val => {
     form.resetFields();
     setImportMode(false);
-    onClose(val);
+    onClose(val, 'department');
   };
 
   const handleImportChange = info => {
@@ -68,7 +68,7 @@ const DepartmentModal = ({ visible, onClose, enterpriseList }) => {
       visible={visible}
       onCancel={() => handleCancel(false)}
       footer={[
-        <Button key="cancel" onClick={onClose}>
+        <Button key="cancel" onClick={() => handleCancel(false)}>
           取消
         </Button>,
         <Button key="save" type="primary" onClick={() => handleSave()}>
@@ -151,7 +151,7 @@ const DepartmentModal = ({ visible, onClose, enterpriseList }) => {
             name="name"
             rules={[{ required: true, message: '请输入部门名称' }]}
           >
-            <Input />
+            <Input maxLength={20} />
           </Item>
         )}
       </Form>

src/pages/EmployeeManagement/components/newEmployeeModal.jsx

@@ -19,7 +19,7 @@ const NewEmployeeModal = props => {
   const handleCancel = val => {
     form.resetFields();
     setImportMode(false);
-    onClose(val);
+    onClose(val, 'newEmployee');
   };
   const handleSave = () => {
     form.validateFields().then(async values => {
@@ -64,15 +64,16 @@ const NewEmployeeModal = props => {
     setDepartmentList([]);
   };
   const onChange = value => {
+    form.setFieldsValue({ departmentId: undefined });
     getDepartmentList(value);
   };
   return (
     <Modal
       visible={visible}
       title="添加新员工"
-      onCancel={onClose}
+      onCancel={handleCancel}
       footer={[
-        <Button key="cancel" onClick={onClose}>
+        <Button key="cancel" onClick={handleCancel}>
           取消
         </Button>,
         <Button key="save" type="primary" onClick={handleSave}>
@@ -177,9 +178,13 @@ const NewEmployeeModal = props => {
                   required: true,
                   message: '请输入员工ID',
                 },
+                {
+                  pattern: /^[a-zA-Z0-9]+$/,
+                  message: '员工ID由数字与英文大小写字母组成',
+                },
               ]}
             >
-              <Input />
+              <Input maxLength={15} />
             </Form.Item>
             <Form.Item
               name="staffName"

src/pages/EmployeeManagement/components/viewDepartmentModal.jsx

@@ -23,7 +23,7 @@ const ViewDepartmentModal = ({ visible, onClose, enterpriseList }) => {
     setDataSource([]);
     setPageInfo({ page: 1, size: 10 });
     setTotal(0);
-    onClose();
+    onClose(false, 'viewDepartment');
   };
   const editName = row => {
     setName(row.name);
@@ -168,7 +168,7 @@ const ViewDepartmentModal = ({ visible, onClose, enterpriseList }) => {
             initialValue={name}
             rules={[{ required: true, message: '请填写部门名称' }]}
           >
-            <Input />
+            <Input maxLength={20} />
           </Form.Item>
         </Form>
       </Modal>

src/pages/EmployeeManagement/data.js

@@ -67,8 +67,8 @@ export const columns = props => [
   },
   {
     title: '员工企业余额',
-    key: 'balanceBackFlag',
-    dataIndex: 'balanceBackFlag',
+    key: 'balance',
+    dataIndex: 'balance',
     align: 'center',
   },
   {

src/pages/EmployeeManagement/index.jsx

@@ -90,16 +90,30 @@ const StoreManagement = () => {
     setDepartmentList([]);
   };
   // 关闭弹框
-  const handleCloseModal = val => {
-    setModalVisible(false);
-    setDepartmentVisible(false);
-    setViewDepartmentVisible(false);
-    setBlacklistVisible(false);
-    setRechargeDetailsVisible(false);
-    if (val) {
-      getDepartmentList(searchForm.enterpriseId);
+  const handleCloseModal = (status, val) => {
+    switch (val) {
+      case 'newEmployee':
+        setModalVisible(false);
+        break;
+      case 'viewDepartment':
+        setViewDepartmentVisible(false);
+        getDepartmentList(searchForm.enterpriseId);
+        break;
+      case 'department':
+        setDepartmentVisible(false);
+        break;
+      case 'blacklist':
+        setBlacklistVisible(false);
+        setSelectedRowKeys([]);
+        break;
+      case 'rechargeDetails':
+        setRechargeDetailsVisible(false);
+        break;
+      default:
+        break;
+    }
+    if (status) {
       shopList({ ...page, data: searchForm });
-      setSelectedRowKeys([]);
     }
   };
 
@@ -337,14 +351,16 @@ const StoreManagement = () => {
           </Button>
         </div>
       </Card>
-      <Table
-        columns={columns(res)}
-        dataSource={staffList}
-        rowKey={r => r.staffNo}
-        bordered
-        rowSelection={rowSelection}
-        pagination={pagination}
-      />
+      <Card>
+        <Table
+          columns={columns(res)}
+          dataSource={staffList}
+          rowKey={r => r.id}
+          bordered
+          rowSelection={rowSelection}
+          pagination={pagination}
+        />
+      </Card>
       <NewEmployeeModal
         visible={modalVisible}
         enterpriseList={enterpriseList}

src/pages/StoreManagement/data.js

@@ -23,10 +23,13 @@ const repastType = list => {
       .filter(item => item !== 4)
       .map(item => {
         const name = repastTypeList.find(i => i.value === item)?.label;
-        return name ? `${name}/到店` : null;
+        return name ? `${name}/到店 ` : null;
       });
   }
-  return '到店';
+  return list.map(item => {
+    const name = repastTypeList.find(i => i.value === item)?.label;
+    return name ? `${name} ` : null;
+  });
 };
 export const columns = props => [
   {

src/pages/StoreManagement/index.jsx

@@ -242,13 +242,15 @@ const StoreManagement = () => {
           </Form>
         )}
       </Card>
-      <Table
-        columns={columns(res)}
-        dataSource={dataList}
-        rowKey={r => r.id}
-        bordered
-        pagination={pagination}
-      />
+      <Card>
+        <Table
+          columns={columns(res)}
+          dataSource={dataList}
+          rowKey={r => r.id}
+          bordered
+          pagination={pagination}
+        />
+      </Card>
       <EditRepastModal
         editVisible={editVisible}
         repastType={repastType}