From 0667c04a4046989772bf378a6c093757c2e81ce5 Mon Sep 17 00:00:00 2001 From: yubao Date: Sat, 17 Mar 2018 21:41:04 +0800 Subject: [PATCH] =?UTF-8?q?=E6=8B=86=E5=88=86=E6=B5=81=E7=A8=8B=E8=AE=BE?= =?UTF-8?q?=E8=AE=A1=E4=B8=8E=E5=88=97=E8=A1=A8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- OpenAuth.Mvc/OpenAuth.Mvc.csproj | 4 +- OpenAuth.Mvc/Views/FlowSchemes/Design.cshtml | 89 +++++++++++ OpenAuth.Mvc/Views/FlowSchemes/Index.cshtml | 82 ---------- OpenAuth.Mvc/js/utils/flowlayout.js | 34 ++-- OpenAuth.Mvc/userJs/flowSchemeDesign.js | 159 +++++++++++++++++++ OpenAuth.Mvc/userJs/flowSchemes.js | 150 ++--------------- 6 files changed, 282 insertions(+), 236 deletions(-) create mode 100644 OpenAuth.Mvc/Views/FlowSchemes/Design.cshtml create mode 100644 OpenAuth.Mvc/userJs/flowSchemeDesign.js diff --git a/OpenAuth.Mvc/OpenAuth.Mvc.csproj b/OpenAuth.Mvc/OpenAuth.Mvc.csproj index c6fe5c48..d191cc15 100644 --- a/OpenAuth.Mvc/OpenAuth.Mvc.csproj +++ b/OpenAuth.Mvc/OpenAuth.Mvc.csproj @@ -205,6 +205,7 @@ + @@ -233,7 +234,7 @@ - + @@ -644,6 +645,7 @@ + diff --git a/OpenAuth.Mvc/Views/FlowSchemes/Design.cshtml b/OpenAuth.Mvc/Views/FlowSchemes/Design.cshtml new file mode 100644 index 00000000..99696621 --- /dev/null +++ b/OpenAuth.Mvc/Views/FlowSchemes/Design.cshtml @@ -0,0 +1,89 @@ + +@section header +{ + + +} + +
+ + +
+
+
    +
  • 基本信息
    • +
  • 选择表单
    • +
  • 流程设计
    • +
+
+
+ +
+ +
+ +
+
+
+ +
+ +
+
+ +
+ +
+ + +
+
+
+ +
+ + +
+
+ +
+ +
+ + +
+
+
+ +
+ +
+
+
+ +
+
    +
    +
    + +
    +
    +
    +
    +
    +
    + +
    +
    + + +
    +
    +
    + + + + diff --git a/OpenAuth.Mvc/Views/FlowSchemes/Index.cshtml b/OpenAuth.Mvc/Views/FlowSchemes/Index.cshtml index 581afdd0..b896358f 100644 --- a/OpenAuth.Mvc/Views/FlowSchemes/Index.cshtml +++ b/OpenAuth.Mvc/Views/FlowSchemes/Index.cshtml @@ -1,7 +1,6 @@ @section header { - }
    @Html.Action("MenuHeader", "Home") @@ -35,87 +34,6 @@ 查看 - - - diff --git a/OpenAuth.Mvc/js/utils/flowlayout.js b/OpenAuth.Mvc/js/utils/flowlayout.js index e5742c66..aebaae71 100644 --- a/OpenAuth.Mvc/js/utils/flowlayout.js +++ b/OpenAuth.Mvc/js/utils/flowlayout.js @@ -1,7 +1,7 @@ -layui.define("jquery", +layui.define(["jquery","layer"], function(exports) { var $ = layui.jquery; - + var layer = layui.layer; //初始化设计流程器 $.fn.flowdesign = function(options) { var $frmpreview = $(this); @@ -84,14 +84,14 @@ case "startround": _startroundFlag++; if (_fromlines[_node.id] == undefined) { - dialogTop("开始节点无法流转到下一个节点", "error"); + layer.msg("开始节点无法流转到下一个节点"); return -1; } break; case "endround": _endroundFlag++; if (_tolines[_node.id] == undefined) { - dialogTop("无法流转到结束节点", "error"); + layer.msg("无法流转到结束节点"); return -1; } break; @@ -107,43 +107,43 @@ _flag = true; break; default: - dialogTop("节点数据异常,请重新登录下系统！", "error"); + layer.msg("节点数据异常,请重新登录下系统！"); return -1; break; } if (_flag) { if (_tolines[_node.id] == undefined) { labellingRedNode(_node.id); - dialogTop("标注红色的节点没有【进来】的连接线段", "error"); + layer.msg("标注红色的节点没有【进来】的连接线段"); return -1; } if (_fromlines[_node.id] == undefined) { labellingRedNode(_node.id); - dialogTop("标注红色的节点没有【出去】的连接线段", "error"); + layer.msg("标注红色的节点没有【出去】的连接线段"); return -1; } } _nodes[_node.id] = _node; } if (_startroundFlag == 0) { - dialogTop("必须有开始节点", "error"); + layer.msg("必须有开始节点"); return -1; } if (_endroundFlag == 0) { - dialogTop("必须有结束节点", "error"); + layer.msg("必须有结束节点"); return -1; } if (_fnodes.length != _hnodes.length) { - dialogTop("分流节点必须等于合流节点", "error"); + layer.msg("分流节点必须等于合流节点"); return -1; } for (var a in _fnodes) { var aNondeid = _fnodes[a]; if (_fromlines[aNondeid].length == 1) { labellingRedNode(aNondeid); - dialogTop("标注红色的分流节点不允许只有一条【出去】的线段", "error"); + layer.msg("标注红色的分流节点不允许只有一条【出去】的线段"); return -1; } var _hhnodeid = {}; @@ -155,33 +155,33 @@ var _nextNode = _nodes[_nextLine[0]]; if (_nextNode.type != "confluencenode") { labellingRedNode(_nodes[btoNode].id); - dialogTop("标注红色的普通节点下一个节点必须是合流节点", "error"); + layer.msg("标注红色的普通节点下一个节点必须是合流节点"); return -1; } else { _hhnodeid[_nextLine[0]] = 0; if (_hhnodeid.length > 1) { labellingRedNode(aNondeid); - dialogTop("标注红色的分流节点与之对应的合流节点只能有一个", "error"); + layer.msg("标注红色的分流节点与之对应的合流节点只能有一个"); return -1; } if (_tolines[_nextLine[0]].length != _fromlines[aNondeid].length) { labellingRedNode(_nextLine[0]); - dialogTop("标注红色的合流节点与之对应的分流节点只能有一个", "error"); + layer.msg("标注红色的合流节点与之对应的分流节点只能有一个"); return -1; } } if (_nextLine.length > 1) { labellingRedNode(_nodes[btoNode].id); - dialogTop("标注红色的节点只能有一条出去的线条【分流合流之间】", "error"); + layer.msg("标注红色的节点只能有一条出去的线条【分流合流之间】"); return -1; } else if (_tolines[_nodes[btoNode].id], length > 1) { labellingRedNode(_nodes[btoNode].id); - dialogTop("标注红色的节点只能有一条进来的线条【分流合流之间】", "error"); + layer.msg("标注红色的节点只能有一条进来的线条【分流合流之间】"); return -1; } } else { labellingRedNode(aNondeid); - dialogTop("标注红色的分流节点必须经过一个普通节点到合流节点", "error"); + layer.msg("标注红色的分流节点必须经过一个普通节点到合流节点"); return -1; } } diff --git a/OpenAuth.Mvc/userJs/flowSchemeDesign.js b/OpenAuth.Mvc/userJs/flowSchemeDesign.js new file mode 100644 index 00000000..a080306b --- /dev/null +++ b/OpenAuth.Mvc/userJs/flowSchemeDesign.js @@ -0,0 +1,159 @@ +layui.config({ + base: "/js/" +}).use(['form', 'vue', 'ztree', 'layer', 'queryString', 'element', 'jquery', 'table', 'droptree', 'openauth', 'flow-ui/gooflow', 'utils/flowlayout'], function () { + var form = layui.form, element = layui.element, + //layer = (parent == undefined || parent.layer === undefined )? layui.layer : parent.layer, + layer = layui.layer, + $ = layui.jquery; + var table = layui.table; + var openauth = layui.openauth; + var id = $.getUrlParam("id"); //ID + var update = (id != ''); + //提交的URL + var url = "/FlowSchemes/Add"; + + var vm = new Vue({ + el: "#formEdit" + }); + + //表单选择 + var frmTree = function () { + var zTreeObj; + var setting = { + view: { selectedMulti: true }, + check: { + enable: true, + chkStyle: "checkbox", + chkboxType: { "Y": "", "N": "" } //去掉勾选时级联 + }, + data: { + key: { + name: 'Name', + title: 'Name' + }, + simpleData: { + enable: true, + idKey: 'Id', + pIdKey: 'ParentId', + rootPId: 'null' + } + }, + callback: { + onClick: function (event, treeId, treeNode) { + var id = treeNode.Id; + $.get("/forms/previewdata?id=" + id, function (data) { + $("#frmPreview").html(data); + }); + }, + onCheck: function (event, treeId, treeNode) { + $("#FrmId").val(treeNode.Id); + } + } + }; + + var load = function () { + var url = '/forms/load'; + $.getJSON(url, function (json) { + zTreeObj = $.fn.zTree.init($("#frmTree"), setting); + zTreeObj.addNodes(null, json.data); + + $("#menutree").html("点击预览表单效果"); + zTreeObj.expandAll(true); + }); + }; + + var setCheck = function (id) { //设置已经选中的表单 + if (id == null | id == '') return; + var node = zTreeObj.getNodeByParam("Id", id, null); + zTreeObj.checkNode(node, true, false); + + $.get("/forms/previewdata?id=" + id, function (data) { + $("#frmPreview").html(data); + }); + } + + return { + load: load, + setCheck: setCheck + } + }(); + + /*=========流程设计（begin）======================*/ + var flowDesignPanel = $('#flowPanel').flowdesign({ + height: 500, + widht: 700, + OpenNode: function (object) { + FlowDesignObject = object; //为NodeInfo窗口提供调用 + + if (object.$nodeData[object.$focus].type == 'startround') { + return false; + } + + layer.open({ + type: 2, + area: ['500px', '450px'], //宽高 + maxmin: true, //开启最大化最小化按钮 + title: '节点设置【' + object.$nodeData[object.$focus].name + '】', + content: '/flowschemes/nodeInfo', + btn: ['保存', '关闭'], + yes: function (index, layero) { + var body = layer.getChildFrame('body', index); + var iframeWin = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method(); + var nodedata = iframeWin.getVal(); + flowDesignPanel.SetNodeEx(object.$focus, nodedata); + layer.close(index); + }, + cancel: function (index) { + layer.close(index); + } + }); + }, + OpenLine: function (id, object) { + lay.msg("暂不能设置分支条件"); + return; + } + }); + /*=========流程设计（end）=====================*/ + + + frmTree.load(); + + if (update) { + $.get('/fllowschemes/get?id=' + id, + function (data) { + url = "/FlowSchemes/Update"; + vm.$set('$data', data); + flowDesignPanel.loadData(JSON.parse(data.SchemeContent)); + frmTree.setCheck(data.FrmId); + }); + } else { + vm.$set('$data', + { + Id: '' + }); + } + + + //提交数据 + form.on('submit()', + function (data) { + var content = flowDesignPanel.exportDataEx(); + if (content == -1) return false; + var schemecontent = { + SchemeContent: JSON.stringify(content) + } + + $.extend(data.field, schemecontent); + $.post(url, + data.field, + function (result) { + layer.msg(result.Message); + }, + "json"); + return false; + }); + + submit = function() { + $("#formEdit").submit(); + } +}) \ No newline at end of file diff --git a/OpenAuth.Mvc/userJs/flowSchemes.js b/OpenAuth.Mvc/userJs/flowSchemes.js index 59c30048..d6850fa6 100644 --- a/OpenAuth.Mvc/userJs/flowSchemes.js +++ b/OpenAuth.Mvc/userJs/flowSchemes.js @@ -1,6 +1,6 @@ layui.config({ base: "/js/" -}).use(['form', 'vue', 'ztree', 'layer', 'element', 'jquery', 'table', 'droptree', 'openauth', 'flow-ui/gooflow', 'utils/flowlayout'], function () { +}).use(['form', 'vue', 'ztree', 'layer', 'element', 'jquery', 'table', 'droptree', 'openauth'], function () { var form = layui.form, element = layui.element, //layer = (parent == undefined || parent.layer === undefined )? layui.layer : parent.layer, layer = layui.layer, @@ -66,108 +66,6 @@ } }(); - var vm = new Vue({ - el: "#formEdit" - }); - - //表单选择 - var frmTree = function () { - var zTreeObj; - var setting = { - view: { selectedMulti: true }, - check: { - enable: true, - chkStyle: "checkbox", - chkboxType: { "Y": "", "N": "" } //去掉勾选时级联 - }, - data: { - key: { - name: 'Name', - title: 'Name' - }, - simpleData: { - enable: true, - idKey: 'Id', - pIdKey: 'ParentId', - rootPId: 'null' - } - }, - callback: { - onClick: function (event, treeId, treeNode) { - var id = treeNode.Id; - $.get("/forms/previewdata?id=" + id, function (data) { - $("#frmPreview").html(data); - }); - }, - onCheck: function (event, treeId, treeNode) { - $("#FrmId").val(treeNode.Id); - } - } - }; - - var load = function () { - var url = '/forms/load'; - $.getJSON(url, function (json) { - zTreeObj = $.fn.zTree.init($("#frmTree"), setting); - zTreeObj.addNodes(null, json.data); - - $("#menutree").html("点击预览表单效果"); - zTreeObj.expandAll(true); - }); - }; - - var setCheck = function (id) { //设置已经选中的表单 - if (id == null | id == '') return; - var node = zTreeObj.getNodeByParam("Id", id, null); - zTreeObj.checkNode(node, true, false); - - $.get("/forms/previewdata?id=" + id, function (data) { - $("#frmPreview").html(data); - }); - } - - return { - load: load, - setCheck: setCheck - } - }(); - - /*=========流程设计（begin）======================*/ - var flowDesignPanel = $('#flowPanel').flowdesign({ - height: 500, - widht: 700, - OpenNode: function (object) { - FlowDesignObject = object; //为NodeInfo窗口提供调用 - - if (object.$nodeData[object.$focus].type == 'startround') { - return false; - } - - layer.open({ - type: 2, - area: ['500px', '450px'], //宽高 - maxmin: true, //开启最大化最小化按钮 - title: '节点设置【' + object.$nodeData[object.$focus].name + '】', - content: '/flowschemes/nodeInfo', - btn: ['保存', '关闭'], - yes: function (index, layero) { - var body = layer.getChildFrame('body', index); - var iframeWin = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method(); - var nodedata = iframeWin.getVal(); - flowDesignPanel.SetNodeEx(object.$focus, nodedata); - layer.close(index); - }, - cancel: function (index) { - layer.close(index); - } - }); - }, - OpenLine: function (id, object) { - lay.msg("暂不能设置分支条件"); - return; - } - }); - /*=========流程设计（end）=====================*/ //添加（编辑）对话框 var editDlg = function () { @@ -176,43 +74,23 @@ var show = function (data) { var title = update ? "编辑信息" : "添加"; - frmTree.load(); - layer.open({ + type: 2, + area: ['600px', '500px'], //宽高 + maxmin: true, //开启最大化最小化按钮 title: title, - area: ["800px", "600px"], - type: 1, - content: $('#divEdit'), - success: function () { - vm.$set('$data', data); - if (update) { - flowDesignPanel.loadData(JSON.parse(data.SchemeContent)); - frmTree.setCheck(data.FrmId); - } + content: '/flowschemes/design?id='+data.Id, + btn: ['保存', '关闭'], + yes: function (index, layero) { + var iframeWin = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method(); + iframeWin.submit(); + layer.close(index); + mainList(); }, - end: mainList + cancel: function (index) { + layer.close(index); + } }); - var url = "/FlowSchemes/Add"; - if (update) { - url = "/FlowSchemes/Update"; - } - //提交数据 - form.on('submit(formSubmit)', - function (data) { - var content = flowDesignPanel.exportDataEx(); - var schemecontent = { - SchemeContent: JSON.stringify(content) - } - - $.extend(data.field, schemecontent); - $.post(url, - data.field, - function (data) { - layer.msg(data.Message); - }, - "json"); - return false; - }); } return { add: function () { //弹出添加