import React from "react";
import { ProTable } from "@ant-design/pro-components";
import { Card } from "antd";
import { getTaIssueApply } from "@/service/taissueapply";
import { getSysOrg } from "@/service/sysorg";
import { queryTable, queryDict } from "@/utils/request";
import useBool from "@/utils/hooks/useBool";
import { processEnum } from "@/utils/biz";

const fetchOrg = queryDict(getSysOrg, { labelKey: "name", valueKey: "orgId" });
const fetchData = queryTable(getTaIssueApply);

export default (props) => {
  const { issueId } = props;

  const columns = [
    {
      title: "申请日期",
      dataIndex: "createDate",
      valueType: "date",
    },
    {
      title: "申请类别",
      dataIndex: "applyType",
      valueEnum: processEnum,
    },
    {
      title: "申请理由",
      dataIndex: "remark",
    },
    {
      title: "申请人",
      dataIndex: "createUserName",
    },
    {
      title: "审批日期",
      dataIndex: "verifyDate",
      valueType: "date",
    },
    {
      title: "审批人",
      dataIndex: "verifyUserName",
    },
    {
      title: "审批结果",
      dataIndex: "verifyStatus",
      valueEnum: {
        ready: {
          text: "未审批",
          status: "Default",
        },
        pass: {
          text: "通过",
          status: "Success",
        },
        reject: {
          text: "驳回",
          status: "Error",
        },
      },
    },
    {
      title: "审批意见",
      dataIndex: "verifyDesc",
    },
    {
      title: "申请单位",
      valueType: "select",
      dataIndex: "orgId",
      request: fetchOrg,
    },
  ];

  return (
    <Card title="申请流程">
      <ProTable
        rowKey="verifyId"
        search={false}
        params={{ issueId, isAll: true }}
        columns={columns}
        request={fetchData}
        toolBarRender={false}
      />
    </Card>
  );
};