退出与黑名单

src/components/AccessDepartmentSelect/index.tsx

@@ -46,7 +46,7 @@ const AccessDepartmentSelect: React.FC<AccessDepartmentSelectProps> = ({
       disabled={disabled}
       treeData={buildTree(userOrgAll)}
       allowClear
-      style={{ width: '100%' }}
+      style={{ width: '160px' }}
       showSearch
     />
   );

src/pages/supplier/supplierBlacklist/blacklistManage/components/ViewBlacklistModal.tsx

@@ -66,10 +66,10 @@ const ViewBlacklistModal: React.FC<ViewBlacklistModalProps> = ({
   const columns:ColumnsType<Supplier> = [
     { title: "供应商名称", dataIndex: "supplierName", align: "center" },
     { title: "准入部门", dataIndex: "deptName", align: "center" },
-    { title: "准入时间", dataIndex: "createTime", align: "center" },
+    { title: "准入时间", dataIndex: "evaluateTime", align: "center" },
     { title: "准入品类", dataIndex: "categoryName", align: "center" },
-    { title: "最近一次评价", dataIndex: "lastEval", align: "center" },
+     // { title: "最近一次评价", dataIndex: "lastEval", align: "center" },
-    { title: "评价时间", dataIndex: "lastEvalDate", align: "center" },
+    // { title: "评价时间", dataIndex: "lastEvalDate", align: "center" },
   ];
 
   return (

src/pages/supplier/supplierExit/supplierExitAudit/components/ViewBlacklistModal.tsx

@@ -1,25 +1,26 @@
 import React, { useEffect, useState } from "react";
-import { Modal, Button, Table, Descriptions, Spin, message, Tooltip } from "antd";
+import { Modal, Button, Table, Form, Input, Tooltip, DatePicker } from "antd";
-import {coscoSupplierexit } from "../services"; 
 import type { ColumnsType } from 'antd/es/table';
+import { SearchOutlined, DeleteOutlined } from "@ant-design/icons";
+//umi 相关
+import { connect } from 'umi';
+import moment from 'moment';
+import AccessDepartmentSelect from "@/components/AccessDepartmentSelect"
+//接口
+import { getExitInfoPage } from "../services";
 import { useSupplierDetailModal } from '@/components/SupplierDetailModalContext/SupplierDetailModalContext';
-
+//统一列表分页
+import tableProps from '@/utils/tableProps'
 interface Supplier {
-    id: number; // 作为 rowKey 用于唯一标识
+  id: string; // 作为 rowKey 用于唯一标识
-    supplierName: string; // 供应商名称
+  supplierName: string; // 供应商名称
-    unit: string;         // 准入部门
+  unit: string;         // 准入部门
-    accessTime: string;   // 准入时间
+  accessTime: string;   // 准入时间
-    categoryName: string; // 准入品类
+  categoryName: string; // 准入品类
-    lastEval: string;     // 最近一次评价
+  lastEval: string;     // 最近一次评价
-    lastEvalDate: string; // 评价时间
+  lastEvalDate: string; // 评价时间
-    supplierId: string;
+  supplierId: string;
-    categoryId: string;
+  categoryId: string;
-  }
-interface DetailData {
-  exitTheme: string;
-  deptName: string;
-  deptId: string;
-  exitReason: string;
 }
 
 interface ViewBlacklistModalProps {
@@ -34,38 +35,50 @@ const ViewBlacklistModal: React.FC<ViewBlacklistModalProps> = ({
   recordId,
 }) => {
   const [loading, setLoading] = useState(false);
-  const [detail, setDetail] = useState<DetailData | null>(null);
-  const [suppliers, setSuppliers] = useState<Supplier[]>([]);
- const supplierDetailModal = useSupplierDetailModal();
-  const fetchData = async () => {
-    setLoading(true);
-    try {
-      const {  code, data } = await coscoSupplierexit(recordId)
-      if (code == 200) {
-        setDetail(data.coscoSupplierexit);
-      } else {
-        message.error("获取详情失败");
-      }
 
-      if (code == 200) {
+  const [form] = Form.useForm();
-        setSuppliers(data.coscoSupplierexitSupplierCategoryList || []);
+  const [data, setData] = useState<Supplier[]>([]);
-      } else {
+  const [pagination, setPagination] = useState({ current: 1, pageSize: 10, total: 0 });
-        message.error("获取供应商列表失败");
+
-      }
+  const supplierDetailModal = useSupplierDetailModal();
-    } catch (error) {
+
-      message.error("获取数据异常");
+  // 查询接口
-    } finally {
+  const getList = async (pageNo = 1, pageSize = 10) => {
-      setLoading(false);
+    setLoading(true);
+    // 可传查询条件 form.getFieldsValue()
+
+    const values = form.getFieldsValue();
+    const { exitTheme, time, deptId } = values;
+    const startTime = time ? moment(time[0]).format('YYYY-MM-DD') : '';
+    const endTime = time ? moment(time[1]).format('YYYY-MM-DD') : '';
+
+    const { code, data } = await getExitInfoPage({ supplierexitId: recordId, pageNo, pageSize, exitTheme, deptId, startTime, endTime });
+    if (code === 200) {
+      setData(data.records);
+      setPagination(prev => ({ ...prev, current: pageNo, pageSize, total: data.total }));
     }
+    setLoading(false);
+  };
+
+  // 查询
+  const handleSearch = () => {
+    setPagination({ ...pagination, current: 1 });
+    getList(1, pagination.pageSize);
+  };
+  // 重置
+  const handleReset = () => {
+    form.resetFields();
+    setPagination({ ...pagination, current: 1 });
+    getList(1, pagination.pageSize);
   };
 
   useEffect(() => {
     if (visible && recordId) {
-      fetchData();
+      getList();
     }
   }, [visible, recordId]);
 
-  const columns:ColumnsType<Supplier> = [
+  const columns: ColumnsType<Supplier> = [
     {
       title: "供应商名称", dataIndex: "supplierName", align: "left",
       width: 360,
@@ -78,8 +91,10 @@ const ViewBlacklistModal: React.FC<ViewBlacklistModalProps> = ({
         )
       }
     },
-    { title: "准入部门", dataIndex: "deptId", align: "center", width: 160 },
+    { title: "发起单位", dataIndex: "orgName", align: "center", ellipsis: true, width: 160 },
-    { title: "退出品类", dataIndex: "categoryName", align: "center", width: 160 },
+    { title: "发起部门", dataIndex: "deptName", align: "center", ellipsis: true, width: 160 },
+    { title: "退出品类", dataIndex: "categoryName", align: "center", ellipsis: true, width: 160 },
+    { title: "退出时间", dataIndex: "createTime", align: "center", width: 180 },
   ];
 
   return (
@@ -87,37 +102,44 @@ const ViewBlacklistModal: React.FC<ViewBlacklistModalProps> = ({
       title="供应商退出详情"
       visible={visible}
       onCancel={onCancel}
-      width={900}
+      width='80%'
       footer={<Button onClick={onCancel}>关闭</Button>}
       destroyOnClose
       bodyStyle={{ padding: "36px 36px 16px" }}
     >
-      <Spin spinning={loading}>
+      <div className="filter-action-row">
-        {detail && (
+        <Form form={form} layout="inline" className="filter-form" >
-          <Descriptions
+          <Form.Item name="exitTheme" label="供应商名称">
-            column={1}
+            <Input placeholder="请输入供应商名称" style={{ width: 150 }} allowClear maxLength={100} />
-            labelStyle={{ width: 120 }}
+          </Form.Item>
-            bordered
+          <Form.Item name="deptId" label="发起单位">
-            style={{ marginBottom: 24 }}
+            <AccessDepartmentSelect placeholder={'请选择发起单位'} />
-          >
+          </Form.Item>
-            <Descriptions.Item label="申请主题">{detail.exitTheme}</Descriptions.Item>
+          <Form.Item name="time" label="退出时间">
-            <Descriptions.Item label="发起部门">{detail.deptId}</Descriptions.Item>
+            <DatePicker.RangePicker style={{ width: 220 }} allowClear />
-            <Descriptions.Item label="退出原因" >{detail.exitReason}</Descriptions.Item>
+          </Form.Item>
-          </Descriptions>
+          <Form.Item>
-        )}
+            <Button className="buttonSubmit" type="primary" htmlType="submit" icon={<SearchOutlined />} onClick={handleSearch} >
+              搜索
+            </Button>
+          </Form.Item>
+          <Form.Item>
+            <Button className="buttonReset" icon={<DeleteOutlined />} onClick={handleReset} >重置</Button>
+          </Form.Item>
+        </Form>
+      </div>
 
-        <Table
+      <Table
-          columns={columns}
+        columns={columns}
-          dataSource={suppliers}
+        dataSource={data}
-          rowKey="id"
+        loading={loading}
-          bordered
+        rowKey="id"
-          pagination={false}
+        pagination={{ ...tableProps.pagination, total: pagination.total }}
-          style={{ flex: 1, minHeight: 0 }}
+        style={{ flex: 1, minHeight: 'calc(100vh - 350px)' }}
-          scroll={{ y: 'calc(100vh - 650px)' }}
+        scroll={{ y: 'calc(100vh - 350px)' }}
-        />
+      />
-      </Spin>
     </Modal>
   );
 };
 
-export default ViewBlacklistModal;
+export default connect()(ViewBlacklistModal);

src/pages/supplier/supplierExit/supplierExitAudit/services.ts

@@ -16,6 +16,25 @@ interface getPageData {
     endTime?: string;
 }
 export const getPage = (data: getPageData) => request.post('/coscoSupplierexit/getPage', { data });
+
+/**
+ *  
+ */
+interface getExitInfoPageData {
+    pageNo: number;
+    pageSize: number;
+    supplierexitId?: string;
+    deptId?: string;
+    accessType?: string;
+    reviewStatus?: string;
+    approveStatus?: string;
+    categoryId?: string;
+    exitTheme?: string;
+    startTime?: string;
+    endTime?: string;
+}
+export const getExitInfoPage = (data: getExitInfoPageData) => request.post('/coscoSupplierexit/getExitInfoPage', { data });
+
 /**
  * 供应商分页列表查询
  */

src/pages/supplier/supplierExit/supplierExitManage/components/SupplierSelectModal.tsx

@@ -12,11 +12,15 @@ import { useSupplierDetailModal } from '@/components/SupplierDetailModalContext/
 
 
 interface Supplier {
-  id: number;
+  id: number; // 作为 rowKey 用于唯一标识
+  supplierName: string; // 供应商名称
+  unit: string;         // 准入部门
+  accessTime: string;   // 准入时间
+  categoryName: string; // 准入品类
+  lastEval: string;     // 最近一次评价
+  lastEvalDate: string; // 评价时间
   supplierId: string;
   categoryId: string;
-  supplierName: string;
-  categoryName: string; // 准入品类
 }
 
 interface SupplierSelectModalProps {

src/pages/supplier/supplierExit/supplierExitManage/components/ViewBlacklistModal.tsx

@@ -1,12 +1,16 @@
 import React, { useEffect, useState } from "react";
-import { Modal, Button, Table, Descriptions, Spin, message, Tooltip } from "antd";
+import { Modal, Button, Table, Form, Input, Tooltip, DatePicker } from "antd";
 import type { ColumnsType } from 'antd/es/table';
+import { SearchOutlined, DeleteOutlined } from "@ant-design/icons";
 //umi 相关
 import { connect } from 'umi';
+import moment from 'moment';
+import AccessDepartmentSelect from "@/components/AccessDepartmentSelect"
 //接口
-import { coscoSupplierexit } from "../services"; 
+import { getExitInfoPage } from "../services";
 import { useSupplierDetailModal } from '@/components/SupplierDetailModalContext/SupplierDetailModalContext';
-
+//统一列表分页
+import tableProps from '@/utils/tableProps'
 interface Supplier {
   id: string; // 作为 rowKey 用于唯一标识
   supplierName: string; // 供应商名称
@@ -18,12 +22,6 @@ interface Supplier {
   supplierId: string;
   categoryId: string;
 }
-interface DetailData {
-  exitTheme: string;
-  deptName: string;
-  deptId: string;
-  exitReason: string;
-}
 
 interface ViewBlacklistModalProps {
   visible: boolean;
@@ -37,34 +35,46 @@ const ViewBlacklistModal: React.FC<ViewBlacklistModalProps> = ({
   recordId,
 }) => {
   const [loading, setLoading] = useState(false);
-  const [detail, setDetail] = useState<DetailData | null>(null);
-  const [suppliers, setSuppliers] = useState<Supplier[]>([]);
-  const supplierDetailModal = useSupplierDetailModal();
-  const fetchData = async () => {
-    setLoading(true);
-    try {
-      const { code, data } = await coscoSupplierexit(recordId)
-      if (code == 200) {
-        setDetail(data.coscoSupplierexit);
-      } else {
-        message.error("获取详情失败");
-      }
 
-      if (code == 200) {
+  const [form] = Form.useForm();
-        setSuppliers(data.coscoSupplierexitSupplierCategoryList || []);
+  const [data, setData] = useState<Supplier[]>([]);
-      } else {
+  const [pagination, setPagination] = useState({ current: 1, pageSize: 10, total: 0 });
-        message.error("获取供应商列表失败");
+
-      }
+  const supplierDetailModal = useSupplierDetailModal();
-    } catch (error) {
+
-      message.error("获取数据异常");
+  // 查询接口
-    } finally {
+  const getList = async (pageNo = 1, pageSize = 10) => {
-      setLoading(false);
+    setLoading(true);
+    // 可传查询条件 form.getFieldsValue()
+
+    const values = form.getFieldsValue();
+    const { exitTheme, time, deptId } = values;
+    const startTime = time ? moment(time[0]).format('YYYY-MM-DD') : '';
+    const endTime = time ? moment(time[1]).format('YYYY-MM-DD') : '';
+
+    const { code, data } = await getExitInfoPage({ supplierexitId: recordId, pageNo, pageSize, exitTheme, deptId, startTime, endTime });
+    if (code === 200) {
+      setData(data.records);
+      setPagination(prev => ({ ...prev, current: pageNo, pageSize, total: data.total }));
     }
+    setLoading(false);
+  };
+
+  // 查询
+  const handleSearch = () => {
+    setPagination({ ...pagination, current: 1 });
+    getList(1, pagination.pageSize);
+  };
+  // 重置
+  const handleReset = () => {
+    form.resetFields();
+    setPagination({ ...pagination, current: 1 });
+    getList(1, pagination.pageSize);
   };
 
   useEffect(() => {
     if (visible && recordId) {
-      fetchData();
+      getList();
     }
   }, [visible, recordId]);
 
@@ -81,8 +91,10 @@ const ViewBlacklistModal: React.FC<ViewBlacklistModalProps> = ({
         )
       }
     },
-    { title: "准入部门", dataIndex: "deptId", align: "center", width: 160 },
+    { title: "发起单位", dataIndex: "orgName", align: "center", ellipsis: true, width: 160 },
-    { title: "退出品类", dataIndex: "categoryName", align: "center", width: 160 },
+    { title: "发起部门", dataIndex: "deptName", align: "center", ellipsis: true, width: 160 },
+    { title: "退出品类", dataIndex: "categoryName", align: "center", ellipsis: true, width: 160 },
+    { title: "退出时间", dataIndex: "createTime", align: "center", width: 180 },
   ];
 
   return (
@@ -95,30 +107,37 @@ const ViewBlacklistModal: React.FC<ViewBlacklistModalProps> = ({
       destroyOnClose
       bodyStyle={{ padding: "36px 36px 16px" }}
     >
-      <Spin spinning={loading}>
+      <div className="filter-action-row">
-        {detail && (
+        <Form form={form} layout="inline" className="filter-form" >
-          <Descriptions
+          <Form.Item name="exitTheme" label="供应商名称">
-            column={1}
+            <Input placeholder="请输入供应商名称" style={{ width: 150 }} allowClear maxLength={100} />
-            labelStyle={{ width: 120 }}
+          </Form.Item>
-            bordered
+          <Form.Item name="deptId" label="发起单位">
-            style={{ marginBottom: 24 }}
+            <AccessDepartmentSelect placeholder={'请选择发起单位'} />
-          >
+          </Form.Item>
-            <Descriptions.Item label="申请主题">{detail.exitTheme}</Descriptions.Item>
+          <Form.Item name="time" label="退出时间">
-            <Descriptions.Item label="发起部门">{detail.deptId}</Descriptions.Item>
+            <DatePicker.RangePicker style={{ width: 220 }} allowClear />
-            <Descriptions.Item label="退出原因" >{detail.exitReason}</Descriptions.Item>
+          </Form.Item>
-          </Descriptions>
+          <Form.Item>
-        )}
+            <Button className="buttonSubmit" type="primary" htmlType="submit" icon={<SearchOutlined />} onClick={handleSearch} >
+              搜索
+            </Button>
+          </Form.Item>
+          <Form.Item>
+            <Button className="buttonReset" icon={<DeleteOutlined />} onClick={handleReset} >重置</Button>
+          </Form.Item>
+        </Form>
+      </div>
 
-        <Table
+      <Table
-          columns={columns}
+        columns={columns}
-          dataSource={suppliers}
+        dataSource={data}
-          rowKey="id"
+        loading={loading}
-          bordered
+        rowKey="id"
-          pagination={false}
+        pagination={{ ...tableProps.pagination, total: pagination.total }}
-          style={{ flex: 1, minHeight: 'calc(100vh - 650px)' }}
+        style={{ flex: 1, minHeight: 'calc(100vh - 350px)' }}
-          scroll={{ y: 'calc(100vh - 650px)' }}
+        scroll={{ y: 'calc(100vh - 350px)' }}
-        />
+      />
-      </Spin>
     </Modal>
   );
 };

src/pages/supplier/supplierExit/supplierExitManage/services.ts

@@ -17,6 +17,24 @@ interface getPageData {
 }
 export const getPage = (data: getPageData) => request.post('/coscoSupplierexit/getPage', { data });
 
+/**
+ *  
+ */
+interface getExitInfoPageData {
+    pageNo: number;
+    pageSize: number;
+    supplierexitId?: string;
+    deptId?: string;
+    accessType?: string;
+    reviewStatus?: string;
+    approveStatus?: string;
+    categoryId?: string;
+    exitTheme?: string;
+    startTime?: string;
+    endTime?: string;
+}
+export const getExitInfoPage = (data: getExitInfoPageData) => request.post('/coscoSupplierexit/getExitInfoPage', { data });
+
 /**
  * 供应商分页列表查询
  */