canrd-main / canrd-erp-front · Files

import { RESPONSE_CODE } from '@/constants/enum';
import {
  postServiceOrderEditOrder,
  postServiceOrderInvoicing,
} from '@/services';
import { FloatAdd, enumToSelect, enumValueToLabel } from '@/utils';
import { getReceivingCompanyOptions } from '@/utils/order';
import {
  DrawerForm,
  ProFormDatePicker,
  ProFormDigit,
  ProFormSelect,
  ProFormText,
  ProFormTextArea,
} from '@ant-design/pro-components';
import { Button, Form, message } from 'antd';
import { useEffect, useState } from 'react';
import { INVOCING_STATUS_OPTIONS_OLD, PAYEE_OPTIONS } from '../../constant';

export default ({
  mainOrder,
  subOrders,
  isEdit,
  isMainOrder,
  cancel,
  onClose,
}) => {
  const [invoicingStatus, setInvoicingStatus] = useState('');
  const subIds = subOrders.map((item) => item.id);
  useEffect(() => {
    // 在组件挂载或数据变化时，更新组件状态
    if (mainOrder) {
      setInvoicingStatus(subOrders[0]?.invoicingStatus);
    }
  }, [mainOrder]);
  useEffect(() => {
    console.log(JSON.stringify(subOrders));
  }, []);

  const [form] = Form.useForm<{ name: string; company: string }>();

  /**
   * 自动选择收款公司
   * @param receivingCompany
   */
  function chooseReceivingCompany(receivingCompany: any) {
    form.setFieldValue('payee', receivingCompany);
  }

  /**
   * 计算选中子订单的主订单金额之和
   */
  function computeTotalPayment() {
    let distinctMap = new Map();

    subOrders?.forEach((item: any) => {
      distinctMap.set(item.mainOrderId, item.totalPayment);
    });

    let sum = 0;
    for (let p of distinctMap.values()) {
      sum = FloatAdd(p, sum);
    }

    form.setFieldValue('money', sum);
  }

  return (
    <DrawerForm<{
      name: string;
      company: string;
    }>
      open
      title="财务信息"
      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 res;
        let body = values;
        body.subIds = subIds;
        if (isEdit) {
          res = await postServiceOrderEditOrder({ data: body });
        } else {
          res = await postServiceOrderInvoicing({ data: body });
        }
        if (res.result === RESPONSE_CODE.SUCCESS) {
          message.success(res.message);
          onClose();
        }
      }}
      onOpenChange={(val) => {
        return !val && cancel();
      }}
    >
      {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: '是否需要开票必填' }]}
        />
      ) : (
        ''
      )}

      <ProFormTextArea
        width="lg"
        name="invoiceIdentificationNumber"
        label="开票信息"
        placeholder="请输入开票信息"
        disabled
      />
      <ProFormText
        width="lg"
        name="bank"
        label="开户银行"
        placeholder="请输入开户银行"
        disabled
      />
      <ProFormText
        width="lg"
        name="bankAccountNumber"
        label="开户银行账号"
        placeholder="请输入开户银行账号"
        disabled
      />

      {invoicingStatus !== 'UN_INVOICE'
        ? [
          <ProFormDatePicker
            key="invoicingTime"
            width="lg"
            name="invoicingTime"
            label="开票时间"
            disabled={isEdit}
            rules={[
              { required: !isEdit ? true : false, message: '这是必填项' },
            ]}
            initialValue={subOrders[0]?.invoicingTime}
          />,
          <ProFormText
            key="purchaser"
            width="lg"
            name="purchaser"
            label="抬头名称"
            disabled={isEdit}
            rules={[
              { required: !isEdit ? true : false, message: '这是必填项' },
            ]}
            initialValue={subOrders[0]?.purchaser}
          />,
          <ProFormDatePicker
            key="financialReceiptIssuanceTime"
            width="lg"
            name="financialReceiptIssuanceTime"
            label="开收据时间"
            initialValue={subOrders[0]?.financialReceiptIssuanceTime}
          />,
          <ProFormDatePicker
            key="collectMoneyTime"
            width="lg"
            name="collectMoneyTime"
            label="收款时间"
            initialValue={subOrders[0]?.collectMoneyTime}
          />,
          <ProFormText
            width="lg"
            key="invoiceNumber"
            name="invoiceNumber"
            label="发票号码"
            initialValue={subOrders[0]?.invoiceNumber}
            rules={[{ required: true, message: '发票号码必填' }]}
          />,
          <div
            key="salesChooseReceivingCompany"
            hidden={subOrders[0].receivingCompany === null}
          >
            <span className={'pl-2 text-xs text-gray-400'}>
              销售申请开票时选择了：
              {enumValueToLabel(
                subOrders[0].receivingCompany,
                getReceivingCompanyOptions(PAYEE_OPTIONS),
              )}
            </span>
            <span
              hidden={subOrders[0].receivingCompany === 'ANY'}
              className={
                'pl-2 text-xs text-[#1677ff] cursor-pointer hover:text-[#64abf7]'
              }
              onClick={() => {
                chooseReceivingCompany(subOrders[0].receivingCompany);
              }}
            >
              选择
            </span>
          </div>,
          <ProFormSelect
            key="payee"
            placeholder="选择收款单位"
            name="payee"
            width="lg"
            showSearch
            label="收款单位"
            options={enumToSelect(PAYEE_OPTIONS)}
            initialValue={subOrders[0]?.payee}
            rules={[{ required: true, message: '收款单位必填' }]}
          />,

          <div id="total-payment" key="money">
            <ProFormDigit
              key="money"
              name="money"
              width="lg"
              label="金额"
              rules={[{ required: true, message: '金额必填' }]}
              tooltip="点击计算，合计所有子订单对应主订单总额"
              fieldProps={{
                addonAfter: (
                  <Button
                    className="rounded-l-none"
                    type="primary"
                    onClick={computeTotalPayment}
                  >
                    计算
                  </Button>
                ),
              }}
            />
          </div>,
        ]
        : ''}

      <ProFormSelect
        placeholder="是否完全开票"
        name="afterInvoicingStatus"
        width="lg"
        label="是否完全开票"
        options={[
          { label: '完全开票', value: 'COMPLETE_INVOICING' },
          { label: '部分开票', value: 'PARTIAL_INVOICING' },
        ]}
        // disabled={mainInfoDisbled}
        initialValue={
          subOrders[0]?.afterInvoicingStatus === 'APPLY_FOR_INVOICING'
            ? 'COMPLETE_INVOICING'
            : subOrders[0]?.afterInvoicingStatus
        }
        rules={[{ required: true, message: '是否完全开票必填' }]}
      />
      <ProFormTextArea
        width="lg"
        name="invoicingNotes"
        label="备注"
        initialValue={subOrders[0]?.invoicingNotes}
      />
    </DrawerForm>
  );
};