import {
  MyButtons,
  MyColumns,
  MyProTableProps,
  MyTableActions,
  MyToolBarActions,
} from '@/common';
import { Selects } from '@/components/Select';
import { Apis } from '@/gen/Apis';
import {
  RenovationAppliesConstructionStatusEnum,
  RenovationAppliesStatusEnum,
} from '@/gen/Enums';
import { PlusOutlined } from '@ant-design/icons';
import { ProTable } from '@ant-design/pro-components';
import { useNavigate } from '@umijs/max';
import { Space } from 'antd';
import DepositPay from './modals/DepositPay';
import DepositRefund from './modals/DepositRefund';
import MyWorkerCreate from './modals/WorkerCreate';

export default function Index() {
  const navigate = useNavigate();

  return (
    <ProTable
      {...MyProTableProps.props}
      request={async (params, sort) =>
        MyProTableProps.request(
          params,
          sort,
          Apis.Renovation.RenovationApplies.List,
        )
      }
      headerTitle="装修申请列表"
      toolBarRender={(action) => [
        <MyToolBarActions
          key="toolbar"
          actions={{
            add: (
              <MyButtons.Default
                key="Create"
                size="middle"
                type="primary"
                icon={<PlusOutlined />}
                onClick={() => {
                  navigate('/quality/renovation/pages/create');
                }}
                title="装修申请"
              />
            ),
            rules: (
              <MyButtons.Default
                key="InspectionRules"
                size="middle"
                onClick={() => {
                  navigate('/quality/renovation/inspection_rules');
                }}
                title="巡检配置"
              />
            ),
            audit: (
              <MyButtons.Default
                key="Audit"
                size="middle"
                onClick={() => {
                  navigate('/quality/renovation/audit');
                }}
                title="资料审核"
              />
            ),
          }}
        />,
      ]}
      columns={[
        MyColumns.ID({ search: false }),
        Selects?.AssetProjects({
          title: '选择项目',
          key: 'id',
          hidden: true,
        }),
        MyColumns.EnumTag({
          title: '登记状态',
          dataIndex: 'status',
          valueEnum: RenovationAppliesStatusEnum,
          search: false,
        }),
        {
          title: '关联项目',
          dataIndex: ['asset_project', 'name'],
          search: false,
        },
        {
          title: '房屋',
          dataIndex: ['asset_house', 'full_name'],
          search: {
            transform: (value) => {
              return { full_name: value };
            },
          },
        },
        {
          title: '装修人',
          dataIndex: 'owner_name',
        },
        {
          title: '装修公司',
          dataIndex: 'company_name',
          search: false,
        },
        {
          title: '施工负责人',
          dataIndex: 'construction_principal_name',
          search: false,
        },
        MyColumns.EnumTag({
          title: '施工状态',
          dataIndex: 'construction_status',
          valueEnum: RenovationAppliesConstructionStatusEnum,
          search: false,
        }),
        {
          title: '保证金',
          dataIndex: 'deposit_amount',
          search: false,
        },
        {
          title: '施工时间',
          search: false,
          render: (_, item: any) => {
            return (
              <div>
                {item?.construction_start_date || ''} 至
                {item?.construction_end_date || ''}
              </div>
            );
          },
        },
        MyColumns.CreatedAt(),
        MyColumns.Option({
          render: (_, item: any, index, action) => (
            <Space key={index}>
              <MyTableActions
                actions={{
                  show: (
                    <MyButtons.Default
                      key="Show"
                      size="small"
                      type="primary"
                      onClick={() => {
                        navigate(
                          `/quality/renovation/pages/show?id=${item.id}`,
                        );
                      }}
                      title="查看"
                    />
                  ),
                  worker: (
                    <MyWorkerCreate
                      item={{
                        ...item,
                        size: 'small',
                      }}
                      title="装修工人"
                      key="WorkerCreate"
                    />
                  ),
                  update: (
                    <MyButtons.Default
                      key="Update"
                      size="small"
                      type="primary"
                      disabled={item.status !== 'Draft'}
                      onClick={() => {
                        navigate(
                          `/quality/renovation/pages/update?id=${item.id}`,
                        );
                      }}
                      title="编辑"
                    />
                  ),
                  pay: (
                    <DepositPay
                      key="DepositPay"
                      item={item}
                      reload={action?.reload}
                    />
                  ),
                  refund: (
                    <DepositRefund
                      key="DepositRefund"
                      item={item}
                      reload={action?.reload}
                    />
                  ),
                  delete: (
                    <MyButtons.Delete
                      disabled={item.status !== 'Draft'}
                      onConfirm={() =>
                        Apis.Renovation.RenovationApplies.Delete({
                          id: item.id,
                        }).then(() => action?.reload())
                      }
                    />
                  ),
                }}
                maxVisible={3}
              />
            </Space>
          ),
        }),
      ]}
    />
  );
}
