FinancialEditDrawer.tsx
4.23 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
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
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
// import { PlusOutlined } from '@ant-design/icons';
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>
);
};