396 lines
20 KiB
JavaScript
396 lines
20 KiB
JavaScript
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", "fork", "join"],
|
||
haveGroup: true,
|
||
useOperStack: true,
|
||
needNoTag: true,
|
||
useName: "处理人",
|
||
tagName: { "1": "通过", "2": "不通过", "3": "驳回/撤回" },
|
||
tagClass: { "1": "#5cb85c", "2": "#d9534f", "3": "#f0ad4e" },
|
||
resultName: "结果",
|
||
timeName: "处理时间",
|
||
remarkName: "备注",
|
||
};
|
||
if (options != undefined) {
|
||
$.extend(defaultcnf, options);
|
||
}
|
||
|
||
var flowPanel = $.createWaterFlow($(this), defaultcnf);
|
||
flowPanel.setNodeRemarks({
|
||
cursor: "选择指针",
|
||
direct: "转换连线",
|
||
dashed: "关联虚线",
|
||
start: "开始节点",
|
||
end: "结束节点",
|
||
task: "任务节点",
|
||
node: "任务节点",
|
||
chat: "决策节点",
|
||
state: "状态节点",
|
||
plug: "附加插件",
|
||
fork: "会签开始节点",
|
||
join: "会签结束节点",
|
||
complex: "复合节点",
|
||
group: "组织划分框编辑开"
|
||
});
|
||
if (options != undefined
|
||
&& options.flowcontent != undefined
|
||
&& options.flowcontent != null) { //加载内容
|
||
flowPanel.loadData(options.flowcontent);
|
||
}
|
||
|
||
//导出数据扩展方法
|
||
//所有节点必须有进出线段
|
||
//必须有开始结束节点（且只能为一个）
|
||
//分流合流节点必须成对出现
|
||
//分流合流节点必须一一对应且中间必须有且只能有一个普通节点
|
||
//分流节点与合流节点之前的审核节点必须有且只能有一条出去和进来节点
|
||
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":
|
||
if (_node.setInfo == null) {
|
||
layer.msg("请设置任务节点【"+_node.name+"】操作人员");
|
||
return -1;
|
||
}
|
||
_flag = true;
|
||
break;
|
||
case "fork":
|
||
_flag = true;
|
||
fnodes.push(_node.id);
|
||
break;
|
||
case "join":
|
||
hnodes.push(_node.id);
|
||
_flag = true;
|
||
break;
|
||
default:
|
||
layer.msg("节点数据异常！");
|
||
return -1;
|
||
break;
|
||
}
|
||
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;
|
||
}
|
||
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.SetAreaEx = function (id, data) {
|
||
flowPanel.setName(id, data.AreaName, "area", data);
|
||
flowPanel.setAreaColor(id, data.AreaColor);
|
||
}
|
||
flowPanel.onItemDbClick = function (id, type) {
|
||
var obj = flowPanel.getItemInfo(id, type);
|
||
switch (type) {
|
||
case "node":
|
||
if ('OpenNode' in options) {
|
||
options.OpenNode(obj);
|
||
}
|
||
break;
|
||
case "line":
|
||
if ('OpenLine' in options) {
|
||
options.OpenLine(obj);
|
||
}
|
||
break;
|
||
case "area":
|
||
if ('OpenArea' in options) {
|
||
options.OpenArea(obj);
|
||
}
|
||
break;
|
||
}
|
||
return false;
|
||
}
|
||
flowPanel.onItemRightClick = function (id, type) {
|
||
var obj = flowPanel.getItemInfo(id, type);
|
||
switch (type) {
|
||
case "node":
|
||
if ('OpenNode' in options) {
|
||
options.OpenNode(obj);
|
||
}
|
||
break;
|
||
case "line":
|
||
if ('OpenLine' in options) {
|
||
options.OpenLine(obj);
|
||
}
|
||
break;
|
||
case "area":
|
||
if ('OpenArea' in options) {
|
||
options.OpenArea(obj);
|
||
}
|
||
break;
|
||
}
|
||
return false;
|
||
}
|
||
if (defaultcnf.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:0;display:inline-block;">';
|
||
if (defaultcnf.needNoTag==true) {
|
||
tipHtml +=
|
||
'<div style="display: inline-block;"><i style="padding-right:5px;color:#5bc0de;" class="layui-icon"></i><span>正在处理</span></div>';
|
||
}
|
||
if (!!defaultcnf.tagClass && Object.keys(defaultcnf.tagClass).length > 0) {
|
||
for (var p in defaultcnf.tagClass) {//遍历json对象的每个key/value对,p为key
|
||
tipHtml +=
|
||
'<div style="display: inline-block;;margin-left: 10px;"><i style="padding-right:5px;color:' + defaultcnf.tagClass[p] + ';" class="layui-icon"></i><span>' + defaultcnf.tagName[p] + '</span></div>';
|
||
}
|
||
}
|
||
if (defaultcnf.needNoTag == true) {
|
||
tipHtml +=
|
||
'<div style="display: inline-block;margin-left: 10px;"><i style="padding-right:5px;color:#999;" class="layui-icon"></i><span>未处理</span></div></div>';
|
||
}
|
||
$('.WaterFlow_work .WaterFlow_work_inner').css('background-image', 'none');
|
||
$('td').css('color', '#fff');
|
||
$frmpreview.css('background', '#fff');
|
||
$('.ico').remove();
|
||
$('.WaterFlow_item').css('border', '0px');
|
||
$frmpreview.append(tipHtml);
|
||
$.each(options.nodeData,
|
||
function (i, item) {
|
||
$("#" + item.id).css("background", "#999");
|
||
if (item.type == "start round mix") {
|
||
$("#" + item.id).css("background", "#5cb85c");
|
||
} else {
|
||
if (item.id == options.activityId) {
|
||
$("#" + item.id).css("background", "#5bc0de");
|
||
}
|
||
if (item.setInfo != undefined && item.setInfo.Taged != undefined) {
|
||
if (!!defaultcnf.tagName[item.setInfo.Taged]) {
|
||
$("#" + item.id).css("background", defaultcnf.tagClass[item.setInfo.Taged]);
|
||
} else {
|
||
$("#" + item.id).css("background", "#999");
|
||
}
|
||
}
|
||
}
|
||
if (item.setInfo != undefined && item.setInfo.Taged != undefined) {
|
||
var tips = '<div style="text-align:left">';
|
||
tips += "<p>" + defaultcnf.useName+"：" + item.setInfo.UserName + "</p>";
|
||
tips += "<p>" + defaultcnf.resultName + "：" + defaultcnf.tagName[item.setInfo.Taged] + "</p>";
|
||
tips += "<p>" + defaultcnf.timeName +"：" + item.setInfo.TagedTime + "</p>";
|
||
tips += "<pre>" + defaultcnf.remarkName +"：" + item.setInfo.Description + "</pre></div>";
|
||
|
||
$('#' + item.id).hover(function () {
|
||
layer.tips(tips, '#' + item.id);
|
||
});
|
||
} else {
|
||
$('#' + item.id).hover(function () {
|
||
layer.tips('暂无处理信息', '#' + item.id);
|
||
});
|
||
}
|
||
});
|
||
}
|
||
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 = { "all": "所有步骤通过", "one": "一个步骤通过即可", "2": "按百分比计算" };
|
||
if (options.flowcontent == undefined) return;
|
||
$.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> 基本信息</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> 审核者</div>';
|
||
_popoverhtml += '<ul>';
|
||
_popoverhtml += '<li>类型:' + _NodeDesignate[item.setInfo.NodeDesignate] + '</li>';
|
||
if (item.setInfo.NodeDesignateData != undefined) {
|
||
var _rowstr = "";
|
||
for (var i in item.setInfo.NodeDesignateData.roles) {
|
||
var _postitem = item.setInfo.NodeDesignateData.roles[i];
|
||
var _one = top.clientroleData[_postitem];
|
||
_rowstr += ' <span class="label label-success">' +
|
||
(_one == undefined ? _postitem : _one.FullName) +
|
||
'</span>';
|
||
if (i == item.setInfo.NodeDesignateData.roles.length - 1) {
|
||
_popoverhtml += '<li>角色:' + _rowstr + '</li>';
|
||
}
|
||
}
|
||
|
||
_rowstr = "";
|
||
for (var i in item.setInfo.NodeDesignateData.users) {
|
||
var _postitem = item.setInfo.NodeDesignateData.users[i];
|
||
var _one = clientuserData[_postitem];
|
||
_rowstr += ' <span class="label label-danger">' +
|
||
(_one == undefined ? _postitem : _one.RealName) +
|
||
'</span>';
|
||
if (i == item.setInfo.NodeDesignateData.users.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> 权限分配</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> 执行SQL</div>';
|
||
_popoverhtml += '<ul>';
|
||
_popoverhtml += '<li>数据库:' + DataBaseLinkData[item.setInfo.NodeDataBaseToSQL] + '</li>';
|
||
_popoverhtml += '<li>SQL语句:' + item.setInfo.NodeSQL + '</li>';
|
||
_popoverhtml += '</ul>';
|
||
}
|
||
|
||
$('#' + item.id).attr('title', item.name);
|
||
$('#' + item.id).attr('data-toggle', 'popover');
|
||
$('#' + item.id).attr('data-placement', 'bottom');
|
||
$('#' + item.id).attr('data-content', _popoverhtml);
|
||
} else {
|
||
$('#' + item.id).attr('title', item.name);
|
||
$('#' + item.id).attr('data-toggle', 'popover');
|
||
$('#' + item.id).attr('data-placement', 'bottom');
|
||
$('#' + item.id).attr('data-content', "该节点未被设置");
|
||
}
|
||
});
|
||
//$('.WaterFlow_item').popover({ html: true });
|
||
}
|
||
|
||
return flowPanel;
|
||
}
|
||
|
||
exports('flowlayout');
|
||
});
|
||
|
||
|
||
|
||
|
||
|