InvoicingDrawerForm.tsx 4.45 KB
// import { PlusOutlined } from '@ant-design/icons';
import {
  postServiceConstInvoiceType,
  postServiceConstInvoicingType,
  postServiceInvoiceApplyInvoice,
} from '@/services';
import { enumToSelect } from '@/utils';
import { CloseCircleOutlined } from '@ant-design/icons';
import {
  DrawerForm,
  ProFormGroup,
  ProFormList,
  ProFormMoney,
  ProFormSelect,
  ProFormText,
  ProFormUploadDragger,
} from '@ant-design/pro-components';
import { Form } from 'antd';
import { useEffect, useState } from 'react';
import { PAYEE_OPTIONS } from '../constant';

export default ({ dataList, setVisible, onClose }) => {
  // let subOrderIds = dataList?.map((item) => {
  //   return item.id;
  // });
  const [invoiceTypeValueEnum, setInvoiceTypeValueEnum] = useState({});
  const [invoicingTypeValueEnum, setInvoicingTypeValueEnum] = useState({});
  let initEnum = async () => {
    let invoiceTypeRet = await postServiceConstInvoiceType();
    setInvoiceTypeValueEnum(invoiceTypeRet.data);
    let invoicingTypeRet = await postServiceConstInvoicingType();
    setInvoicingTypeValueEnum(invoicingTypeRet.data);
  };
  useEffect(() => {
    initEnum();
  }, []);
  const [form] = Form.useForm();
  return (
    <DrawerForm
      open
      title="合并开票"
      resize={{
        onResize() {
          console.log('resize!');
        },
        maxWidth: window.innerWidth * 0.8,
        minWidth: 400,
      }}
      form={form}
      autoFocusFirstInput
      drawerProps={{
        destroyOnClose: true,
      }}
      submitTimeout={2000}
      onFinish={async (values) => {
        postServiceInvoiceApplyInvoice({
          data: {
            ...values,
            subOrderIds: dataList.map((item) => {
              return item.id;
            }),
          },
        });
        onClose();
      }}
      onOpenChange={(val) => {
        return !val && setVisible();
      }}
    >
      <ProFormList
        name="subOrderIdObjs"
        label="开票订单"
        /*initialValue={subOrders.map((item) => {
                    return {
                        value:item.id
                    }
                })}*/
        deleteIconProps={{
          Icon: CloseCircleOutlined,
          tooltipText: '不需要这行了',
        }}
      >
        <ProFormGroup key="group">
          <ProFormText name="value" label="" />
        </ProFormGroup>
      </ProFormList>
      <ProFormText
        rules={[
          {
            required: true,
          },
        ]}
        width="md"
        name="partyAName"
        label="购方名称"
        placeholder="请输入名称"
      />
      <ProFormText
        rules={[
          {
            required: true,
          },
        ]}
        width="md"
        name="partyATaxid"
        label="购方税号"
        placeholder="请输入名称"
      />
      <ProFormText
        rules={[
          {
            required: true,
          },
        ]}
        width="md"
        name="partyAOpenBank"
        label="开户银行"
        placeholder="请输入名称"
      />
      <ProFormText
        rules={[
          {
            required: true,
          },
        ]}
        width="md"
        name="partyABankAccount"
        label="开户行账号"
        placeholder="请输入名称"
      />
      <ProFormMoney
        label="开票金额"
        name="price"
        locale="en-GB"
        initialValue={22.22}
      />
      <ProFormSelect
        name="invoicingType"
        label="开具类型"
        options={enumToSelect(invoicingTypeValueEnum)}
        placeholder="请选择开具类型"
        rules={[{ required: true, message: '请选择开具类型!' }]}
      />
      <ProFormSelect
        name="type"
        label="开票类型"
        options={enumToSelect(invoiceTypeValueEnum)}
        placeholder="请选择开票类型"
        rules={[{ required: true, message: '请选择开票类型!' }]}
      />
      <ProFormSelect
        name="partyBName"
        label="开票收款单位"
        options={enumToSelect(PAYEE_OPTIONS)}
        placeholder="请选择收款单位"
        rules={[{ required: true, message: '请选择收款单位!' }]}
      />
      <ProFormSelect
        name="isUrgent"
        label="是否加急"
        valueEnum={{
          true: '是',
          false: '否',
        }}
        placeholder="请选择是否加急"
        rules={[{ required: true, message: '请选择是否加急!' }]}
      />
      <ProFormUploadDragger name="drag-pic" label="拖拽上传" />
    </DrawerForm>
  );
};