fastlion-amis/lib/components/Mobileprocess/Workflow/index.js

一种MIS页面生成工具

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var react_1 = tslib_1.__importStar(require("react"));
var antd_1 = require("antd");
var icons_1 = require("@ant-design/icons");
var lodash_1 = require("lodash");
require("./index.scss");
var FlowProcess_1 = tslib_1.__importDefault(require("../FlowProcess"));
var helper_1 = require("../../../utils/helper");
var icons_2 = require("../../icons");
var utils_1 = require("../../../renderers/Lion/utils/utils");
var tools_1 = require("../../../utils/shell/tools");
var statusObj = {
    submit: '提交申请',
    waiting: '待签核',
    doing: '签核中',
    revert: '撤销',
    refuse: '拒绝',
    pass: '通过',
    return: '退回'
};
var ModalFlow = function (props) {
    var _a;
    var visible = props.visible, render = props.render, onClose = props.onClose, env = props.env, flowDetail = props.flowDetail, onImageEnlarge = props.onImageEnlarge, language = props.language;
    var Mobile = (0, helper_1.isMobile)();
    // 移动端按钮
    var _b = (0, react_1.useState)(), form = _b[0], setForm = _b[1];
    var _c = (0, react_1.useState)(false), visibleOpen = _c[0], setVisibleOpen = _c[1];
    var replacedString = (_a = flowDetail === null || flowDetail === void 0 ? void 0 : flowDetail.flowDesc) === null || _a === void 0 ? void 0 : _a.replace(/\r\n/g, '<br>');
    var _d = (0, react_1.useState)(false), spinning = _d[0], setSpinning = _d[1];
    var currentaudit = function (value, title, titletype) {
        if (title === void 0) { title = ''; }
        if (titletype === void 0) { titletype = false; }
        if (title !== 'doneItem' || titletype) {
            switch (value) {
                case "doing":
                    // 待审批
                    return react_1.default.createElement("span", { className: "process_content_icon ".concat(!Mobile ? 'process_content_' + value : "") }, Mobile ? react_1.default.createElement(icons_2.Icon, { icon: "under-approval", className: "icon" }) : '签核中');
                case "refuse":
                    // 已拒绝
                    return react_1.default.createElement("span", { className: "process_content_icon ".concat(!Mobile ? 'process_content_' + value : "") }, Mobile ? react_1.default.createElement(icons_2.Icon, { icon: "refuse", className: "icon" }) : '已拒绝');
                case "pass":
                    // 已通过
                    return react_1.default.createElement("span", { className: "process_content_icon ".concat('process_content_' + value) }, Mobile ? react_1.default.createElement(icons_2.Icon, { icon: "passed", className: "icon" }) : '已通过');
                case "revert":
                    // 已撤回
                    return react_1.default.createElement("span", { className: "process_content_icon ".concat('process_content_' + value) }, Mobile ? react_1.default.createElement(icons_2.Icon, { icon: "withdrawn", className: "icon" }) : '已撤回');
                case "return":
                    // 已退回
                    return react_1.default.createElement("span", { className: "process_content_icon ".concat('process_content_' + value) }, Mobile ? react_1.default.createElement(icons_2.Icon, { icon: "returnicon", className: "icon" }) : '已退回');
                default:
                    // 未定义
                    return react_1.default.createElement("span", null, value);
            }
        }
        else {
            switch (value) {
                case "refuse":
                    // 已拒绝
                    return react_1.default.createElement("span", { className: "process_content_icon ".concat('process_content_' + value) },
                        react_1.default.createElement(icons_2.Icon, { icon: "rejected-icon", className: "icon" }));
                case "pass":
                    // 已通过
                    return react_1.default.createElement("span", { className: "process_content_icon ".concat('process_content_' + value) },
                        react_1.default.createElement(icons_2.Icon, { icon: "passed-icon", className: "icon" }));
                case "revert":
                    // 已撤回
                    return react_1.default.createElement("span", { className: "process_content_icon ".concat('process_content_' + value) },
                        react_1.default.createElement(icons_2.Icon, { icon: "refuse-icon", className: "icon" }));
                case "return":
                    return react_1.default.createElement("span", { className: "process_content_icon ".concat('process_content_' + value) },
                        react_1.default.createElement(icons_2.Icon, { icon: "return-icon", className: "icon" }));
                default:
                    // 未定义
                    return react_1.default.createElement("span", null);
            }
        }
    };
    // 抽屉头部
    var handleTltle = function (flowDetail) {
        return flowDetail ? react_1.default.createElement(react_1.default.Fragment, null,
            react_1.default.createElement("div", { className: "detailed_title ".concat(!Mobile ? "detailed_border detailed_Mobile" : "") },
                react_1.default.createElement("div", { className: 'detailed_title_left' },
                    react_1.default.createElement("div", { className: 'detailed_title_img_text' },
                        react_1.default.createElement("span", { className: 'detailed_title_img' },
                            react_1.default.createElement(icons_2.Icon, { icon: 'camera', className: "icon" })),
                        react_1.default.createElement("span", { className: 'detailed_title_text' }, flowDetail && flowDetail.flowProcess.processDefinitionName)),
                    flowDetail && currentaudit(flowDetail.flowProcess.processStatus)),
                react_1.default.createElement("div", { className: 'detailed_title_right' })),
            react_1.default.createElement("div", { className: 'characteristic' },
                language('Flow.approval.id') + ":" + (flowDetail === null || flowDetail === void 0 ? void 0 : flowDetail.flowProcess.approvalNo),
                react_1.default.createElement(antd_1.Button, { type: "text", icon: react_1.default.createElement(icons_2.Icon, { icon: "copy", className: "icon", size: true }), size: 'small', className: "characteristic_but", onClick: function () {
                        (0, utils_1.copy)(flowDetail === null || flowDetail === void 0 ? void 0 : flowDetail.flowProcess.approvalNo).then(function (_) {
                            antd_1.message.success(language('System.copy'));
                        });
                    } }))) : react_1.default.createElement(antd_1.Skeleton, { avatar: true, paragraph: { rows: 5 } });
    };
    var handleHeader = function () {
        return (flowDetail ? react_1.default.createElement("div", { className: "flow-drawer-header ".concat(!Mobile ? 'flow-drawer-header-mobile' : '') },
            Mobile && react_1.default.createElement("div", { className: 'left-text', onClick: function () { return onClose(false); } },
                react_1.default.createElement(icons_2.Icon, { icon: "title-left", style: { width: '16px', height: '16px' } })),
            react_1.default.createElement("div", { className: "flow-drawer-header-title" },
                react_1.default.createElement("div", { className: "flow-drawer-title" }, tools_1.tools.isComWx ? (Mobile ? '' : (flowDetail && handleTltle(flowDetail))) :
                    Mobile ? language('Flow.editDetail') : (flowDetail && handleTltle(flowDetail)))),
            react_1.default.createElement("div", { className: "flow-drawer-extra" }, !Mobile && react_1.default.createElement(react_1.default.Fragment, null,
                react_1.default.createElement("div", { className: 'flow-drawer-icon' },
                    react_1.default.createElement("span", { className: 'right-text-icon', onClick: infoDetails },
                        react_1.default.createElement(icons_1.QuestionOutlined, null)),
                    react_1.default.createElement("span", { className: "right-text" }, react_1.default.createElement("div", { style: { fontSize: '17px', cursor: 'pointer' }, onClick: function () { onClose(false); } },
                        react_1.default.createElement(icons_1.CloseOutlined, null)))),
                react_1.default.createElement("div", { className: 'flow-drawer-file' },
                    react_1.default.createElement("span", { className: 'right-text-icon' }),
                    react_1.default.createElement("span", { className: 'right-text-icon', onClick: function () { return handlePrint(); } },
                        react_1.default.createElement(icons_2.Icon, { icon: "print", className: "icon" }))))))
            :
                react_1.default.createElement(antd_1.Skeleton, { avatar: true, paragraph: { rows: 2 } }));
    };
    // 发起请求
    var handleRadios = (0, lodash_1.debounce)(function (api, spin) { return tslib_1.__awaiter(void 0, void 0, void 0, function () {
        var data, res;
        return tslib_1.__generator(this, function (_a) {
            switch (_a.label) {
                case 0:
                    spin && setSpinning(true);
                    data = tslib_1.__assign({}, (flowDetail && flowDetail.flowProcess));
                    return [4 /*yield*/, env.fetcher(api, data).finally()];
                case 1:
                    res = _a.sent();
                    if (res.status === 0) {
                        onClose(true);
                    }
                    else {
                        antd_1.message.error(res.msg);
                    }
                    spin && setSpinning(false);
                    return [2 /*return*/];
            }
        });
    }); }, 600);
    // 确定按钮文字 二次确定
    var showModal = function (item) {
        if (item.name == "flow_cancel") {
            onClose(false);
            return;
        }
    };
    var InPosition = function () {
        var data = flowDetail === null || flowDetail === void 0 ? void 0 : flowDetail.processNodeList.find(function (item) { return item.nodeStatus === "doing"; });
        if (data) {
            return "".concat(language('Flow.process.to')).concat(data.nodeName, "\uFF0C").concat(language('Flow.withdraw'), "\uFF1F");
        }
        else {
            return "".concat(language('Flow.the.process.has.ended'), "\uFF0C").concat(language('Flow.withdraw'), "\uFF1F");
        }
    };
    // 底部按钮
    var handleFooter = function () {
        var _a;
        return (flowDetail ? react_1.default.createElement("div", { className: "handling_opinions" },
            react_1.default.createElement(antd_1.Spin, { spinning: spinning, indicator: react_1.default.createElement(react_1.default.Fragment, null) }, (_a = flowDetail === null || flowDetail === void 0 ? void 0 : flowDetail.flowButtonList) === null || _a === void 0 ? void 0 : _a.map(function (item, index) {
                return (react_1.default.createElement(antd_1.Button, { className: "flowButtonList_button ".concat(item.name), onClick: function () {
                        showModal(item);
                        item.name == 'flow_revert' && info(item);
                        item.name == 'flow_urge' && infoUrge(item);
                    }, type: "primary", key: index }, item.label));
            }))) : react_1.default.createElement(react_1.default.Fragment, null));
    };
    // 撤回按钮
    var info = function (item) {
        antd_1.Modal.confirm({
            // '确认撤回当前表单'
            title: '确认撤回当前表单',
            content: ((0, helper_1.isMobile)() ? '' :
                react_1.default.createElement("div", { style: { clear: 'both', paddingLeft: 14 } },
                    react_1.default.createElement("p", null, InPosition()))),
            centered: true,
            icon: react_1.default.createElement(icons_1.ExclamationCircleFilled, { style: { color: "#FDA71E", fontSize: 36 } }),
            onOk: function () {
                return tslib_1.__awaiter(this, void 0, void 0, function () {
                    return tslib_1.__generator(this, function (_a) {
                        switch (_a.label) {
                            case 0: return [4 /*yield*/, handleRadios(item.api, true)];
                            case 1:
                                _a.sent();
                                return [2 /*return*/];
                        }
                    });
                });
            },
            getContainer: env.getModalContainer,
            zIndex: 1010,
            className: "".concat((0, helper_1.isMobile)() ? 'infoModalConfirm' : ''),
            okText: language('Flow.determine'),
            cancelText: language('cancel'),
            okButtonProps: {
                style: {
                    background: '#FDA71E',
                    color: 'white',
                    borderColor: '#FDA71E',
                    borderRadius: '4px',
                },
            },
        });
    };
    // 催办按钮
    var infoUrge = function (item) {
        antd_1.Modal.confirm({
            // // '确认撤回当前表单'
            title: '是否催办当前表单',
            onOk: function () {
                return tslib_1.__awaiter(this, void 0, void 0, function () {
                    return tslib_1.__generator(this, function (_a) {
                        switch (_a.label) {
                            case 0: return [4 /*yield*/, handleRadios(item.api, false)];
                            case 1:
                                _a.sent();
                                return [2 /*return*/];
                        }
                    });
                });
            },
            getContainer: env.getModalContainer,
            zIndex: 1011,
            centered: true,
            className: "".concat((0, helper_1.isMobile)() ? 'infoModalConfirm' : ''),
            icon: react_1.default.createElement(react_1.default.Fragment, null),
            okText: language('Flow.determine'),
            cancelText: language('cancel')
        });
    };
    var infoDetails = function () {
        antd_1.Modal.info({
            content: (react_1.default.createElement("div", { className: 'custom-modal-container-body' },
                react_1.default.createElement("div", { dangerouslySetInnerHTML: {
                        __html: replacedString || ''
                    } }))),
            icon: react_1.default.createElement(react_1.default.Fragment, null),
            className: 'custom-modal-container',
        });
    };
    var handlePrint = function () {
        var _a;
        if (flowDetail) {
            form.handleAction(undefined, {
                actionType: "form-print",
                type: "button",
                level: "info",
                name: Math.random().toString(),
                label: "打印",
                printInfo: {
                    title: flowDetail.flowProcess.processDefinitionName,
                    subTitle: (_a = statusObj[flowDetail.flowProcess.processStatus]) !== null && _a !== void 0 ? _a : flowDetail.flowProcess.processStatus,
                    extraTitle: "\u5BA1\u6279\u7F16\u53F7:".concat(flowDetail.flowProcess.approvalNo),
                    printFlow: true,
                    processNodeList: flowDetail.processNodeList
                }
            });
        }
    };
    return (react_1.default.createElement(react_1.default.Fragment, null, visible &&
        react_1.default.createElement(antd_1.Drawer, { style: Mobile ? undefined : {
                height: 'calc(100vh - 44px)',
                top: '44px'
            }, maskClosable: true, className: "process_drawer flow_dom_drawer ".concat(Mobile ? 'mobile' : 'pc'), closable: false, width: Mobile ? "100%" : '100%', visible: visible, onClose: function () { return onClose(false); }, getContainer: env.getDrawerContainer, destroyOnClose: true, zIndex: Mobile ? 1010 : 9, footer: handleFooter(), placement: "right", bodyStyle: { overflow: 'hidden' } },
            react_1.default.createElement(antd_1.Spin, { spinning: spinning, indicator: react_1.default.createElement(react_1.default.Fragment, null) }, handleHeader()),
            react_1.default.createElement(antd_1.Spin, { spinning: spinning, tip: '\u8BF7\u7A0D\u540E...' }, flowDetail ?
                react_1.default.createElement(FlowProcess_1.default, { getFilterForm: setForm, render: render, flowDetail: flowDetail, env: env, onImageEnlarge: onImageEnlarge, language: language, visibleOpen: visibleOpen, handleVisible: function (body) { return setVisibleOpen(body); } })
                :
                    react_1.default.createElement(antd_1.Skeleton, { paragraph: { rows: 20 } })))));
};
exports.default = ModalFlow;
//# sourceMappingURL=./components/Mobileprocess/Workflow/index.js.map