OpenAuth.Net/OpenAuth.Mvc/js/utils/flowlayout.js

layui.define(["jquery","layer"],
    function(exports) {
        var $ = layui.jquery;
        var layer = layui.layer;
        //初始化设计流程器
        $.fn.flowdesign = function(options) {
            var $frmpreview = $(this);
            if (!$frmpreview.attr('id')) {
                return false;
            }
            $frmpreview.html("");

            var defaultcnf = {
                width: 500,
                height: 400,

                haveHead: false,
                haveTool: true,
                headLabel: true,
                toolBtns: ["start round mix", "end round", "node", "join", "fork"],
                haveGroup: true,
                useOperStack: true
            };
            if (options != undefined ) {
                $.extend(defaultcnf, options);
            }

            var flowPanel = $.createGooFlow($(this),defaultcnf);
            flowPanel.setNodeRemarks({
                cursor: "选择指针",
                direct: "转换连线",
                dashed: "关联虚线",
                start: "开始结点",
                end: "结束结点",
                task: "任务结点",
                node: "任务结点",
                chat: "决策结点",
                state: "状态结点",
                plug: "附加插件",
                fork: "分支结点",
                join: "联合结点",
                complex: "复合结点",
                group: "组织划分框编辑开"
            });
            flowPanel.loadData("");
            //导出数据扩展方法
            //所有节点必须有进出线段
            //必须有开始结束节点（且只能为一个）
            //分流合流节点必须成对出现
            //分流合流节点必须一一对应且中间必须有且只能有一个普通节点
            //分流节点与合流节点之前的审核节点必须有且只能有一条出去和进来节点
            //flowPanel.exportDataEx = function() {
            //    var _data = flowPanel.exportData();
            //    var _fromlines = {},
            //        _tolines = {},
            //        _nodes = {},
            //        _fnodes = [],
            //        _hnodes = [],
            //        _startroundFlag = 0,
            //        _endroundFlag = 0;
            //    for (var i in _data.lines) {
            //        if (_fromlines[_data.lines[i].from] == undefined) {
            //            _fromlines[_data.lines[i].from] = [];
            //        }
            //        _fromlines[_data.lines[i].from].push(_data.lines[i].to);

            //        if (_tolines[_data.lines[i].to] == undefined) {
            //            _tolines[_data.lines[i].to] = [];
            //        }
            //        _tolines[_data.lines[i].to].push(_data.lines[i].from);
            //    }
            //    for (var j in _data.nodes) {
            //        var _node = _data.nodes[j];
            //        var _flag = false;
            //        switch (_node.type) {
            //            case "start round mix":
            //            _startroundFlag++;
            //            if (_fromlines[_node.id] == undefined) {
            //                layer.msg("开始节点无法流转到下一个节点");
            //                return -1;
            //            }
            //            break;
            //            case "end round":
            //            _endroundFlag++;
            //            if (_tolines[_node.id] == undefined) {
            //                layer.msg("无法流转到结束节点");
            //                return -1;
            //            }
            //            break;
            //            case "node":
            //            _flag = true;
            //            break;
            //        case "shuntnode":
            //            _flag = true;
            //            _fnodes.push(_node.id);
            //            break;
            //        case "confluencenode":
            //            _hnodes.push(_node.id);
            //            _flag = true;
            //            break;
            //        default:
            //            layer.msg("节点数据异常,请重新登录下系统！");
            //            return -1;
            //            break;
            //        }
            //        if (_flag) {
            //            if (_tolines[_node.id] == undefined) {
            //                labellingRedNode(_node.id);
            //                layer.msg("标注红色的节点没有【进来】的连接线段");
            //                return -1;
            //            }
            //            if (_fromlines[_node.id] == undefined) {
            //                labellingRedNode(_node.id);
            //                layer.msg("标注红色的节点没有【出去】的连接线段");
            //                return -1;
            //            }
            //        }
            //        _nodes[_node.id] = _node;
            //    }
            //    if (_startroundFlag == 0) {
            //        layer.msg("必须有开始节点");
            //        return -1;
            //    }

            //    if (_endroundFlag == 0) {
            //        layer.msg("必须有结束节点");
            //        return -1;
            //    }

            //    if (_fnodes.length != _hnodes.length) {
            //        layer.msg("分流节点必须等于合流节点");
            //        return -1;
            //    }
            //    for (var a in _fnodes) {
            //        var aNondeid = _fnodes[a];
            //        if (_fromlines[aNondeid].length == 1) {
            //            labellingRedNode(aNondeid);
            //            layer.msg("标注红色的分流节点不允许只有一条【出去】的线段");
            //            return -1;
            //        }
            //        var _hhnodeid = {};
            //        for (var b in _fromlines[aNondeid]) {
            //            btoNode = _fromlines[aNondeid][b];
            //            if (_nodes[btoNode].type == "stepnode") {
            //                var _nextLine = _fromlines[_nodes[btoNode].id];

            //                var _nextNode = _nodes[_nextLine[0]];
            //                if (_nextNode.type != "confluencenode") {
            //                    labellingRedNode(_nodes[btoNode].id);
            //                    layer.msg("标注红色的普通节点下一个节点必须是合流节点");
            //                    return -1;
            //                } else {
            //                    _hhnodeid[_nextLine[0]] = 0;
            //                    if (_hhnodeid.length > 1) {
            //                        labellingRedNode(aNondeid);
            //                        layer.msg("标注红色的分流节点与之对应的合流节点只能有一个");
            //                        return -1;
            //                    }
            //                    if (_tolines[_nextLine[0]].length != _fromlines[aNondeid].length) {
            //                        labellingRedNode(_nextLine[0]);
            //                        layer.msg("标注红色的合流节点与之对应的分流节点只能有一个");
            //                        return -1;
            //                    }
            //                }
            //                if (_nextLine.length > 1) {
            //                    labellingRedNode(_nodes[btoNode].id);
            //                    layer.msg("标注红色的节点只能有一条出去的线条【分流合流之间】");
            //                    return -1;
            //                } else if (_tolines[_nodes[btoNode].id], length > 1) {
            //                    labellingRedNode(_nodes[btoNode].id);
            //                    layer.msg("标注红色的节点只能有一条进来的线条【分流合流之间】");
            //                    return -1;
            //                }
            //            } else {
            //                labellingRedNode(aNondeid);
            //                layer.msg("标注红色的分流节点必须经过一个普通节点到合流节点");
            //                return -1;
            //            }
            //        }

            //    }
            //    return _data;
            //}
            flowPanel.SetNodeEx = function(id, data) {
                flowPanel.setName(id, data.NodeName, "node", data);
            }
            flowPanel.SetLineEx = function(id, data) {
                flowPanel.setName(id, data.LineName, "line", data);
            }
            flowPanel.onItemDbClick = function (id, type) {
                var obj = flowPanel.getItemInfo(id, type);
                switch (type) {
                    case "node":
                        options.OpenNode(obj);
                        break;
                    case "line":
                        options.OpenLine(obj);
                        break;
                }
                return false;
            }
            if (options.isprocessing) //如果是显示进程状态
            {
                var tipHtml =
                    '<div style="position:absolute;left:10px;margin-top: 10px;padding:10px;border-radius:5px;background:rgba(0,0,0,0.05);z-index:1000;display:inline-block;">';
                tipHtml +=
                    '<div style="display: inline-block;"><i style="padding-right:5px;color:#5cb85c;" class="fa fa-flag"></i><span>已处理</span></div>';
                tipHtml +=
                    '<div style="display: inline-block;margin-left: 10px;"><i style="padding-right:5px;color:#5bc0de;" class="fa fa-flag"></i><span>正在处理</span></div>';
                tipHtml +=
                    '<div style="display: inline-block;margin-left: 10px;"><i style="padding-right:5px;color:#d9534f;" class="fa fa-flag"></i><span>不通过</span></div>';
                tipHtml +=
                    '<div style="display: inline-block;margin-left: 10px;"><i style="padding-right:5px;color:#f0ad4e;" class="fa fa-flag"></i><span>驳回</span></div>';
                tipHtml +=
                    '<div style="display: inline-block;margin-left: 10px;"><i style="padding-right:5px;color:#999;" class="fa fa-flag"></i><span>未处理</span></div></div>';

                $frmpreview.find('.GooFlow_work .GooFlow_work_inner').css('background-image', 'none');
                $frmpreview.find('td').css('color', '#fff');
                $frmpreview.css('background', '#fff');
                $frmpreview.find('.ico').remove();
                $frmpreview.find('.GooFlow_item').css('border', '0px');
                $frmpreview.append(tipHtml);
                $.each(options.nodeData,
                    function(i, item) {
                        $frmpreview.find("#" + item.id).css("background", "#999");
                        if (item.type == "startround") {
                            $frmpreview.find("#" + item.id).css("background", "#5cb85c");
                        } else {
                            if (item.id == options.activityId) {
                                $frmpreview.find("#" + item.id).css("background", "#5bc0de"); //正在处理
                            }
                            if (item.setInfo != undefined && item.setInfo.Taged != undefined) {
                                if (item.setInfo.Taged == -1) {
                                    $frmpreview.find("#" + item.id).css("background", "#d9534f"); //不通过
                                } else if (item.setInfo.Taged == 1) {
                                    $frmpreview.find("#" + item.id).css("background", "#5cb85c"); //通过
                                } else {
                                    $frmpreview.find("#" + item.id).css("background", "#f0ad4e"); //驳回
                                }
                            }
                        }
                        if (item.setInfo != undefined && item.setInfo.Taged != undefined) {
                            var _one = clientuserData[item.setInfo.UserId];
                            var _row = '<div style="text-align:left">';
                            var tagname = { "-1": "不通过", "1": "通过", "0": "驳回" };
                            _row += "<p>处理人：" + (_one == undefined ? item.setInfo.UserId : _one.RealName) + "</p>";
                            _row += "<p>结果：" + tagname[item.setInfo.Taged] + "</p>";
                            _row += "<p>处理时间：" + item.setInfo.TagedTime + "</p>";
                            _row += "<p>备注：" + item.setInfo.description + "</p></div>";

                            $frmpreview.find('#' + item.id).attr('data-toggle', 'tooltip');
                            $frmpreview.find('#' + item.id).attr('data-placement', 'bottom');
                            $frmpreview.find('#' + item.id).attr('title', _row);
                        }
                    });
                $('[data-toggle="tooltip"]').tooltip({ "html": true });
            }
            if (options.preview == 1) {
                preview();
            }

            //预览
            function preview() {
                var _frmitems = {};
                for (var i in options.frmData) {
                    var _frmitem = options.frmData[i];
                    _frmitems[_frmitem.control_field] = _frmitem.control_label;
                }
                var DataBaseLinkData = {};


                var _NodeRejectType = { "0": "前一步", "1": "第一步", "2": "某一步", "3": "用户指定", "4": "不处理" };
                var _NodeIsOver = { "0": "不允许", "1": "允许" };
                var _NodeDesignate = {
                    "NodeDesignateType1": "所有成员",
                    "NodeDesignateType2": "指定成员",
                    "NodeDesignateType3": "发起者领导",
                    "NodeDesignateType4": "前一步骤领导",
                    "NodeDesignateType5": "发起者部门领导",
                    "NodeDesignateType6": "发起者公司领导"
                };
                var _NodeConfluenceType = { "0": "所有步骤通过", "1": "一个步骤通过即可", "2": "按百分比计算" };
                $.each(options.flowcontent.nodes,
                    function(i, item) {
                        if (item.setInfo != undefined) {
                            var _popoverhtml = "";
                            _popoverhtml +=
                                '<div class="flow-portal-panel-title"><i class="fa fa-navicon"></i>&nbsp;&nbsp;基本信息</div>';
                            _popoverhtml += '<ul>';
                            _popoverhtml += '<li>节点标识:' + item.setInfo.NodeCode + '</li>';
                            _popoverhtml += '<li>驳回类型:' + _NodeRejectType[item.setInfo.NodeRejectType] + '</li>';
                            _popoverhtml += '<li>终止流程:' + _NodeIsOver[item.setInfo.NodeIsOver] + '</li>';
                            if (item.setInfo.Description != "") {
                                _popoverhtml += '<li>备注:' + item.setInfo.Description + '</li>';
                            }
                            if (item.setInfo.NodeConfluenceType != "") {
                                _popoverhtml += '<li>会签策略:' +
                                    _NodeConfluenceType[item.setInfo.NodeConfluenceType] +
                                    '</li>';
                                if (item.setInfo.NodeConfluenceType == 2) {
                                    _popoverhtml += '<li>会签比例:' + item.setInfo.NodeConfluenceRate + '</li>';
                                }
                            }
                            if (item.setInfo.NodeDataBase != "") {
                                _popoverhtml += '<li>绑定数据库:' + DataBaseLinkData[item.setInfo.NodeDataBase] + '</li>';
                            }
                            if (item.setInfo.NodeTable != "") {
                                _popoverhtml += '<li>绑定表名:' + item.setInfo.NodeTable + '</li>';
                            }
                            if (item.setInfo.NodePram != "") {
                                _popoverhtml += '<li>绑定字段:' + item.setInfo.NodePram + '</li>';
                            }
                            _popoverhtml += '</ul>';

                            _popoverhtml +=
                                '<div class="flow-portal-panel-title"><i class="fa fa-navicon"></i>&nbsp;&nbsp;审核者</div>';
                            _popoverhtml += '<ul>';
                            _popoverhtml += '<li>类型:' + _NodeDesignate[item.setInfo.NodeDesignate] + '</li>';
                            if (item.setInfo.NodeDesignateData != undefined) {
                                var _rowstr = "";
                                for (var i in item.setInfo.NodeDesignateData.role) {
                                    var _postitem = item.setInfo.NodeDesignateData.role[i];
                                    var _one = top.clientroleData[_postitem];
                                    _rowstr += ' <span class="label label-success">' +
                                        (_one == undefined ? _postitem : _one.FullName) +
                                        '</span>';
                                    if (i == item.setInfo.NodeDesignateData.role.length - 1) {
                                        _popoverhtml += '<li>角色:' + _rowstr + '</li>';
                                    }
                                }

                                _rowstr = "";
                                for (var i in item.setInfo.NodeDesignateData.user) {
                                    var _postitem = item.setInfo.NodeDesignateData.user[i];
                                    var _one = clientuserData[_postitem];
                                    _rowstr += ' <span class="label label-danger">' +
                                        (_one == undefined ? _postitem : _one.RealName) +
                                        '</span>';
                                    if (i == item.setInfo.NodeDesignateData.user.length - 1) {
                                        _popoverhtml += '<li>用户:' + _rowstr + '</li>';
                                    }
                                }
                            }
                            _popoverhtml += '</ul>';

                            var _row = "";
                            for (var i in item.setInfo.frmPermissionInfo) {
                                var _item = item.setInfo.frmPermissionInfo[i];
                                var _downtext = "";
                                if (_item.down) {
                                    _downtext = ' | 可下载';
                                } else if (_item.down != undefined) {
                                    _downtext = ' | 不可下载';
                                }
                                _row += '<li>' +
                                    _frmitems[_item.fieldid] +
                                    ': ' +
                                    (_item.look ? '可查看' : '不可查看') +
                                    _downtext +
                                    '</li>';
                                if (i == item.setInfo.frmPermissionInfo.length - 1) {
                                    _popoverhtml +=
                                        '<div class="flow-portal-panel-title"><i class="fa fa-navicon"></i>&nbsp;&nbsp;权限分配</div>';
                                    _popoverhtml += '<ul>';
                                    _popoverhtml += _row;
                                    _popoverhtml += '</ul>';
                                }
                            }

                            if (item.setInfo.NodeDataBaseToSQL != "" || item.setInfo.NodeSQL != "") {
                                _popoverhtml +=
                                    '<div class="flow-portal-panel-title"><i class="fa fa-navicon"></i>&nbsp;&nbsp;执行SQL</div>';
                                _popoverhtml += '<ul>';
                                _popoverhtml += '<li>数据库:' + DataBaseLinkData[item.setInfo.NodeDataBaseToSQL] + '</li>';
                                _popoverhtml += '<li>SQL语句:' + item.setInfo.NodeSQL + '</li>';
                                _popoverhtml += '</ul>';
                            }

                            $frmpreview.find('#' + item.id).attr('title', item.name);
                            $frmpreview.find('#' + item.id).attr('data-toggle', 'popover');
                            $frmpreview.find('#' + item.id).attr('data-placement', 'bottom');
                            $frmpreview.find('#' + item.id).attr('data-content', _popoverhtml);
                        } else {
                            $frmpreview.find('#' + item.id).attr('title', item.name);
                            $frmpreview.find('#' + item.id).attr('data-toggle', 'popover');
                            $frmpreview.find('#' + item.id).attr('data-placement', 'bottom');
                            $frmpreview.find('#' + item.id).attr('data-content', "该节点未被设置");
                        }
                    });
                $frmpreview.find('.GooFlow_item').popover({ html: true });
            }

            function labellingRedNode(id) {
                $frmpreview.find('.flow-labellingnode-red').removeClass('flow-labellingnode-red');
                $frmpreview.find('#' + id).addClass('flow-labellingnode-red');
            }

            return flowPanel;
        }

        exports('utils/flowlayout');   //只有这样写才能找到utils/flowlayout？？好尴尬
    });