SubOrderComfirmReceiptImagesModal.tsx
1.29 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
import { postServiceOrderViewImages } from '@/services';
import { Button, Divider, Image, Modal } from 'antd';
import { useEffect, useState } from 'react';
export default ({ setVisible, onClose, orderRow }) => {
const [images, setImages] = useState([]);
const handleOk = () => {
onClose();
setVisible(false);
};
const handleCancel = () => {
onClose();
setVisible(false);
};
async function getImages() {
const res = await postServiceOrderViewImages({
data: { subId: orderRow.id },
});
const images = res.data;
setImages(images);
}
useEffect(() => {
getImages();
}, []);
return (
<>
<Modal
title="收货凭证"
open
onOk={handleOk}
onCancel={handleCancel}
footer={[
<Button key="back" onClick={handleCancel}>
返回
</Button>,
]}
>
<Image.PreviewGroup
className="mr-10"
preview={{
onChange: (current, prev) =>
console.log(`current index: ${current}, prev index: ${prev}`),
}}
>
{images.map((url) => (
<>
<Image width={120} src={url} /> <Divider type="vertical" />
</>
))}
</Image.PreviewGroup>
</Modal>
</>
);
};