46 lines
1.2 KiB
JavaScript
46 lines
1.2 KiB
JavaScript
|
import React from "react";
|
||
|
|
import { CloseOutlined } from '@ant-design/icons';
|
||
|
|
|
||
|
|
const PdfView = ({ visible, title, onClose, url, fileId }) => {
|
||
|
|
if (!visible) return null;
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div style={{
|
||
|
|
position: 'fixed',
|
||
|
|
top: 0,
|
||
|
|
left: 0,
|
||
|
|
width: '100vw',
|
||
|
|
height: '100vh',
|
||
|
|
backgroundColor: 'rgba(0, 0, 0, 0.5)',
|
||
|
|
zIndex: 2000,
|
||
|
|
display: 'flex',
|
||
|
|
justifyContent: 'center',
|
||
|
|
alignItems: 'center'
|
||
|
|
}}>
|
||
|
|
<div style={{ width: '60%', height: '80vh', display: 'flex', flexDirection: 'column', position: 'relative' }}>
|
||
|
|
<CloseOutlined
|
||
|
|
onClick={onClose}
|
||
|
|
style={{
|
||
|
|
position: 'absolute',
|
||
|
|
top: '-30px',
|
||
|
|
right: 0,
|
||
|
|
color: '#fff',
|
||
|
|
fontSize: '18px',
|
||
|
|
cursor: 'pointer'
|
||
|
|
}}
|
||
|
|
/>
|
||
|
|
<iframe
|
||
|
|
style={{
|
||
|
|
height: '100%',
|
||
|
|
width: '100%',
|
||
|
|
border: 0,
|
||
|
|
background: '#fff'
|
||
|
|
}}
|
||
|
|
src={`${process.env.PUBLIC_URL}/static/pdf/web/viewer.html?file=${encodeURIComponent(url + fileId)}`}
|
||
|
|
title={title}
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
export default PdfView
|