index.tsx 6.04 KB
import { RESPONSE_CODE } from '@/constants/enum';
import Audit from '@/pages/Invoice/ReissueRecord/components/Audit';
import {
  postServiceConstBeforeInvoicingInvoiceRecordStatus,
  postServiceInvoiceReissueRecords,
} from '@/services';
import { enumToSelect } from '@/utils';
import { useModel } from '@@/exports';
import type { ActionType, ProColumns } from '@ant-design/pro-components';
import { ProTable, TableDropdown } from '@ant-design/pro-components';
import { useRef } from 'react';

export const waitTimePromise = async (time: number = 100) => {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve(true);
    }, time);
  });
};

export const waitTime = async (time: number = 100) => {
  await waitTimePromise(time);
};

type GithubIssueItem = {
  url: string;
  id: number;
  number: number;
  title: string;
  labels: {
    name: string;
    color: string;
  }[];
  state: string;
  comments: number;
  created_at: string;
  updated_at: string;
  closed_at?: string;
};

export default () => {
  const actionRef = useRef<ActionType>();
  const { getInvoiceFlushStatus } = useModel('enum');
  const columns: ProColumns<GithubIssueItem>[] = [
    {
      dataIndex: 'index',
      valueType: 'indexBorder',
      width: 48,
    },
    {
      title: '重开的发票',
      dataIndex: 'invoiceNumbers',
      render: (_, record) => {
        return record.invoiceNumbers?.join(',');
      },
      hideInSearch: true,
    },
    {
      title: '重开原因',
      dataIndex: 'notes',
      ellipsis: true,
      hideInSearch: true,
    },
    {
      title: '申请人',
      dataIndex: 'createByName',
      ellipsis: true,
      hideInSearch: true,
    },
    {
      title: '申请时间',
      dataIndex: 'createTime',
      ellipsis: true,
      hideInSearch: true,
    },
    {
      title: '审核状态',
      dataIndex: 'statusText',
      ellipsis: true,
      hideInSearch: true,
    },
    {
      title: '冲红状态',
      dataIndex: 'flushStatusText',
      ellipsis: true,
      hideInSearch: true,
    },
    {
      title: '财务负责人',
      dataIndex: 'financeManager',
      ellipsis: true,
      hideInSearch: true,
    },
    {
      title: '冲红时间',
      dataIndex: 'flushDatetime',
      ellipsis: true,
      hideInSearch: true,
    },

    {
      title: '发票号码',
      dataIndex: 'invoiceNumber',
      hideInTable: true,
    },
    {
      title: '申请人',
      dataIndex: 'createByName',
      hideInTable: true,
    },
    {
      title: '重开原因',
      dataIndex: 'notes',
      hideInTable: true,
    },
    {
      title: '申请时间',
      valueType: 'dateRange',
      hideInTable: true,
      search: {
        transform: (value) => {
          if (value) {
            return {
              createDatetimeGe: value[0],
              createDatetimeLe: value[1],
            };
          }
        },
      },
    },
    {
      title: '审核状态',
      valueType: 'select',
      key: 'status',
      dataIndex: 'status',
      filters: true,
      onFilter: true,
      hideInTable: true,
      request: async () => {
        const res = await postServiceConstBeforeInvoicingInvoiceRecordStatus();
        return enumToSelect(res.data);
      },
    },
    {
      title: '冲红状态',
      valueType: 'select',
      key: 'flushStatus',
      dataIndex: 'flushStatus',
      filters: true,
      onFilter: true,
      hideInTable: true,
      request: async () => {
        const res = await getInvoiceFlushStatus();
        return enumToSelect(res);
      },
    },
    {
      title: '财务负责人',
      dataIndex: 'financeManager',
      ellipsis: true,
      hideInTable: true,
    },
    {
      title: '冲红时间',
      valueType: 'dateRange',
      hideInTable: true,
      search: {
        transform: (value) => {
          if (value) {
            return {
              flushDatetimeGe: value[0],
              flushDatetimeLe: value[1],
            };
          }
        },
      },
    },

    {
      title: '操作',
      valueType: 'option',
      key: 'option',
      render: (text, record, _, action) => [
        <Audit key={'audit'} recordId={record.id} />,
        <a
          href={record.url}
          target="_blank"
          rel="noopener noreferrer"
          key="view"
        >
          查看
        </a>,
        <TableDropdown
          key="actionGroup"
          onSelect={() => action?.reload()}
          menus={[
            { key: 'copy', name: '复制' },
            { key: 'delete', name: '删除' },
          ]}
        />,
      ],
    },
  ];
  return (
    <ProTable<GithubIssueItem>
      columns={columns}
      actionRef={actionRef}
      cardBordered
      request={async (params) => {
        const res = await postServiceInvoiceReissueRecords({
          data: {
            ...params,
          },
        });
        if (res.result === RESPONSE_CODE.SUCCESS) {
          return {
            data: res?.data?.data,
            total: res?.data?.total || 0,
          };
        }
        return {
          data: [],
          success: false,
        };
      }}
      editable={{
        type: 'multiple',
      }}
      columnsState={{
        persistenceKey: 'pro-table-singe-demos',
        persistenceType: 'localStorage',
        defaultValue: {
          option: { fixed: 'right', disable: true },
        },
        onChange(value) {
          console.log('value: ', value);
        },
      }}
      rowKey="id"
      search={{
        labelWidth: 'auto',
      }}
      options={{
        setting: {
          listsHeight: 400,
        },
      }}
      form={{
        // 由于配置了 transform,提交的参数与定义的不同这里需要转化一下
        syncToUrl: (values, type) => {
          if (type === 'get') {
            return {
              ...values,
              created_at: [values.startTime, values.endTime],
            };
          }
          return values;
        },
      }}
      pagination={{
        pageSize: 5,
        onChange: (page) => console.log(page),
      }}
      dateFormatter="string"
      headerTitle="高级表格"
    />
  );
};