HistoryModal.tsx
4.13 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
import { postServiceOrderQueryHistoryOrderRecord } from '@/services';
import { formatDateTime } from '@/utils';
import { Button, Col, Empty, Flex, Modal, Row, Spin } from 'antd';
import { useEffect, useState } from 'react';
import { HISTORY_OPT_TYPE } from '../constant';
export default ({ subOrders, isCancelledOrder, onClose }) => {
let subOrderIds = subOrders?.map((subOrder: any) => {
return subOrder.id;
});
const [data, setData] = useState([]);
const [loading, setLoading] = useState(true);
let i = 0;
const handleOk = () => {
onClose();
};
/**
* 获取历史记录
*/
const getHistory = async () => {
let res = await postServiceOrderQueryHistoryOrderRecord({
data: { ids: subOrderIds, isDeleteQueryOrder: isCancelledOrder },
});
setData(res.data);
setLoading(false);
};
const getRecord = (history: any) => {
let record = [];
record.push(
<span className="pr-2 text-[#5E5E5E]">
{formatDateTime(history.createTime)}
</span>,
);
record.push(<span className="text-[#3b83e5]">{history.createByName}</span>);
record.push(<span>进行了</span>);
record.push(
<span className="text-[#3b83e5]">
{HISTORY_OPT_TYPE.get(history.record) +
(history.record === 'INVOICING'
? '(开票号码：' + history.invoiceNumber + ')'
: '')}
</span>,
);
// let label = enumValueToLabel(history.status, ORDER_STATUS_OPTIONS);
// if (
// history.record !== 'INVOICING' && history.record !== 'order-change-normal' && history.record !== 'order-change-normal-CHECK' &&
// history.record?.indexOf(':') === -1 &&
// label !== undefined &&
// label !== ''
// ) {
// record.push(
// <>
// <span>，订单状态为：</span>
// <span className="text-[#3b83e5]">{label}</span>
// </>,
// );
// }
if (history.record?.indexOf(':') !== -1) {
let values = history.record?.split(':');
//采购转发
if (values[0] === 'PROCURE_CONVERT_PROCURE') {
record.push(
<>
<span>采购转发，{history.createByName}将订单转发给了</span>
<span className="text-[#3b83e5]">{values[1]}</span>
</>,
);
}
}
if (history.notes !== null) {
record.push(<span className="pl-1">{'备注：' + history.notes}</span>);
}
if (history.description !== null) {
record.push(
<span className="pl-1">{'描述：' + history.description}</span>,
);
}
return record;
};
useEffect(() => {
getHistory();
}, []);
const handleCancel = () => {
onClose();
};
return (
<>
<Modal
title="订单历史记录"
open
width={650}
onOk={handleOk}
onCancel={handleCancel}
footer={() => (
<>
<Button onClick={handleCancel}>返回</Button>
</>
)}
>
<Spin tip="加载中" spinning={loading}>
<Row className="max-h-[500px] overflow-auto" gutter={[0, 14]}>
{data.map((item) => {
return (
<Col span={24} key={i}>
<Flex vertical>
<div>
<span className="py-2 text-[#5E5E5E]">
{'商品' + ++i}
</span>
<span className="text-[#8C8C8C]">
-【{item.productName}】
</span>
</div>
<Flex vertical>
{item.historySubOrderRecordDto?.map((history) => {
return (
<div className="py-1" key={history.id}>
{getRecord(history)}
</div>
);
})}
</Flex>
</Flex>
</Col>
);
})}
</Row>
{data?.length <= 0 ? (
<Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
) : (
''
)}
</Spin>
</Modal>
</>
);
};