canrd-main / canrd-erp-front · Commits

Commit d5cb3ed2eb1e38f5af0d148ef69450bcf8a43502

Authored by PurelzMgnead
1 parent cc61036e
build: skipped

feat: update分期账单

Inline Side-by-side
Showing 13 changed files with 2594 additions and 2575 deletions
.umirc.ts
  View file @d5cb3ed
... ... @@ -63,7 +63,7 @@ export default defineConfig({
63 63 path: '/instalment',
64 64 component: './Instalment',
65 65 icon: 'BookOutlined',
66   - access: 'canReadAdminAndFinance',
  66 + access: 'canReadLinda',
67 67 },
68 68 {
69 69 name: '打印',
... ...
src/access.ts
  View file @d5cb3ed
1 1 export default (initialState: API.UserInfo) => {
2 2 // 在这里按照初始化数据定义项目中的权限，统一管理
3 3 // 参考文档 https://umijs.org/docs/max/access
4   - const { roleSmallVO } = initialState;
  4 + const { roleSmallVO, username } = initialState;
5 5  
6 6 return {
7 7 canReadAdmin: roleSmallVO?.code === 'admin',
  8 + canReadLinda: username === 'Linda' || '吴量',
8 9 canReadProcure: roleSmallVO?.code === 'procure',
9 10 canReadAdminAndFinance:
10 11 roleSmallVO?.code === 'admin' || roleSmallVO?.code === 'finance',
... ...
src/pages/Instalment/components/comfire/comfire.tsx
  View file @d5cb3ed
1   -import { PlusOutlined } from '@ant-design/icons';
2   -import {
3   - ModalForm,
4   - ProForm,
5   - ProFormDateRangePicker,
6   - ProFormSelect,
7   - ProFormText,
8   -} from '@ant-design/pro-components';
9   -import { Button, Form, message } from 'antd';
  1 +import { ModalForm } from '@ant-design/pro-components';
  2 +import { Form, message } from 'antd';
10 3 import { useState } from 'react';
11 4  
12 5 const waitTime = (time: number = 100) => {
... ... @@ -17,14 +10,13 @@ const waitTime = (time: number = 100) => {
17 10 });
18 11 };
19 12  
20   -export default ({currtDid,sureDelete}) => {
  13 +export default ({ currtDid, sureDelete }) => {
21 14 const [form] = Form.useForm<{ name: string; company: string }>();
22   - const [ids,setIds]=useState([]);
  15 + const [ids, setIds] = useState([]);
23 16  
24   - function getIds(){
25   - // console.log(currtDid);
26   - setIds([])
27   - setIds(currtDid)
  17 + function getIds() {
  18 + setIds([]);
  19 + setIds(currtDid);
28 20 }
29 21 return (
30 22 <ModalForm<{
... ... @@ -32,7 +24,11 @@ export default ({currtDid,sureDelete}) =&gt; {
32 24 company: string;
33 25 }>
34 26 trigger={
35   - <a onClick={()=>{getIds()}}>
  27 + <a
  28 + onClick={() => {
  29 + getIds();
  30 + }}
  31 + >
36 32 删除
37 33 </a>
38 34 }
... ... @@ -41,18 +37,16 @@ export default ({currtDid,sureDelete}) =&gt; {
41 37 width={190}
42 38 modalProps={{
43 39 destroyOnClose: true,
44   - // onCancel: () => console.log('run'),
45 40 }}
46   - onFinish={async (values) => {
  41 + onFinish={async () => {
47 42 await waitTime(100);
48 43 sureDelete([ids]);
49   - // console.log(values.name);
50 44 message.success('提交成功');
51 45 return true;
52 46 }}
53 47 >
54   - <br/>
  48 + <br />
55 49 <h2>确定删除吗</h2>
56 50 </ModalForm>
57 51 );
58   -};
59 52 \ No newline at end of file
  53 +};
... ...
src/pages/Instalment/components/detail/detail.tsx
  View file @d5cb3ed
  1 +import {
  2 + postOrderErpOrderStagesAdd,
  3 + postOrderErpOrderStagesPayWaySaveOrUpdate,
  4 + postOrderErpOrderStagesSearch,
  5 + postOrderErpOrderStagesUpload,
  6 +} from '@/services';
1 7 import { PlusOutlined } from '@ant-design/icons';
2 8 import {
3   - ModalForm,
4   - ProCard,
5   - ProForm,
6   - ProFormDatePicker,
7   - ProFormText,
8   - ProFormTextArea,
9   - ProFormUploadButton,
  9 + ModalForm,
  10 + ProCard,
  11 + ProForm,
  12 + ProFormDatePicker,
  13 + ProFormText,
  14 + ProFormTextArea,
  15 + ProFormUploadButton,
10 16 } from '@ant-design/pro-components';
11   -import ProductDetail from '../productDetail/productDetail';
12   -import PayWayDetail from '../payWayDetail/payWayDetail';
13   -import { Button, Form,message } from 'antd';
14   -import { useEffect,useState } from 'react';
15   -import { postOrderErpOrderStagesAdd, postOrderErpOrderStagesPayWaySaveOrUpdate, postOrderErpOrderStagesSaveOrUpdate, postOrderErpOrderStagesSearch, postOrderErpOrderStagesUpload } from '@/services';
  17 +import { Button, Form, message } from 'antd';
16 18 import { RcFile } from 'antd/es/upload';
  19 +import { useEffect, useState } from 'react';
  20 +import PayWayDetail from '../payWayDetail/payWayDetail';
  21 +import ProductDetail from '../productDetail/productDetail';
17 22  
18 23 const waitTime = (time: number = 100) => {
19   - return new Promise((resolve) => {
20   - setTimeout(() => {
21   - resolve(true);
22   - }, time);
23   - });
  24 + return new Promise((resolve) => {
  25 + setTimeout(() => {
  26 + resolve(true);
  27 + }, time);
  28 + });
24 29 };
25 30  
26   -export default ({ toReload}) => {
27   - const [form] = Form.useForm<{ name: string; company: string }>();
28   - const [contextBody, setContextBody] = useState<OrderStagesWithListItem>({
29   - id:undefined,
30   - contract:undefined,
31   - dateRange:undefined,
32   - terminal:undefined,
33   - orderStagesDeviceVoList:[],
34   - totalPrice:undefined,
35   - payWay:"30/30/30/10",
36   - annex:undefined,
37   - remark:undefined
38   - });
39   - const [editProductBody, setEditProductBody] = useState([]);
40   - const [total, setTotal] = useState(0);
41   - const [payWayBody, setPayWayBody] = useState([])
42   - const [otherBody, setOtherBody] = useState([])
43   - const [isDis,setIsDis]=useState(true)
  31 +export default ({ toReload }) => {
  32 + const [form] = Form.useForm<{ name: string; company: string }>();
  33 + const [contextBody, setContextBody] = useState<OrderStagesWithListItem>({
  34 + id: undefined,
  35 + contract: undefined,
  36 + dateRange: undefined,
  37 + terminal: undefined,
  38 + orderStagesDeviceVoList: [],
  39 + totalPrice: undefined,
  40 + payWay: '30/30/30/10',
  41 + annex: undefined,
  42 + remark: undefined,
  43 + });
  44 + const [editProductBody, setEditProductBody] = useState([]);
  45 + const [total, setTotal] = useState(0);
  46 + const [payWayBody, setPayWayBody] = useState([]);
  47 + const [otherBody, setOtherBody] = useState([]);
  48 + const [isDis] = useState(true);
44 49  
45   - type OrderStagesWithListItem = {
46   - //文件编号
47   - id?: number;
48   - //合同编号
49   - contract?: string;
50   - //供应商名称
51   - vendor?: string;
52   - //签合同日期
53   - dateRange?: Date;
54   - //终端名称
55   - terminal?: string;
56   - orderStagesDeviceVoList: orderStagesDevice[]
57   - //合同总金额
58   - totalPrice?: number;
59   - //付款方式
60   - payWay?: string;
61   - //附件
62   - annex?: string;
63   - //备注
64   - remark?: string;
65   - };
  50 + type OrderStagesWithListItem = {
  51 + //文件编号
  52 + id?: number;
  53 + //合同编号
  54 + contract?: string;
  55 + //供应商名称
  56 + vendor?: string;
  57 + //签合同日期
  58 + dateRange?: Date;
  59 + //终端名称
  60 + terminal?: string;
  61 + orderStagesDeviceVoList: orderStagesDevice[];
  62 + //合同总金额
  63 + totalPrice?: number;
  64 + //付款方式
  65 + payWay?: string;
  66 + //附件
  67 + annex?: string;
  68 + //备注
  69 + remark?: string;
  70 + };
66 71  
67   - type orderStagesDevice = {
68   - //设备id
69   - dId: number;
70   - //设备名称
71   - deviceName: string;
72   - //设备型号
73   - deviceModel: string;
74   - //数量
75   - count: number;
76   - //单价
77   - unitPrice: number;
78   - //总价
79   - price: number;
80   - }
  72 + type orderStagesDevice = {
  73 + //设备id
  74 + dId: number;
  75 + //设备名称
  76 + deviceName: string;
  77 + //设备型号
  78 + deviceModel: string;
  79 + //数量
  80 + count: number;
  81 + //单价
  82 + unitPrice: number;
  83 + //总价
  84 + price: number;
  85 + };
  86 +
  87 + function setSave(value) {
  88 + setOtherBody(value);
  89 + }
81 90  
82   - function getEditProductBody(value) {
83   - // console.log(value);
  91 + useEffect(() => {
  92 + setContextBody({ ...contextBody, totalPrice: total });
  93 + form.setFieldValue('totalPrice', total);
  94 + }, [total]);
84 95  
85   - setEditProductBody(value)
86   - let price = 0;
87   - value.map(obj => (
88   - price += (obj.count * obj.unitPrice)
89   - ));
90   - setTotal(price);
91   - setContextBody({ ...contextBody, orderStagesDeviceVoList: value })
92   - if (contextBody.payWay==="") {
93   - handleInputChange("30/30/30/10", 0, price)
94   - }else{
95   - handleInputChange(contextBody.payWay, 0, price)
  96 + const handleInputChange = (value: string, no: number, priceNow?: number) => {
  97 + if (value === '') {
  98 + message.info('请输入比例!');
  99 + } else {
  100 + let totalPay = 0;
  101 + const payValue: string[] = value.split('/');
  102 + let body:
  103 + | ((prevState: never[]) => never[])
  104 + | { proportion: string; payPrice: number }[] = [];
  105 + if (no === 1) {
  106 + if (payValue.length !== 4) {
  107 + message.warning('比例个数总和不为4个!');
  108 + } else {
  109 + payValue.forEach((item) => {
  110 + totalPay += Number(item);
  111 + });
96 112 }
  113 + if (totalPay !== 100) {
  114 + message.warning('比例总和不为100!');
  115 + } else {
  116 + message.success('输入有效!');
  117 + payValue.forEach((item) => {
  118 + body.push({
  119 + proportion: item + '%',
  120 + payPrice: (Number(item) * total) / 100,
  121 + });
  122 + });
  123 + setPayWayBody(body);
  124 + }
  125 + } else {
  126 + payValue.forEach((item) => {
  127 + totalPay += Number(item);
  128 + });
  129 + payValue.forEach((item) => {
  130 + body.push({
  131 + proportion: item + '%',
  132 + payPrice: (Number(item) * priceNow) / 100,
  133 + });
  134 + });
  135 + setPayWayBody(body);
  136 + }
97 137 }
98   - []
99   - function setSave(value) {
100   - // console.log(value);
101   - setOtherBody(value)
  138 + };
  139 +
  140 + function getEditProductBody(value) {
  141 + setEditProductBody(value);
  142 + let price = 0;
  143 + value.map((obj) => (price += obj.count * obj.unitPrice));
  144 + setTotal(price);
  145 + setContextBody({ ...contextBody, orderStagesDeviceVoList: value });
  146 + if (contextBody.payWay === '') {
  147 + handleInputChange('30/30/30/10', 0, price);
  148 + } else {
  149 + handleInputChange(contextBody.payWay, 0, price);
102 150 }
  151 + }
103 152  
104   - useEffect(() => {
105   - setContextBody({ ...contextBody, totalPrice: total })
106   - form.setFieldValue('totalPrice', total);
107   - }, [total])
  153 + function refresh() {
  154 + setContextBody({
  155 + id: undefined,
  156 + contract: undefined,
  157 + dateRange: undefined,
  158 + terminal: undefined,
  159 + orderStagesDeviceVoList: [],
  160 + totalPrice: undefined,
  161 + payWay: '30/30/30/10',
  162 + annex: undefined,
  163 + remark: undefined,
  164 + });
  165 + handleInputChange('30/30/30/10', 0, 0);
  166 + }
108 167  
109   - const handleInputChange = (value: string, no: number, priceNow?: number) => {
110   - if (value==="") {
111   - message.info("请输入比例!")
112   - }else{
113   - let totalPay = 0;
114   - const payValue: string[] = value.split("/")
115   - let body: ((prevState: never[]) => never[]) | { proportion: string; payPrice: number; }[] = [];
116   - if (no === 1) {
117   - if (payValue.length !== 4) {
118   - message.warning('比例个数总和不为4个!');
119   - } else {
120   - payValue.forEach((item, index) => {
121   - totalPay += Number(item)
122   - })
123   - }
124   - if (totalPay != 100) {
125   - message.warning('比例总和不为100!');
126   - } else {
127   - message.success('输入有效!');
128   - payValue.forEach((item, index) => {
129   - body.push({ proportion: item + "%", payPrice: Number(item) * total / 100 })
130   - })
131   - setPayWayBody(body)
132   - }
133   - } else {
134   - payValue.forEach((item, index) => {
135   - totalPay += Number(item)
136   - })
137   - payValue.forEach((item, index) => {
138   - body.push({ proportion: item + "%", payPrice: Number(item) * priceNow / 100 })
139   - })
140   - setPayWayBody(body)
141   - }
  168 + return (
  169 + <ModalForm<OrderStagesWithListItem>
  170 + title="新建"
  171 + trigger={
  172 + <Button
  173 + key="button"
  174 + icon={<PlusOutlined />}
  175 + type="primary"
  176 + onClick={() => refresh()}
  177 + >
  178 + 新增
  179 + </Button>
  180 + }
  181 + form={form}
  182 + autoFocusFirstInput
  183 + modalProps={{
  184 + destroyOnClose: true,
  185 + }}
  186 + submitTimeout={2000}
  187 + onFinish={async (values) => {
  188 + if (editProductBody.length === 0) {
  189 + message.error('请填写产品数据');
  190 + return false;
142 191 }
143   - };
  192 + let remakeValue = [];
144 193  
145   - function refresh(){
146   - setContextBody({
147   - id:undefined,
148   - contract:undefined,
149   - dateRange:undefined,
150   - terminal:undefined,
151   - orderStagesDeviceVoList:[],
152   - totalPrice:undefined,
153   - payWay:"30/30/30/10",
154   - annex:undefined,
155   - remark:undefined
156   - })
157   - handleInputChange("30/30/30/10",0,0)
158   - }
  194 + const formData = new FormData();
  195 + let toSendEdit = {
  196 + id: values.id || contextBody.id,
  197 + contract: values.contract || contextBody.contract,
  198 + vendor: values.vendor || contextBody.vendor,
  199 + dateRange: values.dateRange || contextBody.dateRange,
  200 + terminal: values.terminal || contextBody.terminal,
  201 + orderStagesDeviceDoList:
  202 + values.orderStagesDeviceVoList ||
  203 + contextBody.orderStagesDeviceVoList,
  204 + totalPrice: values.totalPrice || contextBody.totalPrice,
  205 + payWay: values.payWay || contextBody.payWay,
  206 + annex: contextBody.annex,
  207 + remark: values.remark || contextBody.remark,
  208 + };
  209 + if (values.annex) {
  210 + formData.append('file', values.annex[0].originFileObj as RcFile);
  211 + const res = await postOrderErpOrderStagesUpload({
  212 + data: formData,
  213 + headers: {
  214 + 'Content-Type':
  215 + 'multipart/form-data; boundary=----WebKitFormBoundarynl6gT1BKdPWIejNq',
  216 + },
  217 + });
  218 + if (res.data) {
  219 + toSendEdit.annex = res.data;
  220 + }
  221 + }
  222 + const isSaveOrUpdate = await postOrderErpOrderStagesAdd({
  223 + data: { ...toSendEdit },
  224 + });
159 225  
160   - return (
161   - <ModalForm<OrderStagesWithListItem>
162   - title="新建"
163   - trigger={
164   - <Button
165   - key="button"
166   - icon={<PlusOutlined />}
167   - type="primary"
168   - onClick={()=>refresh()}
169   - >
170   - 新增
171   - </Button>
172   - }
173   - form={form}
174   - autoFocusFirstInput
175   - modalProps={{
176   - destroyOnClose: true,
177   - // onCancel: () => console.log('run'),
178   - }}
179   - // onChange={(e) => {
180   - // console.log(e);
181   -
182   - // console.log(e.target.value);
183   - // }}
184   - submitTimeout={2000}
185   - onFinish={async (values) => {
186   - if (editProductBody.length==0) {
187   - message.error("请填写产品数据")
188   - return false;
189   - }
190   - // console.log(values);
191   - // console.log(otherBody);
192   - let remakeValue = [];
193   - let remakeItem = {}
194   -
195   - const formData = new FormData();
196   - // let toSendEdit={...values,orderStagesDeviceVoList:contextBody.orderStagesDeviceVoList};
197   - let toSendEdit = {
198   - id: values.id || contextBody.id,
199   - contract: values.contract || contextBody.contract,
200   - vendor: values.vendor || contextBody.vendor,
201   - dateRange: values.dateRange || contextBody.dateRange,
202   - terminal: values.terminal || contextBody.terminal,
203   - orderStagesDeviceDoList: values.orderStagesDeviceVoList || contextBody.orderStagesDeviceVoList,
204   - totalPrice: values.totalPrice || contextBody.totalPrice,
205   - payWay: values.payWay || contextBody.payWay,
206   - annex: contextBody.annex,
207   - remark: values.remark || contextBody.remark,
208   - };
209   - if (values.annex) {
210   - formData.append('file', values.annex[0].originFileObj as RcFile);
211   - const res = await postOrderErpOrderStagesUpload({
212   - data: formData,
213   - headers: {
214   - 'Content-Type':
215   - 'multipart/form-data; boundary=----WebKitFormBoundarynl6gT1BKdPWIejNq',
216   - }
217   - });
218   - if (res.data) {
219   - // console.log(values)
220   - // console.log(contextBody);
221   - toSendEdit.annex = res.data
222   - }
223   - }
224   - const isSaveOrUpdate = await postOrderErpOrderStagesAdd({
225   - data: { ...toSendEdit }
226   - })
227   -
228   - if (isSaveOrUpdate) {
229   - // 创建一个用于存储所有异步操作的Promise数组
230   - const promises = [];
  226 + if (isSaveOrUpdate) {
  227 + const promises = [];
231 228  
232   - otherBody.forEach(item => {
233   - let remakeItem = { ossId: item.ossId, number: item.id, dataRange: item.payDate, fileName: item.fileName };
234   - if (typeof item.fileUrl === 'object' && item.fileUrl instanceof File) {
235   - const formData = new FormData();
236   - formData.append('file', item.fileUrl as RcFile);
237   - const uploadPromise = async () => {
238   - const res = await postOrderErpOrderStagesUpload({
239   - data: formData,
240   - headers: {
241   - 'Content-Type': 'multipart/form-data; boundary=----WebKitFormBoundarynl6gT1BKdPWIejNq',
242   - }
243   - });
244   - if (res.data) {
245   - remakeItem.fileUrl = res.data;
246   - }
247   - };
248   - promises.push(uploadPromise());
249   - }
250   - remakeValue.push(remakeItem);
  229 + otherBody.forEach((item) => {
  230 + let remakeItem = {
  231 + ossId: item.ossId,
  232 + number: item.id,
  233 + dataRange: item.payDate,
  234 + fileName: item.fileName,
  235 + };
  236 + if (
  237 + typeof item.fileUrl === 'object' &&
  238 + item.fileUrl instanceof File
  239 + ) {
  240 + const formData = new FormData();
  241 + formData.append('file', item.fileUrl as RcFile);
  242 + const uploadPromise = async () => {
  243 + const res = await postOrderErpOrderStagesUpload({
  244 + data: formData,
  245 + headers: {
  246 + 'Content-Type':
  247 + 'multipart/form-data; boundary=----WebKitFormBoundarynl6gT1BKdPWIejNq',
  248 + },
251 249 });
252   -
253   - let makeEnd=[]
254   - const getRetrunIDPromise=async()=>{
255   - let returnOssID=await postOrderErpOrderStagesSearch({
256   - data:{contract: values.contract || contextBody.contract,},
257   - })
258   - console.log(returnOssID.data);
259   -
260   - if (returnOssID) {
261   - makeEnd = remakeValue.map(item => {
262   - return { ...item, ossId: returnOssID.data[0].id };
263   - });
264   -
265   - // console.log(makeEnd);
266   - }
  250 + if (res.data) {
  251 + remakeItem.fileUrl = res.data;
267 252 }
  253 + };
  254 + promises.push(uploadPromise());
  255 + }
  256 + remakeValue.push(remakeItem);
  257 + });
268 258  
269   - promises.push(getRetrunIDPromise());
  259 + let makeEnd = [];
  260 + const getRetrunIDPromise = async () => {
  261 + let returnOssID = await postOrderErpOrderStagesSearch({
  262 + data: { contract: values.contract || contextBody.contract },
  263 + });
  264 + console.log(returnOssID.data);
270 265  
271   - // 使用Promise.all等待所有异步操作完成后再执行保存操作
272   - Promise.all(promises).then(
273   - async () => {
274   - // console.log(makeEnd);
275   - await postOrderErpOrderStagesPayWaySaveOrUpdate({
276   - data: makeEnd
277   - });
278   - });
279   - // console.log(isSaveOrUpdate);
280   - toReload()
281   - }
282   - await waitTime(2000);
283   - message.success('提交成功');
284   - return true;
285   - }}
286   - >
287   - <ProCard
288   - title="基本信息"
289   - headerBordered
290   - bordered
291   - >
292   - <ProForm.Group>
293   - <ProFormText
294   - width="md"
295   - name="vendor"
296   - rules={[{ required: true, message: '此项为必填项' }]}
297   - label="供应商名称"
298   - placeholder="请输入"
299   - initialValue={contextBody.vendor}
300   - />
  266 + if (returnOssID) {
  267 + makeEnd = remakeValue.map((item) => {
  268 + return { ...item, ossId: returnOssID.data[0].id };
  269 + });
  270 + }
  271 + };
  272 +
  273 + promises.push(getRetrunIDPromise());
  274 + Promise.all(promises).then(async () => {
  275 + await postOrderErpOrderStagesPayWaySaveOrUpdate({
  276 + data: makeEnd,
  277 + });
  278 + });
  279 + toReload();
  280 + }
  281 + await waitTime(2000);
  282 + message.success('提交成功');
  283 + return true;
  284 + }}
  285 + >
  286 + <ProCard title="基本信息" headerBordered bordered>
  287 + <ProForm.Group>
  288 + <ProFormText
  289 + width="md"
  290 + name="vendor"
  291 + rules={[{ required: true, message: '此项为必填项' }]}
  292 + label="供应商名称"
  293 + placeholder="请输入"
  294 + initialValue={contextBody.vendor}
  295 + />
301 296  
302   - <ProFormText
303   - width="md"
304   - name="terminal"
305   - rules={[{ required: true, message: '此项为必填项' }]}
306   - label="终端名称"
307   - placeholder="请输入"
308   - initialValue={contextBody.terminal}
309   - />
  297 + <ProFormText
  298 + width="md"
  299 + name="terminal"
  300 + rules={[{ required: true, message: '此项为必填项' }]}
  301 + label="终端名称"
  302 + placeholder="请输入"
  303 + initialValue={contextBody.terminal}
  304 + />
310 305  
311   - <ProFormDatePicker
312   - name="dateRange"
313   - width="md"
314   - label="签合同日期"
315   - placeholder="请选择日期"
316   - fieldProps={{
317   - format: (value) => value.format('YYYY-MM-DD'),
318   - }}
319   - initialValue={contextBody.dateRange}
320   - />
  306 + <ProFormDatePicker
  307 + name="dateRange"
  308 + width="md"
  309 + label="签合同日期"
  310 + placeholder="请选择日期"
  311 + fieldProps={{
  312 + format: (value) => value.format('YYYY-MM-DD'),
  313 + }}
  314 + initialValue={contextBody.dateRange}
  315 + />
321 316  
322   - <ProFormText
323   - width="md"
324   - name="payWay"
325   - rules={[{ required: true, message: '此项为必填项' }]}
326   - label="付款比例"
327   - placeholder="请输入"
328   - initialValue={contextBody.payWay}
329   - disabled={!isDis}
330   - onBlur={(e) => {
331   - setContextBody({...contextBody,payWay:e.target.value})
332   - handleInputChange(e.target.value, 1);
333   - }}
334   - />
  317 + <ProFormText
  318 + width="md"
  319 + name="payWay"
  320 + rules={[{ required: true, message: '此项为必填项' }]}
  321 + label="付款比例"
  322 + placeholder="请输入"
  323 + initialValue={contextBody.payWay}
  324 + disabled={!isDis}
  325 + onBlur={(e) => {
  326 + setContextBody({ ...contextBody, payWay: e.target.value });
  327 + handleInputChange(e.target.value, 1);
  328 + }}
  329 + />
335 330  
336   - <ProFormText
337   - width="md"
338   - name="contract"
339   - rules={[{ required: true, message: '此项为必填项' }]}
340   - label="合同编号"
341   - placeholder="请输入"
342   - initialValue={contextBody.contract}
343   - />
  331 + <ProFormText
  332 + width="md"
  333 + name="contract"
  334 + rules={[{ required: true, message: '此项为必填项' }]}
  335 + label="合同编号"
  336 + placeholder="请输入"
  337 + initialValue={contextBody.contract}
  338 + />
344 339  
345   - <ProFormUploadButton width="md"
346   - name="annex"
347   - max={1}
348   - onChange={(value) => {
349   - // console.log(value);
350   - }}
351   - label="合同附件" />
  340 + <ProFormUploadButton
  341 + width="md"
  342 + name="annex"
  343 + max={1}
  344 + label="合同附件"
  345 + />
352 346  
353   - <ProFormText
354   - width="md"
355   - name="totalPrice"
356   - label="合同金额"
357   - placeholder="请输入"
358   - // rules={[{ required: true, message: '此项为必填项' }]}
359   - // value={contextBody.totalPrice}
360   - // onBlur={(e) => {
361   - // if (e.target.value !== '0') {
362   - // setIsDis(false);
363   - // setTotal(e.target.value);
364   - // } else {
365   - // setIsDis(true);
366   - // }
367   - // }}
368   - disabled={isDis}
369   - initialValue={"0"}
370   - />
371   - </ProForm.Group>
372   - </ProCard>
373   - <ProCard
374   - title={<><span style={{ color: 'red' }}>*</span>产品明细</>}
375   - style={{ marginTop: 10 }}
376   - headerBordered
377   - bordered
378   - >
379   - <ProductDetail productBody={[]} EditProductBody={getEditProductBody}></ProductDetail>
380   - </ProCard>
  347 + <ProFormText
  348 + width="md"
  349 + name="totalPrice"
  350 + label="合同金额"
  351 + placeholder="请输入"
  352 + disabled={isDis}
  353 + initialValue={'0'}
  354 + />
  355 + </ProForm.Group>
  356 + </ProCard>
  357 + <ProCard
  358 + title={
  359 + <>
  360 + <span style={{ color: 'red' }}>*</span>产品明细
  361 + </>
  362 + }
  363 + style={{ marginTop: 10 }}
  364 + headerBordered
  365 + bordered
  366 + >
  367 + <ProductDetail
  368 + productBody={[]}
  369 + EditProductBody={getEditProductBody}
  370 + ></ProductDetail>
  371 + </ProCard>
381 372  
382   - <ProCard
383   - title="付款信息"
384   - style={{ marginTop: 10 }}
385   - headerBordered
386   - bordered
387   - >
388   - <PayWayDetail payBody={payWayBody} thisId={null} currtSave={setSave}></PayWayDetail>
389   - </ProCard>
  373 + <ProCard
  374 + title="付款信息"
  375 + style={{ marginTop: 10 }}
  376 + headerBordered
  377 + bordered
  378 + >
  379 + <PayWayDetail
  380 + payBody={payWayBody}
  381 + thisId={null}
  382 + currtSave={setSave}
  383 + ></PayWayDetail>
  384 + </ProCard>
390 385  
391   - <ProCard
392   - style={{ marginTop: 10 }}
393   - headerBordered
394   - bordered
395   - >
396   - <ProFormTextArea label="备注" name="remark" initialValue={contextBody.remark} />
397   - </ProCard>
398   - </ModalForm>
399   - );
400   -};
401 386 \ No newline at end of file
  387 + <ProCard style={{ marginTop: 10 }} headerBordered bordered>
  388 + <ProFormTextArea
  389 + label="备注"
  390 + name="remark"
  391 + initialValue={contextBody.remark}
  392 + />
  393 + </ProCard>
  394 + </ModalForm>
  395 + );
  396 +};
... ...
src/pages/Instalment/components/edit/edit.tsx
  View file @d5cb3ed
1   -import { PlusOutlined } from '@ant-design/icons';
2 1 import {
3   - ModalForm,
4   - ProCard,
5   - ProForm,
6   - ProFormDatePicker,
7   - ProFormDateRangePicker,
8   - ProFormDependency,
9   - ProFormSelect,
10   - ProFormText,
11   - ProFormTextArea,
12   - ProFormUploadButton,
  2 + postOrderErpOrderStagesPayWaySaveOrUpdate,
  3 + postOrderErpOrderStagesSaveOrUpdate,
  4 + postOrderErpOrderStagesSearch,
  5 + postOrderErpOrderStagesUpload,
  6 +} from '@/services';
  7 +import {
  8 + ModalForm,
  9 + ProCard,
  10 + ProForm,
  11 + ProFormDatePicker,
  12 + ProFormText,
  13 + ProFormTextArea,
  14 + ProFormUploadButton,
13 15 } from '@ant-design/pro-components';
14   -import ProductDetail from '../productDetail/productDetail';
15   -import PayWayDetail from '../payWayDetail/payWayDetail';
16   -import { Button, Form, UploadProps, message } from 'antd';
17   -import Item from 'antd/es/list/Item';
18   -import { useEffect, useRef, useState } from 'react';
19   -import { postOrderErpOrderStagesPayWaySaveOrUpdate, postOrderErpOrderStagesPayWayUploadForPayWay, postOrderErpOrderStagesSaveOrUpdate, postOrderErpOrderStagesSearch, postOrderErpOrderStagesUpload, postServiceOrderFileProcess } from '@/services';
20   -import { context } from '@/.umi/core/helmetContext';
  16 +import { Form, message } from 'antd';
21 17 import { RcFile } from 'antd/es/upload';
  18 +import { useEffect, useState } from 'react';
  19 +import PayWayDetail from '../payWayDetail/payWayDetail';
  20 +import ProductDetail from '../productDetail/productDetail';
22 21  
23 22 const waitTime = (time: number = 100) => {
24   - return new Promise((resolve) => {
25   - setTimeout(() => {
26   - resolve(true);
27   - }, time);
28   - });
  23 + return new Promise((resolve) => {
  24 + setTimeout(() => {
  25 + resolve(true);
  26 + }, time);
  27 + });
29 28 };
30 29  
31 30 export default ({ currentContract, toReload }) => {
32   - const [form] = Form.useForm<{ name: string; company: string }>();
33   - const [contextBody, setContextBody] = useState({});
34   - const [editProductBody, setEditProductBody] = useState([]);
35   - const [total, setTotal] = useState(0);
36   - const [payWayBody, setPayWayBody] = useState([])
37   - const [otherBody, setOtherBody] = useState([])
  31 + const [form] = Form.useForm<{ name: string; company: string }>();
  32 + const [contextBody, setContextBody] = useState({});
  33 + const [total, setTotal] = useState(0);
  34 + const [payWayBody, setPayWayBody] = useState([]);
  35 + const [otherBody, setOtherBody] = useState([]);
38 36  
39   - type OrderStagesWithListItem = {
40   - //文件编号
41   - id: number;
42   - //合同编号
43   - contract: string;
44   - //供应商名称
45   - vendor: string;
46   - //签合同日期
47   - dateRange: Date;
48   - //终端名称
49   - terminal: string;
50   - orderStagesDeviceVoList: orderStagesDevice[]
51   - //合同总金额
52   - totalPrice: number;
53   - //付款方式
54   - payWay: string;
55   - //附件
56   - annex: string;
57   - //备注
58   - remark: string;
59   - };
  37 + type OrderStagesWithListItem = {
  38 + //文件编号
  39 + id: number;
  40 + //合同编号
  41 + contract: string;
  42 + //供应商名称
  43 + vendor: string;
  44 + //签合同日期
  45 + dateRange: Date;
  46 + //终端名称
  47 + terminal: string;
  48 + orderStagesDeviceVoList: orderStagesDevice[];
  49 + //合同总金额
  50 + totalPrice: number;
  51 + //付款方式
  52 + payWay: string;
  53 + //附件
  54 + annex: string;
  55 + //备注
  56 + remark: string;
  57 + };
60 58  
61   - type orderStagesDevice = {
62   - //设备id
63   - dId: number;
64   - //设备名称
65   - deviceName: string;
66   - //设备型号
67   - deviceModel: string;
68   - //数量
69   - count: number;
70   - //单价
71   - unitPrice: number;
72   - //总价
73   - price: number;
74   - }
  59 + type orderStagesDevice = {
  60 + //设备id
  61 + dId: number;
  62 + //设备名称
  63 + deviceName: string;
  64 + //设备型号
  65 + deviceModel: string;
  66 + //数量
  67 + count: number;
  68 + //单价
  69 + unitPrice: number;
  70 + //总价
  71 + price: number;
  72 + };
75 73  
76   - async function getBody() {
77   - const res = await postOrderErpOrderStagesSearch({
78   - data: { contract: currentContract },
79   - });
80   - const context = res.data[0];
81   - // console.log(context);
  74 + async function refresh() {
  75 + const res = await postOrderErpOrderStagesSearch({
  76 + data: { contract: currentContract },
  77 + });
  78 + const context = res.data[0];
82 79  
83   - if (context.contract != null) {
84   - setContextBody(context);
85   - setTotal(context.totalPrice)
86   - form.setFieldValue('totalPrice', context.totalPrice);
87   - }
88   - handleInputChange(context.payWay, 0, context.totalPrice)
  80 + if (context.contract !== null) {
  81 + setContextBody(context);
  82 + setTotal(context.totalPrice);
  83 + form.setFieldValue('totalPrice', context.totalPrice);
89 84 }
  85 + }
90 86  
91   - async function refresh() {
92   - const res = await postOrderErpOrderStagesSearch({
93   - data: { contract: currentContract },
94   - });
95   - const context = res.data[0];
96   - // console.log(context);
97   -
98   - if (context.contract != null) {
99   - setContextBody(context);
100   - setTotal(context.totalPrice)
101   - form.setFieldValue('totalPrice', context.totalPrice);
102   - }
103   - }
  87 + function setSave(value) {
  88 + setOtherBody(value);
  89 + }
104 90  
105   - function getEditProductBody(value) {
106   - // console.log(value);
  91 + useEffect(() => {
  92 + setContextBody({ ...contextBody, totalPrice: total });
  93 + form.setFieldValue('totalPrice', total);
  94 + }, [total]);
107 95  
108   - setEditProductBody(value)
109   - let price = 0;
110   - value.map(obj => (
111   - price += (obj.count * obj.unitPrice)
112   - ));
113   - setTotal(price);
114   - setContextBody({ ...contextBody, orderStagesDeviceVoList: value })
115   - handleInputChange(contextBody.payWay, 0, price)
  96 + const handleInputChange = (value: string, no: number, priceNow?: number) => {
  97 + let totalPay = 0;
  98 + const payValue: string[] = value.split('/');
  99 + let body:
  100 + | ((prevState: never[]) => never[])
  101 + | { proportion: string; payPrice: number }[] = [];
  102 + if (no === 1) {
  103 + if (payValue.length !== 4) {
  104 + message.warning('比例个数总和不为4个!');
  105 + } else {
  106 + payValue.forEach((item) => {
  107 + totalPay += Number(item);
  108 + });
  109 + }
  110 + if (totalPay !== 100) {
  111 + message.warning('比例总和不为100!');
  112 + } else {
  113 + message.success('输入有效!');
  114 + const price = total;
  115 + payValue.forEach((item) => {
  116 + body.push({
  117 + proportion: item + '%',
  118 + payPrice: (Number(item) * price) / 100,
  119 + });
  120 + });
  121 + setPayWayBody(body);
  122 + }
  123 + } else {
  124 + payValue.forEach((item) => {
  125 + totalPay += Number(item);
  126 + });
  127 + payValue.forEach((item) => {
  128 + body.push({
  129 + proportion: item + '%',
  130 + payPrice: (Number(item) * priceNow) / 100,
  131 + });
  132 + });
  133 + setPayWayBody(body);
116 134 }
  135 + };
  136 +
  137 + async function getBody() {
  138 + const res = await postOrderErpOrderStagesSearch({
  139 + data: { contract: currentContract },
  140 + });
  141 + const context = res.data[0];
117 142  
118   - function setSave(value) {
119   - // console.log(value);
120   - setOtherBody(value)
  143 + if (context.contract !== null) {
  144 + setContextBody(context);
  145 + setTotal(context.totalPrice);
  146 + form.setFieldValue('totalPrice', context.totalPrice);
121 147 }
  148 + handleInputChange(context.payWay, 0, context.totalPrice);
  149 + }
122 150  
123   - useEffect(() => {
124   - setContextBody({ ...contextBody, totalPrice: total })
125   - form.setFieldValue('totalPrice', total);
126   - }, [total])
  151 + function getEditProductBody(value) {
  152 + let price = 0;
  153 + value.map((obj) => (price += obj.count * obj.unitPrice));
  154 + setTotal(price);
  155 + setContextBody({ ...contextBody, orderStagesDeviceVoList: value });
  156 + handleInputChange(contextBody.payWay, 0, price);
  157 + }
127 158  
128   - useEffect(() => {
129   - getBody()
130   - }, [])
  159 + useEffect(() => {
  160 + getBody();
  161 + }, []);
131 162  
132   - const handleInputChange = (value: string, no: number, priceNow?: number) => {
133   - let totalPay = 0;
134   - const payValue: string[] = value.split("/")
135   - let body: ((prevState: never[]) => never[]) | { proportion: string; payPrice: number; }[] = [];
136   - if (no === 1) {
137   - if (payValue.length !== 4) {
138   - message.warning('比例个数总和不为4个!');
139   - } else {
140   - payValue.forEach((item, index) => {
141   - totalPay += Number(item)
142   - })
143   - }
144   - if (totalPay != 100) {
145   - message.warning('比例总和不为100!');
146   - } else {
147   - message.success('输入有效!');
148   - const price = total
149   - payValue.forEach((item, index) => {
150   - body.push({ proportion: item + "%", payPrice: Number(item) * price / 100 })
151   - })
152   - setPayWayBody(body)
153   - }
154   - } else {
155   - payValue.forEach((item, index) => {
156   - totalPay += Number(item)
157   - })
158   - payValue.forEach((item, index) => {
159   - body.push({ proportion: item + "%", payPrice: Number(item) * priceNow / 100 })
160   - })
161   - setPayWayBody(body)
  163 + return (
  164 + <ModalForm<OrderStagesWithListItem>
  165 + title="新建"
  166 + trigger={<a onClick={refresh}>编辑</a>}
  167 + form={form}
  168 + autoFocusFirstInput
  169 + modalProps={{
  170 + destroyOnClose: true,
  171 + }}
  172 + submitTimeout={2000}
  173 + onFinish={async (values) => {
  174 + if (contextBody.orderStagesDeviceVoList.length === 0) {
  175 + message.error('请填写产品数据');
  176 + return false;
162 177 }
163   - };
164   -
165   - return (
166   - <ModalForm<OrderStagesWithListItem>
167   - title="新建"
168   - trigger={
169   - <a onClick={refresh}>编辑</a>
170   - }
171   - form={form}
172   - autoFocusFirstInput
173   - modalProps={{
174   - destroyOnClose: true,
175   - // onCancel: () => console.log('run'),
176   - }}
177   - submitTimeout={2000}
178   - onFinish={async (values) => {
179   - if (contextBody.orderStagesDeviceVoList.length == 0) {
180   - message.error("请填写产品数据")
181   - return false;
182   - }
183   -
184   - // console.log(values);
185   - // console.log(otherBody);
186   - let remakeValue = [];
187   - let remakeItem = {}
188   - // 创建一个用于存储所有异步操作的Promise数组
189   - const promises = [];
  178 + let remakeValue = [];
  179 + const promises = [];
190 180  
191   - otherBody.forEach(item => {
192   - let remakeItem = { ossId: contextBody.id, number: item.id, dateRange: item.payDate, fileName: item.fileName };
193   - if (typeof item.fileUrl === 'object' && item.fileUrl instanceof File) {
194   - const formData = new FormData();
195   - formData.append('file', item.fileUrl as RcFile);
196   - const uploadPromise = async () => {
197   - const res = await postOrderErpOrderStagesUpload({
198   - data: formData,
199   - headers: {
200   - 'Content-Type': 'multipart/form-data; boundary=----WebKitFormBoundarynl6gT1BKdPWIejNq',
201   - }
202   - });
203   - if (res.data) {
204   - remakeItem.fileUrl = res.data;
205   - }
206   - };
207   - promises.push(uploadPromise());
208   - }
209   - remakeValue.push(remakeItem);
210   - });
  181 + otherBody.forEach((item) => {
  182 + let remakeItem = {
  183 + ossId: contextBody.id,
  184 + number: item.id,
  185 + dateRange: item.payDate,
  186 + fileName: item.fileName,
  187 + };
  188 + if (
  189 + typeof item.fileUrl === 'object' &&
  190 + item.fileUrl instanceof File
  191 + ) {
  192 + const formData = new FormData();
  193 + formData.append('file', item.fileUrl as RcFile);
  194 + const uploadPromise = async () => {
  195 + const res = await postOrderErpOrderStagesUpload({
  196 + data: formData,
  197 + headers: {
  198 + 'Content-Type':
  199 + 'multipart/form-data; boundary=----WebKitFormBoundarynl6gT1BKdPWIejNq',
  200 + },
  201 + });
  202 + if (res.data) {
  203 + remakeItem.fileUrl = res.data;
  204 + }
  205 + };
  206 + promises.push(uploadPromise());
  207 + }
  208 + remakeValue.push(remakeItem);
  209 + });
  210 + Promise.all(promises).then(async () => {
  211 + await postOrderErpOrderStagesPayWaySaveOrUpdate({
  212 + data: remakeValue,
  213 + });
  214 + });
  215 + const formData = new FormData();
  216 + let toSendEdit = {
  217 + id: values.id || contextBody.id,
  218 + contract: values.contract || contextBody.contract,
  219 + vendor: values.vendor || contextBody.vendor,
  220 + dateRange: values.dateRange || contextBody.dateRange,
  221 + terminal: values.terminal || contextBody.terminal,
  222 + orderStagesDeviceDoList:
  223 + values.orderStagesDeviceVoList ||
  224 + contextBody.orderStagesDeviceVoList,
  225 + totalPrice: values.totalPrice || contextBody.totalPrice,
  226 + payWay: values.payWay || contextBody.payWay,
  227 + annex: contextBody.annex,
  228 + remark: values.remark || contextBody.remark,
  229 + };
  230 + if (values.annex) {
  231 + formData.append('file', values.annex[0].originFileObj as RcFile);
  232 + const res = await postOrderErpOrderStagesUpload({
  233 + data: formData,
  234 + headers: {
  235 + 'Content-Type':
  236 + 'multipart/form-data; boundary=----WebKitFormBoundarynl6gT1BKdPWIejNq',
  237 + },
  238 + });
  239 + if (res.data) {
  240 + toSendEdit.annex = res.data;
  241 + }
  242 + }
  243 + const isSaveOrUpdate = await postOrderErpOrderStagesSaveOrUpdate({
  244 + data: { ...toSendEdit },
  245 + });
  246 + if (isSaveOrUpdate) {
  247 + getBody();
  248 + toReload();
  249 + }
  250 + await waitTime(2000);
  251 + message.success('提交成功');
  252 + return true;
  253 + }}
  254 + >
  255 + <ProCard title="基本信息" headerBordered bordered>
  256 + <ProForm.Group>
  257 + <ProFormText
  258 + width="md"
  259 + name="vendor"
  260 + rules={[{ required: true, message: '此项为必填项' }]}
  261 + label="供应商名称"
  262 + placeholder="请输入"
  263 + initialValue={contextBody.vendor}
  264 + />
211 265  
212   - // 使用Promise.all等待所有异步操作完成后再执行保存操作
213   - Promise.all(promises).then(async () => {
214   - // console.log(remakeValue);
  266 + <ProFormText
  267 + width="md"
  268 + name="terminal"
  269 + rules={[{ required: true, message: '此项为必填项' }]}
  270 + label="终端名称"
  271 + placeholder="请输入"
  272 + initialValue={contextBody.terminal}
  273 + />
215 274  
216   - const resp = await postOrderErpOrderStagesPayWaySaveOrUpdate({
217   - data: remakeValue
218   - });
219   - });
220   - const formData = new FormData();
221   - // let toSendEdit={...values,orderStagesDeviceVoList:contextBody.orderStagesDeviceVoList};
222   - let toSendEdit = {
223   - id: values.id || contextBody.id,
224   - contract: values.contract || contextBody.contract,
225   - vendor: values.vendor || contextBody.vendor,
226   - dateRange: values.dateRange || contextBody.dateRange,
227   - terminal: values.terminal || contextBody.terminal,
228   - orderStagesDeviceDoList: values.orderStagesDeviceVoList || contextBody.orderStagesDeviceVoList,
229   - totalPrice: values.totalPrice || contextBody.totalPrice,
230   - payWay: values.payWay || contextBody.payWay,
231   - annex: contextBody.annex,
232   - remark: values.remark || contextBody.remark,
233   - };
234   - if (values.annex) {
235   - formData.append('file', values.annex[0].originFileObj as RcFile);
236   - const res = await postOrderErpOrderStagesUpload({
237   - data: formData,
238   - headers: {
239   - 'Content-Type':
240   - 'multipart/form-data; boundary=----WebKitFormBoundarynl6gT1BKdPWIejNq',
241   - }
242   - });
243   - if (res.data) {
244   - // console.log(values)
245   - // console.log(contextBody);
246   - toSendEdit.annex = res.data
247   - }
248   - }
249   - const isSaveOrUpdate = await postOrderErpOrderStagesSaveOrUpdate({
250   - data: { ...toSendEdit }
251   - })
252   - if (isSaveOrUpdate) {
253   - // console.log(isSaveOrUpdate);
254   - getBody()
255   - toReload()
256   - }
257   - await waitTime(2000);
258   - message.success('提交成功');
259   - return true;
  275 + <ProFormDatePicker
  276 + name="dateRange"
  277 + width="md"
  278 + label="签合同日期"
  279 + placeholder="请选择日期"
  280 + fieldProps={{
  281 + format: (value) => value.format('YYYY-MM-DD'),
260 282 }}
261   - >
262   - <ProCard
263   - title="基本信息"
264   - headerBordered
265   - bordered
266   - >
267   - <ProForm.Group>
268   - <ProFormText
269   - width="md"
270   - name="vendor"
271   - rules={[{ required: true, message: '此项为必填项' }]}
272   - label="供应商名称"
273   - placeholder="请输入"
274   - initialValue={contextBody.vendor}
275   - />
276   -
277   - <ProFormText
278   - width="md"
279   - name="terminal"
280   - rules={[{ required: true, message: '此项为必填项' }]}
281   - label="终端名称"
282   - placeholder="请输入"
283   - initialValue={contextBody.terminal}
284   - />
  283 + initialValue={contextBody.dateRange}
  284 + />
285 285  
286   - <ProFormDatePicker
287   - name="dateRange"
288   - width="md"
289   - label="签合同日期"
290   - placeholder="请选择日期"
291   - fieldProps={{
292   - format: (value) => value.format('YYYY-MM-DD'),
293   - }}
294   - initialValue={contextBody.dateRange}
295   - />
  286 + <ProFormText
  287 + width="md"
  288 + name="payWay"
  289 + rules={[{ required: true, message: '此项为必填项' }]}
  290 + label="付款比例"
  291 + placeholder="请输入"
  292 + initialValue={contextBody.payWay}
  293 + onBlur={(e) => {
  294 + handleInputChange(e.target.value, 1);
  295 + }}
  296 + />
296 297  
297   - <ProFormText
298   - width="md"
299   - name="payWay"
300   - rules={[{ required: true, message: '此项为必填项' }]}
301   - label="付款比例"
302   - placeholder="请输入"
303   - initialValue={contextBody.payWay}
304   - onBlur={(e) => {
305   - handleInputChange(e.target.value, 1);
306   - }}
307   - />
  298 + <ProFormText
  299 + width="md"
  300 + name="contract"
  301 + rules={[{ required: true, message: '此项为必填项' }]}
  302 + label="合同编号"
  303 + placeholder="请输入"
  304 + initialValue={contextBody.contract}
  305 + />
308 306  
309   - <ProFormText
310   - width="md"
311   - name="contract"
312   - rules={[{ required: true, message: '此项为必填项' }]}
313   - label="合同编号"
314   - placeholder="请输入"
315   - initialValue={contextBody.contract}
316   - />
  307 + <ProFormUploadButton
  308 + width="md"
  309 + name="annex"
  310 + max={1}
  311 + label="合同附件"
  312 + />
317 313  
318   - <ProFormUploadButton width="md"
319   - name="annex"
320   - max={1}
321   - onChange={(value) => {
322   - // console.log(value);
323   - }}
324   - label="合同附件" />
  314 + <ProFormText
  315 + width="md"
  316 + name="totalPrice"
  317 + label="合同金额"
  318 + placeholder="请输入"
  319 + disabled
  320 + initialValue={contextBody.totalPrice}
  321 + />
  322 + </ProForm.Group>
  323 + </ProCard>
325 324  
326   - <ProFormText
327   - width="md"
328   - name="totalPrice"
329   - label="合同金额"
330   - placeholder="请输入"
331   - disabled
332   - // rules={[{ required: true, message: '此项为必填项' }]}
333   - // value={contextBody.totalPrice}
334   - initialValue={contextBody.totalPrice}
335   - />
336   - </ProForm.Group>
337   - </ProCard>
338   -
339   - <ProCard
340   - title={<><span style={{ color: 'red' }}>*</span>产品明细</>}
341   - style={{ marginTop: 10 }}
342   - headerBordered
343   - bordered
344   - >
345   - <ProductDetail productBody={contextBody.orderStagesDeviceVoList} EditProductBody={getEditProductBody}></ProductDetail>
346   - </ProCard>
347   -
  325 + <ProCard
  326 + title={
  327 + <>
  328 + <span style={{ color: 'red' }}>*</span>产品明细
  329 + </>
  330 + }
  331 + style={{ marginTop: 10 }}
  332 + headerBordered
  333 + bordered
  334 + >
  335 + <ProductDetail
  336 + productBody={contextBody.orderStagesDeviceVoList}
  337 + EditProductBody={getEditProductBody}
  338 + ></ProductDetail>
  339 + </ProCard>
348 340  
349   - <ProCard
350   - title="付款信息"
351   - style={{ marginTop: 10 }}
352   - headerBordered
353   - bordered
354   - >
355   - <PayWayDetail payBody={payWayBody} thisId={contextBody.id} currtSave={setSave}></PayWayDetail>
356   - </ProCard>
  341 + <ProCard
  342 + title="付款信息"
  343 + style={{ marginTop: 10 }}
  344 + headerBordered
  345 + bordered
  346 + >
  347 + <PayWayDetail
  348 + payBody={payWayBody}
  349 + thisId={contextBody.id}
  350 + currtSave={setSave}
  351 + ></PayWayDetail>
  352 + </ProCard>
357 353  
358   - <ProCard
359   - style={{ marginTop: 10 }}
360   - headerBordered
361   - bordered
362   - >
363   - <ProFormTextArea label="备注" name="remark" initialValue={contextBody.remark} />
364   - </ProCard>
365   - </ModalForm>
366   - );
367   -};
368 354 \ No newline at end of file
  355 + <ProCard style={{ marginTop: 10 }} headerBordered bordered>
  356 + <ProFormTextArea
  357 + label="备注"
  358 + name="remark"
  359 + initialValue={contextBody.remark}
  360 + />
  361 + </ProCard>
  362 + </ModalForm>
  363 + );
  364 +};
... ...
src/pages/Instalment/components/payWayDetail/payWayDetail.tsx
  View file @d5cb3ed
  1 +import { postOrderErpOrderStagesPayWaySelect } from '@/services';
1 2 import type { ProColumns } from '@ant-design/pro-components';
2 3 import {
3   - EditableProTable,
4   - ProCard,
5   - ProFormDatePicker,
6   - ProFormDateTimePicker,
7   - ProFormField,
8   - ProFormRadio,
9   - ProFormTimePicker,
10   - ProFormUploadButton,
  4 + EditableProTable,
  5 + ProFormDatePicker,
  6 + ProFormRadio,
  7 + ProFormUploadButton,
11 8 } from '@ant-design/pro-components';
12   -import React, { useEffect, useState } from 'react';
13   -import './payWayDetail.less'
14   -import { getOrderErpOrderStagesPayWaySelectOssId, postOrderErpOrderStagesPayWaySelect } from '@/services';
15 9 import { message } from 'antd';
  10 +import React, { useEffect, useState } from 'react';
  11 +import './payWayDetail.less';
16 12  
17 13 const waitTime = (time: number = 100) => {
18   - return new Promise((resolve) => {
19   - setTimeout(() => {
20   - resolve(true);
21   - }, time);
22   - });
  14 + return new Promise((resolve) => {
  15 + setTimeout(() => {
  16 + resolve(true);
  17 + }, time);
  18 + });
23 19 };
24 20  
25 21 type DataSourceType = {
26   - id: number;
27   - payStep?: string;
28   - proportion?: string;
29   - ossId?: number,
30   - payPrice?: number;
31   - payDate?: Date;
32   - fileName?: string;
33   - fileUrl?: string;
  22 + id: number;
  23 + payStep?: string;
  24 + proportion?: string;
  25 + ossId?: number;
  26 + payPrice?: number;
  27 + payDate?: Date;
  28 + fileName?: string;
  29 + fileUrl?: string;
34 30 };
35 31  
36 32 export default ({ payBody, thisId, currtSave }) => {
37   - const defaultData: DataSourceType[] = [
38   - {
39   - id: 1,
40   - payStep: '预付款',
41   - proportion: undefined,
42   - payPrice: undefined,
43   - ossId: undefined,
44   - payDate: undefined,
45   - fileName: undefined,
46   - fileUrl: undefined
47   - },
48   - {
49   - id: 2,
50   - payStep: '发贷款',
51   - proportion: undefined,
52   - payPrice: undefined,
53   - ossId: undefined,
54   - payDate: undefined,
55   - fileName: undefined,
56   - fileUrl: undefined
57   - },
58   - {
59   - id: 3,
60   - payStep: '验收款',
61   - proportion: undefined,
62   - payPrice: undefined,
63   - ossId: undefined,
64   - payDate: undefined,
65   - fileName: undefined,
66   - fileUrl: undefined
67   - },
68   - {
69   - id: 4,
70   - payStep: '质保金',
71   - proportion: undefined,
72   - payPrice: undefined,
73   - ossId: undefined,
74   - payDate: undefined,
75   - fileName: undefined,
76   - fileUrl: undefined
77   - }
78   - ];
  33 + const defaultData: DataSourceType[] = [
  34 + {
  35 + id: 1,
  36 + payStep: '预付款',
  37 + proportion: undefined,
  38 + payPrice: undefined,
  39 + ossId: undefined,
  40 + payDate: undefined,
  41 + fileName: undefined,
  42 + fileUrl: undefined,
  43 + },
  44 + {
  45 + id: 2,
  46 + payStep: '发贷款',
  47 + proportion: undefined,
  48 + payPrice: undefined,
  49 + ossId: undefined,
  50 + payDate: undefined,
  51 + fileName: undefined,
  52 + fileUrl: undefined,
  53 + },
  54 + {
  55 + id: 3,
  56 + payStep: '验收款',
  57 + proportion: undefined,
  58 + payPrice: undefined,
  59 + ossId: undefined,
  60 + payDate: undefined,
  61 + fileName: undefined,
  62 + fileUrl: undefined,
  63 + },
  64 + {
  65 + id: 4,
  66 + payStep: '质保金',
  67 + proportion: undefined,
  68 + payPrice: undefined,
  69 + ossId: undefined,
  70 + payDate: undefined,
  71 + fileName: undefined,
  72 + fileUrl: undefined,
  73 + },
  74 + ];
79 75  
80   - const [editableKeys, setEditableRowKeys] = useState<React.Key[]>([]);
81   - const [dataSource, setDataSource] = useState<readonly DataSourceType[]>([]);
82   - const [position, setPosition] = useState<'top' | 'bottom' | 'hidden'>('hidden',);
83   - const [payWayDetailBody, setPayWayDetailBody] = useState<readonly DataSourceType[]>([...defaultData])
84   - const [body, setBody] = useState([])
85   - const [isAccept, setIsAccept] = useState(null)
86   - const [isCurrtSave, setIsCurrtSave] = useState(false);
  76 + const [editableKeys, setEditableRowKeys] = useState<React.Key[]>([]);
  77 + const [position, setPosition] = useState<'top' | 'bottom' | 'hidden'>(
  78 + 'hidden',
  79 + );
  80 + const [payWayDetailBody, setPayWayDetailBody] = useState<
  81 + readonly DataSourceType[]
  82 + >([...defaultData]);
  83 + // const [body, setBody] = useState([])
  84 + const [isAccept, setIsAccept] = useState(null);
  85 + // const [isCurrtSave, setIsCurrtSave] = useState(false);
87 86  
88   - async function getOther(value, arr) {
89   - const res = await postOrderErpOrderStagesPayWaySelect({
90   - data: { ossId: value }
  87 + async function getOther(value, arr) {
  88 + const res = await postOrderErpOrderStagesPayWaySelect({
  89 + data: { ossId: value },
  90 + });
  91 + if (res.data) {
  92 + const context = res.data;
  93 + const remake = arr.map((obj) => {
  94 + let currt = obj;
  95 + context.forEach((object) => {
  96 + if (object.number === obj.id) {
  97 + currt = {
  98 + ...obj,
  99 + ossId: value,
  100 + payDate: object.dateRange,
  101 + fileName: object.fileName,
  102 + fileUrl: object.fileUrl,
  103 + };
  104 + return currt;
  105 + }
91 106 });
92   - if (res.data) {
93   - const context = res.data;
94   - const remake = arr.map(obj => {
95   - let currt = obj;
96   - context.forEach(object => {
97   - if (object.number == obj.id) {
98   - currt = {
99   - ...obj,
100   - ossId: value,
101   - payDate: object.dateRange,
102   - fileName: object.fileName,
103   - fileUrl: object.fileUrl
104   - };
105   - return currt;
106   - }
107   - });
108   - // console.log(currt);
109   - return currt;
110   - });
111   - // console.log(context);
112   - setPayWayDetailBody(remake);
113   - }
  107 + return currt;
  108 + });
  109 + setPayWayDetailBody(remake);
114 110 }
  111 + }
115 112  
116   - function setPayWay(value) {
117   - const remakeData = payWayDetailBody.map(obj => {
118   - return { ...obj, proportion: value[obj.id - 1]?.proportion, payPrice: value[obj.id - 1]?.payPrice }
119   - })
120   - // console.log(remakeData);
121   -
122   - setPayWayDetailBody(remakeData)
123   - // console.log(thisId);
124   -
125   - if (thisId!=null) {
126   - getOther(thisId, remakeData)
127   - }
128   - }
129   - // useEffect(() => {
130   - // getOther(thisId)
131   - // }, [thisId])
  113 + function setPayWay(value) {
  114 + const remakeData = payWayDetailBody.map((obj) => {
  115 + return {
  116 + ...obj,
  117 + proportion: value[obj.id - 1]?.proportion,
  118 + payPrice: value[obj.id - 1]?.payPrice,
  119 + };
  120 + });
  121 + // console.log(remakeData);
132 122  
133   - useEffect(() => {
134   - setPayWay(payBody)
135   - }, [payBody])
  123 + setPayWayDetailBody(remakeData);
  124 + // console.log(thisId);
136 125  
137   - function setCurrtSave(value) {
138   - // console.log(value);
139   - setIsCurrtSave(payWayDetailBody)
  126 + if (thisId !== null) {
  127 + getOther(thisId, remakeData);
140 128 }
  129 + }
  130 + // useEffect(() => {
  131 + // getOther(thisId)
  132 + // }, [thisId])
141 133  
  134 + useEffect(() => {
  135 + setPayWay(payBody);
  136 + }, [payBody]);
142 137  
143   - const columns: ProColumns<DataSourceType>[] = [
144   - {
145   - title: '编号',
146   - dataIndex: 'id',
147   - hideInTable: true,
148   - editable: false
149   - },
150   - {
151   - title: '付款信息',
152   - dataIndex: 'payStep',
153   - editable: false
154   - },
155   - {
156   - title: '付款比例',
157   - dataIndex: 'proportion',
158   - editable: false
159   - },
160   - {
161   - title: '付款金额',
162   - dataIndex: 'payPrice',
163   - editable: false
164   - },
165   - {
166   - title: '对应的订单',
167   - dataIndex: 'ossId',
168   - editable: false,
169   - hideInTable: true,
170   - },
171   - {
172   - title: '付款时间',
173   - dataIndex: 'payDate',
174   - editable: false,
175   - render: (text, record, _, action) => {
176   - const handleChange = (value) => {
177   - const updatedDataSource = payWayDetailBody.map(item => {
178   - if (item.id === record.id) {
179   - return {
180   - ...item,
181   - payDate: value
182   - };
183   - }
184   - return item;
185   - });
186   - // console.log(updatedDataSource);
187   -
188   - setPayWayDetailBody(updatedDataSource);
189   - currtSave(updatedDataSource)
190   - };
  138 + // function setCurrtSave(value) {
  139 + // // console.log(value);
  140 + // setIsCurrtSave(payWayDetailBody)
  141 + // }
191 142  
192   - return (
193   - <ProFormDatePicker
194   - className='dataChoose'
195   - initialValue={record.payDate}
196   - value={record.payDate}
197   - placeholder={"请填写时间"}
198   - fieldProps={{
199   - format: (value) => value.format('YYYY-MM-DD'),
200   - onChange: handleChange,
201   - }}
202   - />
203   - );
  143 + const columns: ProColumns<DataSourceType>[] = [
  144 + {
  145 + title: '编号',
  146 + dataIndex: 'id',
  147 + hideInTable: true,
  148 + editable: false,
  149 + },
  150 + {
  151 + title: '付款信息',
  152 + dataIndex: 'payStep',
  153 + editable: false,
  154 + },
  155 + {
  156 + title: '付款比例',
  157 + dataIndex: 'proportion',
  158 + editable: false,
  159 + },
  160 + {
  161 + title: '付款金额',
  162 + dataIndex: 'payPrice',
  163 + editable: false,
  164 + },
  165 + {
  166 + title: '对应的订单',
  167 + dataIndex: 'ossId',
  168 + editable: false,
  169 + hideInTable: true,
  170 + },
  171 + {
  172 + title: '付款时间',
  173 + dataIndex: 'payDate',
  174 + editable: false,
  175 + render: (text, record) => {
  176 + const handleChange = (value) => {
  177 + const updatedDataSource = payWayDetailBody.map((item) => {
  178 + if (item.id === record.id) {
  179 + return {
  180 + ...item,
  181 + payDate: value,
  182 + };
204 183 }
205   - },
206   - {
207   - title: '付款单回执',
208   - dataIndex: 'fileName',
209   - render: (text, record, _, action) => {
210   - if (isAccept !== record.id) {
211   - if (typeof record.fileUrl === 'object' && record.fileUrl instanceof File) {
212   - return (<a onClick={() => message.error("请先保存")}>{record.fileName}</a>)
213   - } else {
214   - return (<a href={record.fileUrl}>{record.fileName}</a>)
215   - }
216   - } else {
217   - return (
218   - <ProFormUploadButton
219   - name={record.id}
220   - onChange={(value) => {
221   - // console.log(value);
222   - // console.log(payWayDetailBody);
223   - let remakeBody = [];
224   - let remakeBodyItem = {};
225   - payWayDetailBody.forEach(item => {
226   - if (item.id === record.id) {
227   - remakeBodyItem = { ...item, fileUrl: value.file.originFileObj, fileName: value.file.name }
228   - } else {
229   - remakeBodyItem = { ...item }
230   - }
231   - // if (value.fileList.length == 0) {
232   - // remakeBodyItem = { ...item, fileUrl: undefined, fileName: undefined }
233   - // }
234   - remakeBody.push(remakeBodyItem)
235   - })
236   - setPayWayDetailBody(remakeBody)
237   - currtSave(remakeBody)
238   - }}
239   - width="md"
240   - max={1} />
241   - )
242   - }
243   - },
244   - },
245   - {
246   - title: '操作',
247   - valueType: 'option',
248   - width: 200,
249   - render: (text, record, _, action) => [
250   - <a
251   - key="editable"
252   - onClick={() => {
253   - if (isAccept !== record.id) {
254   - setIsAccept(record.id)
255   - } else {
256   - setIsAccept(null)
257   - }
  184 + return item;
  185 + });
  186 + // console.log(updatedDataSource);
258 187  
259   - }}
260   - >
261   - {(record.fileName !== undefined && record.fileName !== "" && record.fileName !== null) ? '重新上传' : '上传回执'}
262   - </a>
263   - ],
264   - },
265   - ];
  188 + setPayWayDetailBody(updatedDataSource);
  189 + currtSave(updatedDataSource);
  190 + };
266 191  
267   - return (
268   - <>
269   - <EditableProTable<DataSourceType>
270   - rowKey="id"
271   - className='payway-detail-index'
272   - toolbar={{ style: { display: 'none' } }}
273   - ghost={true}
274   - scroll={{
275   - x: 960,
276   - }}
277   - recordCreatorProps={
278   - position !== 'hidden'
279   - ? {
280   - position: position as 'top',
281   - record: () => ({ id: (Math.random() * 1000000).toFixed(0) }),
282   - }
283   - : false
284   - }
285   - loading={false}
286   - toolBarRender={() => [
287   - <ProFormRadio.Group
288   - key="render"
289   - fieldProps={{
290   - value: position,
291   - onChange: (e) => setPosition(e.target.value),
292   - }}
293   - />,
294   - ]}
295   - columns={columns}
296   - request={payWayDetailBody}
297   - value={payWayDetailBody}
298   - onChange={() => {
299   - setPayWayDetailBody;
300   - setCurrtSave(payWayDetailBody)
301   - }}
302   - editable={{
303   - type: 'multiple',
304   - editableKeys,
305   - onSave: async (rowKey, data, row) => {
306   - // console.log(rowKey, data, row);
307   - await waitTime(2000);
308   - },
309   - onChange: setEditableRowKeys,
310   - }}
  192 + return (
  193 + <ProFormDatePicker
  194 + className="dataChoose"
  195 + initialValue={record.payDate}
  196 + value={record.payDate}
  197 + placeholder={'请填写时间'}
  198 + fieldProps={{
  199 + format: (value) => value.format('YYYY-MM-DD'),
  200 + onChange: handleChange,
  201 + }}
  202 + />
  203 + );
  204 + },
  205 + },
  206 + {
  207 + title: '付款单回执',
  208 + dataIndex: 'fileName',
  209 + render: (text, record) => {
  210 + if (isAccept !== record.id) {
  211 + if (
  212 + typeof record.fileUrl === 'object' &&
  213 + record.fileUrl instanceof File
  214 + ) {
  215 + return (
  216 + <a onClick={() => message.error('请先保存')}>{record.fileName}</a>
  217 + );
  218 + } else {
  219 + return <a href={record.fileUrl}>{record.fileName}</a>;
  220 + }
  221 + } else {
  222 + return (
  223 + <ProFormUploadButton
  224 + name={record.id}
  225 + onChange={(value) => {
  226 + // console.log(value);
  227 + // console.log(payWayDetailBody);
  228 + let remakeBody = [];
  229 + let remakeBodyItem = {};
  230 + payWayDetailBody.forEach((item) => {
  231 + if (item.id === record.id) {
  232 + remakeBodyItem = {
  233 + ...item,
  234 + fileUrl: value.file.originFileObj,
  235 + fileName: value.file.name,
  236 + };
  237 + } else {
  238 + remakeBodyItem = { ...item };
  239 + }
  240 + // if (value.fileList.length == 0) {
  241 + // remakeBodyItem = { ...item, fileUrl: undefined, fileName: undefined }
  242 + // }
  243 + remakeBody.push(remakeBodyItem);
  244 + });
  245 + setPayWayDetailBody(remakeBody);
  246 + currtSave(remakeBody);
  247 + }}
  248 + width="md"
  249 + max={1}
311 250 />
312   - </>
313   - );
314   -};
315 251 \ No newline at end of file
  252 + );
  253 + }
  254 + },
  255 + },
  256 + {
  257 + title: '操作',
  258 + valueType: 'option',
  259 + width: 200,
  260 + render: (text, record) => [
  261 + <a
  262 + key="editable"
  263 + onClick={() => {
  264 + if (isAccept !== record.id) {
  265 + setIsAccept(record.id);
  266 + } else {
  267 + setIsAccept(null);
  268 + }
  269 + }}
  270 + >
  271 + {record.fileName !== undefined &&
  272 + record.fileName !== '' &&
  273 + record.fileName !== null
  274 + ? '重新上传'
  275 + : '上传回执'}
  276 + </a>,
  277 + ],
  278 + },
  279 + ];
  280 +
  281 + return (
  282 + <>
  283 + <EditableProTable<DataSourceType>
  284 + rowKey="id"
  285 + className="payway-detail-index"
  286 + toolbar={{ style: { display: 'none' } }}
  287 + ghost={true}
  288 + scroll={{
  289 + x: 960,
  290 + }}
  291 + recordCreatorProps={
  292 + position !== 'hidden'
  293 + ? {
  294 + position: position as 'top',
  295 + record: () => ({ id: (Math.random() * 1000000).toFixed(0) }),
  296 + }
  297 + : false
  298 + }
  299 + loading={false}
  300 + toolBarRender={() => [
  301 + <ProFormRadio.Group
  302 + key="render"
  303 + fieldProps={{
  304 + value: position,
  305 + onChange: (e) => setPosition(e.target.value),
  306 + }}
  307 + />,
  308 + ]}
  309 + columns={columns}
  310 + request={payWayDetailBody}
  311 + value={payWayDetailBody}
  312 + onChange={(value) => {
  313 + setPayWayDetailBody(value);
  314 + // setCurrtSave(payWayDetailBody)
  315 + }}
  316 + editable={{
  317 + type: 'multiple',
  318 + editableKeys,
  319 + onSave: async () => {
  320 + // console.log(rowKey, data, row);
  321 + await waitTime(2000);
  322 + },
  323 + onChange: setEditableRowKeys,
  324 + }}
  325 + />
  326 + </>
  327 + );
  328 +};
... ...
src/pages/Instalment/components/productDetail/productDetail.tsx
  View file @d5cb3ed
1 1 import type { ProColumns } from '@ant-design/pro-components';
2   -import {
3   - EditableProTable,
4   - ProCard,
5   - ProFormField,
6   - ProFormRadio,
7   -} from '@ant-design/pro-components';
  2 +import { EditableProTable, ProFormRadio } from '@ant-design/pro-components';
8 3 import React, { useEffect, useState } from 'react';
9   -import './productDetail.less'
10   -import { countBy } from 'lodash';
11   -import { Form } from 'antd';
  4 +import './productDetail.less';
12 5  
13 6 const waitTime = (time: number = 100) => {
14   - return new Promise((resolve) => {
15   - setTimeout(() => {
16   - resolve(true);
17   - }, time);
18   - });
19   -};
20   -
21   -type DataSourceType = {
22   - count?: number;
23   - id: React.Key;
24   - deviceModel?: string;
25   - deviceName?: string;
26   - price?: number;
27   - unitPrice?: number;
  7 + return new Promise((resolve) => {
  8 + setTimeout(() => {
  9 + resolve(true);
  10 + }, time);
  11 + });
28 12 };
29 13  
30   -const defaultData: DataSourceType[] = [
31   - // {
32   - // id:1,
33   - // deviceName: '高低温试验箱',
34   - // deviceModel: 'CAN-TES36-0049ST',
35   - // count: 1,
36   - // unitPrice: 24500,
37   - // price: 24500,
38   - // }
39   -];
  14 +// type DataSourceType = {
  15 +// count?: number;
  16 +// id: React.Key;
  17 +// deviceModel?: string;
  18 +// deviceName?: string;
  19 +// price?: number;
  20 +// unitPrice?: number;
  21 +// };
40 22  
41 23 export default ({ productBody, EditProductBody }) => {
42   - const [editableKeys, setEditableRowKeys] = useState<React.Key[]>([]);
43   - const [dataSource, setDataSource] = useState<readonly DataSourceType[]>([]);
44   - const [form] = Form.useForm<{ name: string; company: string }>();
45   - const [position, setPosition] = useState<'top' | 'bottom' | 'hidden'>(
46   - 'bottom',
47   - );
48   - function getDataSourece() {
49   - if (productBody.length != 0) {
50   - setDataSource(productBody)
51   - }
  24 + const [editableKeys, setEditableRowKeys] = useState<React.Key[]>([]);
  25 + const [dataSource, setDataSource] = useState<readonly DataSourceType[]>([]);
  26 + // const [form] = Form.useForm<{ name: string; company: string }>();
  27 + const [position, setPosition] = useState<'top' | 'bottom' | 'hidden'>(
  28 + 'bottom',
  29 + );
  30 + function getDataSourece() {
  31 + if (productBody.length !== 0) {
  32 + setDataSource(productBody);
52 33 }
53   - function setEditProductBody(value) {
54   - // console.log(value);
55   - // console.log(dataSource);
56   -
57   - const modifiedArray = value.map(obj => {
58   - if (obj.dId && Number(obj.dId) <= 1000) {
59   - return {
60   - ...obj,
61   - count: obj.count,
62   - dId: null,
63   - deviceModel: obj.deviceModel,
64   - deviceName: obj.deviceName,
65   - price: Number(obj.unitPrice)*Number(obj.count),
66   - unitPrice: obj.unitPrice
67   - };
68   - } else {
69   - return {...obj,price: Number(obj.unitPrice)*Number(obj.count)};
70   - }
71   - });
72   - // console.log(modifiedArray);
  34 + }
  35 + function setEditProductBody(value) {
  36 + // console.log(value);
  37 + // console.log(dataSource);
73 38  
74   - EditProductBody(modifiedArray)
75   - setDataSource(value)
76   - }
  39 + const modifiedArray = value.map((obj) => {
  40 + if (obj.dId && Number(obj.dId) <= 1000) {
  41 + return {
  42 + ...obj,
  43 + count: obj.count,
  44 + dId: null,
  45 + deviceModel: obj.deviceModel,
  46 + deviceName: obj.deviceName,
  47 + price: Number(obj.unitPrice) * Number(obj.count),
  48 + unitPrice: obj.unitPrice,
  49 + };
  50 + } else {
  51 + return { ...obj, price: Number(obj.unitPrice) * Number(obj.count) };
  52 + }
  53 + });
  54 + // console.log(modifiedArray);
77 55  
78   - useEffect(() => {
79   - getDataSourece()
80   - }, [productBody])
  56 + EditProductBody(modifiedArray);
  57 + setDataSource(value);
  58 + }
81 59  
82   - type DataSourceType = {
83   - id: React.Key,
84   - count: number,
85   - dId?: number,
86   - deviceModel: string,
87   - deviceName: string,
88   - price: number
89   - unitPrice: number
90   - }
  60 + useEffect(() => {
  61 + getDataSourece();
  62 + }, [productBody]);
91 63  
  64 + type DataSourceType = {
  65 + id: React.Key;
  66 + count: number;
  67 + dId?: number;
  68 + deviceModel: string;
  69 + deviceName: string;
  70 + price: number;
  71 + unitPrice: number;
  72 + };
92 73  
93   - const columns: ProColumns<DataSourceType>[] = [
94   - {
95   - title: '设备编号',
96   - dataIndex: 'dId',
97   - hideInTable: true,
98   - },
99   - {
100   - title: '设备名称',
101   - dataIndex: 'deviceName',
102   - formItemProps: (form, { rowIndex }) => {
103   - return {
104   - rules:
105   - [{ required: true, message: '此项为必填项' }]
106   - };
107   - }
108   - },
109   - {
110   - title: '设备型号',
111   - dataIndex: 'deviceModel',
112   - width: '15%',
113   - formItemProps: (form, { rowIndex }) => {
114   - return {
115   - rules:
116   - [{ required: true, message: '此项为必填项' }]
117   - };
  74 + const columns: ProColumns<DataSourceType>[] = [
  75 + {
  76 + title: '设备编号',
  77 + dataIndex: 'dId',
  78 + hideInTable: true,
  79 + },
  80 + {
  81 + title: '设备名称',
  82 + dataIndex: 'deviceName',
  83 + formItemProps: () => {
  84 + return {
  85 + rules: [{ required: true, message: '此项为必填项' }],
  86 + };
  87 + },
  88 + },
  89 + {
  90 + title: '设备型号',
  91 + dataIndex: 'deviceModel',
  92 + width: '15%',
  93 + formItemProps: () => {
  94 + return {
  95 + rules: [{ required: true, message: '此项为必填项' }],
  96 + };
  97 + },
  98 + },
  99 + {
  100 + title: '数量',
  101 + dataIndex: 'count',
  102 + formItemProps: () => {
  103 + return {
  104 + rules: [{ required: true, message: '此项为必填项' }],
  105 + };
  106 + },
  107 + },
  108 + {
  109 + title: '单价',
  110 + dataIndex: 'unitPrice',
  111 + formItemProps: () => {
  112 + return {
  113 + rules: [{ required: true, message: '此项为必填项' }],
  114 + };
  115 + },
  116 + },
  117 + {
  118 + title: '总价',
  119 + dataIndex: 'price',
  120 + hideInSetting: true,
  121 + disable: true,
  122 + editable: false,
  123 + render: (_text, record) => [
  124 + <span key={record.dId}>{record.count * record.unitPrice}</span>,
  125 + ],
  126 + },
  127 + {
  128 + title: '操作',
  129 + valueType: 'option',
  130 + width: 200,
  131 + render: (_text, record, _, action) => [
  132 + <a
  133 + key="editable"
  134 + onClick={() => {
  135 + if (record.dId) {
  136 + action?.startEditable?.(record.dId);
118 137 }
119   - },
120   - {
121   - title: '数量',
122   - dataIndex: 'count',
123   - formItemProps: (form, { rowIndex }) => {
124   - return {
125   - rules:
126   - [{ required: true, message: '此项为必填项' }]
127   - };
128   - }
129   - },
130   - {
131   - title: '单价',
132   - dataIndex: 'unitPrice',
133   - formItemProps: (form, { rowIndex }) => {
134   - return {
135   - rules:
136   - [{ required: true, message: '此项为必填项' }]
137   - };
138   - }
139   - },
140   - {
141   - title: '总价',
142   - dataIndex: 'price',
143   - hideInSetting:true,
144   - disable:true,
145   - editable:false,
146   - render: (text, record, _, action) => [
147   - <span>
148   - {record.count*record.unitPrice}
149   - </span>
150   - ],
151   - },
152   - {
153   - title: '操作',
154   - valueType: 'option',
155   - width: 200,
156   - render: (text, record, _, action) => [
157   - <a
158   - key="editable"
159   - onClick={() => {
160   - if (record.dId) {
161   - // EditProductBody(dataSource.filter((item) => item.dId !== record.dId));
162   - // console.log(record);
163   -
164   - action?.startEditable?.(record.dId);
165   - }
166   - }}
167   - >
168   - 编辑
169   - </a>,
170   - <a
171   - key="delete"
172   - onClick={() => {
173   - EditProductBody(dataSource.filter((item) => item.dId !== record.dId));
174   - setDataSource(dataSource.filter((item) => item.dId !== record.dId));
175   - }}
176   - >
177   - 删除
178   - </a>,
179   - ],
180   - },
181   - ];
  138 + }}
  139 + >
  140 + 编辑
  141 + </a>,
  142 + <a
  143 + key="delete"
  144 + onClick={() => {
  145 + EditProductBody(
  146 + dataSource.filter((item) => item.dId !== record.dId),
  147 + );
  148 + setDataSource(dataSource.filter((item) => item.dId !== record.dId));
  149 + }}
  150 + >
  151 + 删除
  152 + </a>,
  153 + ],
  154 + },
  155 + ];
182 156  
183   - return (
184   - <>
185   - <EditableProTable<DataSourceType>
186   - className='product-detail-index'
187   - rowKey="dId"
188   - toolbar={{ style: { display: 'none' } }}
189   - ghost={true}
190   - scroll={{
191   - x: 960,
192   - }}
193   - recordCreatorProps={
194   - position !== 'hidden'
195   - ? {
196   - position: position as 'top',
197   - record: () => ({ dId: (Math.random() * 1000).toFixed(0) }),
198   - }
199   - : false
200   - }
201   - loading={false}
202   - toolBarRender={() => [
203   - <ProFormRadio.Group
204   - key="render"
205   - fieldProps={{
206   - value: position,
207   - onChange: (e) => setPosition(e.target.value),
208   - }}
209   - />,
210   - ]}
211   - columns={columns}
212   - request={dataSource}
213   - value={dataSource}
214   - onChange={setEditProductBody}
215   - editable={{
216   - type: 'multiple',
217   - editableKeys,
218   - onSave: async (rowKey, data, row) => {
219   - // console.log(data);
220   - await waitTime(500);
221   - },
222   - onChange: setEditableRowKeys,
223   - }}
224   - />
225   - </>
226   - );
227   -};
228 157 \ No newline at end of file
  158 + return (
  159 + <>
  160 + <EditableProTable<DataSourceType>
  161 + className="product-detail-index"
  162 + rowKey="dId"
  163 + toolbar={{ style: { display: 'none' } }}
  164 + ghost={true}
  165 + scroll={{
  166 + x: 960,
  167 + }}
  168 + recordCreatorProps={
  169 + position !== 'hidden'
  170 + ? {
  171 + position: position as 'top',
  172 + record: () => ({ dId: (Math.random() * 1000).toFixed(0) }),
  173 + }
  174 + : false
  175 + }
  176 + loading={false}
  177 + toolBarRender={() => [
  178 + <ProFormRadio.Group
  179 + key="render"
  180 + fieldProps={{
  181 + value: position,
  182 + onChange: (e) => setPosition(e.target.value),
  183 + }}
  184 + />,
  185 + ]}
  186 + columns={columns}
  187 + request={dataSource}
  188 + value={dataSource}
  189 + onChange={setEditProductBody}
  190 + editable={{
  191 + type: 'multiple',
  192 + editableKeys,
  193 + onSave: async () => {
  194 + await waitTime(500);
  195 + },
  196 + onChange: setEditableRowKeys,
  197 + }}
  198 + />
  199 + </>
  200 + );
  201 +};
... ...
src/pages/Instalment/components/read/read.tsx
  View file @d5cb3ed
1   -import { PlusOutlined } from '@ant-design/icons';
2 1 import {
3   - ModalForm,
4   - ProCard,
5   - ProForm,
6   - ProFormDatePicker,
7   - ProFormDateRangePicker,
8   - ProFormDependency,
9   - ProFormSelect,
10   - ProFormText,
11   - ProFormTextArea,
12   - ProFormUploadButton,
  2 + postOrderErpOrderStagesPayWaySaveOrUpdate,
  3 + postOrderErpOrderStagesSaveOrUpdate,
  4 + postOrderErpOrderStagesSearch,
  5 + postOrderErpOrderStagesUpload,
  6 +} from '@/services';
  7 +import {
  8 + ModalForm,
  9 + ProCard,
  10 + ProForm,
  11 + ProFormDatePicker,
  12 + ProFormText,
  13 + ProFormTextArea,
13 14 } from '@ant-design/pro-components';
14   -import ProductDetail from './readProduct';
15   -import PayWayDetail from './readPayWay'
16   -import { Button, Form, UploadProps, message } from 'antd';
17   -import Item from 'antd/es/list/Item';
18   -import { useEffect, useRef, useState } from 'react';
19   -import { postOrderErpOrderStagesPayWaySaveOrUpdate, postOrderErpOrderStagesPayWayUploadForPayWay, postOrderErpOrderStagesSaveOrUpdate, postOrderErpOrderStagesSearch, postOrderErpOrderStagesUpload, postServiceOrderFileProcess } from '@/services';
20   -import { context } from '@/.umi/core/helmetContext';
  15 +import { Form, message } from 'antd';
21 16 import { RcFile } from 'antd/es/upload';
  17 +import { useEffect, useState } from 'react';
  18 +import PayWayDetail from './readPayWay';
  19 +import ProductDetail from './readProduct';
22 20  
23 21 const waitTime = (time: number = 100) => {
24   - return new Promise((resolve) => {
25   - setTimeout(() => {
26   - resolve(true);
27   - }, time);
28   - });
  22 + return new Promise((resolve) => {
  23 + setTimeout(() => {
  24 + resolve(true);
  25 + }, time);
  26 + });
29 27 };
30 28  
31 29 export default ({ currentContract }) => {
32   - const [form] = Form.useForm<{ name: string; company: string }>();
33   - const [contextBody, setContextBody] = useState({});
34   - const [editProductBody, setEditProductBody] = useState([]);
35   - const [total, setTotal] = useState(0);
36   - const [payWayBody, setPayWayBody] = useState([])
37   - const [otherBody, setOtherBody] = useState([])
38   - const [isOnlyRead, setisOnlyRead] = useState()
  30 + const [form] = Form.useForm<{ name: string; company: string }>();
  31 + const [contextBody, setContextBody] = useState({});
  32 + const [, setEditProductBody] = useState([]);
  33 + const [total, setTotal] = useState(0);
  34 + const [payWayBody, setPayWayBody] = useState([]);
  35 + const [otherBody, setOtherBody] = useState([]);
39 36  
40   - type OrderStagesWithListItem = {
41   - //文件编号
42   - id: number;
43   - //合同编号
44   - contract: string;
45   - //供应商名称
46   - vendor: string;
47   - //签合同日期
48   - dateRange: Date;
49   - //终端名称
50   - terminal: string;
51   - orderStagesDeviceVoList: orderStagesDevice[]
52   - //合同总金额
53   - totalPrice: number;
54   - //付款方式
55   - payWay: string;
56   - //附件
57   - annex: string;
58   - //备注
59   - remark: string;
60   - };
  37 + type OrderStagesWithListItem = {
  38 + //文件编号
  39 + id: number;
  40 + //合同编号
  41 + contract: string;
  42 + //供应商名称
  43 + vendor: string;
  44 + //签合同日期
  45 + dateRange: Date;
  46 + //终端名称
  47 + terminal: string;
  48 + orderStagesDeviceVoList: orderStagesDevice[];
  49 + //合同总金额
  50 + totalPrice: number;
  51 + //付款方式
  52 + payWay: string;
  53 + //附件
  54 + annex: string;
  55 + //备注
  56 + remark: string;
  57 + };
61 58  
62   - type orderStagesDevice = {
63   - //设备id
64   - dId: number;
65   - //设备名称
66   - deviceName: string;
67   - //设备型号
68   - deviceModel: string;
69   - //数量
70   - count: number;
71   - //单价
72   - unitPrice: number;
73   - //总价
74   - price: number;
75   - }
  59 + type orderStagesDevice = {
  60 + //设备id
  61 + dId: number;
  62 + //设备名称
  63 + deviceName: string;
  64 + //设备型号
  65 + deviceModel: string;
  66 + //数量
  67 + count: number;
  68 + //单价
  69 + unitPrice: number;
  70 + //总价
  71 + price: number;
  72 + };
76 73  
77   - async function getBody() {
78   - const res = await postOrderErpOrderStagesSearch({
79   - data: { contract: currentContract },
80   - });
81   - const context = res.data[0];
82   - // console.log(context);
  74 + async function refresh() {
  75 + const res = await postOrderErpOrderStagesSearch({
  76 + data: { contract: currentContract },
  77 + });
  78 + const context = res.data[0];
  79 + // console.log(context);
83 80  
84   - if (context.contract != null) {
85   - setContextBody(context);
86   - setTotal(context.totalPrice)
87   - form.setFieldValue('totalPrice', context.totalPrice);
88   - }
89   - handleInputChange(context.payWay, 0, context.totalPrice)
  81 + if (context.contract !== null) {
  82 + setContextBody(context);
  83 + setTotal(context.totalPrice);
  84 + form.setFieldValue('totalPrice', context.totalPrice);
90 85 }
  86 + }
91 87  
92   - async function refresh() {
93   - const res = await postOrderErpOrderStagesSearch({
94   - data: { contract: currentContract },
95   - });
96   - const context = res.data[0];
97   - // console.log(context);
  88 + function setSave(value) {
  89 + // console.log(value);
  90 + setOtherBody(value);
  91 + }
98 92  
99   - if (context.contract != null) {
100   - setContextBody(context);
101   - setTotal(context.totalPrice)
102   - form.setFieldValue('totalPrice', context.totalPrice);
103   - }
  93 + useEffect(() => {
  94 + setContextBody({ ...contextBody, totalPrice: total });
  95 + form.setFieldValue('totalPrice', total);
  96 + }, [total]);
  97 +
  98 + const handleInputChange = (value: string, no: number, priceNow?: number) => {
  99 + let totalPay = 0;
  100 + const payValue: string[] = value.split('/');
  101 + let body:
  102 + | ((prevState: never[]) => never[])
  103 + | { proportion: string; payPrice: number }[] = [];
  104 + if (no === 1) {
  105 + if (payValue.length !== 4) {
  106 + message.warning('比例个数总和不为4个!');
  107 + } else {
  108 + payValue.forEach((item) => {
  109 + totalPay += Number(item);
  110 + });
  111 + }
  112 + if (totalPay !== 100) {
  113 + message.warning('比例总和不为100!');
  114 + } else {
  115 + message.success('输入有效!');
  116 + const price = total;
  117 + payValue.forEach((item) => {
  118 + body.push({
  119 + proportion: item + '%',
  120 + payPrice: (Number(item) * price) / 100,
  121 + });
  122 + });
  123 + setPayWayBody(body);
  124 + }
  125 + } else {
  126 + payValue.forEach((item) => {
  127 + totalPay += Number(item);
  128 + });
  129 + payValue.forEach((item) => {
  130 + body.push({
  131 + proportion: item + '%',
  132 + payPrice: (Number(item) * priceNow) / 100,
  133 + });
  134 + });
  135 + setPayWayBody(body);
104 136 }
  137 + };
105 138  
106   - function getEditProductBody(value) {
107   - // console.log(value);
  139 + async function getBody() {
  140 + const res = await postOrderErpOrderStagesSearch({
  141 + data: { contract: currentContract },
  142 + });
  143 + const context = res.data[0];
  144 + // console.log(context);
108 145  
109   - setEditProductBody(value)
110   - let price = 0;
111   - value.map(obj => (
112   - price += (obj.count * obj.unitPrice)
113   - ));
114   - setTotal(price);
115   - setContextBody({ ...contextBody, orderStagesDeviceVoList: value })
116   - handleInputChange(contextBody.payWay, 0, price)
117   - }
118   - []
119   - function setSave(value) {
120   - // console.log(value);
121   - setOtherBody(value)
  146 + if (context.contract !== null) {
  147 + setContextBody(context);
  148 + setTotal(context.totalPrice);
  149 + form.setFieldValue('totalPrice', context.totalPrice);
122 150 }
  151 + handleInputChange(context.payWay, 0, context.totalPrice);
  152 + }
123 153  
124   - useEffect(() => {
125   - setContextBody({ ...contextBody, totalPrice: total })
126   - form.setFieldValue('totalPrice', total);
127   - }, [total])
  154 + useEffect(() => {
  155 + getBody();
  156 + }, []);
128 157  
129   - useEffect(() => {
130   - getBody()
131   - }, [])
  158 + function getEditProductBody(value) {
  159 + // console.log(value);
132 160  
133   - const handleInputChange = (value: string, no: number, priceNow?: number) => {
134   - let totalPay = 0;
135   - const payValue: string[] = value.split("/")
136   - let body: ((prevState: never[]) => never[]) | { proportion: string; payPrice: number; }[] = [];
137   - if (no === 1) {
138   - if (payValue.length !== 4) {
139   - message.warning('比例个数总和不为4个!');
140   - } else {
141   - payValue.forEach((item, index) => {
142   - totalPay += Number(item)
143   - })
144   - }
145   - if (totalPay != 100) {
146   - message.warning('比例总和不为100!');
147   - } else {
148   - message.success('输入有效!');
149   - const price = total
150   - payValue.forEach((item, index) => {
151   - body.push({ proportion: item + "%", payPrice: Number(item) * price / 100 })
152   - })
153   - setPayWayBody(body)
154   - }
155   - } else {
156   - payValue.forEach((item, index) => {
157   - totalPay += Number(item)
158   - })
159   - payValue.forEach((item, index) => {
160   - body.push({ proportion: item + "%", payPrice: Number(item) * priceNow / 100 })
161   - })
162   - setPayWayBody(body)
163   - }
164   - };
  161 + setEditProductBody(value);
  162 + let price = 0;
  163 + value.map((obj) => (price += obj.count * obj.unitPrice));
  164 + setTotal(price);
  165 + setContextBody({ ...contextBody, orderStagesDeviceVoList: value });
  166 + handleInputChange(contextBody.payWay, 0, price);
  167 + }
165 168  
166   - return (
167   - <ModalForm<OrderStagesWithListItem>
168   - title="新建"
169   - trigger={
170   - <a onClick={refresh}>查看</a>
171   - }
172   - form={form}
173   - autoFocusFirstInput
174   - modalProps={{
175   - destroyOnClose: true,
176   - // onCancel: () => console.log('run'),
177   - }}
178   - submitTimeout={2000}
179   - onFinish={async (values) => {
180   - // console.log(values);
181   - // console.log(otherBody);
182   - let remakeValue = [];
183   - let remakeItem = {}
184   - // 创建一个用于存储所有异步操作的Promise数组
185   - const promises = [];
  169 + return (
  170 + <ModalForm<OrderStagesWithListItem>
  171 + title="新建"
  172 + trigger={<a onClick={refresh}>查看</a>}
  173 + form={form}
  174 + autoFocusFirstInput
  175 + modalProps={{
  176 + destroyOnClose: true,
  177 + // onCancel: () => console.log('run'),
  178 + }}
  179 + submitTimeout={2000}
  180 + onFinish={async (values) => {
  181 + // console.log(values);
  182 + // console.log(otherBody);
  183 + let remakeValue = [];
  184 + // 创建一个用于存储所有异步操作的Promise数组
  185 + const promises = [];
186 186  
187   - otherBody.forEach(item => {
188   - let remakeItem = { ossId: item.ossId, number: item.id, dataRange: item.payDate, fileName: item.fileName };
189   - if (typeof item.fileUrl === 'object' && item.fileUrl instanceof File) {
190   - const formData = new FormData();
191   - formData.append('file', item.fileUrl as RcFile);
192   - const uploadPromise = async () => {
193   - const res = await postOrderErpOrderStagesUpload({
194   - data: formData,
195   - headers: {
196   - 'Content-Type': 'multipart/form-data; boundary=----WebKitFormBoundarynl6gT1BKdPWIejNq',
197   - }
198   - });
199   - if (res.data) {
200   - remakeItem.fileUrl = res.data;
201   - }
202   - };
203   - promises.push(uploadPromise());
204   - }
205   - remakeValue.push(remakeItem);
206   - });
  187 + otherBody.forEach((item) => {
  188 + let remakeItem = {
  189 + ossId: item.ossId,
  190 + number: item.id,
  191 + dataRange: item.payDate,
  192 + fileName: item.fileName,
  193 + };
  194 + if (
  195 + typeof item.fileUrl === 'object' &&
  196 + item.fileUrl instanceof File
  197 + ) {
  198 + const formData = new FormData();
  199 + formData.append('file', item.fileUrl as RcFile);
  200 + const uploadPromise = async () => {
  201 + const res = await postOrderErpOrderStagesUpload({
  202 + data: formData,
  203 + headers: {
  204 + 'Content-Type':
  205 + 'multipart/form-data; boundary=----WebKitFormBoundarynl6gT1BKdPWIejNq',
  206 + },
  207 + });
  208 + if (res.data) {
  209 + remakeItem.fileUrl = res.data;
  210 + }
  211 + };
  212 + promises.push(uploadPromise());
  213 + }
  214 + remakeValue.push(remakeItem);
  215 + });
207 216  
208   - // 使用Promise.all等待所有异步操作完成后再执行保存操作
209   - Promise.all(promises).then(async () => {
210   - const resp = await postOrderErpOrderStagesPayWaySaveOrUpdate({
211   - data: remakeValue
212   - });
213   - });
214   - const formData = new FormData();
215   - // let toSendEdit={...values,orderStagesDeviceVoList:contextBody.orderStagesDeviceVoList};
216   - let toSendEdit = {
217   - id: values.id || contextBody.id,
218   - contract: values.contract || contextBody.contract,
219   - vendor: values.vendor || contextBody.vendor,
220   - dateRange: values.dateRange || contextBody.dateRange,
221   - terminal: values.terminal || contextBody.terminal,
222   - orderStagesDeviceDoList: values.orderStagesDeviceVoList || contextBody.orderStagesDeviceVoList,
223   - totalPrice: values.totalPrice || contextBody.totalPrice,
224   - payWay: values.payWay || contextBody.payWay,
225   - annex: contextBody.annex,
226   - remark: values.remark || contextBody.remark,
227   - };
228   - if (values.annex) {
229   - formData.append('file', values.annex[0].originFileObj as RcFile);
230   - const res = await postOrderErpOrderStagesUpload({
231   - data: formData,
232   - headers: {
233   - 'Content-Type':
234   - 'multipart/form-data; boundary=----WebKitFormBoundarynl6gT1BKdPWIejNq',
235   - }
236   - });
237   - if (res.data) {
238   - // console.log(values)
239   - // console.log(contextBody);
240   - toSendEdit.annex = res.data
241   - }
242   - }
243   - const isSaveOrUpdate = await postOrderErpOrderStagesSaveOrUpdate({
244   - data: { ...toSendEdit }
245   - })
246   - if (isSaveOrUpdate) {
247   - // console.log(isSaveOrUpdate);
248   - getBody()
249   - }
250   - await waitTime(2000);
251   - message.success('提交成功');
252   - return true;
253   - }}
254   - >
255   - <ProCard
256   - title="基本信息"
257   - headerBordered
258   - bordered
259   - >
260   - <ProForm.Group>
261   - <ProFormText
262   - width="md"
263   - name="vendor"
264   - label="供应商名称"
265   - placeholder="请输入"
266   - initialValue={contextBody.vendor}
267   - readonly
268   - />
  217 + // 使用Promise.all等待所有异步操作完成后再执行保存操作
  218 + Promise.all(promises).then(async () => {
  219 + await postOrderErpOrderStagesPayWaySaveOrUpdate({
  220 + data: remakeValue,
  221 + });
  222 + });
  223 + const formData = new FormData();
  224 + // let toSendEdit={...values,orderStagesDeviceVoList:contextBody.orderStagesDeviceVoList};
  225 + let toSendEdit = {
  226 + id: values.id || contextBody.id,
  227 + contract: values.contract || contextBody.contract,
  228 + vendor: values.vendor || contextBody.vendor,
  229 + dateRange: values.dateRange || contextBody.dateRange,
  230 + terminal: values.terminal || contextBody.terminal,
  231 + orderStagesDeviceDoList:
  232 + values.orderStagesDeviceVoList ||
  233 + contextBody.orderStagesDeviceVoList,
  234 + totalPrice: values.totalPrice || contextBody.totalPrice,
  235 + payWay: values.payWay || contextBody.payWay,
  236 + annex: contextBody.annex,
  237 + remark: values.remark || contextBody.remark,
  238 + };
  239 + if (values.annex) {
  240 + formData.append('file', values.annex[0].originFileObj as RcFile);
  241 + const res = await postOrderErpOrderStagesUpload({
  242 + data: formData,
  243 + headers: {
  244 + 'Content-Type':
  245 + 'multipart/form-data; boundary=----WebKitFormBoundarynl6gT1BKdPWIejNq',
  246 + },
  247 + });
  248 + if (res.data) {
  249 + // console.log(values)
  250 + // console.log(contextBody);
  251 + toSendEdit.annex = res.data;
  252 + }
  253 + }
  254 + const isSaveOrUpdate = await postOrderErpOrderStagesSaveOrUpdate({
  255 + data: { ...toSendEdit },
  256 + });
  257 + if (isSaveOrUpdate) {
  258 + // console.log(isSaveOrUpdate);
  259 + getBody();
  260 + }
  261 + await waitTime(2000);
  262 + message.success('提交成功');
  263 + return true;
  264 + }}
  265 + >
  266 + <ProCard title="基本信息" headerBordered bordered>
  267 + <ProForm.Group>
  268 + <ProFormText
  269 + width="md"
  270 + name="vendor"
  271 + label="供应商名称"
  272 + placeholder="请输入"
  273 + initialValue={contextBody.vendor}
  274 + readonly
  275 + />
269 276  
270   - <ProFormText
271   - width="md"
272   - name="terminal"
273   - label="终端名称"
274   - placeholder="请输入"
275   - initialValue={contextBody.terminal}
276   - readonly
277   - />
  277 + <ProFormText
  278 + width="md"
  279 + name="terminal"
  280 + label="终端名称"
  281 + placeholder="请输入"
  282 + initialValue={contextBody.terminal}
  283 + readonly
  284 + />
278 285  
279   - <ProFormDatePicker
280   - name="dateRange"
281   - width="md"
282   - label="签合同日期"
283   - placeholder="请选择日期"
284   - fieldProps={{
285   - format: (value) => value.format('YYYY-MM-DD'),
286   - }}
287   - initialValue={contextBody.dateRange}
288   - readonly
289   - />
  286 + <ProFormDatePicker
  287 + name="dateRange"
  288 + width="md"
  289 + label="签合同日期"
  290 + placeholder="请选择日期"
  291 + fieldProps={{
  292 + format: (value) => value.format('YYYY-MM-DD'),
  293 + }}
  294 + initialValue={contextBody.dateRange}
  295 + readonly
  296 + />
290 297  
291   - <ProFormText
292   - width="md"
293   - name="payWay"
294   - label="付款比例"
295   - placeholder="请输入"
296   - initialValue={contextBody.payWay}
297   - readonly
298   - onBlur={(e) => {
299   - handleInputChange(e.target.value, 1);
300   - }}
301   - />
  298 + <ProFormText
  299 + width="md"
  300 + name="payWay"
  301 + label="付款比例"
  302 + placeholder="请输入"
  303 + initialValue={contextBody.payWay}
  304 + readonly
  305 + onBlur={(e) => {
  306 + handleInputChange(e.target.value, 1);
  307 + }}
  308 + />
302 309  
303   - <ProFormText
304   - width="md"
305   - name="contract"
306   - label="合同编号"
307   - placeholder="请输入"
308   - initialValue={contextBody.contract}
309   - readonly
310   - />
  310 + <ProFormText
  311 + width="md"
  312 + name="contract"
  313 + label="合同编号"
  314 + placeholder="请输入"
  315 + initialValue={contextBody.contract}
  316 + readonly
  317 + />
311 318  
312   - {/* <ProFormText
  319 + {/* <ProFormText
313 320 width="md"
314 321 name="annex"
315 322 label="合同附件"
... ... @@ -318,45 +325,52 @@ export default ({ currentContract }) =&gt; {
318 325 readonly
319 326 /> */}
320 327  
  328 + <ProFormText
  329 + width="md"
  330 + name="totalPrice"
  331 + label="合同金额"
  332 + placeholder="请输入"
  333 + disabled
  334 + readonly
  335 + // rules={[{ required: true, message: '此项为必填项' }]}
  336 + // value={contextBody.totalPrice}
  337 + initialValue={contextBody.totalPrice}
  338 + />
  339 + </ProForm.Group>
  340 + </ProCard>
  341 + <ProCard
  342 + title="产品明细"
  343 + style={{ marginTop: 10 }}
  344 + headerBordered
  345 + bordered
  346 + >
  347 + <ProductDetail
  348 + productBody={contextBody.orderStagesDeviceVoList}
  349 + EditProductBody={getEditProductBody}
  350 + ></ProductDetail>
  351 + </ProCard>
321 352  
322   - <ProFormText
323   - width="md"
324   - name="totalPrice"
325   - label="合同金额"
326   - placeholder="请输入"
327   - disabled
328   - readonly
329   - // rules={[{ required: true, message: '此项为必填项' }]}
330   - // value={contextBody.totalPrice}
331   - initialValue={contextBody.totalPrice}
332   - />
333   - </ProForm.Group>
334   - </ProCard>
335   - <ProCard
336   - title="产品明细"
337   - style={{ marginTop: 10 }}
338   - headerBordered
339   - bordered
340   - >
341   - <ProductDetail productBody={contextBody.orderStagesDeviceVoList} EditProductBody={getEditProductBody}></ProductDetail>
342   - </ProCard>
  353 + <ProCard
  354 + title="付款信息"
  355 + style={{ marginTop: 10 }}
  356 + headerBordered
  357 + bordered
  358 + >
  359 + <PayWayDetail
  360 + payBody={payWayBody}
  361 + thisId={contextBody.id}
  362 + currtSave={setSave}
  363 + ></PayWayDetail>
  364 + </ProCard>
343 365  
344   - <ProCard
345   - title="付款信息"
346   - style={{ marginTop: 10 }}
347   - headerBordered
348   - bordered
349   - >
350   - <PayWayDetail payBody={payWayBody} thisId={contextBody.id} currtSave={setSave}></PayWayDetail>
351   - </ProCard>
352   -
353   - <ProCard
354   - style={{ marginTop: 10 }}
355   - headerBordered
356   - bordered
357   - >
358   - <ProFormTextArea label="备注" name="remark" initialValue={contextBody.remark} readonly />
359   - </ProCard>
360   - </ModalForm>
361   - );
362   -};
363 366 \ No newline at end of file
  367 + <ProCard style={{ marginTop: 10 }} headerBordered bordered>
  368 + <ProFormTextArea
  369 + label="备注"
  370 + name="remark"
  371 + initialValue={contextBody.remark}
  372 + readonly
  373 + />
  374 + </ProCard>
  375 + </ModalForm>
  376 + );
  377 +};
... ...
src/pages/Instalment/components/read/readPayWay.tsx
  View file @d5cb3ed
  1 +import { postOrderErpOrderStagesPayWaySelect } from '@/services';
1 2 import type { ProColumns } from '@ant-design/pro-components';
2 3 import {
3   - EditableProTable,
4   - ProCard,
5   - ProFormDatePicker,
6   - ProFormDateTimePicker,
7   - ProFormField,
8   - ProFormRadio,
9   - ProFormTimePicker,
10   - ProFormUploadButton,
  4 + EditableProTable,
  5 + ProFormRadio,
  6 + ProFormUploadButton,
11 7 } from '@ant-design/pro-components';
12   -import React, { useEffect, useState } from 'react';
13   -import { postOrderErpOrderStagesPayWaySelect } from '@/services';
14 8 import { message } from 'antd';
  9 +import React, { useEffect, useState } from 'react';
15 10  
16 11 const waitTime = (time: number = 100) => {
17   - return new Promise((resolve) => {
18   - setTimeout(() => {
19   - resolve(true);
20   - }, time);
21   - });
  12 + return new Promise((resolve) => {
  13 + setTimeout(() => {
  14 + resolve(true);
  15 + }, time);
  16 + });
22 17 };
23 18  
24 19 type DataSourceType = {
25   - id: number;
26   - payStep?: string;
27   - proportion?: string;
28   - ossId?: number,
29   - payPrice?: number;
30   - payDate?: Date;
31   - fileName?: string;
32   - fileUrl?: string;
  20 + id: number;
  21 + payStep?: string;
  22 + proportion?: string;
  23 + ossId?: number;
  24 + payPrice?: number;
  25 + payDate?: Date;
  26 + fileName?: string;
  27 + fileUrl?: string;
33 28 };
34 29  
35 30 export default ({ payBody, thisId, currtSave }) => {
36   - const defaultData: DataSourceType[] = [
37   - {
38   - id: 1,
39   - payStep: '预付款',
40   - proportion: undefined,
41   - payPrice: undefined,
42   - ossId: undefined,
43   - payDate: undefined,
44   - fileName: undefined,
45   - fileUrl: undefined
46   - },
47   - {
48   - id: 2,
49   - payStep: '发贷款',
50   - proportion: undefined,
51   - payPrice: undefined,
52   - ossId: undefined,
53   - payDate: undefined,
54   - fileName: undefined,
55   - fileUrl: undefined
56   - },
57   - {
58   - id: 3,
59   - payStep: '验收款',
60   - proportion: undefined,
61   - payPrice: undefined,
62   - ossId: undefined,
63   - payDate: undefined,
64   - fileName: undefined,
65   - fileUrl: undefined
66   - },
67   - {
68   - id: 4,
69   - payStep: '质保金',
70   - proportion: undefined,
71   - payPrice: undefined,
72   - ossId: undefined,
73   - payDate: undefined,
74   - fileName: undefined,
75   - fileUrl: undefined
76   - }
77   - ];
  31 + const defaultData: DataSourceType[] = [
  32 + {
  33 + id: 1,
  34 + payStep: '预付款',
  35 + proportion: undefined,
  36 + payPrice: undefined,
  37 + ossId: undefined,
  38 + payDate: undefined,
  39 + fileName: undefined,
  40 + fileUrl: undefined,
  41 + },
  42 + {
  43 + id: 2,
  44 + payStep: '发贷款',
  45 + proportion: undefined,
  46 + payPrice: undefined,
  47 + ossId: undefined,
  48 + payDate: undefined,
  49 + fileName: undefined,
  50 + fileUrl: undefined,
  51 + },
  52 + {
  53 + id: 3,
  54 + payStep: '验收款',
  55 + proportion: undefined,
  56 + payPrice: undefined,
  57 + ossId: undefined,
  58 + payDate: undefined,
  59 + fileName: undefined,
  60 + fileUrl: undefined,
  61 + },
  62 + {
  63 + id: 4,
  64 + payStep: '质保金',
  65 + proportion: undefined,
  66 + payPrice: undefined,
  67 + ossId: undefined,
  68 + payDate: undefined,
  69 + fileName: undefined,
  70 + fileUrl: undefined,
  71 + },
  72 + ];
78 73  
79   - const [editableKeys, setEditableRowKeys] = useState<React.Key[]>([]);
80   - const [dataSource, setDataSource] = useState<readonly DataSourceType[]>([]);
81   - const [position, setPosition] = useState<'top' | 'bottom' | 'hidden'>('hidden');
82   - const [payWayDetailBody, setPayWayDetailBody] = useState<readonly DataSourceType[]>([...defaultData])
83   - const [body, setBody] = useState([])
84   - const [isAccept, setIsAccept] = useState(null)
85   - const [isCurrtSave, setIsCurrtSave] = useState(false);
  74 + const [editableKeys, setEditableRowKeys] = useState<React.Key[]>([]);
  75 + const [position, setPosition] = useState<'top' | 'bottom' | 'hidden'>(
  76 + 'hidden',
  77 + );
  78 + const [payWayDetailBody, setPayWayDetailBody] = useState<
  79 + readonly DataSourceType[]
  80 + >([...defaultData]);
  81 + const [isAccept] = useState(null);
  82 + // const [isCurrtSave, setIsCurrtSave] = useState(false);
86 83  
87   - async function getOther(value, arr) {
88   - const res = await postOrderErpOrderStagesPayWaySelect({
89   - data: { ossId: value }
  84 + async function getOther(value, arr) {
  85 + const res = await postOrderErpOrderStagesPayWaySelect({
  86 + data: { ossId: value },
  87 + });
  88 + if (res.data) {
  89 + const context = res.data;
  90 + const remake = arr.map((obj) => {
  91 + let currt = obj;
  92 + context.forEach((object) => {
  93 + if (object.number === obj.id) {
  94 + currt = {
  95 + ...obj,
  96 + ossId: value,
  97 + payDate: object.dateRange,
  98 + fileName: object.fileName,
  99 + fileUrl: object.fileUrl,
  100 + };
  101 + return currt;
  102 + }
90 103 });
91   - if (res.data) {
92   - const context = res.data;
93   - const remake = arr.map(obj => {
94   - let currt = obj;
95   - context.forEach(object => {
96   - if (object.number == obj.id) {
97   - currt = {
98   - ...obj,
99   - ossId: value,
100   - payDate: object.dateRange,
101   - fileName: object.fileName,
102   - fileUrl: object.fileUrl
103   - };
104   - return currt;
105   - }
106   - });
107   - // console.log(currt);
108   - return currt;
109   - });
110   - // console.log(context);
111   - setPayWayDetailBody(remake);
112   - }
  104 + return currt;
  105 + });
  106 + setPayWayDetailBody(remake);
113 107 }
  108 + }
114 109  
115   - function setPayWay(value) {
116   - const remakeData = payWayDetailBody.map(obj => {
117   - return { ...obj, proportion: value[obj.id - 1]?.proportion, payPrice: value[obj.id - 1]?.payPrice }
118   - })
119   - // console.log(remakeData);
120   -
121   - setPayWayDetailBody(remakeData)
122   - // console.log(thisId);
123   -
124   - if (thisId!=null) {
125   - getOther(thisId, remakeData)
126   - }
127   - }
128   - // useEffect(() => {
129   - // getOther(thisId)
130   - // }, [thisId])
  110 + function setPayWay(value) {
  111 + const remakeData = payWayDetailBody.map((obj) => {
  112 + return {
  113 + ...obj,
  114 + proportion: value[obj.id - 1]?.proportion,
  115 + payPrice: value[obj.id - 1]?.payPrice,
  116 + };
  117 + });
131 118  
132   - useEffect(() => {
133   - setPayWay(payBody)
134   - }, [payBody])
  119 + setPayWayDetailBody(remakeData);
135 120  
136   - function setCurrtSave(value) {
137   - // console.log(value);
138   - setIsCurrtSave(payWayDetailBody)
  121 + if (thisId !== null) {
  122 + getOther(thisId, remakeData);
139 123 }
  124 + }
  125 + // useEffect(() => {
  126 + // getOther(thisId)
  127 + // }, [thisId])
140 128  
  129 + useEffect(() => {
  130 + setPayWay(payBody);
  131 + }, [payBody]);
141 132  
142   - const columns: ProColumns<DataSourceType>[] = [
143   - {
144   - title: '编号',
145   - dataIndex: 'id',
146   - hideInTable: true,
147   - editable: false
148   - },
149   - {
150   - title: '付款信息',
151   - dataIndex: 'payStep',
152   - editable: false
153   - },
154   - {
155   - title: '付款比例',
156   - dataIndex: 'proportion',
157   - editable: false
158   - },
159   - {
160   - title: '付款金额',
161   - dataIndex: 'payPrice',
162   - editable: false
163   - },
164   - {
165   - title: '对应的订单',
166   - dataIndex: 'ossId',
167   - editable: false,
168   - hideInTable: true,
169   - },
170   - {
171   - title: '付款时间',
172   - dataIndex: 'payDate',
173   - editable: false,
174   - render: (text, record, _, action) => {
175   - const handleChange = (value) => {
176   - const updatedDataSource = payWayDetailBody.map(item => {
177   - if (item.id === record.id) {
178   - return {
179   - ...item,
180   - payDate: value
181   - };
182   - }
183   - return item;
184   - });
185   - // console.log(updatedDataSource);
  133 + // function setCurrtSave(_value) {
  134 + // setIsCurrtSave(payWayDetailBody)
  135 + // }
186 136  
187   - setPayWayDetailBody(updatedDataSource);
188   - currtSave(updatedDataSource)
189   - };
190   -
191   - return (
192   - <span>{new Intl.DateTimeFormat('zh-CN', { year: 'numeric', month: 'long', day: 'numeric' }).format(record.payDate)}</span>
193   - // <ProFormDatePicker
194   - // className='dataChoose'
195   - // initialValue={record.payDate}
196   - // value={record.payDate}
197   - // placeholder={"请填写时间"}
198   - // fieldProps={{
199   - // format: (value) => value.format('YYYY-MM-DD'),
200   - // onChange: handleChange,
201   - // }}
202   - // />
203   - );
204   - }
205   - },
206   - {
207   - title: '付款单回执',
208   - dataIndex: 'fileName',
209   - render: (text, record, _, action) => {
210   - if (isAccept !== record.id) {
211   - if (typeof record.fileUrl === 'object' && record.fileUrl instanceof File) {
212   - return (<a onClick={() => message.error("请先保存")}>{record.fileName}</a>)
213   - } else {
214   - return (<a href={record.fileUrl}>{record.fileName}</a>)
215   - }
216   - } else {
217   - return (
218   - <ProFormUploadButton
219   - name={record.id}
220   - onChange={(value) => {
221   - // console.log(value);
222   - // console.log(payWayDetailBody);
223   - let remakeBody = [];
224   - let remakeBodyItem = {};
225   - payWayDetailBody.forEach(item => {
226   - if (item.id === record.id) {
227   - remakeBodyItem = { ...item, fileUrl: value.file.originFileObj, fileName: value.file.name }
228   - } else {
229   - remakeBodyItem = { ...item }
230   - } if (value.fileList.length == 0) {
231   - remakeBodyItem = { ...item, fileUrl: undefined, fileName: undefined }
232   - }
233   - remakeBody.push(remakeBodyItem)
234   - })
235   - setPayWayDetailBody(remakeBody)
236   - currtSave(remakeBody)
237   - }}
238   - width="md"
239   - max={1} />
240   - )
241   - }
242   - },
  137 + const columns: ProColumns<DataSourceType>[] = [
  138 + {
  139 + title: '编号',
  140 + dataIndex: 'id',
  141 + hideInTable: true,
  142 + editable: false,
  143 + },
  144 + {
  145 + title: '付款信息',
  146 + dataIndex: 'payStep',
  147 + editable: false,
  148 + },
  149 + {
  150 + title: '付款比例',
  151 + dataIndex: 'proportion',
  152 + editable: false,
  153 + },
  154 + {
  155 + title: '付款金额',
  156 + dataIndex: 'payPrice',
  157 + editable: false,
  158 + },
  159 + {
  160 + title: '对应的订单',
  161 + dataIndex: 'ossId',
  162 + editable: false,
  163 + hideInTable: true,
  164 + },
  165 + {
  166 + title: '付款时间',
  167 + dataIndex: 'payDate',
  168 + editable: false,
  169 + render: (_text, record) => {
  170 + return (
  171 + <span>
  172 + {new Intl.DateTimeFormat('zh-CN', {
  173 + year: 'numeric',
  174 + month: 'long',
  175 + day: 'numeric',
  176 + }).format(record.payDate)}
  177 + </span>
  178 + // <ProFormDatePicker
  179 + // className='dataChoose'
  180 + // initialValue={record.payDate}
  181 + // value={record.payDate}
  182 + // placeholder={"请填写时间"}
  183 + // fieldProps={{
  184 + // format: (value) => value.format('YYYY-MM-DD'),
  185 + // onChange: handleChange,
  186 + // }}
  187 + // />
  188 + );
  189 + },
  190 + },
  191 + {
  192 + title: '付款单回执',
  193 + dataIndex: 'fileName',
  194 + render: (_text, record) => {
  195 + if (isAccept !== record.id) {
  196 + if (
  197 + typeof record.fileUrl === 'object' &&
  198 + record.fileUrl instanceof File
  199 + ) {
  200 + return (
  201 + <a onClick={() => message.error('请先保存')}>{record.fileName}</a>
  202 + );
  203 + } else {
  204 + return <a href={record.fileUrl}>{record.fileName}</a>;
  205 + }
  206 + } else {
  207 + return (
  208 + <ProFormUploadButton
  209 + name={record.id}
  210 + onChange={(value) => {
  211 + let remakeBody = [];
  212 + let remakeBodyItem = {};
  213 + payWayDetailBody.forEach((item) => {
  214 + if (item.id === record.id) {
  215 + remakeBodyItem = {
  216 + ...item,
  217 + fileUrl: value.file.originFileObj,
  218 + fileName: value.file.name,
  219 + };
  220 + } else {
  221 + remakeBodyItem = { ...item };
  222 + }
  223 + if (value.fileList.length === 0) {
  224 + remakeBodyItem = {
  225 + ...item,
  226 + fileUrl: undefined,
  227 + fileName: undefined,
  228 + };
  229 + }
  230 + remakeBody.push(remakeBodyItem);
  231 + });
  232 + setPayWayDetailBody(remakeBody);
  233 + currtSave(remakeBody);
  234 + }}
  235 + width="md"
  236 + max={1}
  237 + />
  238 + );
243 239 }
244   - ];
  240 + },
  241 + },
  242 + ];
245 243  
246   - return (
247   - <>
248   - <EditableProTable<DataSourceType>
249   - rowKey="id"
250   - className='payway-detail-index'
251   - toolbar={{ style: { display: 'none' } }}
252   - ghost={true}
253   - scroll={{
254   - x: 960,
255   - }}
256   - recordCreatorProps={
257   - position !== 'hidden'
258   - ? {
259   - position: position as 'top',
260   - record: () => ({ id: (Math.random() * 1000000).toFixed(0) }),
261   - }
262   - : false
263   - }
264   - loading={false}
265   - toolBarRender={() => [
266   - <ProFormRadio.Group
267   - key="render"
268   - fieldProps={{
269   - value: position,
270   - onChange: (e) => setPosition(e.target.value),
271   - }}
272   - />,
273   - ]}
274   - columns={columns}
275   - request={payWayDetailBody}
276   - value={payWayDetailBody}
277   - onChange={() => {
278   - setPayWayDetailBody;
279   - setCurrtSave(payWayDetailBody)
280   - }}
281   - editable={{
282   - type: 'multiple',
283   - editableKeys,
284   - onSave: async (rowKey, data, row) => {
285   - // console.log(rowKey, data, row);
286   - await waitTime(2000);
287   - },
288   - onChange: setEditableRowKeys,
289   - }}
290   - />
291   - </>
292   - );
293   -};
294 244 \ No newline at end of file
  245 + return (
  246 + <>
  247 + <EditableProTable<DataSourceType>
  248 + rowKey="id"
  249 + className="payway-detail-index"
  250 + toolbar={{ style: { display: 'none' } }}
  251 + ghost={true}
  252 + scroll={{
  253 + x: 960,
  254 + }}
  255 + recordCreatorProps={
  256 + position !== 'hidden'
  257 + ? {
  258 + position: position as 'top',
  259 + record: () => ({ id: (Math.random() * 1000000).toFixed(0) }),
  260 + }
  261 + : false
  262 + }
  263 + loading={false}
  264 + toolBarRender={() => [
  265 + <ProFormRadio.Group
  266 + key="render"
  267 + fieldProps={{
  268 + value: position,
  269 + onChange: (e) => setPosition(e.target.value),
  270 + }}
  271 + />,
  272 + ]}
  273 + columns={columns}
  274 + request={payWayDetailBody}
  275 + value={payWayDetailBody}
  276 + onChange={(value) => {
  277 + setPayWayDetailBody(value);
  278 + // setCurrtSave(payWayDetailBody)
  279 + }}
  280 + editable={{
  281 + type: 'multiple',
  282 + editableKeys,
  283 + onSave: async () => {
  284 + await waitTime(2000);
  285 + },
  286 + onChange: setEditableRowKeys,
  287 + }}
  288 + />
  289 + </>
  290 + );
  291 +};
... ...
src/pages/Instalment/components/read/readProduct.tsx
  View file @d5cb3ed
1 1 import type { ProColumns } from '@ant-design/pro-components';
2   -import {
3   - EditableProTable,
4   - ProCard,
5   - ProFormField,
6   - ProFormRadio,
7   -} from '@ant-design/pro-components';
8   -import React, { useEffect, useState } from 'react';
9   -import { countBy } from 'lodash';
  2 +import { EditableProTable, ProFormRadio } from '@ant-design/pro-components';
10 3 import { Form } from 'antd';
  4 +import React, { useEffect, useState } from 'react';
11 5  
12 6 const waitTime = (time: number = 100) => {
13   - return new Promise((resolve) => {
14   - setTimeout(() => {
15   - resolve(true);
16   - }, time);
17   - });
18   -};
19   -
20   -type DataSourceType = {
21   - count?: number;
22   - id: React.Key;
23   - deviceModel?: string;
24   - deviceName?: string;
25   - price?: number;
26   - unitPrice?: number;
  7 + return new Promise((resolve) => {
  8 + setTimeout(() => {
  9 + resolve(true);
  10 + }, time);
  11 + });
27 12 };
28 13  
29   -const defaultData: DataSourceType[] = [
30   - // {
31   - // id:1,
32   - // deviceName: '高低温试验箱',
33   - // deviceModel: 'CAN-TES36-0049ST',
34   - // count: 1,
35   - // unitPrice: 24500,
36   - // price: 24500,
37   - // }
38   -];
  14 +// type DataSourceType = {
  15 +// count?: number;
  16 +// id: React.Key;
  17 +// deviceModel?: string;
  18 +// deviceName?: string;
  19 +// price?: number;
  20 +// unitPrice?: number;
  21 +// };
39 22  
40 23 export default ({ productBody, EditProductBody }) => {
41   - const [editableKeys, setEditableRowKeys] = useState<React.Key[]>([]);
42   - const [dataSource, setDataSource] = useState<readonly DataSourceType[]>([]);
43   - const [form] = Form.useForm<{ name: string; company: string }>();
44   - const [position, setPosition] = useState<'top' | 'bottom' | 'hidden'>(
45   - 'hidden',
46   - );
47   - function getDataSourece() {
48   - if (productBody.length != 0) {
49   - setDataSource(productBody)
50   - }
  24 + const [editableKeys, setEditableRowKeys] = useState<React.Key[]>([]);
  25 + const [dataSource, setDataSource] = useState<readonly DataSourceType[]>([]);
  26 + const [form] = Form.useForm<{ name: string; company: string }>();
  27 + const [position, setPosition] = useState<'top' | 'bottom' | 'hidden'>(
  28 + 'hidden',
  29 + );
  30 + function getDataSourece() {
  31 + if (productBody.length !== 0) {
  32 + setDataSource(productBody);
51 33 }
52   - function setEditProductBody(value) {
53   - // console.log(value);
54   - // console.log(dataSource);
55   -
56   - const modifiedArray = value.map(obj => {
57   - if (obj.dId && Number(obj.dId) <= 1000) {
58   - return {
59   - ...obj,
60   - count: obj.count,
61   - dId: null,
62   - deviceModel: obj.deviceModel,
63   - deviceName: obj.deviceName,
64   - price: obj.price,
65   - unitPrice: obj.unitPrice
66   - };
67   - } else {
68   - return obj;
69   - }
70   - });
71   - // console.log(modifiedArray);
  34 + }
  35 + function setEditProductBody(value) {
  36 + const modifiedArray = value.map((obj) => {
  37 + if (obj.dId && Number(obj.dId) <= 1000) {
  38 + return {
  39 + ...obj,
  40 + count: obj.count,
  41 + dId: null,
  42 + deviceModel: obj.deviceModel,
  43 + deviceName: obj.deviceName,
  44 + price: obj.price,
  45 + unitPrice: obj.unitPrice,
  46 + };
  47 + } else {
  48 + return obj;
  49 + }
  50 + });
72 51  
73   - EditProductBody(modifiedArray)
74   - setDataSource(value)
75   - }
  52 + EditProductBody(modifiedArray);
  53 + setDataSource(value);
  54 + }
76 55  
77   - useEffect(() => {
78   - getDataSourece()
79   - }, [productBody])
  56 + useEffect(() => {
  57 + getDataSourece();
  58 + }, [productBody]);
80 59  
81   - type DataSourceType = {
82   - id: React.Key,
83   - count: number,
84   - dId?: number,
85   - deviceModel: string,
86   - deviceName: string,
87   - price: number
88   - unitPrice: number,
89   - // logicDelete:1
90   - }
  60 + type DataSourceType = {
  61 + id: React.Key;
  62 + count: number;
  63 + dId?: number;
  64 + deviceModel: string;
  65 + deviceName: string;
  66 + price: number;
  67 + unitPrice: number;
  68 + };
91 69  
  70 + const columns: ProColumns<DataSourceType>[] = [
  71 + {
  72 + title: '设备编号',
  73 + dataIndex: 'dId',
  74 + hideInTable: true,
  75 + },
  76 + {
  77 + title: '设备名称',
  78 + dataIndex: 'deviceName',
  79 + formItemProps: () => {
  80 + return {
  81 + rules: [{ required: true, message: '此项为必填项' }],
  82 + };
  83 + },
  84 + },
  85 + {
  86 + title: '设备型号',
  87 + dataIndex: 'deviceModel',
  88 + width: '15%',
  89 + formItemProps: () => {
  90 + return {
  91 + rules: [{ required: true, message: '此项为必填项' }],
  92 + };
  93 + },
  94 + },
  95 + {
  96 + title: '数量',
  97 + dataIndex: 'count',
  98 + onChange: (e) => {
  99 + const unitPrice = form.getFieldValue(`data[${rowIndex}].unitPrice`);
  100 + form.setFieldsValue({
  101 + [`data[${rowIndex}].price`]: e * unitPrice,
  102 + });
  103 + },
  104 + formItemProps: () => {
  105 + return {
  106 + rules: [{ required: true, message: '此项为必填项' }],
  107 + };
  108 + },
  109 + },
  110 + {
  111 + title: '单价',
  112 + dataIndex: 'unitPrice',
  113 + formItemProps: () => {
  114 + return {
  115 + rules: [{ required: true, message: '此项为必填项' }],
  116 + };
  117 + },
  118 + },
  119 + {
  120 + title: '总价',
  121 + dataIndex: 'price',
  122 + formItemProps: () => {
  123 + return {
  124 + rules: [{ required: true, message: '此项为必填项' }],
  125 + };
  126 + },
  127 + },
  128 + ];
92 129  
93   - const columns: ProColumns<DataSourceType>[] = [
94   - {
95   - title: '设备编号',
96   - dataIndex: 'dId',
97   - hideInTable: true,
98   - },
99   - {
100   - title: '设备名称',
101   - dataIndex: 'deviceName',
102   - formItemProps: (form, { rowIndex }) => {
103   - return {
104   - rules:
105   - [{ required: true, message: '此项为必填项' }]
106   - };
107   - }
108   - },
109   - {
110   - title: '设备型号',
111   - dataIndex: 'deviceModel',
112   - width: '15%',
113   - formItemProps: (form, { rowIndex }) => {
114   - return {
115   - rules:
116   - [{ required: true, message: '此项为必填项' }]
117   - };
118   - }
119   - },
120   - {
121   - title: '数量',
122   - dataIndex: 'count',
123   - onChange: (e) => {
124   - // console.log(e);
125   - const unitPrice = form.getFieldValue(`data[${rowIndex}].unitPrice`);
126   - form.setFieldsValue({
127   - [`data[${rowIndex}].price`]: e * unitPrice
128   - });
129   - },
130   - formItemProps: (form, { rowIndex }) => {
131   - return {
132   - rules:
133   - [{ required: true, message: '此项为必填项' }]
134   - };
135   - }
136   - },
137   - {
138   - title: '单价',
139   - dataIndex: 'unitPrice',
140   - formItemProps: (form, { rowIndex }) => {
141   - return {
142   - rules:
143   - [{ required: true, message: '此项为必填项' }]
144   - };
145   - }
146   - },
147   - {
148   - title: '总价',
149   - dataIndex: 'price',
150   - formItemProps: (form, { rowIndex }) => {
151   - return {
152   - rules:
153   - [{ required: true, message: '此项为必填项' }]
154   - };
155   - }
  130 + return (
  131 + <>
  132 + <EditableProTable<DataSourceType>
  133 + className="product-detail-index"
  134 + rowKey="dId"
  135 + toolbar={{ style: { display: 'none' } }}
  136 + ghost={true}
  137 + scroll={{
  138 + x: 960,
  139 + }}
  140 + recordCreatorProps={
  141 + position !== 'hidden'
  142 + ? {
  143 + position: position as 'top',
  144 + record: () => ({ dId: (Math.random() * 1000).toFixed(0) }),
  145 + }
  146 + : false
156 147 }
157   - ];
158   -
159   - return (
160   - <>
161   - <EditableProTable<DataSourceType>
162   - className='product-detail-index'
163   - rowKey="dId"
164   - toolbar={{ style: { display: 'none' } }}
165   - ghost={true}
166   - scroll={{
167   - x: 960,
168   - }}
169   - recordCreatorProps={
170   - position !== 'hidden'
171   - ? {
172   - position: position as 'top',
173   - record: () => ({ dId: (Math.random() * 1000).toFixed(0) }),
174   - }
175   - : false
176   - }
177   - loading={false}
178   - toolBarRender={() => [
179   - <ProFormRadio.Group
180   - key="render"
181   - fieldProps={{
182   - value: position,
183   - onChange: (e) => setPosition(e.target.value),
184   - }}
185   - />,
186   - ]}
187   - columns={columns}
188   - request={dataSource}
189   - value={dataSource}
190   - onChange={setEditProductBody}
191   - editable={{
192   - type: 'multiple',
193   - editableKeys,
194   - onSave: async (rowKey, data, row) => {
195   - await waitTime(500);
196   - },
197   - onChange: setEditableRowKeys,
198   - }}
199   - />
200   - </>
201   - );
202   -};
203 148 \ No newline at end of file
  149 + loading={false}
  150 + toolBarRender={() => [
  151 + <ProFormRadio.Group
  152 + key="render"
  153 + fieldProps={{
  154 + value: position,
  155 + onChange: (e) => setPosition(e.target.value),
  156 + }}
  157 + />,
  158 + ]}
  159 + columns={columns}
  160 + request={dataSource}
  161 + value={dataSource}
  162 + onChange={setEditProductBody}
  163 + editable={{
  164 + type: 'multiple',
  165 + editableKeys,
  166 + onSave: async () => {
  167 + await waitTime(500);
  168 + },
  169 + onChange: setEditableRowKeys,
  170 + }}
  171 + />
  172 + </>
  173 + );
  174 +};
... ...
src/pages/Instalment/components/title/title.tsx
  View file @d5cb3ed
1   -import { deleteOrderErpOrderStagesDelect, getOrderErpOrderStagesExport, getOrderErpOrderStagesListAll, postOrderErpOrderStagesSaveOrUpdate, postOrderErpOrderStagesSearch } from '@/services';
2   -import { EllipsisOutlined, MinusOutlined, PlusOutlined, VerticalAlignBottomOutlined, VerticalAlignTopOutlined } from '@ant-design/icons';
3   -import Icon from '@ant-design/icons/lib/components/AntdIcon';
4   -import type { ActionType, ProColumns, ProFormInstance } from '@ant-design/pro-components';
5   -import { ProTable, TableDropdown } from '@ant-design/pro-components';
6   -import { Button, Dropdown, Modal, Space, Tag, message } from 'antd';
7   -import { ReactNode, useEffect, useRef, useState } from 'react';
8   -import { request } from 'umi';
  1 +import {
  2 + deleteOrderErpOrderStagesDelect,
  3 + getOrderErpOrderStagesListAll,
  4 + postOrderErpOrderStagesSearch,
  5 +} from '@/services';
  6 +import { orderExport } from '@/services/order';
  7 +import { VerticalAlignTopOutlined } from '@ant-design/icons';
  8 +import type { ProColumns } from '@ant-design/pro-components';
  9 +import { ProTable } from '@ant-design/pro-components';
  10 +import { Button, message } from 'antd';
  11 +import { useRef } from 'react';
  12 +import Comfire from '../comfire/comfire';
9 13 import AddModel from '../detail/detail';
10 14 import EditorModel from '../edit/edit';
  15 +import ReadModel from '../read/read';
11 16 import UploadModel from '../upload/uploadModel';
12   -import ReadModel from '../read/read'
13   -import Comfire from '../comfire/comfire';
14   -import { orderExport } from '@/services/order';
15   -import './title.less'
  17 +import './title.less';
16 18 export const waitTimePromise = async (time: number = 100) => {
17   - return new Promise((resolve) => {
18   - setTimeout(() => {
19   - resolve(true);
20   - }, time);
21   - });
  19 + return new Promise((resolve) => {
  20 + setTimeout(() => {
  21 + resolve(true);
  22 + }, time);
  23 + });
22 24 };
23 25  
24 26 export const waitTime = async (time: number = 100) => {
25   - await waitTimePromise(time);
  27 + await waitTimePromise(time);
26 28 };
27 29  
28 30 type OrderStagesItem = {
29   - //文件编号
30   - id?: number;
31   - //合同编号
32   - contract?: string;
33   - //供应商名称
34   - vendor?: string;
35   - //签合同日期
36   - dateRange?: Date;
37   - //终端名称
38   - terminal?: string;
39   - //设备编号
40   - dId?: number;
41   - //设备名称
42   - deviceName?: string;
43   - //设备型号
44   - deviceModel?: string;
45   - //数量
46   - count?: number;
47   - //单价
48   - unitPrice?: number;
49   - //总价
50   - price?: number;
51   - //合同总金额
52   - totalPrice?: number;
53   - //付款方式
54   - payWay?: string;
55   - //附件
56   - annex?: string;
57   - //备注
58   - remark?: string;
  31 + //文件编号
  32 + id?: number;
  33 + //合同编号
  34 + contract?: string;
  35 + //供应商名称
  36 + vendor?: string;
  37 + //签合同日期
  38 + dateRange?: Date;
  39 + //终端名称
  40 + terminal?: string;
  41 + //设备编号
  42 + dId?: number;
  43 + //设备名称
  44 + deviceName?: string;
  45 + //设备型号
  46 + deviceModel?: string;
  47 + //数量
  48 + count?: number;
  49 + //单价
  50 + unitPrice?: number;
  51 + //总价
  52 + price?: number;
  53 + //合同总金额
  54 + totalPrice?: number;
  55 + //付款方式
  56 + payWay?: string;
  57 + //附件
  58 + annex?: string;
  59 + //备注
  60 + remark?: string;
59 61 };
60 62  
61 63 type OrderStagesWithListItem = {
62   - //文件编号
63   - id: number;
64   - //合同编号
65   - contract: string;
66   - //供应商名称
67   - vendor: string;
68   - //签合同日期
69   - dateRange: Date;
70   - //终端名称
71   - terminal: string;
72   - orderStagesDeviceVoList: orderStagesDevice[]
73   - //合同总金额
74   - totalPrice: number;
75   - //付款方式
76   - payWay: string;
77   - //附件
78   - annex: string;
79   - //备注
80   - remark: string;
  64 + //文件编号
  65 + id: number;
  66 + //合同编号
  67 + contract: string;
  68 + //供应商名称
  69 + vendor: string;
  70 + //签合同日期
  71 + dateRange: Date;
  72 + //终端名称
  73 + terminal: string;
  74 + orderStagesDeviceVoList: orderStagesDevice[];
  75 + //合同总金额
  76 + totalPrice: number;
  77 + //付款方式
  78 + payWay: string;
  79 + //附件
  80 + annex: string;
  81 + //备注
  82 + remark: string;
81 83 };
82 84  
83 85 type orderStagesDevice = {
84   - //设备id
85   - dId: number;
86   - //设备名称
87   - deviceName: string;
88   - //设备型号
89   - deviceModel: string;
90   - //数量
91   - count: number;
92   - //单价
93   - unitPrice: number;
94   - //总价
95   - price: number;
96   -}
  86 + //设备id
  87 + dId: number;
  88 + //设备名称
  89 + deviceName: string;
  90 + //设备型号
  91 + deviceModel: string;
  92 + //数量
  93 + count: number;
  94 + //单价
  95 + unitPrice: number;
  96 + //总价
  97 + price: number;
  98 +};
97 99  
98 100 export default () => {
99   - const actionRef = useRef<ActionType>();
100   - const [TableItem, setTableItem] = useState([]);
101   - const [modal1Open, setModal1Open] = useState(false);
102   - // const [currentContract, setCurrentContract] = useState('');
103   -
104   - // const getContract=(contract:string)=>{
105   - // setCurrentContract(contract)
106   - // }
  101 + // const actionRef = useRef<ActionType>();
  102 + // const [TableItem, setTableItem] = useState([]);
107 103  
108   - interface ActionType {
109   - reload: (resetPageIndex?: boolean) => void;
110   - reloadAndRest: () => void;
111   - reset: () => void;
112   - clearSelected?: () => void;
113   - startEditable: (rowKey: Key) => boolean;
114   - cancelEditable: (rowKey: Key) => boolean;
115   - }
  104 + interface ActionType {
  105 + reload: (resetPageIndex?: boolean) => void;
  106 + reloadAndRest: () => void;
  107 + reset: () => void;
  108 + clearSelected?: () => void;
  109 + startEditable: (rowKey: Key) => boolean;
  110 + cancelEditable: (rowKey: Key) => boolean;
  111 + }
116 112  
117   - const ref = useRef<ActionType>(
118   - {
119   - reload: (resetPageIndex?: boolean) => {
120   - // implementation for reload
121   - },
122   - reloadAndRest: () => {
123   - // implementation for reloadAndRest
124   - },
125   - reset: () => {
126   - // implementation for reset
127   - },
128   - startEditable: (rowKey: Key) => {
129   - // implementation for startEditable
130   - },
131   - cancelEditable: (rowKey: Key) => {
132   - // implementation for cancelEditable
133   - },
134   - }
135   - );
  113 + const ref = useRef<ActionType>({
  114 + reload: () => {
  115 + // implementation for reload
  116 + },
  117 + reloadAndRest: () => {
  118 + // implementation for reloadAndRest
  119 + },
  120 + reset: () => {
  121 + // implementation for reset
  122 + },
  123 + startEditable: () => {
  124 + // implementation for startEditable
  125 + },
  126 + cancelEditable: () => {
  127 + // implementation for cancelEditable
  128 + },
  129 + });
136 130  
137   - function reload() {
138   - ref.current.reload();
139   - }
  131 + function reload() {
  132 + ref.current.reload();
  133 + }
140 134  
141   - async function toDelete(value) {
142   - // console.log(value);
143   -
144   - const res = await deleteOrderErpOrderStagesDelect({
145   - data: {
146   - ids: null,
147   - deviceIds: value
148   - }
149   - })
150   - if (res) {
151   - message.success("删除成功")
152   - ref.current.reload()
153   - } else {
154   - message.error("删除失败")
155   - }
  135 + async function toDelete(value) {
  136 + const res = await deleteOrderErpOrderStagesDelect({
  137 + data: {
  138 + ids: null,
  139 + deviceIds: value,
  140 + },
  141 + });
  142 + if (res) {
  143 + message.success('删除成功');
  144 + ref.current.reload();
  145 + } else {
  146 + message.error('删除失败');
156 147 }
  148 + }
157 149  
158   - const exportLoadingDestory = () => {
159   - message.success("导出成功");
160   - };
  150 + const exportLoadingDestory = () => {
  151 + message.success('导出成功');
  152 + };
161 153  
162   - async function toExport() {
163   - // await getOrderErpOrderStagesExport()
164   - orderExport(
165   - '/api/order/erp/orderStages/export',
166   - '分期订单.xlsx',
167   - 'get',
168   - {},
169   - exportLoadingDestory,
170   - );
171   - }
  154 + async function toExport() {
  155 + // await getOrderErpOrderStagesExport()
  156 + orderExport(
  157 + '/api/order/erp/orderStages/export',
  158 + '分期订单.xlsx',
  159 + 'get',
  160 + {},
  161 + exportLoadingDestory,
  162 + );
  163 + }
172 164  
  165 + const columns: ProColumns<OrderStagesItem>[] = [
  166 + {
  167 + title: '文件编号',
  168 + dataIndex: 'id',
  169 + width: '7%',
  170 + render: (_, record) => {
  171 + if (record.id) {
  172 + const text = record.id.toString();
  173 + const paddedText = '0'.repeat(4 - text.length) + text;
  174 + return paddedText;
  175 + }
  176 + },
  177 + },
  178 + {
  179 + title: '签合同日期',
  180 + dataIndex: 'dateRange',
  181 + valueType: 'date',
  182 + filters: true,
  183 + onFilter: true,
  184 + ellipsis: true,
  185 + width: '8%',
  186 + },
  187 + {
  188 + disable: true,
  189 + title: '合同编号',
  190 + dataIndex: 'contract',
  191 + filters: true,
  192 + onFilter: true,
  193 + ellipsis: true,
  194 + width: '9%',
  195 + },
  196 + {
  197 + disable: true,
  198 + title: '供应商名称',
  199 + dataIndex: 'vendor',
  200 + filters: true,
  201 + onFilter: true,
  202 + ellipsis: true,
  203 + },
  204 + {
  205 + disable: true,
  206 + title: '终端名称',
  207 + dataIndex: 'terminal',
  208 + filters: true,
  209 + onFilter: true,
  210 + ellipsis: true,
  211 + width: '6%',
  212 + },
  213 + {
  214 + disable: true,
  215 + title: '设备名称',
  216 + dataIndex: 'deviceName',
  217 + filters: true,
  218 + onFilter: true,
  219 + ellipsis: true,
  220 + },
  221 + {
  222 + disable: true,
  223 + title: '设备型号',
  224 + dataIndex: 'deviceModel',
  225 + filters: true,
  226 + hideInSearch: true,
  227 + onFilter: false,
  228 + ellipsis: true,
  229 + width: '10%',
  230 + },
  231 + {
  232 + disable: true,
  233 + title: '数量',
  234 + dataIndex: 'count',
  235 + filters: true,
  236 + hideInSearch: true,
  237 + onFilter: false,
  238 + ellipsis: true,
  239 + width: '4%',
  240 + },
  241 + {
  242 + disable: true,
  243 + title: '单价',
  244 + dataIndex: 'unitPrice',
  245 + filters: true,
  246 + hideInSearch: true,
  247 + onFilter: false,
  248 + ellipsis: true,
  249 + width: '5%',
  250 + },
  251 + {
  252 + disable: true,
  253 + title: '总价',
  254 + dataIndex: 'price',
  255 + filters: true,
  256 + hideInSearch: true,
  257 + onFilter: false,
  258 + ellipsis: true,
  259 + width: '5%',
  260 + },
  261 + {
  262 + disable: true,
  263 + title: '合同总金额',
  264 + dataIndex: 'totalPrice',
  265 + filters: true,
  266 + hideInSearch: true,
  267 + onFilter: false,
  268 + ellipsis: true,
  269 + width: '6%',
  270 + },
  271 + {
  272 + disable: true,
  273 + title: '付款方式',
  274 + dataIndex: 'payWay',
  275 + filters: true,
  276 + hideInSearch: true,
  277 + onFilter: false,
  278 + ellipsis: true,
  279 + },
  280 + {
  281 + disable: true,
  282 + title: '附件',
  283 + dataIndex: 'annex',
  284 + filters: true,
  285 + hideInSearch: true,
  286 + onFilter: false,
  287 + ellipsis: true,
  288 + width: '5%',
  289 + render: (_, record) => {
  290 + if (record.id) {
  291 + return <a href={record.annex}>{record.annex}</a>;
  292 + }
  293 + },
  294 + },
  295 + {
  296 + disable: true,
  297 + title: '备注',
  298 + dataIndex: 'remark',
  299 + filters: true,
  300 + hideInSearch: true,
  301 + onFilter: false,
  302 + ellipsis: true,
  303 + width: '5%',
  304 + },
  305 + {
  306 + title: '操作',
  307 + valueType: 'option',
  308 + key: 'option',
  309 + width: '10%',
  310 + render: (_text, record) => {
  311 + if (record?.id) {
  312 + return (
  313 + <>
  314 + <ReadModel currentContract={record.contract}></ReadModel>
  315 + &nbsp;
  316 + <EditorModel
  317 + currentContract={record.contract}
  318 + toReload={reload}
  319 + ></EditorModel>
  320 + &nbsp;
  321 + {/* <a key="delect" target="_blank" rel="noopener noreferrer" onClick={() => { toDelete([record.dId]) }}>
  322 + 删除
  323 + </a> */}
  324 + <Comfire currtDid={record.dId} sureDelete={toDelete}></Comfire>
  325 + </>
  326 + );
  327 + }
  328 + return null;
  329 + },
  330 + },
  331 + ];
173 332  
174   - const columns: ProColumns<OrderStagesItem>[] = [
175   - {
176   - title: '文件编号',
177   - dataIndex: 'id',
178   - width: '7%',
179   - render: (_, record) => {
180   - if (record.id) {
181   - const text = record.id.toString();
182   - const paddedText = '0'.repeat(4 - text.length) + text;
183   - return paddedText;
  333 + return (
  334 + <ProTable<OrderStagesItem>
  335 + className="title-index"
  336 + columnEmptyText=""
  337 + columns={columns}
  338 + actionRef={ref}
  339 + cardBordered
  340 + request={async (params) => {
  341 + // console.log(params);
  342 + if (
  343 + params.id !== null ||
  344 + params.contract !== null ||
  345 + params.vendor !== null ||
  346 + params.terminal !== null ||
  347 + params.deviceName !== null ||
  348 + params.dateRange !== null
  349 + ) {
  350 + // console.log(params.id);
  351 + // console.log(params.contract);
  352 + // console.log(params.vendor);
  353 + let PostOrderErpOrderStagesSearchOption = {
  354 + id: params.id,
  355 + contract: params.contract,
  356 + vendor: params.vendor,
  357 + terminal: params.terminal,
  358 + deviceName: params.deviceName,
  359 + dateRange: params.dateRange,
  360 + };
  361 + let res = await postOrderErpOrderStagesSearch({
  362 + data: { ...PostOrderErpOrderStagesSearchOption },
  363 + });
  364 + await waitTime(2000);
  365 + if (res) {
  366 + // setTableItem(res.data)
  367 + const orderStagesWithList: OrderStagesWithListItem[] = res?.data;
  368 + let orderStagesList: OrderStagesItem[] = [];
  369 + for (let ind = 0; ind < orderStagesWithList.length; ind++) {
  370 + for (
  371 + let index = 0;
  372 + index < orderStagesWithList[ind].orderStagesDeviceVoList.length;
  373 + index++
  374 + ) {
  375 + let item: OrderStagesItem = {
  376 + id: undefined,
  377 + contract: undefined,
  378 + vendor: undefined,
  379 + dateRange: undefined,
  380 + terminal: undefined,
  381 + dId: undefined,
  382 + deviceName: undefined,
  383 + deviceModel: undefined,
  384 + count: undefined,
  385 + unitPrice: undefined,
  386 + price: undefined,
  387 + totalPrice: undefined,
  388 + payWay: undefined,
  389 + annex: undefined,
  390 + remark: undefined,
  391 + };
  392 + if (index === 0) {
  393 + item.id = orderStagesWithList[ind].id;
  394 + item.contract = orderStagesWithList[ind].contract;
  395 + item.vendor = orderStagesWithList[ind].vendor;
  396 + item.dateRange = orderStagesWithList[ind].dateRange;
  397 + item.terminal = orderStagesWithList[ind].terminal;
  398 + item.dId =
  399 + orderStagesWithList[ind].orderStagesDeviceVoList[index].dId;
  400 + item.deviceName =
  401 + orderStagesWithList[ind].orderStagesDeviceVoList[
  402 + index
  403 + ].deviceName;
  404 + item.deviceModel =
  405 + orderStagesWithList[ind].orderStagesDeviceVoList[
  406 + index
  407 + ].deviceModel;
  408 + item.count =
  409 + orderStagesWithList[ind].orderStagesDeviceVoList[
  410 + index
  411 + ].count;
  412 + item.unitPrice =
  413 + orderStagesWithList[ind].orderStagesDeviceVoList[
  414 + index
  415 + ].unitPrice;
  416 + item.price =
  417 + orderStagesWithList[ind].orderStagesDeviceVoList[
  418 + index
  419 + ].price;
  420 + item.totalPrice = orderStagesWithList[ind].totalPrice;
  421 + item.payWay = orderStagesWithList[ind].payWay;
  422 + item.annex = orderStagesWithList[ind].annex;
  423 + item.remark = orderStagesWithList[ind].remark;
  424 + orderStagesList.push(item);
  425 + } else {
  426 + item.id = orderStagesWithList[ind].id;
  427 + item.contract = orderStagesWithList[ind].contract;
  428 + item.vendor = orderStagesWithList[ind].vendor;
  429 + item.dateRange = orderStagesWithList[ind].dateRange;
  430 + item.terminal = orderStagesWithList[ind].terminal;
  431 + item.dId =
  432 + orderStagesWithList[ind].orderStagesDeviceVoList[index].dId;
  433 + item.deviceName =
  434 + orderStagesWithList[ind].orderStagesDeviceVoList[
  435 + index
  436 + ].deviceName;
  437 + item.deviceModel =
  438 + orderStagesWithList[ind].orderStagesDeviceVoList[
  439 + index
  440 + ].deviceModel;
  441 + item.count =
  442 + orderStagesWithList[ind].orderStagesDeviceVoList[
  443 + index
  444 + ].count;
  445 + item.unitPrice =
  446 + orderStagesWithList[ind].orderStagesDeviceVoList[
  447 + index
  448 + ].unitPrice;
  449 + item.price =
  450 + orderStagesWithList[ind].orderStagesDeviceVoList[
  451 + index
  452 + ].price;
  453 + item.totalPrice = orderStagesWithList[ind].totalPrice;
  454 + item.payWay = orderStagesWithList[ind].payWay;
  455 + item.annex = orderStagesWithList[ind].annex;
  456 + item.remark = orderStagesWithList[ind].remark;
  457 + orderStagesList.push(item);
184 458 }
185   - },
186   - },
187   - {
188   - title: '签合同日期',
189   - dataIndex: 'dateRange',
190   - valueType: 'date',
191   - filters: true,
192   - onFilter: true,
193   - ellipsis: true,
194   - width: '8%'
195   - },
196   - {
197   - disable: true,
198   - title: '合同编号',
199   - dataIndex: 'contract',
200   - filters: true,
201   - onFilter: true,
202   - ellipsis: true,
203   - width: '9%'
204   - },
205   - {
206   - disable: true,
207   - title: '供应商名称',
208   - dataIndex: 'vendor',
209   - filters: true,
210   - onFilter: true,
211   - ellipsis: true,
212   - },
213   - {
214   - disable: true,
215   - title: '终端名称',
216   - dataIndex: 'terminal',
217   - filters: true,
218   - onFilter: true,
219   - ellipsis: true,
220   - width: '6%'
221   - },
222   - {
223   - disable: true,
224   - title: '设备名称',
225   - dataIndex: 'deviceName',
226   - filters: true,
227   - onFilter: true,
228   - ellipsis: true,
229   - },
230   - {
231   - disable: true,
232   - title: '设备型号',
233   - dataIndex: 'deviceModel',
234   - filters: true,
235   - hideInSearch: true,
236   - onFilter: false,
237   - ellipsis: true,
238   - width: '10%'
239   - },
240   - {
241   - disable: true,
242   - title: '数量',
243   - dataIndex: 'count',
244   - filters: true,
245   - hideInSearch: true,
246   - onFilter: false,
247   - ellipsis: true,
248   - width: '4%'
249   - },
250   - {
251   - disable: true,
252   - title: '单价',
253   - dataIndex: 'unitPrice',
254   - filters: true,
255   - hideInSearch: true,
256   - onFilter: false,
257   - ellipsis: true,
258   - width: '5%'
259   - },
260   - {
261   - disable: true,
262   - title: '总价',
263   - dataIndex: 'price',
264   - filters: true,
265   - hideInSearch: true,
266   - onFilter: false,
267   - ellipsis: true,
268   - width: '5%'
269   - },
270   - {
271   - disable: true,
272   - title: '合同总金额',
273   - dataIndex: 'totalPrice',
274   - filters: true,
275   - hideInSearch: true,
276   - onFilter: false,
277   - ellipsis: true,
278   - width: '6%'
279   - },
280   - {
281   - disable: true,
282   - title: '付款方式',
283   - dataIndex: 'payWay',
284   - filters: true,
285   - hideInSearch: true,
286   - onFilter: false,
287   - ellipsis: true,
288   - },
289   - {
290   - disable: true,
291   - title: '附件',
292   - dataIndex: 'annex',
293   - filters: true,
294   - hideInSearch: true,
295   - onFilter: false,
296   - ellipsis: true,
297   - width: '5%',
298   - render: (_, record) => {
299   - if (record.id) {
300   - return <a href={record.annex}>{record.annex}</a>;
  459 + }
  460 + }
  461 + return {
  462 + data: orderStagesList || [],
  463 + };
  464 + }
  465 + } else {
  466 + let res = await getOrderErpOrderStagesListAll();
  467 + await waitTime(2000);
  468 + if (res) {
  469 + // setTableItem(res.data)
  470 + const orderStagesWithList: OrderStagesWithListItem[] = res?.data;
  471 + let orderStagesList: OrderStagesItem[] = [];
  472 + for (let ind = 0; ind < orderStagesWithList.length; ind++) {
  473 + for (
  474 + let index = 0;
  475 + index < orderStagesWithList[ind].orderStagesDeviceVoList.length;
  476 + index++
  477 + ) {
  478 + let item: OrderStagesItem = {
  479 + id: undefined,
  480 + contract: undefined,
  481 + vendor: undefined,
  482 + dateRange: undefined,
  483 + terminal: undefined,
  484 + dId: undefined,
  485 + deviceName: undefined,
  486 + deviceModel: undefined,
  487 + count: undefined,
  488 + unitPrice: undefined,
  489 + price: undefined,
  490 + totalPrice: undefined,
  491 + payWay: undefined,
  492 + annex: undefined,
  493 + remark: undefined,
  494 + };
  495 + if (index === 0) {
  496 + item.id = orderStagesWithList[ind].id;
  497 + item.contract = orderStagesWithList[ind].contract;
  498 + item.vendor = orderStagesWithList[ind].vendor;
  499 + item.dateRange = orderStagesWithList[ind].dateRange;
  500 + item.terminal = orderStagesWithList[ind].terminal;
  501 + item.dId =
  502 + orderStagesWithList[ind].orderStagesDeviceVoList[index].dId;
  503 + item.deviceName =
  504 + orderStagesWithList[ind].orderStagesDeviceVoList[
  505 + index
  506 + ].deviceName;
  507 + item.deviceModel =
  508 + orderStagesWithList[ind].orderStagesDeviceVoList[
  509 + index
  510 + ].deviceModel;
  511 + item.count =
  512 + orderStagesWithList[ind].orderStagesDeviceVoList[
  513 + index
  514 + ].count;
  515 + item.unitPrice =
  516 + orderStagesWithList[ind].orderStagesDeviceVoList[
  517 + index
  518 + ].unitPrice;
  519 + item.price =
  520 + orderStagesWithList[ind].orderStagesDeviceVoList[
  521 + index
  522 + ].price;
  523 + item.totalPrice = orderStagesWithList[ind].totalPrice;
  524 + item.payWay = orderStagesWithList[ind].payWay;
  525 + item.annex = orderStagesWithList[ind].annex;
  526 + item.remark = orderStagesWithList[ind].remark;
  527 + orderStagesList.push(item);
  528 + } else {
  529 + item.id = orderStagesWithList[ind].id;
  530 + item.contract = orderStagesWithList[ind].contract;
  531 + item.vendor = orderStagesWithList[ind].vendor;
  532 + item.dateRange = orderStagesWithList[ind].dateRange;
  533 + item.terminal = orderStagesWithList[ind].terminal;
  534 + item.dId =
  535 + orderStagesWithList[ind].orderStagesDeviceVoList[index].dId;
  536 + item.deviceName =
  537 + orderStagesWithList[ind].orderStagesDeviceVoList[
  538 + index
  539 + ].deviceName;
  540 + item.deviceModel =
  541 + orderStagesWithList[ind].orderStagesDeviceVoList[
  542 + index
  543 + ].deviceModel;
  544 + item.count =
  545 + orderStagesWithList[ind].orderStagesDeviceVoList[
  546 + index
  547 + ].count;
  548 + item.unitPrice =
  549 + orderStagesWithList[ind].orderStagesDeviceVoList[
  550 + index
  551 + ].unitPrice;
  552 + item.price =
  553 + orderStagesWithList[ind].orderStagesDeviceVoList[
  554 + index
  555 + ].price;
  556 + item.totalPrice = orderStagesWithList[ind].totalPrice;
  557 + item.payWay = orderStagesWithList[ind].payWay;
  558 + item.annex = orderStagesWithList[ind].annex;
  559 + item.remark = orderStagesWithList[ind].remark;
  560 + orderStagesList.push(item);
301 561 }
302   - },
  562 + }
  563 + }
  564 + return {
  565 + data: orderStagesList || [],
  566 + };
  567 + }
  568 + }
  569 + }}
  570 + editable={{
  571 + type: 'multiple',
  572 + }}
  573 + columnsState={{
  574 + persistenceKey: 'pro-table-singe-demos',
  575 + persistenceType: 'localStorage',
  576 + defaultValue: {
  577 + option: { fixed: 'right', disable: true },
303 578 },
304   - {
305   - disable: true,
306   - title: '备注',
307   - dataIndex: 'remark',
308   - filters: true,
309   - hideInSearch: true,
310   - onFilter: false,
311   - ellipsis: true,
312   - width: '5%',
  579 + // onChange(value) {
  580 + // console.log('value: ', value);
  581 + // },
  582 + }}
  583 + rowKey="dId"
  584 + search={{
  585 + labelWidth: 'auto',
  586 + }}
  587 + options={{
  588 + setting: {
  589 + listsHeight: 800,
313 590 },
314   - {
315   - title: '操作',
316   - valueType: 'option',
317   - key: 'option',
318   - width: '10%',
319   - render: (text, record, _, action) => {
320   - if (record?.id) {
321   - return (
322   - <>
323   - <ReadModel currentContract={record.contract}></ReadModel>
324   - &nbsp;
325   - <EditorModel currentContract={record.contract} toReload={reload}></EditorModel>
326   - &nbsp;
327   - {/* <a key="delect" target="_blank" rel="noopener noreferrer" onClick={() => { toDelete([record.dId]) }}>
328   - 删除
329   - </a> */}
330   - <Comfire currtDid={record.dId} sureDelete={ toDelete }></Comfire>
331   - </>
332   - )
333   - }
334   - return null;
335   - },
  591 + }}
  592 + form={{
  593 + syncToUrl: (values, type) => {
  594 + if (type === 'get') {
  595 + return {
  596 + ...values,
  597 + created_at: [values.startTime, values.endTime],
  598 + };
  599 + }
  600 + return values;
336 601 },
337   - ];
338   -
339   - return (
340   - <ProTable<OrderStagesItem>
341   - className='title-index'
342   - columnEmptyText=''
343   - columns={columns}
344   - actionRef={ref}
345   - cardBordered
346   - request={async (params, sort, filter) => {
347   - // console.log(params);
348   - if (params.id != null || params.contract != null || params.vendor != null || params.terminal != null || params.deviceName != null || params.dateRange != null) {
349   - // console.log(params.id);
350   - // console.log(params.contract);
351   - // console.log(params.vendor);
352   - let PostOrderErpOrderStagesSearchOption = {
353   - id: params.id,
354   - contract: params.contract,
355   - vendor: params.vendor,
356   - terminal: params.terminal,
357   - deviceName: params.deviceName,
358   - dateRange: params.dateRange
359   - }
360   - let res = await postOrderErpOrderStagesSearch({
361   - data: { ...PostOrderErpOrderStagesSearchOption }
362   - })
363   - await waitTime(2000);
364   - if (res) {
365   - setTableItem(res.data)
366   - const orderStagesWithList: OrderStagesWithListItem[] = res?.data
367   - let orderStagesList: OrderStagesItem[] = []
368   - for (let ind = 0; ind < orderStagesWithList.length; ind++) {
369   - for (let index = 0; index < orderStagesWithList[ind].orderStagesDeviceVoList.length; index++) {
370   - let item: OrderStagesItem = {
371   - id: undefined,
372   - contract: undefined,
373   - vendor: undefined,
374   - dateRange: undefined,
375   - terminal: undefined,
376   - dId: undefined,
377   - deviceName: undefined,
378   - deviceModel: undefined,
379   - count: undefined,
380   - unitPrice: undefined,
381   - price: undefined,
382   - totalPrice: undefined,
383   - payWay: undefined,
384   - annex: undefined,
385   - remark: undefined
386   - };
387   - if (index == 0) {
388   - orderStagesWithList[ind].orderStagesDeviceVoList[index];
389   - item.id = orderStagesWithList[ind].id;
390   - item.contract = orderStagesWithList[ind].contract;
391   - item.vendor = orderStagesWithList[ind].vendor;
392   - item.dateRange = orderStagesWithList[ind].dateRange;
393   - item.terminal = orderStagesWithList[ind].terminal;
394   - item.dId = orderStagesWithList[ind].orderStagesDeviceVoList[index].dId;
395   - item.deviceName = orderStagesWithList[ind].orderStagesDeviceVoList[index].deviceName;
396   - item.deviceModel = orderStagesWithList[ind].orderStagesDeviceVoList[index].deviceModel;
397   - item.count = orderStagesWithList[ind].orderStagesDeviceVoList[index].count;
398   - item.unitPrice = orderStagesWithList[ind].orderStagesDeviceVoList[index].unitPrice;
399   - item.price = orderStagesWithList[ind].orderStagesDeviceVoList[index].price;
400   - item.totalPrice = orderStagesWithList[ind].totalPrice;
401   - item.payWay = orderStagesWithList[ind].payWay;
402   - item.annex = orderStagesWithList[ind].annex;
403   - item.remark = orderStagesWithList[ind].remark;
404   - orderStagesList.push(item);
405   - } else {
406   - item.id = orderStagesWithList[ind].id;
407   - item.contract = orderStagesWithList[ind].contract;
408   - item.vendor = orderStagesWithList[ind].vendor;
409   - item.dateRange = orderStagesWithList[ind].dateRange;
410   - item.terminal = orderStagesWithList[ind].terminal;
411   - item.dId = orderStagesWithList[ind].orderStagesDeviceVoList[index].dId;
412   - item.deviceName = orderStagesWithList[ind].orderStagesDeviceVoList[index].deviceName;
413   - item.deviceModel = orderStagesWithList[ind].orderStagesDeviceVoList[index].deviceModel;
414   - item.count = orderStagesWithList[ind].orderStagesDeviceVoList[index].count;
415   - item.unitPrice = orderStagesWithList[ind].orderStagesDeviceVoList[index].unitPrice;
416   - item.price = orderStagesWithList[ind].orderStagesDeviceVoList[index].price;
417   - item.totalPrice = orderStagesWithList[ind].totalPrice;
418   - item.payWay = orderStagesWithList[ind].payWay;
419   - item.annex = orderStagesWithList[ind].annex;
420   - item.remark = orderStagesWithList[ind].remark;
421   - orderStagesList.push(item);
422   - }
423   - }
424   - }
425   - return {
426   - data: orderStagesList || []
427   - }
428   - }
429   - } else {
430   - let res = await getOrderErpOrderStagesListAll();
431   - await waitTime(2000);
432   - if (res) {
433   - setTableItem(res.data)
434   - const orderStagesWithList: OrderStagesWithListItem[] = res?.data
435   - let orderStagesList: OrderStagesItem[] = []
436   - for (let ind = 0; ind < orderStagesWithList.length; ind++) {
437   - for (let index = 0; index < orderStagesWithList[ind].orderStagesDeviceVoList.length; index++) {
438   - let item: OrderStagesItem = {
439   - id: undefined,
440   - contract: undefined,
441   - vendor: undefined,
442   - dateRange: undefined,
443   - terminal: undefined,
444   - dId: undefined,
445   - deviceName: undefined,
446   - deviceModel: undefined,
447   - count: undefined,
448   - unitPrice: undefined,
449   - price: undefined,
450   - totalPrice: undefined,
451   - payWay: undefined,
452   - annex: undefined,
453   - remark: undefined
454   - };
455   - if (index == 0) {
456   - orderStagesWithList[ind].orderStagesDeviceVoList[index];
457   - item.id = orderStagesWithList[ind].id;
458   - item.contract = orderStagesWithList[ind].contract;
459   - item.vendor = orderStagesWithList[ind].vendor;
460   - item.dateRange = orderStagesWithList[ind].dateRange;
461   - item.terminal = orderStagesWithList[ind].terminal;
462   - item.dId = orderStagesWithList[ind].orderStagesDeviceVoList[index].dId;
463   - item.deviceName = orderStagesWithList[ind].orderStagesDeviceVoList[index].deviceName;
464   - item.deviceModel = orderStagesWithList[ind].orderStagesDeviceVoList[index].deviceModel;
465   - item.count = orderStagesWithList[ind].orderStagesDeviceVoList[index].count;
466   - item.unitPrice = orderStagesWithList[ind].orderStagesDeviceVoList[index].unitPrice;
467   - item.price = orderStagesWithList[ind].orderStagesDeviceVoList[index].price;
468   - item.totalPrice = orderStagesWithList[ind].totalPrice;
469   - item.payWay = orderStagesWithList[ind].payWay;
470   - item.annex = orderStagesWithList[ind].annex;
471   - item.remark = orderStagesWithList[ind].remark;
472   - orderStagesList.push(item);
473   - } else {
474   - item.id = orderStagesWithList[ind].id;
475   - item.contract = orderStagesWithList[ind].contract;
476   - item.vendor = orderStagesWithList[ind].vendor;
477   - item.dateRange = orderStagesWithList[ind].dateRange;
478   - item.terminal = orderStagesWithList[ind].terminal;
479   - item.dId = orderStagesWithList[ind].orderStagesDeviceVoList[index].dId;
480   - item.deviceName = orderStagesWithList[ind].orderStagesDeviceVoList[index].deviceName;
481   - item.deviceModel = orderStagesWithList[ind].orderStagesDeviceVoList[index].deviceModel;
482   - item.count = orderStagesWithList[ind].orderStagesDeviceVoList[index].count;
483   - item.unitPrice = orderStagesWithList[ind].orderStagesDeviceVoList[index].unitPrice;
484   - item.price = orderStagesWithList[ind].orderStagesDeviceVoList[index].price;
485   - item.totalPrice = orderStagesWithList[ind].totalPrice;
486   - item.payWay = orderStagesWithList[ind].payWay;
487   - item.annex = orderStagesWithList[ind].annex;
488   - item.remark = orderStagesWithList[ind].remark;
489   - orderStagesList.push(item);
490   - }
491   - }
492   - }
493   - return {
494   - data: orderStagesList || []
495   - }
496   - }
497   - }
498   - }}
499   - editable={{
500   - type: 'multiple',
501   - }}
502   - columnsState={{
503   - persistenceKey: 'pro-table-singe-demos',
504   - persistenceType: 'localStorage',
505   - defaultValue: {
506   - option: { fixed: 'right', disable: true },
507   - },
508   - // onChange(value) {
509   - // console.log('value: ', value);
510   - // },
  602 + }}
  603 + pagination={{
  604 + pageSize: 10,
  605 + // onChange: (page) => console.log(page),
  606 + }}
  607 + dateFormatter="string"
  608 + headerTitle={[]}
  609 + toolBarRender={() => [
  610 + <>
  611 + <AddModel toReload={reload}></AddModel>
  612 + <UploadModel toReload={reload}></UploadModel>
  613 + <Button
  614 + type="primary"
  615 + onClick={() => {
  616 + toExport();
511 617 }}
512   - rowKey="dId"
513   - search={{
514   - labelWidth: 'auto',
515   - }}
516   - options={{
517   - setting: {
518   - listsHeight: 800,
519   - },
520   - }}
521   - form={{
522   - syncToUrl: (values, type) => {
523   - if (type === 'get') {
524   - return {
525   - ...values,
526   - created_at: [values.startTime, values.endTime],
527   - };
528   - }
529   - return values;
530   - },
531   - }}
532   - pagination={{
533   - pageSize: 10,
534   - // onChange: (page) => console.log(page),
535   - }}
536   - dateFormatter="string"
537   - headerTitle={[
538   -
539   - ]}
540   - toolBarRender={() => [
541   - <>
542   - <AddModel toReload={reload}></AddModel>
543   - <UploadModel toReload={reload}></UploadModel>
544   - <Button type="primary" onClick={() => { toExport() }}>
545   - <VerticalAlignTopOutlined />
546   - 导出
547   - </Button>
548   - </>
549   - ]}
550   - />
551   - );
552   -};
553 618 \ No newline at end of file
  619 + >
  620 + <VerticalAlignTopOutlined />
  621 + 导出
  622 + </Button>
  623 + </>,
  624 + ]}
  625 + />
  626 + );
  627 +};
... ...
src/pages/Instalment/components/upload/uploadApp.tsx
  View file @d5cb3ed
1   -import React from 'react';
2   -import { Upload, message } from 'antd';
3 1 import { InboxOutlined } from '@ant-design/icons';
  2 +import { Upload } from 'antd';
  3 +import React from 'react';
4 4  
5 5 const App: React.FC = ({ uploadFile }) => {
6   - const { Dragger } = Upload;
  6 + const { Dragger } = Upload;
7 7  
8   - const props = {
9   - name: 'file',
10   - multiple: true,
11   - maxCount: 1,
12   - onChange:(info)=> {
13   - // console.log(info.file.originFileObj);
14   - uploadFile(info.file.originFileObj)
15   - },
16   - // onDrop(e) {
17   - // console.log('Dropped files', e.dataTransfer.files);
18   - // },
19   - };
  8 + const props = {
  9 + name: 'file',
  10 + multiple: true,
  11 + maxCount: 1,
  12 + onChange: (info) => {
  13 + uploadFile(info.file.originFileObj);
  14 + },
  15 + };
20 16  
21   - return (
22   - <Dragger {...props}>
23   - <p className="ant-upload-drag-icon">
24   - <InboxOutlined />
25   - </p>
26   - <p className="ant-upload-text">Click or drag file to this area to upload</p>
27   - <p className="ant-upload-hint">
28   - Support for a single or bulk upload. Strictly prohibited from uploading company data or other
29   - banned files.
30   - </p>
31   - </Dragger>
32   - );
  17 + return (
  18 + <Dragger {...props}>
  19 + <p className="ant-upload-drag-icon">
  20 + <InboxOutlined />
  21 + </p>
  22 + <p className="ant-upload-text">
  23 + Click or drag file to this area to upload
  24 + </p>
  25 + <p className="ant-upload-hint">
  26 + Support for a single or bulk upload. Strictly prohibited from uploading
  27 + company data or other banned files.
  28 + </p>
  29 + </Dragger>
  30 + );
33 31 };
34 32  
35   -export default App;
36 33 \ No newline at end of file
  34 +export default App;
... ...
src/pages/Instalment/components/upload/uploadModel.tsx
  View file @d5cb3ed
1   -import { PlusOutlined, VerticalAlignBottomOutlined } from '@ant-design/icons';
2   -import {
3   - ModalForm,
4   - ProForm,
5   - ProFormDateRangePicker,
6   - ProFormSelect,
7   - ProFormText,
8   -} from '@ant-design/pro-components';
9   -import { Button, Form, message } from 'antd';
10   -import App from './uploadApp'
11   -import { useState } from 'react';
12 1 import { postOrderErpOrderStagesImport } from '@/services/request';
  2 +import { VerticalAlignBottomOutlined } from '@ant-design/icons';
  3 +import { ModalForm } from '@ant-design/pro-components';
  4 +import { Button, Form, message } from 'antd';
13 5 import { RcFile } from 'antd/es/upload';
  6 +import { useState } from 'react';
  7 +import App from './uploadApp';
14 8  
15   -const waitTime = (time: number = 100) => {
16   - return new Promise((resolve) => {
17   - setTimeout(() => {
18   - resolve(true);
19   - }, time);
20   - });
21   -};
  9 +// const waitTime = (time: number = 100) => {
  10 +// return new Promise((resolve) => {
  11 +// setTimeout(() => {
  12 +// resolve(true);
  13 +// }, time);
  14 +// });
  15 +// };
22 16  
23   -export default ({toReload}) => {
  17 +export default ({ toReload }) => {
24 18 const [form] = Form.useForm<{ name: string; company: string }>();
25   - const [uploadFile, setUploadFile] = useState({})
26   - function setUploadFileWay(value) {
27   - // console.log(value);
28   - setUploadFile(value)
29   - }
  19 + const [uploadFile, setUploadFile] = useState({});
  20 + // function setUploadFileWay(value) {
  21 + // setUploadFile(value)
  22 + // }
30 23 return (
31 24 <ModalForm<{
32 25 name: string;
... ... @@ -43,21 +36,21 @@ export default ({toReload}) =&gt; {
43 36 autoFocusFirstInput
44 37 modalProps={{
45 38 destroyOnClose: true,
46   - // onCancel: () => console.log('run'),
47 39 }}
48 40 submitTimeout={2000}
49   - onFinish={async (values) => {
  41 + onFinish={async () => {
50 42 const formData = new FormData();
51 43 formData.append('file', uploadFile as RcFile);
52 44 const res = await postOrderErpOrderStagesImport({
53 45 data: formData,
54 46 headers: {
55   - 'Content-Type': 'multipart/form-data; boundary=----WebKitFormBoundarynl6gT1BKdPWIejNq',
56   - }
  47 + 'Content-Type':
  48 + 'multipart/form-data; boundary=----WebKitFormBoundarynl6gT1BKdPWIejNq',
  49 + },
57 50 });
58 51 if (res) {
59 52 message.success('提交成功');
60   - toReload()
  53 + toReload();
61 54 return true;
62 55 }
63 56 }}
... ... @@ -65,4 +58,4 @@ export default ({toReload}) =&gt; {
65 58 <App uploadFile={setUploadFile}></App>
66 59 </ModalForm>
67 60 );
68   -};
69 61 \ No newline at end of file
  62 +};
... ...