提交 b241d72f authored 作者: 徐立's avatar 徐立

修复预览bug

上级 21b55530
...@@ -2,15 +2,15 @@ ...@@ -2,15 +2,15 @@
* web端文件预览功能 * web端文件预览功能
*/ */
import React, { Component } from 'react'; import React, { Component } from 'react';
import { Modal,Popconfirm } from 'antd'; import { Modal, Popconfirm } from 'antd';
const FileViewer=(CLIENT_TYPE=="mobile")?null:require('react-file-viewer') const FileViewer = CLIENT_TYPE == 'mobile' ? null : require('react-file-viewer');
export default class index extends Component { export default class index extends Component {
constructor(props){ constructor(props) {
super(props) super(props);
this.state = { this.state = {
visible: false visible: false,
} };
} }
showModal = () => { showModal = () => {
this.setState({ this.setState({
...@@ -30,58 +30,51 @@ export default class index extends Component { ...@@ -30,58 +30,51 @@ export default class index extends Component {
}); });
}; };
download = () => { download = () => {
let { let { path, pathName } = this.props;
path, window.open(path, '_blank');
pathName };
} = this.props
window.open(path,'_blank')
}
render() { render() {
let { let { path, pathName } = this.props;
path, const { visible } = this.state;
pathName let isShow =
} = this.props pathName?.indexOf('.pdf') !== -1 ||
const {
visible,
} = this.state
let isShow = pathName?.indexOf('.pdf') !== -1
// || pathName?.indexOf('.doc') !== -1 // || pathName?.indexOf('.doc') !== -1
|| pathName?.indexOf('.mp3') !== -1 pathName?.indexOf('.mp3') !== -1 ||
|| pathName?.indexOf('.mp4') !== -1 pathName?.indexOf('.mp4') !== -1 ||
|| pathName?.indexOf('.csv') !== -1 pathName?.indexOf('.csv') !== -1 ||
|| pathName?.indexOf('.png') !== -1 pathName?.indexOf('.png') !== -1 ||
|| pathName?.indexOf('.jpeg') !== -1 pathName?.indexOf('.jpeg') !== -1 ||
|| pathName?.indexOf('.gif') !== -1 pathName?.indexOf('.gif') !== -1 ||
|| pathName?.indexOf('.bmp') !== -1 pathName?.indexOf('.bmp') !== -1;
let type; let type;
if(pathName?.indexOf('.pdf') !== -1){ if (pathName?.indexOf('.pdf') !== -1) {
isShow = true isShow = true;
type = 'pdf' type = 'pdf';
} else if(pathName?.indexOf('.mp3') !== -1){ } else if (pathName?.indexOf('.mp3') !== -1) {
isShow = true isShow = true;
type = 'mp3' type = 'mp3';
} else if(pathName?.indexOf('.mp4') !== -1){ } else if (pathName?.indexOf('.mp4') !== -1) {
isShow = true isShow = true;
type = 'mp4' type = 'mp4';
} else if(pathName?.indexOf('.csv') !== -1){ } else if (pathName?.indexOf('.csv') !== -1) {
isShow = true isShow = true;
type = 'csv' type = 'csv';
} else if(pathName?.indexOf('.png') !== -1){ } else if (pathName?.indexOf('.png') !== -1) {
isShow = true isShow = true;
type = 'png' type = 'png';
} else if(pathName?.indexOf('.gif') !== -1){ } else if (pathName?.indexOf('.gif') !== -1) {
isShow = true isShow = true;
type = 'gif' type = 'gif';
} else if(pathName?.indexOf('.bmp') !== -1){ } else if (pathName?.indexOf('.bmp') !== -1) {
isShow = true isShow = true;
type = 'bmp' type = 'bmp';
} else { } else {
isShow = false isShow = false;
} }
console.log(FileViewer);
return ( return (
<> <>
{ {isShow ? (
isShow?
<Popconfirm <Popconfirm
title="该附件支持预览,是否预览?" title="该附件支持预览,是否预览?"
onConfirm={this.download} onConfirm={this.download}
...@@ -89,18 +82,15 @@ export default class index extends Component { ...@@ -89,18 +82,15 @@ export default class index extends Component {
okText="下载" okText="下载"
cancelText="预览" cancelText="预览"
> >
<a <a target="_blank" href={path}>
target="_blank"
href={path}>
{pathName} {pathName}
</a> </a>
</Popconfirm> </Popconfirm>
: <a ) : (
target="_blank" <a target="_blank" href={path}>
href={path}>
{pathName} {pathName}
</a> </a>
} )}
<Modal <Modal
title={pathName} title={pathName}
...@@ -110,32 +100,33 @@ export default class index extends Component { ...@@ -110,32 +100,33 @@ export default class index extends Component {
onOk={this.handleOk} onOk={this.handleOk}
onCancel={this.handleCancel} onCancel={this.handleCancel}
> >
{ {type === 'pdf' ? (
type === 'pdf'?
<iframe <iframe
style={{ style={{
width:'100%', width: '100%',
height:600 height: 600,
}} }}
src={path} src={path}
/> />
:<div ) : (
<div
style={{ style={{
height:600, height: 600,
}} }}
> >
{FileViewer&&<FileViewer.default {FileViewer && (
<FileViewer
fileType={type} fileType={type}
filePath={path} filePath={path}
// onError={this.onError} // onError={this.onError}
// errorComponent={Error} // errorComponent={Error}
// unsupportedComponent={Error} // unsupportedComponent={Error}
/>} />
)}
</div> </div>
} )}
</Modal> </Modal>
</> </>
) );
} }
} }
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论