合并代码

src/components/CompanyInfo/component/AttachmentsTab.tsx

@@ -0,0 +1,141 @@
+import React, { useEffect, useState } from 'react';
+import { Table, Button } from 'antd';
+import type { ColumnsType, TablePaginationConfig } from 'antd/es/table';
+import { battachmentsGetPage } from '../services';
+import { useIntl } from 'umi';
+import AttachmentsFormModal from './AttachmentsFormModal';
+
+interface attachmentsAdd {
+  id?: string;
+  attachmentsType?: string;
+  fileName?: string;
+  filePath?: string;
+  fileSize?: string;
+  fileType?: string;
+  fileUrl?: string;
+  supplierId?: string;
+  certificateUrl?: string;
+}
+
+interface Props {
+  viewType?: boolean;
+}
+const OtherAttachmentsTab: React.FC<Props> = (props) => {
+  const { viewType = false } = props;
+  //语言切换
+  const intl = useIntl();
+  //列表渲染数据
+  const [data, setData] = useState<attachmentsAdd[]>([]);
+  //列表加载
+  const [loading, setLoading] = useState(false);
+  //列表分页
+  const [pagination, setPagination] = useState<TablePaginationConfig>({ current: 1, pageSize: 10, total: 0 });
+
+  //列表方法
+  const getList = async (pageNo = 1, pageSize = 10) => {
+    setLoading(true);
+    try {
+      const { code, data } = await battachmentsGetPage({ pageNo, pageSize });
+      if (code === 200) {
+        setData(data.records);
+        setPagination({ current: pageNo, pageSize, total: data.total });
+      }
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  //增改查
+  const [formVisible, setFormVisible] = useState(false);
+  const [editingRecord, setEditingRecord] = useState<attachmentsAdd | null>(null);
+  const [isViewMode, setIsViewMode] = useState(false);
+  const handleFormSubmit = () => {
+    setFormVisible(false);
+    getList();
+  };
+  const handleAdd = () => {
+    setEditingRecord(null);
+    setIsViewMode(false);
+    setFormVisible(true);
+  };
+
+  const handleEdit = (record: attachmentsAdd) => {
+    setEditingRecord(record);
+    setIsViewMode(false);
+    setFormVisible(true);
+  };
+
+  const handleView = (record: attachmentsAdd) => {
+    setEditingRecord(record);
+    setIsViewMode(true);
+    setFormVisible(true);
+  };
+
+  //初始化
+  useEffect(() => {
+    getList();
+  }, []);
+
+
+  const columns: ColumnsType<attachmentsAdd> = [
+    {
+      title: intl.formatMessage({ id: 'page.workbench.attachments.index' }),
+      render: (_: any, __: any, index: number) => index + 1,
+      width: 60,
+    },
+    {
+      title: '附件',
+      dataIndex: 'fileName',
+      render: (_: any, record: attachmentsAdd) => (
+        <a href={record.fileUrl} target="_blank" rel="noreferrer">{record.fileName}</a>
+      ),
+    },
+    {
+      title: '更新时间',
+      dataIndex: 'updateTime',
+    },
+    ...(viewType ? [] : [
+      {
+        title: 'page.workbench.attachments.action',
+        dataIndex: 'option',
+        width: 120,
+        render: (_: any, record: attachmentsAdd) => (
+          <>
+            <a style={{ marginRight: 8 }} onClick={() => handleView(record)}>查看</a>
+            <a onClick={() => handleEdit(record)}>修改</a>
+          </>
+        ),
+      },
+    ]),
+  ];
+  return (
+    <div style={{ padding: '0 30px 0 0' }}>
+      <div style={{ marginBottom: 16 }}>
+        {!viewType && (
+          <Button type="primary" onClick={handleAdd}>新增</Button>
+        )}
+      </div>
+      <Table
+        className="custom-table"
+        rowKey="id"
+        columns={columns.map(column => ({
+          ...column,
+          title: intl.formatMessage({ id: column.title as string })
+        }))}
+        dataSource={data}
+        pagination={pagination}
+        loading={loading}
+        onChange={(pagination) => getList(pagination.current!, pagination.pageSize!)}
+      />
+      <AttachmentsFormModal
+        visible={formVisible}
+        onOk={handleFormSubmit}
+        onCancel={() => setFormVisible(false)}
+        initialValues={editingRecord || undefined}
+        readOnly={isViewMode}
+      />
+    </div>
+  );
+};
+
+export default OtherAttachmentsTab;