fastlion-amis
Version:
一种MIS页面生成工具
590 lines (589 loc) • 41.8 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var react_1 = tslib_1.__importStar(require("react"));
var theme_1 = require("../theme");
// import { autobind } from '../utils/helper'
// import Modal from './Modal'
var icons_1 = require("./icons");
var UnionImgContent_1 = (0, tslib_1.__importDefault)(require("./Lion/UnionImgContent"));
var MediaShowList_1 = (0, tslib_1.__importDefault)(require("./Lion/MediaShowList"));
var msgsub_1 = (0, tslib_1.__importDefault)(require("../renderers/Lion/utils/msgsub"));
var react_rnd_1 = require("react-rnd");
var lodash_1 = require("lodash");
var DragModal_1 = (0, tslib_1.__importDefault)(require("./DragModal"));
var icons_2 = require("@ant-design/icons");
var antd_1 = require("antd");
var react_pdf_1 = require("react-pdf");
var helper_1 = require("../utils/helper");
var shell_1 = require("../utils/shell");
var tools_1 = require("../utils/shell/tools");
var utils_1 = require("../renderers/Lion/utils/utils");
var dayjs_1 = (0, tslib_1.__importDefault)(require("dayjs"));
react_pdf_1.pdfjs.GlobalWorkerOptions.workerSrc = "//cdnjs.cloudflare.com/ajax/libs/pdf.js/" + react_pdf_1.pdfjs.version + "/pdf.worker.js";
var getImgOriginWidthAndHeight = function (src) { return new Promise(function (res, rej) {
// 创建一个新的 Image 对象
var img = document.createElement('img');
// 定义图片加载完成后的处理函数
img.onload = function () {
// 获取图片的原始宽度和高度
var originalWidth = img.naturalWidth;
var originalHeight = img.naturalHeight;
res({ originalWidth: originalWidth, originalHeight: originalHeight });
};
// 设置图片的源 URL
img.src = src;
}); };
// 初始状态
var initState = {
isOpened: false,
index: -1,
items: [],
unionImgShow: false,
unionSelecting: false,
mediaListShow: true,
imgRotate: 0,
selectList: [],
unionList: [],
totalUnionList: [],
selectUnionImgIndex: 0,
};
// 弹窗最小的高度和宽度 同步设置
var toolHigh = 40;
// const previewHeight = 64 + toolHigh;
var previewHeight = 88 + toolHigh;
var clientHalfHeight = document.documentElement.clientHeight / 2;
var minHeight = clientHalfHeight - previewHeight;
var minWidth = 600;
// const defaultMove = { x: 0, y: 0 };
var ImageGallery = function (props) {
var _a;
var children = props.children;
// const [states, setStates] = useState(initState);
var _b = (0, react_1.useState)(false), visible = _b[0], setVisible = _b[1];
var pcPreviewRef = (0, react_1.useRef)(null);
var _c = (0, react_1.useState)({}), previewInfo = _c[0], setPreviewInfo = _c[1];
/** events */
var handleImageEnlarge = function (info) {
setPreviewInfo(info);
setVisible(true);
requestAnimationFrame(function () {
var _a;
(_a = pcPreviewRef.current) === null || _a === void 0 ? void 0 : _a.handleGetOriginSize();
});
};
var onClose = function () {
setVisible(false);
};
var handlePreviewKeydown = function (e) {
var _a, _b, _c, _d;
// 对应 ↑↓
var filesKeyCode = [38, 40];
// 对应 ←→
var pdfFileKeyCode = [37, 39];
var keyCode = e.keyCode;
// 文件上下个切换
if (filesKeyCode.includes(keyCode)) {
if (keyCode === 40) {
(_a = pcPreviewRef.current) === null || _a === void 0 ? void 0 : _a.handleNext();
}
else {
(_b = pcPreviewRef.current) === null || _b === void 0 ? void 0 : _b.handlePrev();
}
}
// 文件预览左右按键实现 上下页切换
if (pdfFileKeyCode.includes(keyCode)) {
if (keyCode === 39) {
(_c = pcPreviewRef.current) === null || _c === void 0 ? void 0 : _c.handlePdfNext();
}
else {
(_d = pcPreviewRef.current) === null || _d === void 0 ? void 0 : _d.handlePdfPrev();
}
}
};
// resize计算高度 省的撑大
/** events - end*/
/** fileViewer */
var PcPreview = (0, react_1.forwardRef)(function (props, ref) {
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
var _k = (0, react_1.useState)({}), selectedAttachment = _k[0], setSelectAttachment = _k[1];
var _l = (0, react_1.useState)([]), allAttachment = _l[0], setAllAttachment = _l[1];
var _m = (0, react_1.useState)(1), pageNumber = _m[0], setPageNumber = _m[1];
var _o = (0, react_1.useState)(1), scale = _o[0], setScale = _o[1];
var _p = (0, react_1.useState)(initState), states = _p[0], setStates = _p[1];
var _q = (0, react_1.useState)(1), pageIndex = _q[0], setPageIndex = _q[1];
// const [moveData, setMoveData] = useState(defaultMove);
var _r = (0, react_1.useState)(), FileHigh = _r[0], setFileHigh = _r[1];
// const [FileWidth, setFileWidth] = useState();
var _s = (0, react_1.useState)(0), rotate = _s[0], setRotate = _s[1];
var previewRef = (0, react_1.useRef)(null);
var dragRef = (0, react_1.useRef)(null);
var previewTitleHigh = (0, react_1.useRef)(0);
var _t = (0, react_1.useState)(false), dragging = _t[0], setDragging = _t[1];
var _u = (0, react_1.useState)('100%'), maxImgWidth = _u[0], setMaxImgWidth = _u[1];
var _v = (0, react_1.useState)({ width: '100%', height: '100%' }), previewImgInfo = _v[0], setPreviewImgInfo = _v[1];
var _w = (0, react_1.useState)(false), downloadLoading = _w[0], setDownloadLoading = _w[1];
var onWheel = (0, lodash_1.throttle)(function (e) {
// e.preventDefault();
e.stopPropagation();
// 往下滚 缩小
if (e.deltaY > 0) {
setScale(function (value) { return Number((value - 0.1 <= 0.1 ? 0.1 : value - 0.1).toFixed(1)); });
}
// 往下滚 放大
else {
setScale(function (value) { return Number(Number(value + 0.1).toFixed(1)); });
}
}, 300);
// const { previewAddr, fileName, baseUrl, selectedAttachment = {} } = props;
(0, react_1.useImperativeHandle)(ref, function () { return ({
handleNext: handleNext,
handlePrev: handlePrev,
handlePdfNext: handlePdfNext,
handlePdfPrev: handlePdfPrev,
handleGetOriginSize: handleGetOriginSize
}); });
var resizeEnd = (0, lodash_1.throttle)(function () {
var _a, _b;
var bodyHigh = ((_a = previewRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().height) || 0;
// 文件高度 = 整个Modal高度 - title高度 - 底部操作栏高度(文件名+文件列表（文件数量大于1才有）+ 底部工具栏) - padding等边距
var finalHeight = bodyHigh - (states.mediaListShow && ((_b = previewInfo === null || previewInfo === void 0 ? void 0 : previewInfo.list) === null || _b === void 0 ? void 0 : _b.length) > 1 ? previewHeight : toolHigh) - previewTitleHigh.current + 4;
setScale(1);
setRotate(0);
setFileHigh(finalHeight);
// setFileWidth(previewRef.current?.getBoundingClientRect().width || 0);
}, 300);
var previewRefFn = (0, react_1.useCallback)(function (e) {
var _a;
if (e) {
// 找到content来进行计算
var contentDom = helper_1.domUtils.closest(e, '.ant-modal-content');
previewRef.current = contentDom;
previewTitleHigh.current = ((_a = contentDom.querySelector('.ant-modal-header')) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().height) || 0;
}
}, []);
var handleResetMoveData = function () {
var _a;
// const previewContainer = document.querySelector('.file-drag-container') as HTMLDivElement;
// previewContainer.style.transform = `translate(0, 0)`;
(_a = dragRef.current) === null || _a === void 0 ? void 0 : _a.updatePosition({ x: 0, y: 0 });
setScale(1);
setRotate(0);
};
var handleUnionImgShow = function (show) {
var selectList = states.selectList, items = states.items;
// 分割为20一个的数组
var totalUnionList = (0, lodash_1.chunk)(selectList, 20);
if (show) {
if (selectList.length < 2) {
msgsub_1.default._warning('请至少选择2张图片进行并图');
return;
}
// if (selectList.length > 20) {
// MSG._warning('最多可选20张进行并图')
// return
// }
var unionList_1 = items.filter(function (_, mediaIndex) { return totalUnionList[0].includes(mediaIndex); });
setStates(function (data) { return ((0, tslib_1.__assign)((0, tslib_1.__assign)({}, data), { unionImgShow: show, unionList: unionList_1, totalUnionList: totalUnionList, selectUnionImgIndex: 0 })); });
}
else {
setStates(function (data) { return ((0, tslib_1.__assign)((0, tslib_1.__assign)({}, data), { unionImgShow: show, unionList: [], totalUnionList: [], selectUnionImgIndex: 0 })); });
requestAnimationFrame(function () {
handleResetMoveData();
});
}
};
// 切换缩略图列表是否展示
var handleToggleMediaListShow = function () {
setStates(function (data) { return ((0, tslib_1.__assign)((0, tslib_1.__assign)({}, data), { mediaListShow: !data.mediaListShow })); });
};
// 并图勾选中
var handleUnionSelecting = function (show) {
if (!states.mediaListShow)
return;
setStates(function (data) { return ((0, tslib_1.__assign)((0, tslib_1.__assign)({}, data), { unionSelecting: show })); });
};
// 多选
var handleMediaListSelect = function (index) {
var unionSelecting = states.unionSelecting, _a = states.selectList, selectList = _a === void 0 ? [] : _a;
if (unionSelecting) {
var newSelectList_1 = (0, tslib_1.__spreadArray)([], selectList, true);
if (newSelectList_1.includes(index)) {
newSelectList_1 = newSelectList_1.filter(function (item) { return item !== index; });
}
else {
newSelectList_1.push(index);
}
setStates(function (data) { return ((0, tslib_1.__assign)((0, tslib_1.__assign)({}, data), { selectList: newSelectList_1 })); });
}
else {
if (index === states.index)
return;
setFileHigh(0);
setSelectAttachment(function () { return allAttachment[index]; });
setPageIndex(index);
setStates(function (data) { return ((0, tslib_1.__assign)((0, tslib_1.__assign)({}, data), { index: index })); });
if (allAttachment[index]['isNotImg']) {
resizeEnd();
}
}
};
//全选
var handleSelectAll = function (selectList) {
// const selectList = states.items?.map((_, index) => index);
setStates(function (data) { return ((0, tslib_1.__assign)((0, tslib_1.__assign)({}, data), { selectList: selectList })); });
};
//反选
var handleSelectReverse = function (deSelectList) {
setStates(function (data) { return ((0, tslib_1.__assign)((0, tslib_1.__assign)({}, data), { selectList: deSelectList })); });
};
// 切换到下一个文件
var handleNext = function () {
var index = states.index, items = states.items, unionImgShow = states.unionImgShow, unionList = states.unionList, selectUnionImgIndex = states.selectUnionImgIndex, totalUnionList = states.totalUnionList;
// 如果是并图模式
if (unionImgShow && (unionList === null || unionList === void 0 ? void 0 : unionList.length)) {
if (selectUnionImgIndex >= totalUnionList.length - 1)
return;
var nextIndex_1 = selectUnionImgIndex + 1;
var newUnionList_1 = items.filter(function (_, mediaIndex) { return totalUnionList[nextIndex_1].includes(mediaIndex); });
setStates(function (data) { return ((0, tslib_1.__assign)((0, tslib_1.__assign)({}, data), { index: nextIndex_1, selectUnionImgIndex: nextIndex_1, unionList: newUnionList_1 })); });
}
else {
if (index >= items.length - 1)
return;
setFileHigh(0);
var nextIndex_2 = index + 1;
var matchItem = items[nextIndex_2];
setSelectAttachment(matchItem);
setPageIndex(1);
setStates(function (data) { return ((0, tslib_1.__assign)((0, tslib_1.__assign)({}, data), { index: nextIndex_2 })); });
if (matchItem['isNotImg']) {
resizeEnd();
}
}
};
// 切换到上一个文件
var handlePrev = function () {
var index = states.index, items = states.items, unionImgShow = states.unionImgShow, unionList = states.unionList, selectUnionImgIndex = states.selectUnionImgIndex, totalUnionList = states.totalUnionList;
// 如果是并图模式
if (unionImgShow && (unionList === null || unionList === void 0 ? void 0 : unionList.length)) {
if (selectUnionImgIndex === 0)
return;
var prevIndex_1 = selectUnionImgIndex - 1;
var newUnionList_2 = items.filter(function (_, mediaIndex) { return totalUnionList[prevIndex_1].includes(mediaIndex); });
setStates(function (data) { return ((0, tslib_1.__assign)((0, tslib_1.__assign)({}, data), { index: prevIndex_1, selectUnionImgIndex: prevIndex_1, unionList: newUnionList_2 })); });
}
else {
if (index === 0)
return;
setFileHigh(0);
var prevIndex_2 = index - 1;
var matchItem = items[prevIndex_2];
setSelectAttachment(matchItem);
setPageIndex(1);
setStates(function (data) { return ((0, tslib_1.__assign)((0, tslib_1.__assign)({}, data), { index: prevIndex_2 })); });
if (matchItem['isNotImg']) {
resizeEnd();
}
}
};
// 切换到文件的下一页
var handlePdfNext = function () { return selectedAttachment.isNotImg && setPageIndex(function (index) { return index + 1 > pageNumber ? index : index + 1; }); };
// 切换到文件的上一页
var handlePdfPrev = function () { return selectedAttachment.isNotImg && setPageIndex(function (index) { return index - 1 === 0 ? index : index - 1; }); };
var handleGetOriginSize = function (isResetMaxWidth) { return (0, tslib_1.__awaiter)(void 0, void 0, void 0, function () {
return (0, tslib_1.__generator)(this, function (_a) {
handleResetMoveData();
// 获取原始尺寸
if (!selectedAttachment.isNotImg) {
// 如果是显示原始尺寸
if (isResetMaxWidth) {
setMaxImgWidth(undefined);
setPreviewImgInfo({
width: undefined,
height: undefined
});
}
setScale(1);
}
else {
requestAnimationFrame(function () {
resizeEnd();
});
}
return [2 /*return*/];
});
}); };
// 适应图片大小
var handleSetImgMatch = function () {
var _a, _b;
// 如果是图片
if (!selectedAttachment.isNotImg) {
setMaxImgWidth('100%');
var _c = (_a = previewRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect(), width = _c.width, height = _c.height;
var finalHeight = height - (states.mediaListShow && ((_b = previewInfo === null || previewInfo === void 0 ? void 0 : previewInfo.list) === null || _b === void 0 ? void 0 : _b.length) > 1 ? previewHeight : toolHigh) - previewTitleHigh.current + 4;
setFileHigh('auto');
setPreviewImgInfo({
width: Number(width) > 0 ? width + 'px' : undefined,
height: Number(finalHeight) > 0 ? finalHeight + 'px' : undefined
});
}
else {
resizeEnd();
}
handleResetMoveData();
};
var handleImgLoad = function () {
handleSetImgMatch();
// handleGetOriginSize();
};
(0, react_1.useEffect)(function () {
var _a;
if (previewInfo) {
var _b = previewInfo.list, list_1 = _b === void 0 ? [] : _b, _c = previewInfo.index, index_1 = _c === void 0 ? 0 : _c, isNotImg = previewInfo.isNotImg;
var matchItem = (_a = list_1 === null || list_1 === void 0 ? void 0 : list_1[index_1]) !== null && _a !== void 0 ? _a : {};
// handleSetAttachment(matchItem);
setSelectAttachment(matchItem);
setAllAttachment(list_1);
setStates(function (data) { return ((0, tslib_1.__assign)((0, tslib_1.__assign)({}, data), { items: list_1 !== null && list_1 !== void 0 ? list_1 : [], index: index_1 })); });
}
// document.body.addEventListener(ResizeEvent.DIALOGRESIZEENDEVENT, resizeEnd);
return function () {
// document.body.removeEventListener(ResizeEvent.DIALOGRESIZEENDEVENT, resizeEnd);
};
}, []);
var currentItem = (0, react_1.useMemo)(function () {
var _a, _b;
return (_b = (_a = states.items) === null || _a === void 0 ? void 0 : _a[states.index]) !== null && _b !== void 0 ? _b : {};
}, [states.index]);
// 生成className
var genItemClassName = (0, react_1.useMemo)(function () {
var items = states.items;
// 是否所有都是图片
var isAllImg = items.every(function (item) { return !(item === null || item === void 0 ? void 0 : item.isNotImg); });
// 所有都是图片的话，左右就都显示，切换上下个图片， 有文件的话，图片就不显示切换，文件显示切换
// return isAllImg ? false : !items[index]?.isNotImg;
// 如果当前是图片，且全部都是图片，但是就一张图片，就不显示左右箭头
var isMoreClassName = items.length > 1 ? [] : ['hidden'];
var prevClassName = isAllImg ? isMoreClassName : [];
var nextClassName = isAllImg ? isMoreClassName : [];
// 如果当前是图片，且全部都是图片，但是如果是在第一个或者最后一个，则disable
if (isAllImg) {
if (states.index < 1) {
prevClassName.push('hidden');
}
else {
prevClassName = prevClassName.filter(function (item) { return item !== 'hidden'; });
}
if (states.index >= items.length - 1) {
nextClassName.push('hidden');
}
else {
nextClassName = nextClassName.filter(function (item) { return item !== 'hidden'; });
}
}
else {
var isNotImg = currentItem.isNotImg;
// 如果是文件与图片混合的情况
// 如果当前是文件
if (isNotImg) {
if (states.items.length > 1) {
if (states.index < 1) {
prevClassName.push('hidden');
}
else {
prevClassName = prevClassName.filter(function (item) { return item !== 'hidden'; });
}
if (states.index >= items.length - 1 && pageIndex === pageNumber) {
nextClassName.push('hidden');
}
else {
nextClassName = nextClassName.filter(function (item) { return item !== 'hidden'; });
}
}
else {
if (pageIndex === 1) {
prevClassName.push('hidden');
}
else {
prevClassName = prevClassName.filter(function (item) { return item !== 'hidden'; });
}
if (pageIndex === pageNumber) {
nextClassName.push('hidden');
}
else {
nextClassName = nextClassName.filter(function (item) { return item !== 'hidden'; });
}
}
}
else {
// 当前是图片，且在第一张或最后一张，就隐藏上一个/下一个按钮
if (states.index < 1) {
prevClassName.push('hidden');
}
else {
prevClassName = prevClassName.filter(function (item) { return item !== 'hidden'; });
}
if (states.index >= items.length - 1) {
nextClassName.push('hidden');
}
else {
nextClassName = nextClassName.filter(function (item) { return item !== 'hidden'; });
}
}
}
return {
prev: prevClassName.join(' '),
next: nextClassName.join(' '),
};
}, [states.index, states.items, currentItem, pageIndex, pageNumber]);
var handleFileToggle = function (index, type) {
var isNotImg = currentItem.isNotImg;
// 如果是文件，在非第一个文件，在第一页的时候，可以且到上一个文件，同理，在最后一页的时候，可以切到下一个文件
isNotImg ? (type === 'next' ?
((pageIndex === pageNumber && states.index < states.items.length - 1) ? handleNext() : handlePdfNext())
:
((pageIndex === 1 && states.index >= 1) ? handlePrev() : handlePdfPrev()))
: (type === 'next' ? handleNext() : handlePrev());
};
// 渲染当前索引
var handleGenPreviewIndex = (0, react_1.useMemo)(function () {
var _a;
var items = states.items;
var isAllImg = items.every(function (item) { return !(item === null || item === void 0 ? void 0 : item.isNotImg); });
return (react_1.default.createElement("div", { className: "preview-tools-item preview-tools-item-index" }, isAllImg ?
react_1.default.createElement(react_1.default.Fragment, null,
states.index + 1,
"\u00A0/\u00A0", (_a = states.items) === null || _a === void 0 ? void 0 :
_a.length) : react_1.default.createElement(react_1.default.Fragment, null, !currentItem.isNotImg ? react_1.default.createElement(react_1.default.Fragment, null, "1\u00A0/\u00A01") : (react_1.default.createElement(react_1.default.Fragment, null,
" ",
pageIndex,
"\u00A0/\u00A0",
pageNumber)))));
}, [states.items, states.index, pageIndex, pageNumber, currentItem]);
return (react_1.default.createElement("div", { className: "preview-body", ref: previewRefFn },
states.unionImgShow ? (react_1.default.createElement("div", { className: "preview-pdf-container", style: { display: 'flex', alignItems: 'center', justifyContent: 'center', height: '100%' } },
(((_a = states.unionList) === null || _a === void 0 ? void 0 : _a.length) > 1) ? (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement("div", { className: "arrow-icon l " + (states.selectUnionImgIndex < 1 ? 'disabled' : ''), onClick: handlePrev },
react_1.default.createElement(icons_1.Icon, { icon: "#icon-tooltool_left", symbol: true })),
react_1.default.createElement("div", { className: "arrow-icon r " + (states.selectUnionImgIndex >= states.totalUnionList.length - 1 ? 'disabled' : ''), onClick: handleNext },
react_1.default.createElement(icons_1.Icon, { icon: "#icon-tooltool_right", symbol: true })))) : null,
react_1.default.createElement(UnionImgContent_1.default, { unionList: (_b = states.unionList) !== null && _b !== void 0 ? _b : [], handleUnionImgShow: handleUnionImgShow, onClose: onClose }))) : (
// 非并图模式，图片左右切换无效（先隐藏），文件左右切换为切换页码
react_1.default.createElement("div", { className: "preview-pdf-container", style: { display: 'flex', alignItems: 'center', justifyContent: 'center', height: '100%' }, onWheel: onWheel },
(((_c = states.items) === null || _c === void 0 ? void 0 : _c.length) >= 1) ? (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement("div", { className: "arrow-icon l " + genItemClassName['prev'], onClick: function () { return handleFileToggle(states.index, 'prev'); } },
react_1.default.createElement(icons_1.Icon, { icon: "#icon-tooltool_left", symbol: true })),
react_1.default.createElement("div", { className: "arrow-icon r " + genItemClassName['next'], onClick: function () { return handleFileToggle(states.index, 'next'); } },
react_1.default.createElement(icons_1.Icon, { icon: "#icon-tooltool_right", symbol: true })))) : null,
react_1.default.createElement("div", { className: 'preview-scroll-container', style: { minHeight: '100%' } },
react_1.default.createElement(react_rnd_1.Rnd, { ref: function (ref) { return dragRef.current = ref; }, enableResizing: false, bounds: undefined, className: 'file-drag-container', dragHandleClassName: "file-preview-handler", maxWidth: maxImgWidth,
// default={{ x: undefined, y: undefined, width: 'auto', height: 'auto' }}
style: { position: 'inherit', minHeight: minHeight }, onDragStart: function () { return setDragging(function () { return true; }); }, onDragStop: function () { return setDragging(function () { return false; }); }, enableUserSelectHack: false },
react_1.default.createElement("div", { className: "file-preview-handler", style: { transform: "scale(" + scale + ") rotate(" + rotate + "deg)" } }, !selectedAttachment.isNotImg ? (react_1.default.createElement(antd_1.Image, { style: { transformOrigin: 'center', pointerEvents: dragging ? 'none' : 'auto', maxWidth: previewImgInfo.width, maxHeight: previewImgInfo.height }, width: 'auto', height: FileHigh, src: selectedAttachment.originalSrc, preview: false, onLoad: handleImgLoad })) : (react_1.default.createElement(react_pdf_1.Document, { className: "preview-pdf", file: selectedAttachment.originalSrc,
// file="http://localhost:8001/api/v1/download/EMAIL_ATTACH/1039928825930055791?chunk=0&previewAddr=true"
// file="https://bwt.sanfu.com/saas/api/v1/download/EMAIL_ATTACH/1109110181199906965?chunk=0&previewAddr=true"
// file="https://sasdev.sanfu.com/saas_dev/api/v1/download/FORM_ALL_FILE_ONE/988130820110438706?chunk=0&previewAddr=true"
options: { cMapUrl: "https://unpkg.com/pdfjs-dist@" + react_pdf_1.pdfjs.version + "/cmaps/", cMapPacked: true }, error: react_1.default.createElement("span", { style: { color: 'black', fontSize: 18 } }, "\u65E0\u6CD5\u52A0\u8F7DPDF\u6587\u4EF6"), onLoadSuccess: function (data) {
handleImgLoad();
setPageIndex(1);
setPageNumber(data.numPages);
}, onLoadError: function () {
setPageIndex(1);
setPageNumber(1);
}, loading: react_1.default.createElement(antd_1.Spin, { style: { margin: 'auto' } }) },
react_1.default.createElement(react_pdf_1.Page, { key: (selectedAttachment === null || selectedAttachment === void 0 ? void 0 : selectedAttachment.title) + "-" + pageIndex, className: "preview-pdf-page", renderMode: 'svg', height: (0, utils_1.isPdf)((_d = selectedAttachment === null || selectedAttachment === void 0 ? void 0 : selectedAttachment.title) !== null && _d !== void 0 ? _d : '') ? (+(FileHigh !== null && FileHigh !== void 0 ? FileHigh : 0) * scale) : undefined, pageNumber: pageIndex, loading: react_1.default.createElement(antd_1.Spin, null) })))))))),
!states.unionImgShow ? (react_1.default.createElement("div", { className: "preview-box-fileName " + (states.mediaListShow && states.items.length > 1 ? 'showList' : '') }, selectedAttachment.title)) : null,
states.mediaListShow && !states.unionImgShow && states.items.length > 1 ? (react_1.default.createElement(MediaShowList_1.default, { mediaList: (_e = states.items) !== null && _e !== void 0 ? _e : [], currentIndex: states.index, mediaListShow: (_f = states.mediaListShow) !== null && _f !== void 0 ? _f : false, unionImgShow: states.unionImgShow, selectList: (_g = states.selectList) !== null && _g !== void 0 ? _g : [], unionSelecting: (_h = states.unionSelecting) !== null && _h !== void 0 ? _h : false, handleMediaListSelect: handleMediaListSelect, handleUnionImgShow: handleUnionImgShow, handleUnionSelecting: handleUnionSelecting, handleSelectAll: handleSelectAll, handleSelectReverse: handleSelectReverse })) : null,
!states.unionImgShow ? (react_1.default.createElement("div", { className: "preview-tools" },
handleGenPreviewIndex,
react_1.default.createElement(antd_1.Tooltip, { title: "\u4E0A\u4E00\u4E2A", placement: 'top' },
react_1.default.createElement(antd_1.Button, { className: "preview-tools-item " + (states.index < 1 ? 'disabled' : ''), type: "text", icon: react_1.default.createElement(icons_1.Icon, { icon: "#icon-tooltool_left", symbol: true }), onClick: handlePrev })),
react_1.default.createElement(antd_1.Tooltip, { title: "\u4E0B\u4E00\u4E2A", placement: 'top' },
react_1.default.createElement(antd_1.Button, { className: "preview-tools-item " + (states.index >= ((_j = states.items) === null || _j === void 0 ? void 0 : _j.length) - 1 ? 'disabled' : ''), type: "text", icon: react_1.default.createElement(icons_1.Icon, { icon: "#icon-tooltool_right", symbol: true }), onClick: handleNext })),
react_1.default.createElement(antd_1.Tooltip, { title: "\u5DE6\u8F6C", placement: 'top' },
react_1.default.createElement(antd_1.Button, { className: "preview-tools-item", type: "link", icon: react_1.default.createElement(icons_1.Icon, { icon: "#icon-toolimage_turnleft", symbol: true }), onClick: function () {
setRotate(function (rotate) { return rotate - 90; });
} })),
react_1.default.createElement(antd_1.Tooltip, { title: "\u53F3\u8F6C", placement: 'top' },
react_1.default.createElement(antd_1.Button, { className: "preview-tools-item", type: "link", icon: react_1.default.createElement(icons_1.Icon, { icon: "#icon-toolimage-turnright", symbol: true }), title: "\u53F3\u8F6C", onClick: function () {
setRotate(function (rotate) { return rotate + 90; });
} })),
react_1.default.createElement(antd_1.Tooltip, { title: "\u7F29\u5C0F", placement: 'top' },
react_1.default.createElement(antd_1.Button, { type: "link", icon: react_1.default.createElement(icons_1.Icon, { icon: "#icon-toolimage_turnsmall", symbol: true }), className: "preview-tools-item", onClick: function () { return setScale(function (value) { return Number(Number(value - 0.2 <= 0.2 ? 0.2 : value - 0.2).toFixed(1)); }); }, title: "\u7F29\u5C0F" })),
react_1.default.createElement(antd_1.Tooltip, { title: "\u539F\u59CB\u5C3A\u5BF8", placement: 'top' },
react_1.default.createElement(antd_1.Button, { type: "link", icon: react_1.default.createElement(icons_1.Icon, { icon: "#icon-toolimage_turnreturn", symbol: true }), className: "preview-tools-item", onClick: function () { return (0, tslib_1.__awaiter)(void 0, void 0, void 0, function () { return (0, tslib_1.__generator)(this, function (_a) {
return [2 /*return*/, handleGetOriginSize(true)];
}); }); } })),
react_1.default.createElement(antd_1.Tooltip, { title: "\u653E\u5927", placement: 'top' },
react_1.default.createElement(antd_1.Button, { type: "link", icon: react_1.default.createElement(icons_1.Icon, { icon: "#icon-toolimage_turnlarge", symbol: true }), className: "preview-tools-item", onClick: function () { return setScale(function (value) { return Number(Number(value + 0.2).toFixed(1)); }); } })),
react_1.default.createElement(antd_1.Tooltip, { title: "\u9002\u5E94\u56FE\u7247", placement: 'top' },
react_1.default.createElement(antd_1.Button, { type: "link", icon: react_1.default.createElement(icons_1.Icon, { icon: "#icon-toolimage_turnmarch", symbol: true }), className: "preview-tools-item", onClick: function () { return handleSetImgMatch(); } })),
react_1.default.createElement(antd_1.Tooltip, { title: "\u4E0B\u8F7D", placement: 'top' },
react_1.default.createElement(antd_1.Button, { type: "link", onClick: function (e) { return (0, tslib_1.__awaiter)(void 0, void 0, void 0, function () {
var res;
return (0, tslib_1.__generator)(this, function (_a) {
switch (_a.label) {
case 0:
if (!shell_1.Shell.hasShell()) return [3 /*break*/, 2];
e.preventDefault();
return [4 /*yield*/, shell_1.Shell.download(selectedAttachment.originalSrc, selectedAttachment.title)];
case 1:
res = _a.sent();
if (res.success) {
msgsub_1.default._success('执行成功');
}
else {
msgsub_1.default._error(res.msg || 'download error');
}
_a.label = 2;
case 2: return [2 /*return*/];
}
});
}); }, className: "preview-tools-item", href: selectedAttachment.downloadSrc, download: selectedAttachment.title, icon: react_1.default.createElement(icons_1.Icon, { icon: "#icon-toolimage_download", symbol: true }) })),
react_1.default.createElement(antd_1.Tooltip, { title: "\u5168\u90E8\u4E0B\u8F7D", placement: 'top' },
react_1.default.createElement(antd_1.Button, { type: "link", loading: downloadLoading, onClick: function (e) { return (0, tslib_1.__awaiter)(void 0, void 0, void 0, function () {
var items, origin_1, fetchList, res, blob, fileName;
var _a, _b, _c, _d;
return (0, tslib_1.__generator)(this, function (_e) {
switch (_e.label) {
case 0:
e.preventDefault();
antd_1.message.loading('下载中，请稍候...', 0);
_e.label = 1;
case 1:
_e.trys.push([1, , 4, 5]);
items = states.items;
origin_1 = (_c = (_b = (_a = props.env) === null || _a === void 0 ? void 0 : _a.axiosInstance) === null || _b === void 0 ? void 0 : _b.defaults) === null || _c === void 0 ? void 0 : _c.baseURL;
fetchList = items.map(function (item) { return ({ fileUrl: item.originalSrc.startsWith('http') ? item.originalSrc : origin_1 + item.originalSrc, fileName: item.title }); });
return [4 /*yield*/, ((_d = props.env) === null || _d === void 0 ? void 0 : _d.fetcher({ url: '/api/v1/batch/file/download', method: 'POST', data: fetchList, responseType: 'arraybuffer' }, {}))];
case 2:
res = _e.sent();
blob = new Blob([res.data], { type: 'application/zip' });
fileName = 'File-' + (0, dayjs_1.default)().format('YYYYMMDDHHmmss') + '.zip';
return [4 /*yield*/, tools_1.tools.openDownloadDialog(blob, fileName)];
case 3:
_e.sent();
return [3 /*break*/, 5];
case 4:
antd_1.message.destroy();
setDownloadLoading(false);
return [7 /*endfinally*/];
case 5: return [2 /*return*/];
}
});
}); }, className: "preview-tools-item", href: selectedAttachment.downloadSrc, download: selectedAttachment.title, icon: react_1.default.createElement(icons_1.Icon, { icon: "#icon-tooldownloadzip", className: "icon-download", symbol: true }) })),
!selectedAttachment.isNotImg ? (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement(antd_1.Tooltip, { title: "\u5E76\u56FE", placement: 'top' },
react_1.default.createElement(antd_1.Button, { type: "link", icon: react_1.default.createElement(icons_1.Icon, { icon: "#icon-toolmarchpic", symbol: true }), className: "preview-tools-item " + (states.unionSelecting ? 'checked' : '') + " " + (states.mediaListShow && states.items.length > 1 ? '' : 'disabled'), onClick: function () { return handleUnionSelecting(!states.unionSelecting); } })))) : null)) : null));
});
/** fileViewer - end */
return (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.cloneElement(children, {
onImageEnlarge: handleImageEnlarge
}),
visible ? react_1.default.createElement(DragModal_1.default, { className: 'preview-modal', dialogVisible: visible, footer: null, mask: false, centered: true, fullHeightOnInit: true, width: "60%", keyHandle: handlePreviewKeydown, minHeight: minHeight, minWidth: minWidth, title: '\u6587\u4EF6\u9884\u89C8', maskClosable: false, closeIcon: react_1.default.createElement(icons_2.CloseOutlined, { className: "preview-close" }), destroyOnClose: true, getContainer: (_a = props.env) === null || _a === void 0 ? void 0 : _a.getTopModalContainer, resizeable: true, canClickBelowDom: true, setMaxSize: true, drag: true, transitionName: "", onCancel: function () { return onClose(); }, bounds: false, boundDirection: ['top'] },
react_1.default.createElement(PcPreview, (0, tslib_1.__assign)({ ref: function (ref) { return pcPreviewRef.current = ref; } }, props))) : null));
};
exports.default = (0, theme_1.themeable)(ImageGallery);
//# sourceMappingURL=./components/ImageGallery.js.map