pay-admin/src/common/components/schema/MyColumns.tsx

import { MyResponseType, renderTextHelper } from '@/common';
import { Apis } from '@/gen/Apis';
import { ProColumns } from '@ant-design/pro-components';
import { Image, Popconfirm, Tag } from 'antd';

type ReturnType = ProColumns<Record<string, any>, 'text'>;

export const MyColumns = {
  ID(props?: ReturnType): ReturnType {
    return { title: 'ID', dataIndex: 'id', hideInSearch: true, ...props };
  },
  DayStatus: (start: string, end: string) => {
    const now = new Date();
    const startDate = new Date(start);
    const endDate = new Date(end);
    // 判断当前时间与开始时间和结束时间的关系
    if (now < startDate) {
      return (
        <Tag color="green" style={{ cursor: 'pointer' }}>
          未开始
        </Tag>
      );
    } else if (now > endDate) {
      return (
        <Tag color="default" style={{ cursor: 'pointer' }}>
          已结束
        </Tag>
      );
    } else {
      return (
        <Tag color="#f50" style={{ cursor: 'pointer' }}>
          进行中
        </Tag>
      );
    }
  },
  Images({ ...rest }: ReturnType): ReturnType {
    return {
      hideInSearch: true,
      renderText: renderTextHelper.Images,
      ...rest,
    };
  },
  SoftDelete({
    onRestore,
    onSoftDelete,
    ...rest
  }: {
    onRestore: (data: { id: number }) => Promise<MyResponseType>;
    onSoftDelete: (data: { id: number }) => Promise<MyResponseType>;
  } & ReturnType): ReturnType {
    return {
      title: '启/禁用',
      render: (_, item, index, action) =>
        item?.deleted_at ? (
          <Popconfirm
            title="启用"
            description="您确认启用吗？"
            onConfirm={() => {
              onRestore?.({ id: item.id }).then(() => action?.reload());
            }}
            okText="是"
            cancelText="否"
          >
            <Tag color="gray" style={{ cursor: 'pointer' }}>
              已禁用
            </Tag>
          </Popconfirm>
        ) : (
          <Popconfirm
            title="禁用"
            description="您确认禁用吗？"
            onConfirm={() => {
              onSoftDelete?.({ id: item.id }).then(() => action?.reload());
            }}
            okText="是"
            cancelText="否"
          >
            <Tag color="green" style={{ cursor: 'pointer' }}>
              已启用
            </Tag>
          </Popconfirm>
        ),
      search: false,
      ...rest,
    };
  },
  CreatedAt(props?: ReturnType): ReturnType {
    return {
      title: '创建时间',
      dataIndex: 'created_at',
      hideInSearch: true,
      valueType: 'dateTime',
      sorter: true,
      align: 'right',
      ...props,
    };
  },
  UpdatedAt(): ReturnType {
    return {
      title: '最近修改',
      dataIndex: 'updated_at',
      hideInSearch: true,
      valueType: 'dateTime',
      sorter: true,
      align: 'right',
    };
  },
  FinishedAt(): ReturnType {
    return {
      title: '完成时间',
      dataIndex: 'finished_at',
      hideInSearch: true,
      valueType: 'dateTime',
      sorter: true,
      align: 'right',
    };
  },
  Boolean({ label, ...rest }: { label?: string[] } & ReturnType): ReturnType {
    const option: { value: boolean; label: string; color: string }[] = [
      { value: false, label: label?.[0] ?? '否', color: 'gray' },
      { value: true, label: label?.[1] ?? '是', color: 'green' },
    ];
    return {
      align: 'center',
      request: async () => option,
      renderText(text: boolean) {
        const item = option.find((item) => item.value === Boolean(text));
        return <Tag color={item?.color}>{item?.label}</Tag>;
      },
      ...rest,
    };
  },
  YesOrNo({
    yes = '已',
    no = '未',
    ...rest
  }: {
    yes?: string;
    no?: string;
  } & ReturnType): ReturnType {
    return {
      align: 'center',
      renderText(text) {
        return (
          <Tag bordered={false} color={text ? 'processing' : 'error'}>
            {text ? yes : no}
          </Tag>
        );
      },
      ...rest,
    };
  },
  EnumTag({ ...rest }: ReturnType): ReturnType {
    return {
      align: 'center',
      renderText(text: string | number) {
        const _enum = rest.valueEnum ?? {};
        if (!_enum) return <>-</>;
        const item = _enum[text] ?? undefined;
        if (!item) return <>-</>;
        return <Tag color={item.color}>{item.text}</Tag>;
      },
      ...rest,
    };
  },
  Option({ ...rest }: ReturnType): ReturnType {
    return {
      title: '操作',
      valueType: 'option',
      align: 'right',
      fixed: 'right',
      ...rest,
    };
  },
  Companies(props?: ReturnType): ReturnType {
    return {
      title: '选择机构',
      valueType: 'select',
      hideInTable: true,
      key: 'companies_id',
      dataIndex: 'companies_id',
      request: async () => (await Apis.Company.Companies.Select()).data,
      ...props,
    };
  },
  Token({ ...rest }) {
    return {
      title: 'Token',
      renderText(text: string) {
        return <Tag color="blue">{text}</Tag>;
      },
      ...rest,
    };
  },
  Image({ ...rest }) {
    return {
      search: false,
      renderText(text: { url: string }[]) {
        return <Image src={text[0]?.url} width={50} height={50} />;
      },
      ...rest,
    };
  },
};