fastlion-amis
Version:
一种MIS页面生成工具
118 lines (117 loc) • 6.92 kB
JavaScript
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var react_1 = tslib_1.__importStar(require("react"));
var react_pdf_1 = require("react-pdf");
require("./index.scss");
require("react-pdf/dist/esm/Page/AnnotationLayer.css");
var axios_1 = (0, tslib_1.__importDefault)(require("axios"));
var input_number_1 = (0, tslib_1.__importDefault)(require("antd/lib/input-number"));
var utils_1 = require("../../utils/utils");
var Spin_1 = (0, tslib_1.__importDefault)(require("antd/lib/Spin"));
// pdfjs.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.min.js`;
// pdfjs.GlobalWorkerOptions.workerSrc = 'pdf.worker.min.js'
react_pdf_1.pdfjs.GlobalWorkerOptions.workerSrc = "./public/ThirdPlugins/reactPdf.js";
var PdfViewerContent = function (props) {
var src = props.src;
var _a = (0, react_1.useState)(null), errorTip = _a[0], setErrorTip = _a[1];
var _b = (0, react_1.useState)(null), fileData = _b[0], setFileData = _b[1];
var _c = (0, react_1.useState)(0), totalPage = _c[0], setTotalPage = _c[1];
var _d = (0, react_1.useState)(1), currentPage = _d[0], setCurrentPage = _d[1];
var _e = (0, react_1.useState)(1), scale = _e[0], setScale = _e[1];
var updataPage = function (file, err) {
setFileData(file);
setErrorTip(err);
// 重置页码
setTotalPage(0);
setCurrentPage(1);
};
// 前端预请求,为了拿到具体的提示信息
(0, react_1.useEffect)(function () {
// 后端说没给预览地址说明该类型不支持预览
if (src) {
(0, axios_1.default)({
url: src,
responseType: 'arraybuffer',
headers: {
'Content-Type': 'application/json;charset=utf-8'
}
}).then(function (res) {
// 可能传递json格式的非文件信息,文件格式一般比较大
if (res.data.byteLength > 500) {
updataPage(res, null);
return;
}
// 无法转成json格式的直接判断为文件格式
try {
var enc = new TextDecoder('utf-8');
var uint8_msg = new Uint8Array(res.data);
var json = JSON.parse(enc.decode(uint8_msg));
updataPage(null, json.msg);
}
catch (e) {
updataPage(res, null);
}
}).catch(function (e) {
updataPage(null, '文件地址请求错误');
});
}
else {
updataPage(null, '该文件类型不支持预览');
}
}, [src]);
// 切换上下页
var nextOrPre = function (type) {
if (type === 'next')
setCurrentPage(function (origin) { return origin < totalPage ? origin + 1 : origin; });
else
setCurrentPage(function (origin) { return origin > 1 ? origin - 1 : origin; });
};
// 放大缩小
var changeScale = function (type) {
if (type === 'add')
setScale(function (origin) { return Number((origin < 2 ? origin + 0.2 : origin).toFixed(1)); });
else
setScale(function (origin) { return Number((origin > 0.5 ? origin - 0.2 : origin).toFixed(1)); });
};
return react_1.default.createElement("div", { className: !fileData ? 'pdfLoadingWrapper' : 'pdfViewerWrapper' },
fileData
? react_1.default.createElement(react_pdf_1.Document, { className: 'pdfDocumentContent', loading: react_1.default.createElement(Spin_1.default, { size: "large" }), options: {
// cMapUrl: `//cdn.jsdelivr.net/npm/pdfjs-dist@${pdfjs.version}/cmaps/`,
cMapUrl: "https://unpkg.com/pdfjs-dist@" + react_pdf_1.pdfjs.version + "/cmaps/",
cMapPacked: true,
}, onLoadSuccess: function (_a) {
var numPages = _a.numPages;
setTotalPage(numPages);
setCurrentPage(1);
}, file: fileData },
react_1.default.createElement(react_pdf_1.Page, { pageNumber: currentPage, scale: scale }))
: (errorTip
? react_1.default.createElement("div", { className: 'pdfErrorTip' },
react_1.default.createElement("div", null, errorTip))
: react_1.default.createElement(Spin_1.default, { size: "large" })),
fileData &&
react_1.default.createElement("div", { className: 'pdfUtils' },
react_1.default.createElement("div", { className: (0, utils_1.classNames)('iconWrapper', currentPage === 1 && 'iconWrapper_disabled'), onClick: function () { nextOrPre('pre'); } },
react_1.default.createElement("i", { className: "fa fa-chevron-up" })),
react_1.default.createElement(input_number_1.default, { value: currentPage, onPressEnter: function (e) {
var currentPage = Number(e.currentTarget.value);
if (currentPage > totalPage) {
currentPage = totalPage;
// Modal.toast({ content: `该文件最大 ${totalPage} 页` })
}
setCurrentPage(currentPage);
}, className: 'pageInput', min: 1, max: totalPage }),
react_1.default.createElement("div", { className: (0, utils_1.classNames)('iconWrapper', currentPage === totalPage && 'iconWrapper_disabled'), onClick: function () { nextOrPre('next'); } },
react_1.default.createElement("i", { className: "fa fa-chevron-down" })),
react_1.default.createElement("div", { className: (0, utils_1.classNames)('iconWrapper', scale >= 2 && 'iconWrapper_disabled'), onClick: function () { changeScale('add'); } },
react_1.default.createElement("i", { className: "fa fa-search-plus" })),
react_1.default.createElement("div", { className: (0, utils_1.classNames)('iconWrapper', scale <= 0.5 && 'iconWrapper_disabled'), onClick: function () { changeScale('reduce'); } },
react_1.default.createElement("i", { className: "fa fa-search-minus" })),
react_1.default.createElement("div", { className: (0, utils_1.classNames)('iconWrapper', scale === 1 && 'iconWrapper_disabled'), onClick: function () {
setScale(1);
} },
react_1.default.createElement("i", { className: "fa fa-arrows-alt" }))));
};
exports.default = PdfViewerContent;
//# sourceMappingURL=./renderers/Lion/components/PdfViewer/index.js.map
;