payWayUpload.tsx
2.51 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
import { postOrderErpOrderStagesUpload } from '@/services/request';
import { UploadOutlined } from '@ant-design/icons';
import type { UploadProps } from 'antd';
import { Button, Upload, message } from 'antd';
import { RcFile } from 'antd/es/upload';
import React, { useEffect } from 'react';
const App: React.FC = ({ natureModel, setCurryFile }) => {
const [fileList, setFileList] = React.useState([{}]);
useEffect(() => {
if (natureModel.fileUrl !== undefined && natureModel.fileUrl !== null) {
setFileList([{ name: natureModel.fileName, url: natureModel.fileUrl }]);
}
}, []);
const handleUploadChange = (value) => {
setFileList(value.fileList);
setCurryFile({
id: natureModel.id,
name: null,
url: null,
});
if (
value.fileList.length !== 0 &&
value.fileList[0].status === 'uploading'
) {
(async () => {
if (!(value.fileList[0].originFileObj instanceof File)) {
return false;
} else {
const formData = new FormData();
formData.append('file', value.fileList[0].originFileObj as RcFile);
const res = await postOrderErpOrderStagesUpload({
data: formData,
headers: {
'Content-Type': 'multipart/form-data',
},
});
if (res) {
message.success('提交成功');
setCurryFile({
id: natureModel.id,
name: value.fileList[0].originFileObj.name,
url: res.data,
});
setFileList([
{
id: value.fileList[0].originFileObj.uid,
name: value.fileList[0].originFileObj.name,
url: res.data,
},
]);
return (
<a href={res.data} target="_blank" rel="noopener noreferrer">
{value.fileList[0].originFileObj.name}
</a>
);
}
}
})();
}
};
const props: UploadProps = {
onChange(value) {
handleUploadChange(value);
},
};
const shouldShowUploadButton =
fileList.length !== 1 || fileList[0].url === undefined;
return (
<Upload
{...props}
fileList={fileList.filter(
(item) => item.url !== undefined && item.url !== null,
)}
>
{shouldShowUploadButton && (
<Button icon={<UploadOutlined />}>上传</Button>
)}
</Upload>
);
};
export default App;
{
/* {!shouldShowUploadButton && <a href={fileList[0].url}>{fileList[0].name}</a>} */
}