safety-eval-service-frontend/src/pages/Container/QualApplication/FilingListTable.jsx

import { Button, Form, Tag, Table, Typography, Select } from "antd";
import SearchForm from "@cqsjjb/jjb-react-admin-component/SearchForm";
import ControlWrapper from "@cqsjjb/jjb-react-admin-component/ControlWrapper";
import TableAction from "@cqsjjb/jjb-react-admin-component/TableAction";
import {
  CHONGQING_DISTRICTS,
  QUALIFICATION_INDUSTRY_OPTIONS_MAP,
} from "~/enumerate/enterpriseOptions";
import {
  FILING_FORM_MODE,
  getFilingStatusOptions,
  isQualFilingEditable,
  QUAL_FILING_STATUS_COLOR,
} from "~/enumerate/qualFilingOptions";

import { CHANGE_COUNT_STYLE, getChangeCount } from "~/utils/enterpriseForm";

export default function FilingListTable({
  dataSource,
  total,
  loading,
  searchForm,
  onSearch,
  onPageChange,
  scrollY,
  mode,
  showChangeCount = false,
  onChangeCountClick,
  onCreate,
  createLabel,
  listTitle,
  listDesc,
  PageLayout,
  onDelete,
  extraActions,
  history,
}) {
  const statusOptions = getFilingStatusOptions(mode);

  const canEditRow = (record) => {
    if (mode === FILING_FORM_MODE.CHANGE) {
      return [1, 3, 5].includes(record.filingStatusCode);
    }
    return [3, 5].includes(record.filingStatusCode);
  };

  const columns = [
    {
      title: "备案属地",
      dataIndex: "filingTerritoryName",
      width: 120,
      ellipsis: true,
    },
    { title: "备案单位", dataIndex: "filingUnitName", ellipsis: true },
    { title: "备案编号", dataIndex: "filingNo", width: 200 },
    {
      title: "安全评价业务范围",
      dataIndex: "businessScope",
      ellipsis: true,
      render: (_, record) => {
        if (Array.isArray(record.businessScope)) {
          return record.businessScope
            .map((item) => QUALIFICATION_INDUSTRY_OPTIONS_MAP[item])
            .join("、");
        }
        return record.businessScope || "-";
      },
    },
  ];

  if (showChangeCount) {
    columns.push({
      title: "变更次数",
      dataIndex: "changeCount",
      width: 90,
      render: (_, record) => {
        const count = getChangeCount(record);
        const style =
          count > 0 ? CHANGE_COUNT_STYLE.active : CHANGE_COUNT_STYLE.zero;
        if (count <= 0) {
          return <span style={style}>{count}</span>;
        }
        return (
          <Typography.Link
            style={style}
            onClick={() => onChangeCountClick?.(record)}
          >
            {count}
          </Typography.Link>
        );
      },
    });
  }

  columns.push({
    title: "备案状态",
    dataIndex: "filingStatusName",
    width: 110,
    render: (_, record) => {
      const obj = QUAL_FILING_STATUS_COLOR[record.filingStatusCode];
      const color = obj?.color || "default";
      const name = obj?.label || "-";
      return obj ? <Tag color={color}>{name || "-"}</Tag> : "--";
    },
  });

  columns.push({
    title: "操作",
    width: 180,
    fixed: "right",
    render: (_, record) => (
      <TableAction>
        <Button
          type="link"
          size="small"
          onClick={() =>
            history.push(
              `/container/qualApplication/filingForm?mode=${mode}&id=${record.id}&readOnly=1`,
            )
          }
        >
          查看
        </Button>
        {extraActions?.(record)}
        {canEditRow(record) && (
          <Button
            type="link"
            size="small"
            onClick={() =>
              history.push(
                `/container/qualApplication/filingForm?mode=${mode}&id=${record.id}`,
              )
            }
          >
            修改
          </Button>
        )}
        {mode === FILING_FORM_MODE.APPLICATION &&
          isQualFilingEditable(record.filingStatusCode) &&
          onDelete && (
            <Button
              type="link"
              size="small"
              danger
              onClick={() => onDelete(record)}
            >
              删除
            </Button>
          )}
      </TableAction>
    ),
  });

  return (
    <PageLayout
      title={
        listDesc ? (
          <div>
            <span>{listTitle}</span>
            <div className="pageLayout-extra">{listDesc}</div>
          </div>
        ) : (
          listTitle
        )
      }
      extra={
        onCreate && (
          <Button type="primary" onClick={onCreate}>
            {createLabel}
          </Button>
        )
      }
    >
      <SearchForm
        style={{ marginBottom: 24 }}
        form={searchForm}
        loading={loading}
        formLine={[
          <Form.Item key="filingUnitName" name="filingUnitName">
            <ControlWrapper.Input
              label="备案单位"
              placeholder="关键字搜索"
              allowClear
            />
          </Form.Item>,
          <Form.Item key="filingTerritoryCode" name="filingTerritoryCode">
            <ControlWrapper.Select
              label="备案属地"
              placeholder="请输入"
              allowClear
              style={{ width: "100%" }}
            >
              {CHONGQING_DISTRICTS.map((d) => (
                <Select.Option key={d.value} value={d.value}>
                  {d.label}
                </Select.Option>
              ))}
            </ControlWrapper.Select>
          </Form.Item>,
          <Form.Item key="filingNo" name="filingNo">
            <ControlWrapper.Input
              label="备案编号"
              placeholder="关键字搜索"
              allowClear
            />
          </Form.Item>,
          <Form.Item key="filingStatusCode" name="filingStatusCode">
            <ControlWrapper.Select
              label="备案状态"
              placeholder="全部"
              showSearch={false}
              style={{ width: "100%" }}
            >
              {statusOptions.map((opt) => (
                <Select.Option key={opt.value} value={opt.value}>
                  {opt.label}
                </Select.Option>
              ))}
            </ControlWrapper.Select>
          </Form.Item>,
        ]}
        onFinish={(values) => onSearch(values)}
        onReset={(values) => onSearch(values)}
      />
      <Table
        rowKey="id"
        columns={columns}
        dataSource={dataSource}
        loading={loading}
        scroll={{ y: scrollY }}
        pagination={{
          total,
          showSizeChanger: true,
          showQuickJumper: true,
          showTotal: (t) => `共 ${t} 条`,
        }}
        onChange={(pagination) => {
          if (onPageChange) onPageChange(pagination);
        }}
      />
    </PageLayout>
  );
}