import {
  MyBetaModalFormProps,
  MyButtons,
  MyColumns,
  MyProTableProps,
} from '@/common';
import { Apis } from '@/gen/Apis';
import {
  ContractBillsCostTypeEnum,
  HouseOrdersOrderStatusEnum,
} from '@/gen/Enums';
import PayBills from '@/pages/contract/contract_bills/modals/PayBills';
import { ProTable } from '@ant-design/pro-components';
import { useNavigate } from '@umijs/max';
import { Space } from 'antd';

export default function Index(props: MyBetaModalFormProps) {
  const navigate = useNavigate();
  return (
    <ProTable<Record<any, any>>
      {...MyProTableProps.props}
      request={async (params, sort) =>
        MyProTableProps.request(
          { ...params, contracts_id: props?.item?.id },
          sort,
          Apis.Contract.ContractBills.List,
        )
      }
      headerTitle="账单列表"
      toolBarRender={() => [
        <MyButtons.Create
          key="ContractBillsCreate"
          onClick={() => {
            navigate(
              `/contract/contract_bills/pages/create?id=${props?.item?.id}`,
            );
          }}
          title="添加账单"
        />,
      ]}
      columns={[
        MyColumns.ID({ search: false }),
        {
          title: '合同',
          dataIndex: ['contract', 'name'],
          search: false,
        },
        {
          title: '合同ID',
          dataIndex: 'contracts_id',
        },
        {
          title: '年月',
          search: false,
          render: (_, item: any) => {
            return `${item?.year || 0}-${
              item?.month < 10 ? `0${item?.month}` : item?.month
            }`;
          },
        },
        MyColumns.EnumTag({
          title: '支付状态',
          dataIndex: 'payment_status',
          valueEnum: HouseOrdersOrderStatusEnum,
        }),
        MyColumns.EnumTag({
          title: '费用类型',
          dataIndex: 'cost_type',
          valueEnum: ContractBillsCostTypeEnum,
        }),
        {
          title: '账单金额',
          search: false,
          render: (_, item: any) => {
            return `¥${item?.amount || 0}`;
          },
        },
        MyColumns.CreatedAt(),
        MyColumns.Option({
          render: (_, item: any, index, action) => (
            <Space key={index}>
              <PayBills item={item} reload={action?.reload} title="凭证" />
              <MyButtons.Default
                key="Create"
                size="small"
                type="primary"
                disabled={item?.payment_status === 'Paid'}
                onClick={() => {
                  navigate(
                    `/contract/contract_bills/pages/update?id=${item.id}`,
                  );
                }}
                title="编辑"
              />
              <MyButtons.Delete
                disabled={item?.payment_status === 'Paid'}
                onConfirm={() =>
                  Apis.Contract.ContractBills.Delete({ id: item.id }).then(() =>
                    action?.reload(),
                  )
                }
              />
            </Space>
          ),
        }),
      ]}
    />
  );
}
