import {
postOrderErpOrderStagesPayWaySaveOrUpdate,
postOrderErpOrderStagesSaveOrUpdate,
postOrderErpOrderStagesSearch,
postOrderErpOrderStagesUpload,
} from '@/services';
import {
ModalForm,
ProCard,
ProForm,
ProFormDatePicker,
ProFormText,
ProFormTextArea,
} from '@ant-design/pro-components';
import { Form, message } from 'antd';
import { RcFile } from 'antd/es/upload';
import { useEffect, useState } from 'react';
import PayWayDetail from './readPayWay';
import ProductDetail from './readProduct';
const waitTime = (time: number = 100) => {
return new Promise((resolve) => {
setTimeout(() => {
resolve(true);
}, time);
});
};
export default ({ currentContract }) => {
const [form] = Form.useForm<{ name: string; company: string }>();
const [contextBody, setContextBody] = useState({});
const [, setEditProductBody] = useState([]);
const [total, setTotal] = useState(0);
const [payWayBody, setPayWayBody] = useState([]);
const [otherBody, setOtherBody] = useState([]);
type OrderStagesWithListItem = {
//文件编号
id: number;
//合同编号
contract: string;
//供应商名称
vendor: string;
//签合同日期
dateRange: Date;
//终端名称
terminal: string;
orderStagesDeviceVoList: orderStagesDevice[];
//合同总金额
totalPrice: number;
//付款方式
payWay: string;
//附件
annex: string;
//备注
remark: string;
};
type orderStagesDevice = {
//设备id
dId: number;
//设备名称
deviceName: string;
//设备型号
deviceModel: string;
//数量
count: number;
//单价
unitPrice: number;
//总价
price: number;
};
async function refresh() {
const res = await postOrderErpOrderStagesSearch({
data: { contract: currentContract },
});
const context = res?.data?.data[0];
if (context?.contract !== null) {
setContextBody(context);
setTotal(context?.totalPrice);
form.setFieldValue('totalPrice', context?.totalPrice);
}
}
function setSave(value) {
setOtherBody(value);
}
useEffect(() => {
setContextBody({ ...contextBody, totalPrice: total });
form.setFieldValue('totalPrice', total);
}, [total]);
const handleInputChange = (value: string, no: number, priceNow?: number) => {
let totalPay = 0;
const payValue: string[] = value.split('/');
let body:
| ((prevState: never[]) => never[])
| { proportion: string; payPrice: number }[] = [];
if (no === 1) {
if (payValue.length !== 4) {
message.warning('比例个数总和不为4个!');
} else {
payValue.forEach((item) => {
totalPay += Number(item);
});
}
if (totalPay !== 100) {
message.warning('比例总和不为100!');
} else {
message.success('输入有效!');
const price = total;
payValue.forEach((item) => {
body.push({
proportion: item + '%',
payPrice: (Number(item) * price) / 100,
});
});
setPayWayBody(body);
}
} else {
payValue.forEach((item) => {
totalPay += Number(item);
});
payValue.forEach((item) => {
body.push({
proportion: item + '%',
payPrice: (Number(item) * priceNow) / 100,
});
});
setPayWayBody(body);
}
};
async function getBody() {
const res = await postOrderErpOrderStagesSearch({
data: { contract: currentContract },
});
const context = res.data.data[0];
if (context?.contract !== null) {
setContextBody(context);
setTotal(context?.totalPrice);
form.setFieldValue('totalPrice', context?.totalPrice);
}
handleInputChange(context?.payWay, 0, context?.totalPrice);
}
useEffect(() => {
getBody();
}, []);
function getEditProductBody(value) {
setEditProductBody(value);
let price = 0;
value.map((obj) => (price += obj.count * obj.unitPrice));
setTotal(price);
setContextBody({ ...contextBody, orderStagesDeviceVoList: value });
handleInputChange(contextBody.payWay, 0, price);
}
return (
<ModalForm<OrderStagesWithListItem>
title="查看"
trigger={<a onClick={refresh}>查看</a>}
form={form}
autoFocusFirstInput
modalProps={{
destroyOnClose: true,
}}
submitter={{
resetButtonProps: {},
submitButtonProps: {
style: {
display: 'none',
},
},
}}
submitTimeout={2000}
onFinish={async (values) => {
let remakeValue = [];
// 创建一个用于存储所有异步操作的Promise数组
const promises = [];
otherBody.forEach((item) => {
let remakeItem = {
ossId: item.ossId,
number: item.id,
dataRange: item.payDate,
fileName: item.fileName,
};
if (
typeof item.fileUrl === 'object' &&
item.fileUrl instanceof File
) {
const formData = new FormData();
formData.append('file', item.fileUrl as RcFile);
const uploadPromise = async () => {
const res = await postOrderErpOrderStagesUpload({
data: formData,
headers: {
'Content-Type':
'multipart/form-data; boundary=----WebKitFormBoundarynl6gT1BKdPWIejNq',
},
});
if (res.data) {
remakeItem.fileUrl = res.data;
}
};
promises.push(uploadPromise());
}
remakeValue.push(remakeItem);
});
// 使用Promise.all等待所有异步操作完成后再执行保存操作
Promise.all(promises).then(async () => {
await postOrderErpOrderStagesPayWaySaveOrUpdate({
data: remakeValue,
});
});
const formData = new FormData();
// let toSendEdit={...values,orderStagesDeviceVoList:contextBody.orderStagesDeviceVoList};
let toSendEdit = {
id: values.id || contextBody.id,
contract: values.contract || contextBody.contract,
vendor: values.vendor || contextBody.vendor,
dateRange: values.dateRange || contextBody.dateRange,
terminal: values.terminal || contextBody.terminal,
orderStagesDeviceDoList:
values.orderStagesDeviceVoList ||
contextBody.orderStagesDeviceVoList,
totalPrice: values.totalPrice || contextBody.totalPrice,
payWay: values.payWay || contextBody.payWay,
annex: contextBody.annex,
remark: values.remark || contextBody.remark,
};
if (values.annex) {
formData.append('file', values.annex[0].originFileObj as RcFile);
const res = await postOrderErpOrderStagesUpload({
data: formData,
headers: {
'Content-Type':
'multipart/form-data; boundary=----WebKitFormBoundarynl6gT1BKdPWIejNq',
},
});
if (res.data) {
toSendEdit.annex = res.data;
}
}
const isSaveOrUpdate = await postOrderErpOrderStagesSaveOrUpdate({
data: { ...toSendEdit },
});
if (isSaveOrUpdate) {
getBody();
}
await waitTime(2000);
message.success('提交成功');
return true;
}}
>
<ProCard title="基本信息" headerBordered bordered>
<ProForm.Group>
<ProFormText
width="md"
name="vendor"
label="供应商名称"
placeholder="请输入"
initialValue={contextBody?.vendor}
readonly
/>
<ProFormText
width="md"
name="terminal"
label="终端名称"
placeholder="请输入"
initialValue={contextBody?.terminal}
readonly
/>
<ProFormDatePicker
name="dateRange"
width="md"
label="签合同日期"
placeholder="请选择日期"
fieldProps={{
format: (value) => value.format('YYYY-MM-DD'),
}}
initialValue={contextBody?.dateRange}
readonly
/>
<ProFormText
width="md"
name="payWay"
label="付款比例"
placeholder="请输入"
initialValue={contextBody?.payWay}
readonly
onBlur={(e) => {
handleInputChange(e.target.value, 1);
}}
/>
<ProFormText
width="md"
name="contract"
label="合同编号"
placeholder="请输入"
initialValue={contextBody?.contract}
readonly
/>
{/* <ProFormText
width="md"
name="annex"
label="合同附件"
placeholder="请输入"
initialValue={contextBody.fileUrl}
readonly
/> */}
<ProFormText
width="md"
name="totalPrice"
label="合同金额"
placeholder="请输入"
disabled
readonly
// rules={[{ required: true, message: '此项为必填项' }]}
// value={contextBody.totalPrice}
initialValue={contextBody?.totalPrice}
/>
</ProForm.Group>
</ProCard>
<ProCard
title="产品明细"
style={{ marginTop: 10 }}
headerBordered
bordered
>
<ProductDetail
productBody={contextBody?.orderStagesDeviceVoList}
EditProductBody={getEditProductBody}
></ProductDetail>
</ProCard>
<ProCard
title="付款信息"
style={{ marginTop: 10 }}
headerBordered
bordered
>
<PayWayDetail
payBody={payWayBody}
thisId={contextBody?.id}
currtSave={setSave}
></PayWayDetail>
</ProCard>
<ProCard style={{ marginTop: 10 }} headerBordered bordered>
<ProFormTextArea
label="备注"
name="remark"
initialValue={contextBody?.remark}
readonly
/>
</ProCard>
</ModalForm>
);
};