Untitled
unknown
plain_text
3 years ago
2.2 kB
1
Indexable
Never
import React, {useEffect, useRef} from 'react'; import {Button, Modal} from '@themesberg/react-bootstrap'; import FileViewer from 'react-file-viewer'; import WebViewer from '@pdftron/webviewer'; const FileViewerModal = (props) => { const viewerDiv = useRef(null); const handleClose = () => { props.onClose(); }; const filePath = props.selectedFileUrl; const abc = filePath?.split('.'); console.log(filePath) console.log(abc) const summary = () => { } useEffect(() => { WebViewer( { path: '/webviewer/lib', initialDoc: filePath, }, viewerDiv.current, ).then((instance) => { }); }, []); return ( <Modal fullscreen={true} className="filePreviewModal" show={props.show} onHide={handleClose}> {/*<Modal.Header closeButton>*/} {/* /!*<Modal.Title>File Viewer</Modal.Title>*!/*/} {/* <Button type="button" variant="secondary">*/} {/* <a href={filePath}>Tải xuống</a>*/} {/* </Button>*/} {/* <Button type="button" variant="secondary" onClick={summary} style={{marginLeft : '10px'}}>*/} {/* Tóm tắt*/} {/* </Button>*/} {/*</Modal.Header>*/} {/*<Modal.Body>*/} {/* <FileViewer fileType={abc && abc[abc.length - 1].toLowerCase()} filePath={filePath}/>*/} {/*</Modal.Body>*/} {/*<Modal.Footer>*/} {/* <Button type="button" variant="secondary" onClick={handleClose}>*/} {/* Đóng*/} {/* </Button>*/} {/*</Modal.Footer>*/} <Modal.Header closeButton> {/*<Modal.Title>File Viewer</Modal.Title>*/} <Button type="button" variant="secondary"> <a href={filePath}>Tải xuống</a> </Button> <Button type="button" variant="secondary" onClick={summary} style={{marginLeft : '10px'}}> Tóm tắt </Button> </Modal.Header> <Modal.Body> <div className="webViewer" ref={viewerDiv}></div> </Modal.Body> <Modal.Footer> <Button type="button" variant="secondary" onClick={handleClose}> Đóng </Button> </Modal.Footer> {/*<div className="webViewer" ref={viewerDiv}></div>*/} </Modal> ); }; export default FileViewerModal;