Blame view

src/pages/Invoice/waitProcessRecord/components/AddInvoiceDrawerForm.tsx 5.03 KB
曾国涛 authored
1
import { RESPONSE_CODE } from '@/constants/enum';
曾国涛 authored
2
import { PAYEE_OPTIONS } from '@/pages/Order/constant';
3
4
5
6
import {
  postServiceInvoiceAddInvoice,
  postServiceOrderQuerySalesCode,
} from '@/services';
曾国涛 authored
7
import { enumToSelect } from '@/utils';
曾国涛 authored
8
9
10
11
12
13
14
15
16
17
18
19
import { PlusOutlined } from '@ant-design/icons';
import {
  DrawerForm,
  ProFormDateTimePicker,
  ProFormGroup,
  ProFormList,
  ProFormMoney,
  ProFormSelect,
  ProFormText,
  ProFormTextArea,
} from '@ant-design/pro-components';
import { Button, Form, message } from 'antd';
20
import { useEffect, useState } from 'react';
曾国涛 authored
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38

export default ({ onClose }) => {
  const [form] = Form.useForm<{
    invoiceNumber: '';
    invoiceStatus: '';
    purchaser: '';
    payee: '';
    contacts: '';
    sale: '';
    invoicingTime: '';
    notes: '';
    mainOrderIdObjs: [
      {
        mainOrderId: '';
      },
    ];
    money: '';
  }>();
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
  const [salesCodeOptions, setSalesCodeOptions] = useState([]);
  const getSalesCodeOptions = async () => {
    const res = await postServiceOrderQuerySalesCode();
    let options = res.data?.map((item) => {
      return {
        label: item.userName,
        value: item.userName,
        number: item.number,
      };
    });
    setSalesCodeOptions(options);
  };
  useEffect(() => {
    getSalesCodeOptions();
  }, []);
曾国涛 authored
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
  return (
    <DrawerForm<{
      invoiceNumber: string;
      invoiceStatus: string;
      purchaser: string;
      payee: string;
      contacts: string;
      sale: string;
      invoicingTime: Date;
      notes: string;
      mainOrderIdObjs: [
        {
          mainOrderId: string;
        },
      ];
      money: string;
    }>
      title="新增开票"
      resize={{
        onResize() {
          console.log('resize!');
        },
        maxWidth: window.innerWidth * 0.8,
77
        minWidth: 500,
曾国涛 authored
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
      }}
      form={form}
      trigger={
        <Button type="primary">
          <PlusOutlined />
          新增
        </Button>
      }
      autoFocusFirstInput
      drawerProps={{
        destroyOnClose: true,
      }}
      submitTimeout={2000}
      onFinish={async (values) => {
        console.log(values);
        const mainOrderIds = values.mainOrderIdObjs.flatMap(
          (item) => item.mainOrderId,
        );
        let attrs = { ...values, mainOrderIds };
        let res = await postServiceInvoiceAddInvoice({
          data: { ...attrs },
        });
        if (res.result === RESPONSE_CODE.SUCCESS) {
          message.success(res.message);
        } else {
          message.error(res.message);
曾国涛 authored
104
          return false;
曾国涛 authored
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
        }
        onClose();
        // 不返回不会关闭弹框
        return true;
      }}
    >
      <ProFormText
        name="invoiceNumber"
        width="md"
        label="发票号码"
        placeholder="请输入名称"
        rules={[{ required: true, message: '请输入名称!' }]}
      />
      <ProFormSelect
        name="invoiceStatus"
        label="发票类型"
        valueEnum={{
122
123
          SPECIALLY_INVOICED: '专票',
          COMMON_INVOICED: '普票',
曾国涛 authored
124
125
126
127
128
129
130
131
132
133
        }}
        rules={[{ required: true, message: '请选择发票类型!' }]}
      />
      <ProFormText
        name="purchaser"
        width="md"
        label="购买方"
        placeholder="请输入购买方"
        rules={[{ required: true, message: '请输入购买方!' }]}
      />
曾国涛 authored
134
135
      <ProFormSelect
        placeholder="收款单位"
曾国涛 authored
136
        name="payee"
曾国涛 authored
137
138
139
140
141
142
        width="lg"
        key="payee"
        showSearch
        label="开票收款单位"
        tooltip="财务开票将依据这个字段,选择对应的公司开票"
        options={enumToSelect(PAYEE_OPTIONS)}
曾国涛 authored
143
144
145
146
147
148
149
150
      />
      <ProFormText
        name="contacts"
        width="md"
        label="联系人"
        placeholder="请输入联系人"
        rules={[{ required: true, message: '请输入联系人!' }]}
      />
151
      <ProFormSelect
曾国涛 authored
152
153
        name="sale"
        key="sale"
154
155
156
157
158
        width="lg"
        showSearch
        label="销售代表"
        placeholder="请选择销售代表"
        options={salesCodeOptions}
曾国涛 authored
159
160
161
162
163
164
165
166
167
168
169
170
171
172
      />
      <ProFormDateTimePicker
        name="invoicingTime"
        label="开票时间"
        fieldProps={{
          format: (value) => value.format('YYYY-MM-DD'),
        }}
        rules={[{ required: true, message: '请输入开票时间!' }]}
      />
      <ProFormTextArea name="notes" label="备注" placeholder="请输入名称" />
      <ProFormList
        name="mainOrderIdObjs"
        label="订单号"
        min={1}
173
        copyIconProps={false}
曾国涛 authored
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
        deleteIconProps={{
          tooltipText: '删除',
        }}
        initialValue={[
          {
            mainOrderId: '',
          },
        ]}
      >
        <ProFormGroup key="group">
          <ProFormText
            rules={[{ required: true, message: '请输入关联订单!' }]}
            name="mainOrderId"
          />
        </ProFormGroup>
      </ProFormList>
      <ProFormMoney
        label="金额"
        name="money"
        customSymbol="¥"
        min={0}
        rules={[{ required: true, message: '请输入金额!' }]}
      />
    </DrawerForm>
  );
};