routine update

OpenAuth.Mvc/Controllers/FlowInstancesController.cs

@@ -20,6 +20,27 @@ namespace OpenAuth.Mvc.Controllers
             return View();
         }
 
+        public ActionResult Edit()
+        {
+            return View();
+        }
+
+
+        public string Get(string id)
+        {
+            try
+            {
+                var result = new Response<FlowInstance> { Result = App.Get(id) };
+                return JsonHelper.Instance.Serialize(result);
+            }
+            catch (Exception ex)
+            {
+                Result.Code = 500;
+                Result.Message = ex.Message;
+            }
+            return JsonHelper.Instance.Serialize(Result);
+        }
+
         //添加或修改
         [System.Web.Mvc.HttpPost]
         public string Add(FlowInstance obj)

OpenAuth.Mvc/OpenAuth.Mvc.csproj

@@ -195,6 +195,7 @@
     <Content Include="js\flow\img\gooflow_icon.png" />
     <Content Include="js\utils\flowlayout.js" />
     <Content Include="js\utils\ui.js" />
+    <Content Include="userJs\flowInstanceEdit.js" />
     <Content Include="userJs\flowSchemes.js" />
     <Content Include="userJs\nodeInfo.js" />
     <Content Include="userJs\categories.js" />
@@ -639,6 +640,7 @@
     <Content Include="Views\FlowSchemes\Index.cshtml" />
     <Content Include="Views\FlowSchemes\NodeInfo.cshtml" />
     <Content Include="Views\FlowSchemes\Design.cshtml" />
+    <Content Include="Views\FlowInstances\Edit.cshtml" />
   </ItemGroup>
   <ItemGroup />
   <ItemGroup>

OpenAuth.Mvc/Views/FlowInstances/Edit.cshtml

@@ -0,0 +1,55 @@
+
+@section header
+{
+    <link rel="stylesheet" href="/css/treetable.css" />
+<link href="/js/flow/GooFlow.css" rel="stylesheet" />
+}
+
+<form class="layui-form" action="" id="formEdit">
+    <input type="hidden" name="Id" v-model="Id" />
+    <input type="hidden" id="FrmId" name="FrmId" v-model="FrmId" />
+    <input type="hidden" id="SchemeContent" name="SchemeContent" v-model="SchemeContent" />
+
+    <div class="layui-row">
+        <div class="layui-tab layui-tab-brief" lay-filter="tab">
+            <ul class="layui-tab-title">
+                <li class="layui-this">基本信息</li>
+                <li>选择流程模板</li>
+            </ul>
+
+            <div class="layui-tab-content">
+                <div class="layui-tab-item layui-show">
+                    
+                    <div class="layui-form-item">
+                        <label class="layui-form-label">标题</label>
+                        <div class="layui-input-block">
+                            <input type="text" name="CustomName" v-model="CustomName" required lay-verify="required"
+                                   placeholder="自定义名称" autocomplete="off" class="layui-input">
+                        </div>
+                    </div>
+
+                    <div class="layui-form-item">
+                        <label class="layui-form-label">备注</label>
+                        <div class="layui-input-block">
+                            <input type="text" name="Description" v-model="Description"
+                                   placeholder="备注" autocomplete="off" class="layui-input">
+                        </div>
+                    </div>
+                </div>
+
+                <div class="layui-tab-item">
+                    <ul id="frmTree" class="ztree" style="display: inline-block; width: 180px; padding: 10px; border: 1px solid #ddd; overflow: auto;"></ul>
+                    <div id="flowPanel" ></div>
+                    <div id="frmPreview"></div>
+                </div>
+
+            </div>
+        </div>
+    </div>
+    
+    <input type="hidden" lay-submit id="btnSubmit" lay-filter="formSubmit"/>
+</form>
+
+<script type="text/javascript" src="/layui/layui.js"></script>
+<script type="text/javascript" src="/userJs/flowInstanceEdit.js?v2"></script>
+

OpenAuth.Mvc/Views/FlowInstances/Index.cshtml

@@ -41,140 +41,6 @@
     <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>
 </script>
 
-<!--用户添加/编辑窗口-->
-<div id="divEdit" style="display: none">
-    <form class="layui-form" action="" id="formEdit">
-        <input type="hidden" name="Id" v-model="Id" />
-        <div class="layui-form-item">
-            <label class="layui-form-label">流程实例模板Id</label>
-            <div class="layui-input-block">
-                <input type="text" name="InstanceSchemeId" v-model="InstanceSchemeId" required lay-verify="required"
-                       placeholder="流程实例模板Id" autocomplete="off" class="layui-input">
-            </div>
-        </div>
-        <div class="layui-form-item">
-            <label class="layui-form-label">实例编号</label>
-            <div class="layui-input-block">
-                <input type="text" name="Code" v-model="Code" required lay-verify="required"
-                       placeholder="实例编号" autocomplete="off" class="layui-input">
-            </div>
-        </div>
-        <div class="layui-form-item">
-            <label class="layui-form-label">自定义名称</label>
-            <div class="layui-input-block">
-                <input type="text" name="CustomName" v-model="CustomName" required lay-verify="required"
-                       placeholder="自定义名称" autocomplete="off" class="layui-input">
-            </div>
-        </div>
-        <div class="layui-form-item">
-            <label class="layui-form-label">当前节点ID</label>
-            <div class="layui-input-block">
-                <input type="text" name="ActivityId" v-model="ActivityId" required lay-verify="required"
-                       placeholder="当前节点ID" autocomplete="off" class="layui-input">
-            </div>
-        </div>
-        <div class="layui-form-item">
-            <label class="layui-form-label">当前节点类型（0会签节点）</label>
-            <div class="layui-input-block">
-                <input type="radio" name="ActivityType" value="1" title="value1" checked>
-                <input type="radio" name="ActivityType" value="0" title="value2">
-            </div>
-        </div>
-        <div class="layui-form-item">
-            <label class="layui-form-label">当前节点名称</label>
-            <div class="layui-input-block">
-                <input type="text" name="ActivityName" v-model="ActivityName" required lay-verify="required"
-                       placeholder="当前节点名称" autocomplete="off" class="layui-input">
-            </div>
-        </div>
-        <div class="layui-form-item">
-            <label class="layui-form-label">前一个ID</label>
-            <div class="layui-input-block">
-                <input type="text" name="PreviousId" v-model="PreviousId" required lay-verify="required"
-                       placeholder="前一个ID" autocomplete="off" class="layui-input">
-            </div>
-        </div>
-        <div class="layui-form-item">
-            <label class="layui-form-label">表单类型</label>
-            <div class="layui-input-block">
-                <input type="radio" name="FrmType" value="1" title="value1" checked>
-                <input type="radio" name="FrmType" value="0" title="value2">
-            </div>
-        </div>
-        <div class="layui-form-item">
-            <label class="layui-form-label">流程类型</label>
-            <div class="layui-input-block">
-                <input type="text" name="SchemeType" v-model="SchemeType" required lay-verify="required"
-                       placeholder="流程类型" autocomplete="off" class="layui-input">
-            </div>
-        </div>
-        <div class="layui-form-item">
-            <label class="layui-form-label">有效标志</label>
-            <div class="layui-input-block">
-                <input type="radio" name="Disabled" value="1" title="value1" checked>
-                <input type="radio" name="Disabled" value="0" title="value2">
-            </div>
-        </div>
-        <div class="layui-form-item">
-            <label class="layui-form-label">创建时间</label>
-            <div class="layui-input-block">
-                <input type="text" name="CreateDate" v-model="CreateDate" required lay-verify="required"
-                       placeholder="创建时间" autocomplete="off" class="layui-input">
-            </div>
-        </div>
-        <div class="layui-form-item">
-            <label class="layui-form-label">创建用户主键</label>
-            <div class="layui-input-block">
-                <input type="text" name="CreateUserId" v-model="CreateUserId" required lay-verify="required"
-                       placeholder="创建用户主键" autocomplete="off" class="layui-input">
-            </div>
-        </div>
-        <div class="layui-form-item">
-            <label class="layui-form-label">创建用户</label>
-            <div class="layui-input-block">
-                <input type="text" name="CreateUserName" v-model="CreateUserName" required lay-verify="required"
-                       placeholder="创建用户" autocomplete="off" class="layui-input">
-            </div>
-        </div>
-        <div class="layui-form-item">
-            <label class="layui-form-label">等级</label>
-            <div class="layui-input-block">
-                <input type="radio" name="FlowLevel" value="1" title="value1" checked>
-                <input type="radio" name="FlowLevel" value="0" title="value2">
-            </div>
-        </div>
-        <div class="layui-form-item">
-            <label class="layui-form-label">实例备注</label>
-            <div class="layui-input-block">
-                <input type="text" name="Description" v-model="Description" required lay-verify="required"
-                       placeholder="实例备注" autocomplete="off" class="layui-input">
-            </div>
-        </div>
-        <div class="layui-form-item">
-            <label class="layui-form-label">是否完成</label>
-            <div class="layui-input-block">
-                <input type="radio" name="IsFinish" value="1" title="value1" checked>
-                <input type="radio" name="IsFinish" value="0" title="value2">
-            </div>
-        </div>
-        <div class="layui-form-item">
-            <label class="layui-form-label">执行人</label>
-            <div class="layui-input-block">
-                <input type="text" name="MakerList" v-model="MakerList" required lay-verify="required"
-                       placeholder="执行人" autocomplete="off" class="layui-input">
-            </div>
-        </div>
-
-
-        <div class="layui-form-item">
-            <div class="layui-input-block">
-                <button class="layui-btn" lay-submit lay-filter="formSubmit">立即提交</button>
-                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
-            </div>
-        </div>
-    </form>
-</div>
-
 <script type="text/javascript" src="/layui/layui.js"></script>
 <script type="text/javascript" src="/userJs/flowInstances.js"></script>
 

OpenAuth.Mvc/js/utils/flowlayout.js

@@ -9,20 +9,23 @@
                 return false;
             }
             $frmpreview.html("");
-            
 
-            var flowPanel = $.createGooFlow($(this),
+            var defaultcnf = {
-            {
+                width: 500,
-                width: options.width,
+                height: 400,
-                height: options.height,
+
-                
                 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: "转换连线",

OpenAuth.Mvc/userJs/flowInstanceEdit.js

@@ -0,0 +1,186 @@
+layui.config({
+    base: "/js/"
+}).use(['form', 'vue', 'ztree', 'layer', 'queryString', 'element', 'jquery', 'table', 'droptree', 'openauth', 'flow/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 index = parent.layer.getFrameIndex(window.name); //获取窗口索引
+     var id = $.getUrlParam("id");   //ID
+    var update = (id !=null && id != '');
+    //提交的URL
+    var url = "/FlowInstances/Add";
+
+    var vm = new Vue({
+        el: "#formEdit"
+    });
+
+    //标签切换
+    element.on('tab(tab)', function (data) {
+        parent.layer.iframeAuto(index);
+    });
+
+    /*=========流程设计（begin）======================*/
+    var flowDesignPanel = $('#flowPanel').flowdesign({
+        height: 300,
+        widht: 300,
+        haveTool: false,
+        OpenNode: function (object) {
+            FlowDesignObject = object;  //为NodeInfo窗口提供调用
+
+            if (object.type == 'start round mix' || object.type == 'end round') {
+                return false;
+            }
+
+            layer.open({
+                type: 2,
+                area: ['500px', '450px'], //宽高
+                maxmin: true, //开启最大化最小化按钮
+                title: '节点设置【' + object.name + '】',
+                content: '/flowschemes/nodeInfo',
+                btn: ['关闭'],
+                cancel: function (index) {
+                    layer.close(index);
+                }
+            });
+        },
+        OpenLine: function (id, object) {
+            lay.msg("暂不能设置分支条件");
+            return;
+        }
+    });
+    /*=========流程设计（end）=====================*/
+
+    //流程模板选择
+    var frmTree = function () {
+        var zTreeObj;
+        var setting = {
+            view: { selectedMulti: true },
+            check: {
+                enable: true,
+                chkStyle: "radio",
+                radioType: "all",  //整个节点一个分组
+                chkboxType: { "Y": "", "N": "" } //去掉勾选时级联
+            },
+            data: {
+                key: {
+                    name: 'SchemeName',
+                    title: 'SchemeName'
+                },
+                simpleData: {
+                    enable: true,
+                    idKey: 'Id',
+                    pIdKey: 'ParentId',
+                    rootPId: 'null'
+                }
+            },
+            callback: {
+                onClick: function (event, treeId, treeNode) {
+                    //预览表单
+                    $.get("/forms/previewdata?id=" + treeNode.FrmId, function (data) {
+                        $("#frmPreview").html(data);
+                    });
+
+                    //预览流程
+                    flowDesignPanel.loadData(JSON.parse(treeNode.SchemeContent));
+                },
+                onCheck: function (event, treeId, treeNode) {
+                    $("#FrmId").val(treeNode.FrmId);   //把流程模板的表单ID设置成流程实例的表单ID
+                    $("#SchemeContent").val(treeNode.SchemeContent);
+                    
+
+                    //预览表单
+                    $.get("/forms/previewdata?id=" + treeNode.FrmId, function (data) {
+                        $("#frmPreview").html(data);
+                    });
+
+                    //预览流程
+                    flowDesignPanel.loadData(JSON.parse(treeNode.SchemeContent));
+                }
+            }
+        };
+
+        var load = function () {
+            var url = '/flowschemes/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
+        }
+    }();
+
+    frmTree.load();
+
+    if (update) {
+        $.getJSON('/FlowInstances/get?id=' + id,
+            function (data) {
+                var obj = data.Result;
+                url = "/FlowInstances/Update";
+                vm.$set('$data', obj);
+                flowDesignPanel.loadData(JSON.parse(obj.SchemeContent));
+                frmTree.setCheck(obj.FrmId);
+            });
+    } else {
+        vm.$set('$data',
+            {
+                Id: ''
+            });
+    }
+
+
+    //提交数据
+    form.on('submit(formSubmit)',
+        function (data) {
+            var content = flowDesignPanel.exportData();
+            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; //阻止表单跳转。
+        });
+
+    //$(window).resize(function() {
+    //    flowDesignPanel.reinitSize($(window).width()-30, $(window).height()-100);
+    //});
+
+    //该函数供给父窗口确定时调用
+    submit = function () {
+        //只能用隐藏的submit btn才行，用form.submit()时data.field里没有数据
+        $("#btnSubmit").click();
+    }
+
+    //让层自适应iframe
+    parent.layer.iframeAuto(index);
+})

OpenAuth.Mvc/userJs/flowInstances.js

@@ -61,47 +61,37 @@
     }();
 
     //添加（编辑）对话框
-    var editDlg = function() {
+    var editDlg = function () {
-        var vm = new Vue({
+
-            el: "#formEdit"
-        });
         var update = false;  //是否为更新
         var show = function (data) {
             var title = update ? "编辑信息" : "添加";
+
             layer.open({
+                type: 2,
+                area: ['600px', '500px'], //宽高
+                maxmin: true, //开启最大化最小化按钮
                 title: title,
-                area: ["500px", "400px"],
+                content: '/flowInstances/edit?id=' + data.Id,
-                type: 1,
+                btn: ['保存', '关闭'],
-                content: $('#divEdit'),
+                yes: function (index, layero) {
-                success: function() {
+                    var iframeWin = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method();
-                    vm.$set('$data', data);
+                    iframeWin.submit();
                 },
-                end: mainList
+                cancel: function (index) {
+                    layer.close(index);
+                    mainList();
+                }
             });
-            var url = "/FlowInstances/Add";
-            if (update) {
-                url = "/FlowInstances/Update"; 
-            }
-            //提交数据
-            form.on('submit(formSubmit)',
-                function(data) {
-                    $.post(url,
-                        data.field,
-                        function(data) {
-                            layer.msg(data.Message);
-                        },
-                        "json");
-                    return false;
-                });
         }
         return {
-            add: function() { //弹出添加
+            add: function () { //弹出添加
                 update = false;
                 show({
                     Id: ''
                 });
             },
-            update: function(data) { //弹出编辑框
+            update: function (data) { //弹出编辑框
                 update = true;
                 show(data);
             }
@@ -116,7 +106,6 @@
         } 
     });
 
-
     //监听页面主按钮操作
     var active = {
         btnDel: function () {      //批量删除

OpenAuth.Mvc/userJs/flowSchemes.js

@@ -1,6 +1,6 @@
 layui.config({
     base: "/js/"
-}).use(['form', 'vue', 'ztree', 'layer', 'element', 'jquery', 'table', 'droptree', 'openauth'], function () {
+}).use(['form', 'vue', 'ztree', 'layer', '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,
@@ -8,11 +8,6 @@
     var table = layui.table;
     var openauth = layui.openauth;
 
-    //标签切换
-    element.on('tab(tab)', function (data) {
-        console.log(data);
-    });
-
     layui.droptree("/UserSession/GetOrgs", "#Organizations", "#OrganizationIds");
 
     //主列表加载，可反复调用进行刷新
@@ -84,10 +79,10 @@
                 yes: function (index, layero) {
                     var iframeWin = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method();
                     iframeWin.submit();
-                    mainList();
                 },
                 cancel: function (index) {
                     layer.close(index);
+                    mainList();
                 }
             });
         }