105 lines
5.4 KiB
JavaScript
105 lines
5.4 KiB
JavaScript
import React, { useState, useEffect, useRef } from 'react'
|
|
import { Form, Button, Input, Row, Upload, Col, Table, DatePicker, InputNumber, message, Image, Modal, Typography, Select } from 'antd';
|
|
import { DeleteOutlined, FileWordOutlined, FilePdfOutlined, FileZipOutlined, FileExcelOutlined } from '@ant-design/icons';
|
|
import moment from 'moment'
|
|
import apiurl from '../../../service/apiurl';
|
|
import PdfView from './pdfView';
|
|
// import './index.less'
|
|
const FileView = ({mode, fileList, setFileList}) => {
|
|
const childRef = useRef(null);
|
|
|
|
|
|
const download = (params) => {
|
|
let downloadLink = document.createElement("a");
|
|
downloadLink.href = process.env.REACT_APP_API_URL+apiurl.file.download+params
|
|
downloadLink.download = `${params.fileName}`;
|
|
downloadLink.style.display = "none";
|
|
// 将链接添加到页面中
|
|
document.body.appendChild(downloadLink);
|
|
// 模拟点击事件，开始下载
|
|
downloadLink.click();
|
|
}
|
|
|
|
const deleteFile = (fileId) => {
|
|
let filterFile = fileList.filter(item => item.response?.data?.fileId !== fileId);
|
|
setFileList(filterFile)
|
|
}
|
|
|
|
const viewPdf = (params) => {
|
|
if (childRef.current) {
|
|
childRef.current.callChildMethod(params);
|
|
}
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<Row gutter={[16]}>
|
|
{
|
|
fileList.map(file=>(
|
|
<Col span={12}>
|
|
<div className="file-item" style={{ width: "75%",marginTop:5 }}>
|
|
<div className='file-description'>
|
|
{
|
|
(()=>{
|
|
if(file.name.indexOf('.doc') > -1){
|
|
return (
|
|
<div
|
|
onClick={() => { download(file.response?.data?.fileId) }}
|
|
style={{ cursor: 'pointer' }}
|
|
>
|
|
<FileWordOutlined style={{ fontSize: 40 }}/>
|
|
</div>
|
|
)
|
|
}else if(file.name.indexOf('.pdf') > -1){
|
|
return (
|
|
<div
|
|
onClick={() => { viewPdf(file.response?.data?.fileId) }}
|
|
style={{ cursor: 'pointer' }}
|
|
>
|
|
<FilePdfOutlined style={{ fontSize: 40 }} />
|
|
</div>
|
|
)
|
|
}else if(file.name.indexOf('.zip') > -1){
|
|
return (
|
|
<div
|
|
onClick={() => { download(file.response?.data?.fileId) }}
|
|
style={{ cursor: 'pointer' }}
|
|
>
|
|
<FileZipOutlined style={{ fontSize: 40 }} />
|
|
</div>
|
|
)
|
|
}else if(file.name.indexOf('.xls') > -1){
|
|
return (
|
|
<div
|
|
onClick={() => { download(file.response?.data?.fileId) }}
|
|
style={{ cursor: 'pointer' }}
|
|
>
|
|
<FileExcelOutlined style={{ fontSize: 40 }} />
|
|
</div>
|
|
)
|
|
}else{
|
|
return (
|
|
<Image width={60} src={apiurl.file.view + file.response?.data?.filePath} alt='' />
|
|
)
|
|
}
|
|
})()
|
|
}
|
|
<span style={{display: 'inline-block',maxWidth: '180px',overflow: 'hidden',textOverflow: 'ellipsis',whiteSpace: 'nowrap'}}>{file.name}</span>
|
|
</div>
|
|
<div className={mode == "view" ? 'delete-icon disable-icon' : 'delete-icon'} onClick={() => {
|
|
deleteFile(file.response?.data?.fileId)
|
|
}}>
|
|
<DeleteOutlined />
|
|
</div>
|
|
</div>
|
|
</Col>
|
|
))
|
|
}
|
|
</Row>
|
|
<PdfView ref={childRef}/>
|
|
</>
|
|
)
|
|
}
|
|
|
|
export default FileView
|