import {
  deleteOrderErpOrderStagesDelect,
  getOrderErpOrderStagesListAll,
  postOrderErpOrderStagesSearch,
} from '@/services';
import { orderExport } from '@/services/order';
import { VerticalAlignTopOutlined } from '@ant-design/icons';
import type { ProColumns } from '@ant-design/pro-components';
import { ProTable } from '@ant-design/pro-components';
import { Button, message } from 'antd';
import { useRef } from 'react';
import Comfire from '../comfire/comfire';
import AddModel from '../detail/detail';
import EditorModel from '../edit/edit';
import ReadModel from '../read/read';
import UploadModel from '../upload/uploadModel';
import './title.less';
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 OrderStagesItem = {
  //文件编号
  id?: number;
  //合同编号
  contract?: string;
  //供应商名称
  vendor?: string;
  //签合同日期
  dateRange?: Date;
  //终端名称
  terminal?: string;
  //设备编号
  dId?: number;
  //设备名称
  deviceName?: string;
  //设备型号
  deviceModel?: string;
  //数量
  count?: number;
  //单价
  unitPrice?: number;
  //总价
  price?: number;
  //合同总金额
  totalPrice?: number;
  //付款方式
  payWay?: string;
  //附件
  annex?: string;
  //备注
  remark?: string;
};

type OrderStagesWithListItem = {
  //文件编号
  id: number;
  //合同编号
  contract: string;
  //供应商名称
  vendor: string;
  //签合同日期
  dateRange: Date;
  //终端名称
  terminal: string;
  orderStagesDeviceVoList: orderStagesDevice[];
  //合同总金额
  totalPrice: number;
  //付款方式
  payWay: string;
  //附件
  annex: string;
  //备注
  remark: string;
};

type orderStagesDevice = {
  //设备id
  dId: number;
  //设备名称
  deviceName: string;
  //设备型号
  deviceModel: string;
  //数量
  count: number;
  //单价
  unitPrice: number;
  //总价
  price: number;
};

export default () => {
  // const actionRef = useRef<ActionType>();
  // const [TableItem, setTableItem] = useState([]);

  interface ActionType {
    reload: (resetPageIndex?: boolean) => void;
    reloadAndRest: () => void;
    reset: () => void;
    clearSelected?: () => void;
    startEditable: (rowKey: Key) => boolean;
    cancelEditable: (rowKey: Key) => boolean;
  }

  const ref = useRef<ActionType>({
    reload: () => {
      // implementation for reload
    },
    reloadAndRest: () => {
      // implementation for reloadAndRest
    },
    reset: () => {
      // implementation for reset
    },
    startEditable: () => {
      // implementation for startEditable
    },
    cancelEditable: () => {
      // implementation for cancelEditable
    },
  });

  function reload() {
    ref.current.reload();
  }

  async function toDelete(value) {
    const res = await deleteOrderErpOrderStagesDelect({
      data: {
        ids: null,
        deviceIds: value,
      },
    });
    if (res) {
      message.success('删除成功');
      ref.current.reload();
    } else {
      message.error('删除失败');
    }
  }

  const exportLoadingDestory = () => {
    message.success('导出成功');
  };

  async function toExport() {
    // await getOrderErpOrderStagesExport()
    orderExport(
      '/api/order/erp/orderStages/export',
      '分期订单.xlsx',
      'get',
      {},
      exportLoadingDestory,
    );
  }

  const columns: ProColumns<OrderStagesItem>[] = [
    {
      title: '文件编号',
      dataIndex: 'id',
      width: '7%',
      render: (_, record) => {
        if (record.id) {
          const text = record.id.toString();
          const paddedText = '0'.repeat(4 - text.length) + text;
          return paddedText;
        }
      },
    },
    {
      title: '签合同日期',
      dataIndex: 'dateRange',
      valueType: 'date',
      filters: true,
      onFilter: true,
      ellipsis: true,
      width: '8%',
    },
    {
      disable: true,
      title: '合同编号',
      dataIndex: 'contract',
      filters: true,
      onFilter: true,
      ellipsis: true,
      width: '9%',
    },
    {
      disable: true,
      title: '供应商名称',
      dataIndex: 'vendor',
      filters: true,
      onFilter: true,
      ellipsis: true,
    },
    {
      disable: true,
      title: '终端名称',
      dataIndex: 'terminal',
      filters: true,
      onFilter: true,
      ellipsis: true,
      width: '6%',
    },
    {
      disable: true,
      title: '设备名称',
      dataIndex: 'deviceName',
      filters: true,
      onFilter: true,
      ellipsis: true,
    },
    {
      disable: true,
      title: '设备型号',
      dataIndex: 'deviceModel',
      filters: true,
      hideInSearch: true,
      onFilter: false,
      ellipsis: true,
      width: '10%',
    },
    {
      disable: true,
      title: '数量',
      dataIndex: 'count',
      filters: true,
      hideInSearch: true,
      onFilter: false,
      ellipsis: true,
      width: '4%',
    },
    {
      disable: true,
      title: '单价',
      dataIndex: 'unitPrice',
      filters: true,
      hideInSearch: true,
      onFilter: false,
      ellipsis: true,
      width: '5%',
    },
    {
      disable: true,
      title: '总价',
      dataIndex: 'price',
      filters: true,
      hideInSearch: true,
      onFilter: false,
      ellipsis: true,
      width: '5%',
    },
    {
      disable: true,
      title: '合同总金额',
      dataIndex: 'totalPrice',
      filters: true,
      hideInSearch: true,
      onFilter: false,
      ellipsis: true,
      width: '6%',
    },
    {
      disable: true,
      title: '付款方式',
      dataIndex: 'payWay',
      filters: true,
      hideInSearch: true,
      onFilter: false,
      ellipsis: true,
    },
    {
      disable: true,
      title: '附件',
      dataIndex: 'annex',
      filters: true,
      hideInSearch: true,
      onFilter: false,
      ellipsis: true,
      width: '5%',
      render: (_, record) => {
        if (record.id) {
          return <a href={record.annex}>{record.annex}</a>;
        }
      },
    },
    {
      disable: true,
      title: '备注',
      dataIndex: 'remark',
      filters: true,
      hideInSearch: true,
      onFilter: false,
      ellipsis: true,
      width: '5%',
    },
    {
      title: '操作',
      valueType: 'option',
      key: 'option',
      width: '10%',
      render: (_text, record) => {
        if (record?.id) {
          return (
            <>
              <ReadModel currentContract={record.contract}></ReadModel>
              &nbsp;
              <EditorModel
                currentContract={record.contract}
                toReload={reload}
              ></EditorModel>
              &nbsp;
              {/* <a key="delect" target="_blank" rel="noopener noreferrer" onClick={() => { toDelete([record.dId]) }}>
                                删除
                            </a> */}
              <Comfire currtDid={record.dId} sureDelete={toDelete}></Comfire>
            </>
          );
        }
        return null;
      },
    },
  ];

  return (
    <ProTable<OrderStagesItem>
      className="title-index"
      columnEmptyText=""
      columns={columns}
      actionRef={ref}
      cardBordered
      request={async (params) => {
        // console.log(params);
        if (
          params.id !== null ||
          params.contract !== null ||
          params.vendor !== null ||
          params.terminal !== null ||
          params.deviceName !== null ||
          params.dateRange !== null
        ) {
          // console.log(params.id);
          // console.log(params.contract);
          // console.log(params.vendor);
          let PostOrderErpOrderStagesSearchOption = {
            id: params.id,
            contract: params.contract,
            vendor: params.vendor,
            terminal: params.terminal,
            deviceName: params.deviceName,
            dateRange: params.dateRange,
          };
          let res = await postOrderErpOrderStagesSearch({
            data: { ...PostOrderErpOrderStagesSearchOption },
          });
          await waitTime(2000);
          if (res) {
            // setTableItem(res.data)
            const orderStagesWithList: OrderStagesWithListItem[] = res?.data;
            let orderStagesList: OrderStagesItem[] = [];
            for (let ind = 0; ind < orderStagesWithList.length; ind++) {
              for (
                let index = 0;
                index < orderStagesWithList[ind].orderStagesDeviceVoList.length;
                index++
              ) {
                let item: OrderStagesItem = {
                  id: undefined,
                  contract: undefined,
                  vendor: undefined,
                  dateRange: undefined,
                  terminal: undefined,
                  dId: undefined,
                  deviceName: undefined,
                  deviceModel: undefined,
                  count: undefined,
                  unitPrice: undefined,
                  price: undefined,
                  totalPrice: undefined,
                  payWay: undefined,
                  annex: undefined,
                  remark: undefined,
                };
                if (index === 0) {
                  item.id = orderStagesWithList[ind].id;
                  item.contract = orderStagesWithList[ind].contract;
                  item.vendor = orderStagesWithList[ind].vendor;
                  item.dateRange = orderStagesWithList[ind].dateRange;
                  item.terminal = orderStagesWithList[ind].terminal;
                  item.dId =
                    orderStagesWithList[ind].orderStagesDeviceVoList[index].dId;
                  item.deviceName =
                    orderStagesWithList[ind].orderStagesDeviceVoList[
                      index
                    ].deviceName;
                  item.deviceModel =
                    orderStagesWithList[ind].orderStagesDeviceVoList[
                      index
                    ].deviceModel;
                  item.count =
                    orderStagesWithList[ind].orderStagesDeviceVoList[
                      index
                    ].count;
                  item.unitPrice =
                    orderStagesWithList[ind].orderStagesDeviceVoList[
                      index
                    ].unitPrice;
                  item.price =
                    orderStagesWithList[ind].orderStagesDeviceVoList[
                      index
                    ].price;
                  item.totalPrice = orderStagesWithList[ind].totalPrice;
                  item.payWay = orderStagesWithList[ind].payWay;
                  item.annex = orderStagesWithList[ind].annex;
                  item.remark = orderStagesWithList[ind].remark;
                  orderStagesList.push(item);
                } else {
                  item.id = orderStagesWithList[ind].id;
                  item.contract = orderStagesWithList[ind].contract;
                  item.vendor = orderStagesWithList[ind].vendor;
                  item.dateRange = orderStagesWithList[ind].dateRange;
                  item.terminal = orderStagesWithList[ind].terminal;
                  item.dId =
                    orderStagesWithList[ind].orderStagesDeviceVoList[index].dId;
                  item.deviceName =
                    orderStagesWithList[ind].orderStagesDeviceVoList[
                      index
                    ].deviceName;
                  item.deviceModel =
                    orderStagesWithList[ind].orderStagesDeviceVoList[
                      index
                    ].deviceModel;
                  item.count =
                    orderStagesWithList[ind].orderStagesDeviceVoList[
                      index
                    ].count;
                  item.unitPrice =
                    orderStagesWithList[ind].orderStagesDeviceVoList[
                      index
                    ].unitPrice;
                  item.price =
                    orderStagesWithList[ind].orderStagesDeviceVoList[
                      index
                    ].price;
                  item.totalPrice = orderStagesWithList[ind].totalPrice;
                  item.payWay = orderStagesWithList[ind].payWay;
                  item.annex = orderStagesWithList[ind].annex;
                  item.remark = orderStagesWithList[ind].remark;
                  orderStagesList.push(item);
                }
              }
            }
            return {
              data: orderStagesList || [],
            };
          }
        } else {
          let res = await getOrderErpOrderStagesListAll();
          await waitTime(2000);
          if (res) {
            // setTableItem(res.data)
            const orderStagesWithList: OrderStagesWithListItem[] = res?.data;
            let orderStagesList: OrderStagesItem[] = [];
            for (let ind = 0; ind < orderStagesWithList.length; ind++) {
              for (
                let index = 0;
                index < orderStagesWithList[ind].orderStagesDeviceVoList.length;
                index++
              ) {
                let item: OrderStagesItem = {
                  id: undefined,
                  contract: undefined,
                  vendor: undefined,
                  dateRange: undefined,
                  terminal: undefined,
                  dId: undefined,
                  deviceName: undefined,
                  deviceModel: undefined,
                  count: undefined,
                  unitPrice: undefined,
                  price: undefined,
                  totalPrice: undefined,
                  payWay: undefined,
                  annex: undefined,
                  remark: undefined,
                };
                if (index === 0) {
                  item.id = orderStagesWithList[ind].id;
                  item.contract = orderStagesWithList[ind].contract;
                  item.vendor = orderStagesWithList[ind].vendor;
                  item.dateRange = orderStagesWithList[ind].dateRange;
                  item.terminal = orderStagesWithList[ind].terminal;
                  item.dId =
                    orderStagesWithList[ind].orderStagesDeviceVoList[index].dId;
                  item.deviceName =
                    orderStagesWithList[ind].orderStagesDeviceVoList[
                      index
                    ].deviceName;
                  item.deviceModel =
                    orderStagesWithList[ind].orderStagesDeviceVoList[
                      index
                    ].deviceModel;
                  item.count =
                    orderStagesWithList[ind].orderStagesDeviceVoList[
                      index
                    ].count;
                  item.unitPrice =
                    orderStagesWithList[ind].orderStagesDeviceVoList[
                      index
                    ].unitPrice;
                  item.price =
                    orderStagesWithList[ind].orderStagesDeviceVoList[
                      index
                    ].price;
                  item.totalPrice = orderStagesWithList[ind].totalPrice;
                  item.payWay = orderStagesWithList[ind].payWay;
                  item.annex = orderStagesWithList[ind].annex;
                  item.remark = orderStagesWithList[ind].remark;
                  orderStagesList.push(item);
                } else {
                  item.id = orderStagesWithList[ind].id;
                  item.contract = orderStagesWithList[ind].contract;
                  item.vendor = orderStagesWithList[ind].vendor;
                  item.dateRange = orderStagesWithList[ind].dateRange;
                  item.terminal = orderStagesWithList[ind].terminal;
                  item.dId =
                    orderStagesWithList[ind].orderStagesDeviceVoList[index].dId;
                  item.deviceName =
                    orderStagesWithList[ind].orderStagesDeviceVoList[
                      index
                    ].deviceName;
                  item.deviceModel =
                    orderStagesWithList[ind].orderStagesDeviceVoList[
                      index
                    ].deviceModel;
                  item.count =
                    orderStagesWithList[ind].orderStagesDeviceVoList[
                      index
                    ].count;
                  item.unitPrice =
                    orderStagesWithList[ind].orderStagesDeviceVoList[
                      index
                    ].unitPrice;
                  item.price =
                    orderStagesWithList[ind].orderStagesDeviceVoList[
                      index
                    ].price;
                  item.totalPrice = orderStagesWithList[ind].totalPrice;
                  item.payWay = orderStagesWithList[ind].payWay;
                  item.annex = orderStagesWithList[ind].annex;
                  item.remark = orderStagesWithList[ind].remark;
                  orderStagesList.push(item);
                }
              }
            }
            return {
              data: orderStagesList || [],
            };
          }
        }
      }}
      editable={{
        type: 'multiple',
      }}
      columnsState={{
        persistenceKey: 'pro-table-singe-demos',
        persistenceType: 'localStorage',
        defaultValue: {
          option: { fixed: 'right', disable: true },
        },
        // onChange(value) {
        //     console.log('value: ', value);
        // },
      }}
      rowKey="dId"
      search={{
        labelWidth: 'auto',
      }}
      options={{
        setting: {
          listsHeight: 800,
        },
      }}
      form={{
        syncToUrl: (values, type) => {
          if (type === 'get') {
            return {
              ...values,
              created_at: [values.startTime, values.endTime],
            };
          }
          return values;
        },
      }}
      pagination={{
        pageSize: 10,
        // onChange: (page) => console.log(page),
      }}
      dateFormatter="string"
      headerTitle={[]}
      toolBarRender={() => [
        <>
          <AddModel toReload={reload}></AddModel>
          <UploadModel toReload={reload}></UploadModel>
          <Button
            type="primary"
            onClick={() => {
              toExport();
            }}
          >
            <VerticalAlignTopOutlined />
            导出
          </Button>
        </>,
      ]}
    />
  );
};