feat: update 发票对账

zhongnanhuang
1 parent 1d87cfcc
Showing 3 changed files with 176 additions and 211 deletions
src/pages/Invoice/components/BankChooseModal.tsx
src/pages/Invoice/components/InvoiceVerificationModal.tsx
src/pages/Invoice/index.tsx
@@ -14,7 +14,6 @@ import { useRef, useState } from &#39;react&#39;;
 import { BANK_STATEMENT_COLUMNS, INVOICE_STATUS } from '../constant';
 import '../index.less';
 export default ({ invoiceId, setVisible, onClose }) => {
-  const [bankData, setBankData] = useState([]);
   const [selectedStatement, setSelectedStatement] = useState([]);
   const [selectedStatementIdSet, setSelectedStatementIdSet] = useState(
     new Set(),
@@ -154,21 +153,17 @@ export default ({ invoiceId, setVisible, onClose }) =&gt; {
     return columns;
   };
  
+  /**
+   * 删除已选中
+   * @param record
+   */
   const removeSelectedStatement = (record: any) => {
-    console.log(record);
-    console.log(selectedStatement);
-    console.log(bankData);
-
-    //在已选中区域中移除
-    let newSelectedStatement = selectedStatement.filter((item) => {
-      return item.id !== record.id;
-    });
-    setSelectedStatement(newSelectedStatement);
-
-    //将数据添加回到表格中
-    let newBankData = [...bankData];
-    newBankData.push(record);
-    setBankData(newBankData);
+    setSelectedStatement(
+      selectedStatement.filter((item) => {
+        return item.id !== record.id;
+      }),
+    );
+    removeElement(record.id);
   };
  
   const showSelectedStatement = () => {
@@ -217,7 +212,7 @@ export default ({ invoiceId, setVisible, onClose }) =&gt; {
           });
  
           if (res.result === RESPONSE_CODE.SUCCESS) {
-            message.info(res.message);
+            message.success(res.message);
             onClose();
           }
  
@@ -258,7 +253,7 @@ export default ({ invoiceId, setVisible, onClose }) =&gt; {
           }}
           request={async (params) => {
             const res = await postServiceBankStatementQueryBankStatement({
-              data: { ...params },
+              data: { ...params, status: 'ABNORMAL' },
             });
             if (res) {
               return {
@@ -244,71 +244,6 @@ export default ({ invoiceId, setVisible, onClose }) =&gt; {
     return columns;
   };
  
-  /**
-   * 银行流水表
-   * @param param0
-   * @returns
-   */
-  const BankTable = ({ actionRef = undefined }) => {
-    return (
-      <ProTable
-        columns={bankStatementColumnsInit()}
-        actionRef={actionRef}
-        cardBordered
-        pagination={{
-          pageSize: 10,
-        }}
-        dataSource={relationBankStatements}
-        columnsState={{
-          persistenceKey: 'pro-table-singe-demos',
-          persistenceType: 'localStorage',
-          defaultValue: {
-            option: { fixed: 'right', disable: true },
-          },
-          onChange(value) {
-            console.log('value: ', value);
-          },
-        }}
-        rowKey="id"
-        search={false}
-        options={{
-          setting: {
-            listsHeight: 400,
-          },
-          reload: false,
-        }}
-        form={{
-          // 由于配置了 transform，提交的参与与定义的不同这里需要转化一下
-          syncToUrl: (values, type) => {
-            if (type === 'get') {
-              return {
-                ...values,
-                created_at: [values.startTime, values.endTime],
-              };
-            }
-            return values;
-          },
-        }}
-        dateFormatter="string"
-        headerTitle="银行流水"
-        scroll={{ x: 1400, y: 360 }}
-        toolBarRender={() => [
-          <Button
-            key="button"
-            icon={<PlusOutlined />}
-            onClick={() => {
-              setBankChooseModalVisible(true);
-            }}
-            hidden={invoiceInfo?.status === 'VERIFIED'}
-            type="primary"
-          >
-            添加
-          </Button>,
-        ]}
-      />
-    );
-  };
-
   useEffect(() => {
     loadInvoiceData();
   }, []);
@@ -361,7 +296,60 @@ export default ({ invoiceId, setVisible, onClose }) =&gt; {
  
         <Divider plain></Divider>
  
-        <BankTable></BankTable>
+        <ProTable
+          columns={bankStatementColumnsInit()}
+          cardBordered
+          pagination={{
+            pageSize: 10,
+          }}
+          dataSource={relationBankStatements}
+          columnsState={{
+            persistenceKey: 'pro-table-singe-demos',
+            persistenceType: 'localStorage',
+            defaultValue: {
+              option: { fixed: 'right', disable: true },
+            },
+            onChange(value) {
+              console.log('value: ', value);
+            },
+          }}
+          rowKey="id"
+          search={false}
+          options={{
+            setting: {
+              listsHeight: 400,
+            },
+            reload: false,
+          }}
+          form={{
+            // 由于配置了 transform，提交的参与与定义的不同这里需要转化一下
+            syncToUrl: (values, type) => {
+              if (type === 'get') {
+                return {
+                  ...values,
+                  created_at: [values.startTime, values.endTime],
+                };
+              }
+              return values;
+            },
+          }}
+          dateFormatter="string"
+          headerTitle="银行流水"
+          scroll={{ x: 1400, y: 360 }}
+          toolBarRender={() => [
+            <Button
+              key="button"
+              icon={<PlusOutlined />}
+              onClick={() => {
+                setBankChooseModalVisible(true);
+              }}
+              hidden={invoiceInfo?.status === 'VERIFIED'}
+              type="primary"
+            >
+              添加
+            </Button>,
+          ]}
+        />
       </ModalForm>
  
       {bankChooseModalVisible ? (
@@ -265,142 +265,124 @@ const InvoicePage = () =&gt; {
     return columns;
   };
  
-  /**
-   * 发票表
-   * @param param0
-   * @returns
-   */
-  const InvoiceTable = ({ actionRef = undefined }) => {
-    return (
-      <ProTable
-        columns={invoicecColumnsInit()}
-        actionRef={actionRef}
-        cardBordered
-        pagination={{
-          pageSize: 10,
-        }}
-        request={async (params) => {
-          const res = await postServiceInvoiceQueryInvoice({
-            data: { ...params },
-          });
-          if (res) {
-            return {
-              data: res?.data?.data || [],
-              total: res?.data?.total || 0,
-            };
-          }
-        }}
-        columnsState={{
-          persistenceKey: 'pro-table-singe-demos',
-          persistenceType: 'localStorage',
-          defaultValue: {
-            option: { fixed: 'right', disable: true },
-          },
-          onChange(value) {
-            console.log('value: ', value);
-          },
-        }}
-        rowKey="id"
-        search={{
-          labelWidth: 'auto',
-        }}
-        options={{
-          setting: {
-            listsHeight: 400,
-          },
-        }}
-        form={{}}
-        dateFormatter="string"
-        headerTitle="发票列表"
-        scroll={{ x: 1400, y: 360 }}
-      />
-    );
-  };
-
-  /**
-   * 银行流水表
-   * @param param0
-   * @returns
-   */
-  const BankTable = ({ actionRef = undefined }) => {
-    return (
-      <ProTable
-        columns={bankStatemetColumnsInit()}
-        actionRef={actionRef}
-        cardBordered
-        pagination={{
-          pageSize: 10,
-        }}
-        editable={{
-          type: 'multiple',
-          onSave: async (rowKey, data) => {
-            await postServiceBankStatementEditBankStatement({ data: data });
-          },
-          actionRender: (row, config, defaultDom) => [
-            defaultDom.save,
-            defaultDom.cancel,
-          ],
-        }}
-        request={async (params) => {
-          const res = await postServiceBankStatementQueryBankStatement({
-            data: { ...params },
-          });
-          if (res) {
-            return {
-              data: res?.data?.data || [],
-              total: res?.data?.total || 0,
-            };
-          }
-        }}
-        columnsState={{
-          persistenceKey: 'pro-table-singe-demos',
-          persistenceType: 'localStorage',
-          defaultValue: {
-            option: { fixed: 'right', disable: true },
-          },
-          onChange(value) {
-            console.log('value: ', value);
-          },
-        }}
-        rowKey="id"
-        search={{
-          labelWidth: 'auto',
-        }}
-        options={{
-          setting: {
-            listsHeight: 400,
-          },
-        }}
-        form={{}}
-        dateFormatter="string"
-        headerTitle="银行流水列表"
-        scroll={{ x: 1400, y: 360 }}
-        toolBarRender={() => [
-          <Button
-            key="button"
-            icon={<PlusOutlined />}
-            onClick={() => {
-              setBankImportModalVisible(true);
-            }}
-            type="primary"
-          >
-            导入
-          </Button>,
-        ]}
-      />
-    );
-  };
-
   const tabsItems = [
     {
       key: 1,
       label: '发票管理',
-      children: <InvoiceTable actionRef={invoiceActionRef} />,
+      children: (
+        <ProTable
+          columns={invoicecColumnsInit()}
+          actionRef={invoiceActionRef}
+          cardBordered
+          pagination={{
+            pageSize: 10,
+          }}
+          request={async (params) => {
+            const res = await postServiceInvoiceQueryInvoice({
+              data: { ...params },
+            });
+            if (res) {
+              return {
+                data: res?.data?.data || [],
+                total: res?.data?.total || 0,
+              };
+            }
+          }}
+          columnsState={{
+            persistenceKey: 'pro-table-singe-demos',
+            persistenceType: 'localStorage',
+            defaultValue: {
+              option: { fixed: 'right', disable: true },
+            },
+            onChange(value) {
+              console.log('value: ', value);
+            },
+          }}
+          rowKey="id"
+          search={{
+            labelWidth: 'auto',
+          }}
+          options={{
+            setting: {
+              listsHeight: 400,
+            },
+          }}
+          form={{}}
+          dateFormatter="string"
+          headerTitle="发票列表"
+          scroll={{ x: 1400, y: 360 }}
+        />
+      ),
     },
     {
       key: 2,
       label: '银行流水',
-      children: <BankTable actionRef={bankActionRef} />,
+      children: (
+        <ProTable
+          columns={bankStatemetColumnsInit()}
+          actionRef={bankActionRef}
+          cardBordered
+          pagination={{
+            pageSize: 10,
+          }}
+          editable={{
+            type: 'multiple',
+            onSave: async (rowKey, data) => {
+              await postServiceBankStatementEditBankStatement({ data: data });
+            },
+            actionRender: (row, config, defaultDom) => [
+              defaultDom.save,
+              defaultDom.cancel,
+            ],
+          }}
+          request={async (params) => {
+            const res = await postServiceBankStatementQueryBankStatement({
+              data: { ...params },
+            });
+            if (res) {
+              return {
+                data: res?.data?.data || [],
+                total: res?.data?.total || 0,
+              };
+            }
+          }}
+          columnsState={{
+            persistenceKey: 'pro-table-singe-demos',
+            persistenceType: 'localStorage',
+            defaultValue: {
+              option: { fixed: 'right', disable: true },
+            },
+            onChange(value) {
+              console.log('value: ', value);
+            },
+          }}
+          rowKey="id"
+          search={{
+            labelWidth: 'auto',
+          }}
+          options={{
+            setting: {
+              listsHeight: 400,
+            },
+          }}
+          form={{}}
+          dateFormatter="string"
+          headerTitle="银行流水列表"
+          scroll={{ x: 1400, y: 360 }}
+          toolBarRender={() => [
+            <Button
+              key="button"
+              icon={<PlusOutlined />}
+              onClick={() => {
+                setBankImportModalVisible(true);
+              }}
+              type="primary"
+            >
+              导入
+            </Button>,
+          ]}
+        />
+      ),
     },
   ];
   return (