65 lines
1.7 KiB
TypeScript
65 lines
1.7 KiB
TypeScript
/*
|
|
* @Note:
|
|
* @Author: 2058827620@qq.com
|
|
* @Date: 2022-04-03 17:02:15
|
|
*/
|
|
|
|
import { Divider, Modal, Upload, Button, UploadProps, UploadFile } from 'antd';
|
|
import { useEffect, useRef, useState } from 'react';
|
|
import { DownloadOutlined, UploadOutlined } from '@ant-design/icons';
|
|
|
|
|
|
export default ({ modalOpenState, onModalOpenState, onSubmit }) => {
|
|
|
|
const [fileList, setFileList] = useState([]);
|
|
const [uploading, setUploading] = useState(false);
|
|
|
|
|
|
|
|
const props: UploadProps = {
|
|
onRemove: (file) => {
|
|
const index = fileList.indexOf(file);
|
|
const newFileList = fileList.slice();
|
|
newFileList.splice(index, 1);
|
|
setFileList(newFileList);
|
|
},
|
|
beforeUpload: (file) => {
|
|
setFileList([...fileList, file]);
|
|
return false;
|
|
},
|
|
fileList,
|
|
};
|
|
|
|
const handleUpload = () => {
|
|
const formData = new FormData();
|
|
fileList.forEach((file) => {
|
|
formData.append('file', file);
|
|
});
|
|
onSubmit(formData)
|
|
setFileList([])
|
|
};
|
|
|
|
return (
|
|
<>
|
|
<Modal title="导入设备" open={modalOpenState} onCancel={() => {
|
|
onModalOpenState(false)
|
|
}} onOk={handleUpload} footer={(_, { OkBtn, CancelBtn }) => (
|
|
<>
|
|
<CancelBtn />
|
|
<OkBtn />
|
|
</>
|
|
)}>
|
|
<div className='flex'>
|
|
<Upload className='mr-6' {...props}>
|
|
<Button icon={<UploadOutlined />}>选择文件</Button>
|
|
</Upload>
|
|
<Button icon={<DownloadOutlined />} onClick={() => {
|
|
window.open('https://zhongshuai-test.oss-cn-beijing.aliyuncs.com/upload/20240911/11ecca80-3f06-43c9-9c63-e9a9e4ef0173.xlsx');
|
|
}}>下载模板</Button>
|
|
</div>
|
|
</Modal>
|
|
</>
|
|
);
|
|
};
|
|
|