import {
  MyButtons,
  MyColumns,
  MyProTableProps,
  useCurrentPermissions,
} 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 MyWorkerCreate from '../modals/WorkerCreate';

export default function Index() {
  const getCurrentPermissions = useCurrentPermissions();
  const navigate = useNavigate();
  let toolBarRender = () => {
    return getCurrentPermissions(
      {
        add: (
          <MyButtons.Default
            key="Create"
            size="middle"
            type="primary"
            icon={<PlusOutlined />}
            onClick={() => {
              navigate('/renovation/application/pages/create');
            }}
            title="装修申请"
          />
        ),
      },
      'MyRenovationApplies',
    );
  };

  let tableRender = (item: any, action: any) => {
    return getCurrentPermissions(
      {
        show: (
          <MyButtons.Default
            key="Show"
            size="small"
            type="primary"
            onClick={() => {
              navigate(`/renovation/application/pages/show?id=${item.id}`);
            }}
            title="查看"
          />
        ),
        worker_add: (
          <MyWorkerCreate
            item={{
              ...item,
              size: 'small',
            }}
            title="装修工人"
            key="WorkerCreate"
          />
        ),
        update: (
          <MyButtons.Default
            key="Update"
            size="small"
            type="primary"
            disabled={item.status !== 'Draft'}
            onClick={() => {
              navigate(`/renovation/application/pages/update?id=${item.id}`);
            }}
            title="编辑"
          />
        ),
        delete: (
          <MyButtons.Delete
            disabled={item.status !== 'Draft'}
            onConfirm={() =>
              Apis.Renovation.RenovationApplies.Delete({
                id: item.id,
              }).then(() => action?.reload())
            }
          />
        ),
      },
      'MyRenovationApplies',
    );
  };

  return (
    <ProTable
      {...MyProTableProps.props}
      request={async (params, sort) =>
        MyProTableProps.request(
          params,
          sort,
          Apis.Renovation.RenovationApplies.List,
        )
      }
      headerTitle="装修申请列表"
      toolBarRender={() => [toolBarRender()]}
      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,
          // search: {
          //   transform: (value) => {
          //     return { project_name: value };
          //   },
          // },
        },
        // MyColumns.EnumTag({
        //   title: '状态',
        //   dataIndex: 'status',
        //   valueEnum: () => {
        //     let obj: any = JSON.parse(
        //       JSON.stringify(RenovationAppliesStatusEnum),
        //     );
        //     delete obj?.Pending;
        //     return obj;
        //   },
        //   hidden: true,
        // }),
        {
          title: '房屋',
          dataIndex: ['asset_house', 'full_name'],
          search: {
            transform: (value) => {
              return { full_name: value };
            },
          },
        },
        {
          title: '装修人',
          dataIndex: 'owner_name',
        },
        // {
        //   title: '代理人',
        //   dataIndex: 'agent_name',
        // },
        {
          title: '装修公司',
          dataIndex: 'company_name',
          search: false,
          // render: (_, item: any) => {
          //   return (
          //     <Space>
          //       <div>{item?.company_name || '-'}</div>
          //       <div
          //         style={{
          //           padding: '0 0 0 10px',
          //           borderLeft: '1px solid #ccc',
          //         }}
          //       >
          //         {item?.company_principal_name || ''}
          //       </div>
          //     </Space>
          //   );
          // },
        },

        {
          title: '施工负责人',
          dataIndex: 'construction_principal_name',
          search: false,
          // render: (_, item: any) => {
          //   return <div>{item?.construction_principal_name || ''}</div>;
          // },
        },
        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}>{tableRender(item, action)}</Space>
          ),
        }),
      ]}
    />
  );
}
