Initial commit

src/pages/policy/policy.tsx

@@ -0,0 +1,146 @@
+import React, { useState, useEffect } from 'react';
+import { Table, Typography } from 'antd';
+import { history } from 'umi';
+import styles from './policy.less';
+
+const { Title } = Typography;
+
+// 模拟政策法规数据
+const mockPolicyData = [
+  {
+    id: '1',
+    title: '关于进一步规范招标采购活动的管理办法',
+    publishDate: '2023-08-15',
+  },
+  {
+    id: '2',
+    title: '中远海运集团供应商管理实施细则(2023年修订版)',
+    publishDate: '2023-07-20',
+  },
+  {
+    id: '3',
+    title: '关于加强采购合同履约管理的通知',
+    publishDate: '2023-06-10',
+  },
+  {
+    id: '4',
+    title: '中远海运集团招标采购管理办法',
+    publishDate: '2023-05-25',
+  },
+  {
+    id: '5',
+    title: '关于优化招标采购流程提高采购效率的实施意见',
+    publishDate: '2023-04-18',
+  },
+  {
+    id: '6',
+    title: '中远海运集团电子招标采购平台操作指南',
+    publishDate: '2023-03-30',
+  },
+  {
+    id: '7',
+    title: '关于进一步加强采购风险防控的指导意见',
+    publishDate: '2023-02-15',
+  },
+  {
+    id: '8',
+    title: '中远海运集团采购评审专家管理办法',
+    publishDate: '2023-01-10',
+  },
+  {
+    id: '9',
+    title: '关于推进绿色采购的实施方案',
+    publishDate: '2022-12-20',
+  },
+  {
+    id: '10',
+    title: '中远海运集团采购人员职业道德规范',
+    publishDate: '2022-11-05',
+  },
+];
+
+const PolicyPage: React.FC = () => {
+  const [policyData, setPolicyData] = useState<any[]>([]);
+  const [loading, setLoading] = useState<boolean>(true);
+  const [pagination, setPagination] = useState({
+    current: 1,
+    pageSize: 10,
+    total: 0,
+  });
+
+  // 模拟获取政策法规数据
+  useEffect(() => {
+    // 实际项目中应该通过API获取数据
+    setTimeout(() => {
+      setPolicyData(mockPolicyData);
+      setPagination((prevPagination) => ({
+        ...prevPagination,
+        total: mockPolicyData.length,
+      }));
+      setLoading(false);
+    }, 500);
+  }, []);
+
+  // 处理表格分页变化
+  const handleTableChange = (newPagination: any) => {
+    setPagination(newPagination);
+  };
+
+  // 处理点击政策标题
+  const handlePolicyClick = (id: string) => {
+    history.push(`/policy/policyInfo?id=${id}`);
+  };
+
+  // 定义表格列
+  const columns = [
+    {
+      title: '序号',
+      dataIndex: 'index',
+      key: 'index',
+      width: 80,
+      render: (_: any, __: any, index: number) => {
+        return (pagination.current - 1) * pagination.pageSize + index + 1;
+      },
+    },
+    {
+      title: '标题',
+      dataIndex: 'title',
+      key: 'title',
+      render: (text: string, record: any) => (
+        <a onClick={() => handlePolicyClick(record.id)} className={styles.policyTitle}>
+          {text}
+        </a>
+      ),
+    },
+    {
+      title: '发布时间',
+      dataIndex: 'publishDate',
+      key: 'publishDate',
+      width: 150,
+      align: 'center' as 'center',
+    },
+  ];
+
+  return (
+    <div className={styles.policyContainer}>
+      <div className={styles.policyTable}>
+        <Table
+          columns={columns}
+          dataSource={policyData}
+          rowKey="id"
+          pagination={{
+            ...pagination,
+            showTotal: (total) => `共 ${total} 条记录`,
+            showSizeChanger: true,
+            showQuickJumper: true,
+          }}
+          loading={loading}
+          onChange={handleTableChange}
+          bordered
+        />
+      </div>
+    </div>
+  );
+};
+
+export default PolicyPage;