canrd-main / canrd-erp-front · Files

// import { PlusOutlined } from '@ant-design/icons';
import InvoiceModal from '@/pages/Invoice/components/InvoiceModal';
import {
  postServiceConstGetPayeeEnum,
  postServiceConstInvoiceType,
  postServiceConstInvoicingType,
  postServiceConstListInvoiceDetailNames,
  postServiceInvoiceApplyInvoice,
} from '@/services';
import { enumToSelect } from '@/utils';
import {
  DrawerForm,
  ProCard,
  ProFormDigit,
  ProFormGroup,
  ProFormList,
  ProFormMoney,
  ProFormSelect,
  ProFormText,
  ProFormTextArea,
} from '@ant-design/pro-components';
import { Button, Form } from 'antd';
import { useEffect } from 'react';

export default ({ dataList, mainOrder, setVisible, onClose }) => {
  // let subOrderIds = dataList?.map((item) => {
  //   return item.id;
  // });
  const [form] = Form.useForm();
  useEffect(() => {}, []);
  return (
    <DrawerForm
      open
      title="合并开票"
      resize={{
        onResize() {
          console.log('resize!');
        },
        maxWidth: window.innerWidth * 0.8,
        minWidth: 400,
      }}
      form={form}
      autoFocusFirstInput
      drawerProps={{
        destroyOnClose: true,
      }}
      submitter={{
        render: (props, defaultDoms) => {
          return [
            <InvoiceModal
              key={'invoicePreview'}
              button={<Button type="primary"> 发票预览 </Button>}
              getRecord={form.getFieldsValue}
            />,
            ...defaultDoms,
          ];
        },
      }}
      submitTimeout={2000}
      onFinish={async (values) => {
        postServiceInvoiceApplyInvoice({
          data: {
            ...values,
            subOrderIds: dataList.map((item) => {
              return item.id;
            }),
          },
        });
        onClose();
      }}
      onOpenChange={(val) => {
        return !val && setVisible();
      }}
    >
      <ProFormList
        name="subOrderIdObjs"
        readonly={true}
        label="开票订单"
        initialValue={dataList.map((item) => {
          return {
            value: item.id,
          };
        })}
        deleteIconProps={false}
      >
        <ProFormGroup key="group">
          <ProFormText readonly={true} name="value" label="" />
        </ProFormGroup>
      </ProFormList>
      <ProFormText
        rules={[
          {
            required: true,
          },
        ]}
        width="md"
        name="partyAName"
        label="购方名称"
        initialValue={mainOrder.institution}
        placeholder="请输入名称"
      />
      <ProFormText
        rules={[
          {
            required: true,
          },
        ]}
        width="md"
        name="partyATaxid"
        label="购方税号"
        placeholder="请输入名称"
      />
      <ProFormText
        width="md"
        name="partyAOpenBank"
        label="开户银行"
        placeholder="请输入名称"
      />
      <ProFormText
        width="md"
        name="partyABankAccount"
        label="开户行账号"
        placeholder="请输入名称"
      />
      <ProFormMoney
        label="开票金额"
        name="price"
        locale="zh-CN"
        rules={[{ required: true, message: '请填写开票金额!' }]}
        initialValue={dataList.reduce((accumulator, currentValue) => {
          return accumulator + currentValue.subOrderPayment;
        }, 0)}
      />
      <ProFormSelect
        name="invoicingType"
        label="开具类型"
        request={async () => {
          let invoicingTypeRet = await postServiceConstInvoicingType();
          let options = enumToSelect(invoicingTypeRet.data);
          return options;
        }}
        placeholder="请选择开具类型"
        rules={[{ required: true, message: '请选择开具类型!' }]}
      />
      <ProFormSelect
        name="type"
        label="开票类型"
        placeholder="请选择开票类型"
        rules={[{ required: true, message: '请选择开票类型!' }]}
        request={async () => {
          let invoiceTypeRet = await postServiceConstInvoiceType();
          let options = enumToSelect(invoiceTypeRet.data);
          return options;
        }}
      />
      <ProFormSelect
        name="partyB"
        label="开票收款单位"
        request={async () => {
          const res = await postServiceConstGetPayeeEnum();
          let options = res?.data?.map((payee: any) => {
            return {
              ...payee,
              label: payee.payeeName,
              value: payee.name,
            };
          });
          return options;
        }}
        onChange={(_, option) => {
          if (option) {
            form.setFieldsValue({
              partyBName: option.payeeName,
              partyBTaxid: option.taxId,
            });
          }
        }}
        placeholder="请选择收款单位"
        rules={[{ required: true, message: '请选择收款单位!' }]}
      />
      <ProFormText
        name="partyBName"
        label="开票收款单位名称"
        hidden
        rules={[{ required: true, message: '请选择收款单位!' }]}
      />
      <ProFormText
        name="partyBTaxid"
        label="开票收款单位税号"
        hidden
        rules={[{ required: true, message: '请选择收款单位!' }]}
      />
      <ProFormSelect
        name="isUrgent"
        label="是否加急"
        valueEnum={{
          true: '是',
          false: '否',
        }}
        placeholder="请选择是否加急"
        rules={[{ required: true, message: '请选择是否加急!' }]}
      />
      <ProFormList
        name="invoiceDetails"
        label="开票明细"
        initialValue={dataList.map((item) => {
          return {
            projectName: item.productName,
            specification: item.parameters,
            unit: item.unit,
            quantity: item.quantity,
            price: item.productPrice,
            totalPrice: item.totalPayment,
          };
        })}
        rules={[
          {
            required: true,
            validator: async (_, value) => {
              console.log(value);
              if (value && value.length > 0) {
                return;
              }
              throw new Error('至少要有一项！');
            },
          },
        ]}
        itemRender={(doms, listMeta) => {
          console.log(listMeta);
          return (
            <ProCard
              bordered
              extra={doms.action}
              title={'明细' + (listMeta.index + 1)}
              style={{
                marginBlockEnd: 8,
              }}
            >
              <ProFormSelect
                key={'projectName' + listMeta.index}
                width="md"
                showSearch
                name="projectName"
                request={async (value) => {
                  const keywords = value.keyWords;
                  const res = await postServiceConstListInvoiceDetailNames({
                    data: {
                      nameLike: keywords,
                    },
                  });
                  let options = res?.data?.map((c: any) => {
                    return {
                      ...c,
                      label: c.name,
                      value:
                        '*' +
                        c.productAndServiceCatagoryAbbreviation +
                        '*' +
                        c?.name,
                      key: c.id,
                    };
                  });
                  return options;
                }}
                fieldProps={{
                  filterOption() {
                    return true;
                  },
                }}
                onChange={(_, option) => {
                  let index = listMeta.index;
                  let copyList = form.getFieldValue('invoiceDetails');
                  let currentData = copyList[index];
                  currentData.projectName =
                    '*' +
                    option.productAndServiceCatagoryAbbreviation +
                    '*' +
                    option.name;
                  currentData.specification = option.specification;
                  currentData.unit = option.unit;
                  form.setFieldValue('invoiceDetails', copyList);
                }}
                debounceTime={1000}
                label="项目名称"
                placeholder="请输入名称"
              />
              <ProFormText
                key={'specification' + listMeta.index}
                name="specification"
                label="规格型号"
                placeholder="请输入名称"
              />
              <ProFormText
                key={'unit' + listMeta.index}
                name="unit"
                label="单位"
                placeholder="请输入名称"
              />
              <ProFormDigit
                key={'quantity' + listMeta.index}
                label="数量"
                name="quantity"
                min={0}
              />
              <ProFormDigit
                key={'price' + listMeta.index}
                label="单价"
                name="price"
                min={0}
              />
              <ProFormMoney
                key={'totalPrice' + listMeta.index}
                label="金额"
                name="totalPrice"
                locale="zh-CN"
              />
            </ProCard>
          );
        }}
      ></ProFormList>
      <ProFormTextArea
        name="applyInvoicingNotes"
        label="备注"
        placeholder="请输入名称"
      />
    </DrawerForm>
  );
};