导出与 天眼查部分的 品类库列表

src/components/GlobalModal/components/AccessCategoryTable.tsx

@@ -2,8 +2,22 @@ import React, { useEffect, useState } from 'react';
 import { Table, Tabs, message } from 'antd';
 import { useIntl } from 'umi';
 import { getCategoryPage, supplierIdPage } from '../services';
-const { TabPane } = Tabs;
+// 类型定义
+import type { ColumnsType } from 'antd/es/table';
 
+//统一列表分页
+import tableProps from '@/utils/tableProps'
+const { TabPane } = Tabs;
+interface Data {
+  id: number;
+  storeName: string;
+  category: string;
+  region: string;
+  unit: string;
+  owner: string;
+  validTo: string;
+  supplierCount: number;
+}
 const AccessCategoryTable = ({id}:{id:string}) => {
   const intl = useIntl();
   const columns = [
@@ -33,28 +47,64 @@ const AccessCategoryTable = ({id}:{id:string}) => {
       key: 'exitReason',
       ellipsis: true,
       width: 120,
+    }
+  ]
+  //品类
+  const categoryColumns: ColumnsType<Data> = [
+    {
+      title: '品类库名称',
+      dataIndex: 'name',
+      key: 'name',
+      align: 'center',
+      ellipsis: true,
+    },
+    {
+      title: '品类',
+      dataIndex: 'categoryNames',
+      key: 'categoryNames',
+      align: 'center',
+      width: 100,
+      ellipsis: true, 
+    },
+    {
+      title: '区域',
+      dataIndex: 'area',
+      key: 'area',
+      align: 'center',
+      ellipsis: true,
+    },
+    {
+      title: '创建单位',
+      dataIndex: 'deptName',
+      key: 'deptName',
+      align: 'center',
+      ellipsis: true,
+    },
+    {
+      title: '负责人',
+      dataIndex: 'createName',
+      key: 'createName',
+      align: 'center',
+    },
+    {
+      title: '有效期至',
+      dataIndex: 'termOfValidity',
+      key: 'termOfValidity',
+      align: 'center',
+      ellipsis: true,
     },
-
-
-
-
-
-
-
-
-
-
-
   ]
 
   //Tabs切换key
   const [activeKey, setActiveKey] = useState<'access' | 'category'>('access');
+
   //准入品类
   const [accessData, setAccessData] = useState<any[]>([]);
   //分页
   const [accessPagination, setAccessPagination] = useState({ current: 1, pageSize: 10, total: 0 });
   //加载
   const [accessLoading, setAccessLoading] = useState(false);
+
   //品类库
   const [categoryData, setCategoryData] = useState<any[]>([]);
    //分页
@@ -81,7 +131,7 @@ const AccessCategoryTable = ({id}:{id:string}) => {
   const fetchCategoryData = async (current: number, pageSize: number) => {
     setCategoryLoading(true);
     try {
-      const { code, data }  = await supplierIdPage({ basePageRequest: { pageNo: current, pageSize } , supplierId: '1935547019799363584' });
+      const { code, data }  = await supplierIdPage({ basePageRequest: { pageNo: current, pageSize } , supplierId: id });
       if (code === 200) {
         setCategoryData(data.records);
         setCategoryPagination({ current, pageSize, total: data.total });
@@ -108,29 +158,42 @@ const AccessCategoryTable = ({id}:{id:string}) => {
           columns={columns}
           rowKey="code"
           loading={accessLoading}
-          pagination={{
-            current: accessPagination.current,
-            pageSize: accessPagination.pageSize,
-            total: accessPagination.total,
-            showSizeChanger: true,
-            onChange: (page, pageSize = 10) => fetchAccessData(page, pageSize),
+          // pagination={{
+          //   current: accessPagination.current,
+          //   pageSize: accessPagination.pageSize,
+          //   total: accessPagination.total,
+          //   showSizeChanger: true,
+          //   onChange: (page, pageSize = 10) => fetchAccessData(page, pageSize),
+          // }}
+          pagination={{...tableProps.pagination, total: accessPagination.total }}
+          onChange={(pagination) => {
+            fetchCategoryData( pagination.current!, pagination.pageSize!)
           }}
+          style={{ flex: 1, minHeight: 0 }}
+          scroll={{ y: 'calc(100vh - 350px)' }}
         />
       </TabPane>
 
       <TabPane tab={intl.formatMessage({id: 'component.globalModal.CategoryLibrary'})} key="category">
         <Table
           dataSource={categoryData}
-          columns={columns}
+          columns={categoryColumns}
           rowKey="code"
           loading={categoryLoading}
-          pagination={{
-            current: categoryPagination.current,
-            pageSize: categoryPagination.pageSize,
-            total: categoryPagination.total,
-            showSizeChanger: true,
-            onChange: (page, pageSize = 10) => fetchCategoryData(page, pageSize),
+          // pagination={{
+          //   current: categoryPagination.current,
+          //   pageSize: categoryPagination.pageSize,
+          //   total: categoryPagination.total,
+          //   showSizeChanger: true,
+          //   onChange: (page, pageSize = 10) => fetchCategoryData(page, pageSize),
+          // }}
+
+          pagination={{...tableProps.pagination, total: categoryPagination.total }}
+          onChange={(pagination) => {
+            fetchCategoryData( pagination.current!, pagination.pageSize!)
           }}
+          style={{ flex: 1, minHeight: 0 }}
+          scroll={{ y: 'calc(100vh - 350px)' }}
         />
       </TabPane>
     </Tabs>

src/components/GlobalModal/services.ts

@@ -46,5 +46,4 @@ interface basePageRequests {
   pageNo: number;
   pageSize: number;
 }
-export const supplierIdPage = (data: supplierIdPage) => request.post('/cosco/library/supplierIdPage', { data });
- 
+export const supplierIdPage = (data: supplierIdPage) => request.post('/cosco/library/supplierIdPage', { data });