pc-admin/src/pages/issue/index.jsx

import React from 'react';
import { Button, Badge } from 'antd';
import { useNavigate } from 'react-router-dom';
import List from '@/components/Page/List';
import { getTaIssue } from '@/service/taissue';
import { getTdLocType } from '@/service/tdloctype';
import { getSysOrg } from '@/service/sysorg';
import { queryDict } from '@/utils/request';

const queryOrg = queryDict(getSysOrg, { labelKey: 'name', valueKey: 'orgId' });
const queryLocType = queryDict(getTdLocType, { labelKey: 'name', valueKey: 'typeId' });

const today = (new Date()).toJSON().substring(0, 10);

export default (props) => {

  const navigate = useNavigate();

  const columns = [
    {
      title: "上报日期",
      dataIndex: "createDate",
      valueType: 'date',
      hideInSearch: true,
    },
    {
      title: "点位",
      dataIndex: "locId",
      valueType: 'select',
      request: queryLocType,
    },
    {
      title: "位置",
      dataIndex: "addr",
      hideInSearch: true,
    },
    {
      title: "问题详情",
      dataIndex: "content",
      hideInSearch: true,
      ellipsis: true,
    },
    {
      title: "责任单位",
      dataIndex: "orgId",
      valueType: 'select',
      request: queryOrg,
    },
    {
      title: "流程状态",
      dataIndex: "bizStatus",
      valueType: 'select',
      valueEnum: {
        start: {
          text: "待交办",
          status: "Default",
        },
        assigned: {
          text: "已交办",
          status: "Processing",
        },
        end: {
          text: "已办结",
          status: "Success",
        },
        expired: {
          text: "已逾期",
          status: "Error",
        },
        reject: {
          text: "已打回",
          status: "Warning",
        },
      },
      render: (_, row) => {
        if (row.processNode == 'end') {
          return <Badge status="success" text="已办结" />;
        } else {

          if (today >= row.expireDate) {
            return <Badge status="error" text="已逾期" />;
          }

          if ('reject' == row.processStatus) {
            return <Badge status="warning" text="已打回" />;
          }

          if (row.processNode == 'assigned') {
            return <Badge status="processing" text="已交办" />;
          }

          return <Badge status="default" text="待交办" />;
        }
      }
    },
    {
      title: "截止日期",
      dataIndex: "expireDate",
      hideInSearch: true,
    }
  ];

  return (
    <List
      rowKey="issueId"
      request={getTaIssue}
      columns={columns}
      optionRender={(_, row) => [
        <Button key="detail" type="link" onClick={() => navigate(`/issue/detail?id=${row.issueId}`)}>详情</Button>
      ]}
    />
  )
}