fastlion-amis
Version:
一种MIS页面生成工具
142 lines (141 loc) • 10.6 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var react_1 = tslib_1.__importStar(require("react"));
var button_1 = (0, tslib_1.__importDefault)(require("antd/lib/button"));
var antd_1 = require("antd");
var helper_1 = require("../../../utils/helper");
var icons_1 = require("../../../components/icons");
var tools_1 = require("../../../utils/shell/tools");
var icons_2 = require("@ant-design/icons");
var FlowProcess_1 = (0, tslib_1.__importDefault)(require("../MobileProcess/components/FlowProcess"));
var ActionSheet_1 = (0, tslib_1.__importDefault)(require("../../../components/Lion/ActionSheet"));
var lodash_1 = require("lodash");
require("./index.scss");
var utils_1 = require("../MobileProcess/components/utils/utils");
var ModalFlow = function (props) {
var visible = props.visible, flowDetail = props.flowDetail, env = props.env, render = props.render, onClose = props.onClose, onImageEnlarge = props.onImageEnlarge, handleContainer = props.handleContainer, handleRadio = props.handleRadio;
var Mobile = (0, helper_1.isMobile)();
var _a = (0, react_1.useState)([]), modalBt = _a[0], setModalBt = _a[1];
var _b = (0, react_1.useState)(false), isOpened = _b[0], setIsOpened = _b[1];
var _c = (0, react_1.useState)(false), isModalOpen = _c[0], setIsModalOpen = _c[1];
var _d = (0, react_1.useState)(''), modalApi = _d[0], setModalApi = _d[1];
var _e = (0, react_1.useState)("审批意见"), titleModle = _e[0], setTitleModle = _e[1];
var _f = (0, react_1.useState)(''), textValue = _f[0], setTextValue = _f[1];
var _g = (0, react_1.useState)(''), modleKo = _g[0], setModleKo = _g[1];
// 更多按钮
var menu = (react_1.default.createElement(antd_1.Menu, null, modalBt && modalBt.map(function (item, index) {
return react_1.default.createElement(antd_1.Menu.Item, { key: item.name + index },
react_1.default.createElement(button_1.default, { className: "flowButtonList_batton " + item.name, block: true, onClick: function () {
showModal(item);
}, key: index, style: { marginBottom: '5px' } }, item.label));
})));
//超过2个放在更多
(0, react_1.useEffect)(function () {
var _a;
if ((flowDetail === null || flowDetail === void 0 ? void 0 : flowDetail.flowButtonList) && (flowDetail === null || flowDetail === void 0 ? void 0 : flowDetail.flowButtonList.length) > 2) {
(_a = flowDetail === null || flowDetail === void 0 ? void 0 : flowDetail.flowButtonList) === null || _a === void 0 ? void 0 : _a.map(function (item, index) {
index >= 2 && ((modalBt === null || modalBt === void 0 ? void 0 : modalBt.length) < ((flowDetail === null || flowDetail === void 0 ? void 0 : flowDetail.flowButtonList.length) - 2)) && setModalBt(function (Item) { return Item ? (0, tslib_1.__spreadArray)((0, tslib_1.__spreadArray)([], Item, true), [item], false) : [item]; });
});
}
});
// 发起请求
var handleRadios = (0, lodash_1.debounce)(function (api) { return (0, tslib_1.__awaiter)(void 0, void 0, void 0, function () {
var data, res;
return (0, tslib_1.__generator)(this, function (_a) {
switch (_a.label) {
case 0:
data = (0, tslib_1.__assign)({}, (flowDetail && flowDetail.flowProcess));
return [4 /*yield*/, env.fetcher(api, data).finally()];
case 1:
res = _a.sent();
if (res.status === 0) {
setIsModalOpen(false);
onClose(true);
}
else {
antd_1.message.error(res.msg);
}
return [2 /*return*/];
}
});
}); }, 600);
// icon
// 确定按钮文字 二次确定
var showModal = function (item) {
if (item.name == "flow_cancel") {
onClose(false);
setTitleModle(item.label);
return;
}
switch (item.name) {
case 'flow_assign':
setModleKo('加签');
break;
case 'flow_return':
setModleKo('退回');
break;
case 'flow_agree':
setModleKo('通过');
break;
case 'flow_refuse':
setModleKo('拒绝');
break;
case 'flow_referral':
setModleKo('转申');
break;
default:
setModleKo('确定');
break;
}
setTextValue(item.name);
setTitleModle(item.label);
setModalApi(item.api);
setIsModalOpen(true);
};
// 底部按钮
var handleFooter = function () {
var _a;
return react_1.default.createElement("div", { className: "handling_opinions" },
react_1.default.createElement("div", { className: 'flowButtonList' },
modalBt.length > 0 &&
(!Mobile ?
react_1.default.createElement(antd_1.Dropdown, { placement: "top", trigger: ['click'], overlay: menu || react_1.default.createElement(react_1.default.Fragment, null) },
react_1.default.createElement(button_1.default, { block: true, icon: react_1.default.createElement(icons_2.UnorderedListOutlined, null), key: "handling_opinions" }, "\u66F4\u591A"))
:
react_1.default.createElement(ActionSheet_1.default, { key: 'actionSheet', isOpened: isOpened, container: env.getModalContainer, round: true, onHide: function (e) {
e.stopPropagation();
setIsOpened(false);
}, popupContent: react_1.default.createElement("div", { style: { width: '100%', padding: '5px 10px' } }, modalBt.map(function (item, index) { return react_1.default.createElement(button_1.default, { className: "flowButtonList_batton " + item.name, block: true, icon: (0, utils_1.handleBotton)(item.name), onClick: function () {
showModal(item),
setIsOpened(false);
}, key: index, style: { marginBottom: '5px' } }, item.label); })) },
react_1.default.createElement(button_1.default, { block: true, icon: react_1.default.createElement(icons_2.UnorderedListOutlined, null), onClick: function () { setIsOpened(true); }, key: "handling_opinions" }, "\u66F4\u591A"))), (_a = flowDetail === null || flowDetail === void 0 ? void 0 : flowDetail.flowButtonList) === null || _a === void 0 ? void 0 :
_a.map(function (item, index) {
if (index < 2) {
return react_1.default.createElement(button_1.default, { className: "flowButtonList_batton " + item.name, block: true, icon: (0, utils_1.handleBotton)(item.name), onClick: function () {
showModal(item);
}, key: index }, item.label);
}
return;
})),
!Mobile && react_1.default.createElement("div", { className: 'flowdrag', id: 'flowdrag' }));
};
return (react_1.default.createElement(react_1.default.Fragment, null,
visible && react_1.default.createElement(antd_1.Drawer, { className: "process_drawer " + (!Mobile ? 'pc_title' : ''), closeIcon: Mobile &&
react_1.default.createElement("span", { className: "left-text " },
react_1.default.createElement(icons_1.Icon, { icon: 'left-arrow-light', className: "icon" })), title: tools_1.tools.isComWx ?
(Mobile ? '' :
(flowDetail && (0, utils_1.handleTltle)(flowDetail))) :
Mobile ? '详情' : (flowDetail && (0, utils_1.handleTltle)(flowDetail)), onClose: function () { onClose(false); }, width: Mobile ? "100%" : '560px', visible: visible, getContainer: document.getElementById('amis-modal-container-flowing') || env.getModalContainer, destroyOnClose: true, style: {
transform: 'translateX(0px)',
}, extra: react_1.default.createElement("span", { className: "right-text" }, tools_1.tools.isComWx ? '' : Mobile ? '...' :
react_1.default.createElement("div", { style: { fontSize: '17px', cursor: 'pointer' }, onClick: function () { onClose(false); } },
react_1.default.createElement(icons_2.CloseOutlined, null))), footer: handleFooter(), placement: "right" }, flowDetail && react_1.default.createElement(FlowProcess_1.default, { render: render, flowDetail: flowDetail, env: env, onImageEnlarge: onImageEnlarge })),
visible && (Mobile ?
react_1.default.createElement(antd_1.Drawer, { className: 'process_drawer', closeIcon: react_1.default.createElement("span", { className: "left-text" },
react_1.default.createElement(icons_1.Icon, { icon: 'left-arrow-light', className: "icon" })), title: tools_1.tools.isComWx ? '' : titleModle, onClose: function () { return setIsModalOpen(false); }, width: "100%", visible: isModalOpen, getContainer: env.getModalContainer, mask: false, destroyOnClose: true, style: { transform: 'translateX(0px)' }, extra: react_1.default.createElement("span", { className: "right-text" }) }, handleContainer ? handleContainer(textValue, modalApi) : (0, utils_1.handleContainers)(textValue)) :
react_1.default.createElement(antd_1.Modal, { className: "process_modal " + textValue, okText: modleKo, cancelText: '\u53D6\u6D88', visible: isModalOpen, onOk: function () { modalApi && (handleRadio ? handleRadio(modalApi, textValue) : handleRadios(modalApi)); }, destroyOnClose: true, title: titleModle, width: 680, getContainer: document.getElementById('amis-modal-container-flowing') || env.getModalContainer, style: { position: 'fixed', top: '100px', right: 0, left: 0, bottom: 0 }, maskStyle: { position: 'fixed', top: 0, right: 0, left: 0, bottom: 0 }, zIndex: 1000, onCancel: function () { return setIsModalOpen(false); } }, handleContainer ? handleContainer(textValue, modalApi) : (0, utils_1.handleContainers)(textValue)))));
};
exports.default = ModalFlow;
//# sourceMappingURL=./renderers/Lion/Workflow/index.js.map