fastlion-amis
Version:
一种MIS页面生成工具
72 lines (71 loc) • 3.9 kB
JavaScript
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
// 浏览组件工具栏
var react_1 = tslib_1.__importStar(require("react"));
var utils_1 = require("../../renderers/Lion/utils/utils");
var ViewerUtils = function (props) {
var unionSelecting = props.unionSelecting, mediaListShow = props.mediaListShow, mediaList = props.mediaList, currentIndex = props.currentIndex, handleUnionSelecting = props.handleUnionSelecting, toggleMediaListShow = props.toggleMediaListShow, handleRotate = props.handleRotate, next = props.next, prev = props.prev;
var notImage = mediaList.every(function (_) { return _.isNotImg; });
var currentMedia = mediaList[currentIndex];
var currentMediaIsImg = !(currentMedia === null || currentMedia === void 0 ? void 0 : currentMedia.isNotImg);
console.log(mediaList);
// 控制面板显示隐藏
var _a = (0, react_1.useState)(true), showUtils = _a[0], setShowUtils = _a[1];
// 面板显示隐藏定时器
var timeOutRef = (0, react_1.useRef)(null);
// 工具列表
var utilsList = [
{ name: '上一张', disabled: currentIndex === 0, show: true, icon: 'fa-chevron-left', action: prev },
{ name: '下一张', disabled: currentIndex === mediaList.length - 1, show: true, icon: 'fa-chevron-right', action: next },
{
name: '下载',
show: true,
icon: 'fa-download',
action: function () {
(0, utils_1.downloadFile)(currentMedia.downloadSrc || currentMedia.originalSrc, currentMedia.title);
}
},
{
name: '并图',
show: notImage ? false : true,
icon: 'fa-files-o',
selected: unionSelecting,
action: function () {
handleUnionSelecting(!unionSelecting);
}
},
{ name: '逆时针', show: currentMediaIsImg, icon: 'fa-rotate-left', action: function () { handleRotate('anticlockwise'); } },
{ name: '顺时针', show: currentMediaIsImg, icon: 'fa-rotate-right', action: function () { handleRotate('clockwise'); } },
{
name: '显示列表',
show: true,
icon: ' fa-list',
selected: mediaListShow,
action: toggleMediaListShow
}
];
// 控制面板是否显示
var handleUtilsShow = function (visible) {
if (visible) {
timeOutRef.current && clearTimeout(timeOutRef.current);
!showUtils && setShowUtils(true);
}
else {
timeOutRef.current = setTimeout(function () {
setShowUtils(false);
}, 2000);
}
};
return react_1.default.createElement("div", { className: "viewerUtilsWrapper", onMouseOver: function () { handleUtilsShow(true); }, onMouseLeave: function () { handleUtilsShow(false); } }, showUtils &&
react_1.default.createElement("div", { className: "centerContent" },
react_1.default.createElement("div", { className: "actionListWrapper" }, utilsList.filter(function (item) { return item.show; }).map(function (utilItem, utilIndex) {
return react_1.default.createElement("div", { className: (0, utils_1.classNames)("utilItemWrapper", utilItem.selected && "utilItemWrapper_selected", utilItem.disabled && "utilItemWrapper_disabled"), key: utilIndex, onClick: function () {
var _a;
!utilItem.disabled && ((_a = utilItem.action) === null || _a === void 0 ? void 0 : _a.call(utilItem));
} },
react_1.default.createElement("i", { className: "fa " + utilItem.icon }));
}))));
};
exports.default = ViewerUtils;
//# sourceMappingURL=./components/Lion/ViewerUtils.js.map
;