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,7 +63,7 @@ export default defineConfig({
63 path: '/instalment', 63 path: '/instalment',
64 component: './Instalment', 64 component: './Instalment',
65 icon: 'BookOutlined', 65 icon: 'BookOutlined',
66 - access: 'canReadAdminAndFinance', 66 + access: 'canReadLinda',
67 }, 67 },
68 { 68 {
69 name: '打印', 69 name: '打印',
src/access.ts
  View file @d5cb3ed
1 export default (initialState: API.UserInfo) => { 1 export default (initialState: API.UserInfo) => {
2 // 在这里按照初始化数据定义项目中的权限，统一管理 2 // 在这里按照初始化数据定义项目中的权限，统一管理
3 // 参考文档 https://umijs.org/docs/max/access 3 // 参考文档 https://umijs.org/docs/max/access
4 - const { roleSmallVO } = initialState; 4 + const { roleSmallVO, username } = initialState;
5 5
6 return { 6 return {
7 canReadAdmin: roleSmallVO?.code === 'admin', 7 canReadAdmin: roleSmallVO?.code === 'admin',
  8 + canReadLinda: username === 'Linda' || '吴量',
8 canReadProcure: roleSmallVO?.code === 'procure', 9 canReadProcure: roleSmallVO?.code === 'procure',
9 canReadAdminAndFinance: 10 canReadAdminAndFinance:
10 roleSmallVO?.code === 'admin' || roleSmallVO?.code === 'finance', 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 import { useState } from 'react'; 3 import { useState } from 'react';
11 4
12 const waitTime = (time: number = 100) => { 5 const waitTime = (time: number = 100) => {
@@ -17,14 +10,13 @@ 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 const [form] = Form.useForm<{ name: string; company: string }>(); 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 return ( 21 return (
30 <ModalForm<{ 22 <ModalForm<{
@@ -32,7 +24,11 @@ export default ({currtDid,sureDelete}) =&gt; { @@ -32,7 +24,11 @@ export default ({currtDid,sureDelete}) =&gt; {
32 company: string; 24 company: string;
33 }> 25 }>
34 trigger={ 26 trigger={
35 - <a onClick={()=>{getIds()}}> 27 + <a
  28 + onClick={() => {
  29 + getIds();
  30 + }}
  31 + >
36 删除 32 删除
37 </a> 33 </a>
38 } 34 }
@@ -41,18 +37,16 @@ export default ({currtDid,sureDelete}) =&gt; { @@ -41,18 +37,16 @@ export default ({currtDid,sureDelete}) =&gt; {
41 width={190} 37 width={190}
42 modalProps={{ 38 modalProps={{
43 destroyOnClose: true, 39 destroyOnClose: true,
44 - // onCancel: () => console.log('run'),  
45 }} 40 }}
46 - onFinish={async (values) => { 41 + onFinish={async () => {
47 await waitTime(100); 42 await waitTime(100);
48 sureDelete([ids]); 43 sureDelete([ids]);
49 - // console.log(values.name);  
50 message.success('提交成功'); 44 message.success('提交成功');
51 return true; 45 return true;
52 }} 46 }}
53 > 47 >
54 - <br/> 48 + <br />
55 <h2>确定删除吗</h2> 49 <h2>确定删除吗</h2>
56 </ModalForm> 50 </ModalForm>
57 ); 51 );
58 -};  
59 \ No newline at end of file 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 import { PlusOutlined } from '@ant-design/icons'; 7 import { PlusOutlined } from '@ant-design/icons';
2 import { 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 } from '@ant-design/pro-components'; 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 import { RcFile } from 'antd/es/upload'; 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 const waitTime = (time: number = 100) => { 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 \ No newline at end of file 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 import { 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 } from '@ant-design/pro-components'; 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 import { RcFile } from 'antd/es/upload'; 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 const waitTime = (time: number = 100) => { 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 export default ({ currentContract, toReload }) => { 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 \ No newline at end of file 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 import type { ProColumns } from '@ant-design/pro-components'; 2 import type { ProColumns } from '@ant-design/pro-components';
2 import { 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 } from '@ant-design/pro-components'; 8 } from '@ant-design/pro-components';
12 -import React, { useEffect, useState } from 'react';  
13 -import './payWayDetail.less'  
14 -import { getOrderErpOrderStagesPayWaySelectOssId, postOrderErpOrderStagesPayWaySelect } from '@/services';  
15 import { message } from 'antd'; 9 import { message } from 'antd';
  10 +import React, { useEffect, useState } from 'react';
  11 +import './payWayDetail.less';
16 12
17 const waitTime = (time: number = 100) => { 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 type DataSourceType = { 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 export default ({ payBody, thisId, currtSave }) => { 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 \ No newline at end of file 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 import type { ProColumns } from '@ant-design/pro-components'; 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 import React, { useEffect, useState } from 'react'; 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 const waitTime = (time: number = 100) => { 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 export default ({ productBody, EditProductBody }) => { 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 \ No newline at end of file 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 import { 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 } from '@ant-design/pro-components'; 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 import { RcFile } from 'antd/es/upload'; 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 const waitTime = (time: number = 100) => { 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 export default ({ currentContract }) => { 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 width="md" 320 width="md"
314 name="annex" 321 name="annex"
315 label="合同附件" 322 label="合同附件"
@@ -318,45 +325,52 @@ export default ({ currentContract }) =&gt; { @@ -318,45 +325,52 @@ export default ({ currentContract }) =&gt; {
318 readonly 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 \ No newline at end of file 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 import type { ProColumns } from '@ant-design/pro-components'; 2 import type { ProColumns } from '@ant-design/pro-components';
2 import { 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 } from '@ant-design/pro-components'; 7 } from '@ant-design/pro-components';
12 -import React, { useEffect, useState } from 'react';  
13 -import { postOrderErpOrderStagesPayWaySelect } from '@/services';  
14 import { message } from 'antd'; 8 import { message } from 'antd';
  9 +import React, { useEffect, useState } from 'react';
15 10
16 const waitTime = (time: number = 100) => { 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 type DataSourceType = { 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 export default ({ payBody, thisId, currtSave }) => { 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 \ No newline at end of file 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 import type { ProColumns } from '@ant-design/pro-components'; 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 import { Form } from 'antd'; 3 import { Form } from 'antd';
  4 +import React, { useEffect, useState } from 'react';
11 5
12 const waitTime = (time: number = 100) => { 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 export default ({ productBody, EditProductBody }) => { 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 \ No newline at end of file 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 import AddModel from '../detail/detail'; 13 import AddModel from '../detail/detail';
10 import EditorModel from '../edit/edit'; 14 import EditorModel from '../edit/edit';
  15 +import ReadModel from '../read/read';
11 import UploadModel from '../upload/uploadModel'; 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 export const waitTimePromise = async (time: number = 100) => { 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 export const waitTime = async (time: number = 100) => { 26 export const waitTime = async (time: number = 100) => {
25 - await waitTimePromise(time); 27 + await waitTimePromise(time);
26 }; 28 };
27 29
28 type OrderStagesItem = { 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 type OrderStagesWithListItem = { 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 type orderStagesDevice = { 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 export default () => { 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 \ No newline at end of file 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 import { InboxOutlined } from '@ant-design/icons'; 1 import { InboxOutlined } from '@ant-design/icons';
  2 +import { Upload } from 'antd';
  3 +import React from 'react';
4 4
5 const App: React.FC = ({ uploadFile }) => { 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 \ No newline at end of file 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 import { postOrderErpOrderStagesImport } from '@/services/request'; 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 import { RcFile } from 'antd/es/upload'; 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 const [form] = Form.useForm<{ name: string; company: string }>(); 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 return ( 23 return (
31 <ModalForm<{ 24 <ModalForm<{
32 name: string; 25 name: string;
@@ -43,21 +36,21 @@ export default ({toReload}) =&gt; { @@ -43,21 +36,21 @@ export default ({toReload}) =&gt; {
43 autoFocusFirstInput 36 autoFocusFirstInput
44 modalProps={{ 37 modalProps={{
45 destroyOnClose: true, 38 destroyOnClose: true,
46 - // onCancel: () => console.log('run'),  
47 }} 39 }}
48 submitTimeout={2000} 40 submitTimeout={2000}
49 - onFinish={async (values) => { 41 + onFinish={async () => {
50 const formData = new FormData(); 42 const formData = new FormData();
51 formData.append('file', uploadFile as RcFile); 43 formData.append('file', uploadFile as RcFile);
52 const res = await postOrderErpOrderStagesImport({ 44 const res = await postOrderErpOrderStagesImport({
53 data: formData, 45 data: formData,
54 headers: { 46 headers: {
55 - 'Content-Type': 'multipart/form-data; boundary=----WebKitFormBoundarynl6gT1BKdPWIejNq',  
56 - } 47 + 'Content-Type':
  48 + 'multipart/form-data; boundary=----WebKitFormBoundarynl6gT1BKdPWIejNq',
  49 + },
57 }); 50 });
58 if (res) { 51 if (res) {
59 message.success('提交成功'); 52 message.success('提交成功');
60 - toReload() 53 + toReload();
61 return true; 54 return true;
62 } 55 }
63 }} 56 }}
@@ -65,4 +58,4 @@ export default ({toReload}) =&gt; { @@ -65,4 +58,4 @@ export default ({toReload}) =&gt; {
65 <App uploadFile={setUploadFile}></App> 58 <App uploadFile={setUploadFile}></App>
66 </ModalForm> 59 </ModalForm>
67 ); 60 );
68 -};  
69 \ No newline at end of file 61 \ No newline at end of file
  62 +};