import { RESPONSE_CODE } from '@/constants/enum';
import { postServiceOrderNoNeedInvoicingEdit } from '@/services';
import { enumToSelect } from '@/utils';
import {
  DrawerForm,
  ProFormDatePicker,
  ProFormSelect,
  ProFormText,
} from '@ant-design/pro-components';
import { Form, message } from 'antd';
import { useEffect, useState } from 'react';
import { INVOCING_STATUS_OPTIONS_OLD } from '../../constant';

export default ({ mainOrder, subOrders, setVisible, isMainOrder, onClose }) => {
  const [invoicingStatus, setInvoicingStatus] = useState('');
  useEffect(() => {
    setInvoicingStatus(subOrders[0]?.invoicingStatus);
  }, []);
  const subOrderIds = subOrders?.map((subOrder) => {
    return subOrder?.id;
  });
  const mainOrderId = mainOrder.id;
  const [form] = Form.useForm<{
    collectMoneyTime: string;
    subIds: [];
    financialReceiptIssuanceTime: string;
  }>();

  //回显开收据时间和收款时间
  if (!isMainOrder) {
    form.setFieldValue('collectMoneyTime', subOrders[0].collectMoneyTime);
    form.setFieldValue(
      'financialReceiptIssuanceTime',
      subOrders[0].financialReceiptIssuanceTime,
    );
  }

  return (
    <DrawerForm<{
      collectMoneyTime: string;
      financialReceiptIssuanceTime: string;
      subIds: [];
    }>
      open
      title={isMainOrder ? '编辑开票信息' : '编辑收款时间'}
      resize={{
        onResize() {
          console.log('resize!');
        },
        maxWidth: window.innerWidth * 0.8,
        minWidth: 400,
      }}
      initialValues={mainOrder}
      form={form}
      autoFocusFirstInput
      drawerProps={{
        destroyOnClose: true,
      }}
      submitTimeout={2000}
      onFinish={async (values) => {
        let body = {
          ...values,
          mainOrderId: mainOrderId,
          subIds: subOrderIds,
        };

        if (!isMainOrder) {
          body.invoicingStatus = 'UN_INVOICE';
        }

        let res = await postServiceOrderNoNeedInvoicingEdit({
          data: body,
        });
        if (res.result === RESPONSE_CODE.SUCCESS) {
          message.success(res.message);
          onClose();
        }
      }}
      onOpenChange={(val) => {
        return !val && setVisible(val);
      }}
    >
      {isMainOrder ? (
        <ProFormSelect
          placeholder="选择是否需要开票"
          name="invoicingStatus"
          width="lg"
          label="是否需要开票"
          options={enumToSelect(INVOCING_STATUS_OPTIONS_OLD)}
          onChange={setInvoicingStatus}
          initialValue={subOrders[0]?.invoicingStatus}
          // disabled={mainInfoDisbled}
          rules={[{ required: true, message: '是否需要开票必填' }]}
        />
      ) : (
        ''
      )}

      {invoicingStatus !== 'UN_INVOICE' ? (
        <>
          <ProFormText
            key="invoiceIdentificationNumber"
            width="lg"
            name="invoiceIdentificationNumber"
            label="开票信息"
            placeholder="请输入开票信息"
            rules={[{ required: true, message: '开票信息必填' }]}
          />
          <ProFormText
            key="bank"
            width="lg"
            name="bank"
            label="开户银行"
            placeholder="请输入开户银行"
          />
          <ProFormText
            key="bankAccountNumber"
            width="lg"
            name="bankAccountNumber"
            label="开户银行账号"
            placeholder="请输入开户银行账号"
          />
        </>
      ) : (
        ''
      )}

      <ProFormDatePicker
        key="financialReceiptIssuanceTime"
        width="lg"
        name="financialReceiptIssuanceTime"
        label="开收据时间"
        // rules={[
        //   {
        //     required: !isMainOrder && invoicingStatus === 'UN_INVOICE',
        //     message: '开收据时间必填',
        //   },
        // ]}
      />
      <ProFormDatePicker
        key="collectMoneyTime"
        width="lg"
        name="collectMoneyTime"
        label="收款时间"
        // rules={[
        //   {
        //     required: !isMainOrder && invoicingStatus === 'UN_INVOICE',
        //     message: '收款时间必填',
        //   },
        // ]}
      />
    </DrawerForm>
  );
};