<!DOCTYPE HTML> 
 | 
<html xmlns:th="http://www.thymeleaf.org"> 
 | 
<head> 
 | 
    <meta charset="utf-8"> 
 | 
    <META HTTP-EQUIV="Pragma" CONTENT="no-cache"> 
 | 
    <meta name="renderer" content="webkit|ie-comp|ie-stand"> 
 | 
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
 | 
    <meta name="viewport" 
 | 
          content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/> 
 | 
    <meta http-equiv="Cache-Control" content="no-siteapp"/> 
 | 
    <LINK rel="Bookmark" th:href="@{/images/favicon.ico}"> 
 | 
    <!-- 本框架基本脚本和样式 --> 
 | 
    <script type="text/javascript" 
 | 
            th:src="@{/js/plugin/jquery-2.1.4.min.js}"></script> 
 | 
    <script type="text/javascript" th:src="@{/js/systools/MBase.js}"></script> 
 | 
    <link rel="stylesheet" 
 | 
          th:href="@{/plugin/zTree/zTreeStyle/zTreeStyle.css}" type="text/css"> 
 | 
    <script type="text/javascript" 
 | 
            th:src="@{/plugin/zTree/jquery.ztree.core-3.5.min.js}"></script> 
 | 
    <script type="text/javascript" 
 | 
            th:src="@{/plugin/zTree/jquery.ztree.excheck.min.js}"></script> 
 | 
    <style type="text/css"> 
 | 
        .permission-list > dd > dl > dt { 
 | 
            width:140px; 
 | 
  
 | 
        } 
 | 
  
 | 
        #powerBox { 
 | 
            max-height: 500px; 
 | 
            overflow: scroll; 
 | 
            overflow-x: hidden; 
 | 
            border: 1px solid #aeaeae; 
 | 
            border-radius: 5px; 
 | 
            padding: 0; 
 | 
        } 
 | 
    </style> 
 | 
</head> 
 | 
  
 | 
<body> 
 | 
<div class="ibox-content"> 
 | 
    <form class="form-horizontal" id="dataform" 
 | 
          onsubmit="javascripr:return false;"> 
 | 
        <input autocomplete="off"   type="hidden" name="roleId" th:value="${obj.roleId }"> 
 | 
        <input autocomplete="off"   type="hidden" name="tokenUrl" th:value="${tokenUrl}"> 
 | 
        <input autocomplete="off"   type="hidden" name="token" th:value="${token}"> 
 | 
        <div class="form-group"> 
 | 
            <label class="col-sm-2 control-label">角色名称<span 
 | 
                    class="text-danger">*</span></label> 
 | 
            <div class="col-sm-4"> 
 | 
                <input autocomplete="off"   type="text" class="form-control" th:value="${obj.roleName}" 
 | 
                       name="roleName" datatype="*2-16" nullmsg="角色名称不能为空"> 
 | 
                <div class="Validform_checktip"></div> 
 | 
            </div> 
 | 
            <label class="col-sm-2 control-label">可查询所有门店数据</label> 
 | 
            <div class="col-sm-4"> 
 | 
                <select class="form-control" name="roleRemark"> 
 | 
                    <option th:selected="${obj?.roleRemark == '是'}" >是</option> 
 | 
                    <option th:selected="${obj?.roleRemark == '否'}" >否</option> 
 | 
                </select> 
 | 
            </div> 
 | 
        </div> 
 | 
        <div class="form-group"> 
 | 
            <label class="col-sm-2 control-label">可查询所有门店客户</label> 
 | 
            <div class="col-sm-4"> 
 | 
                <select class="form-control" name="customer"> 
 | 
                    <option th:selected="${obj?.customer == '是'}" >是</option> 
 | 
                    <option th:selected="${obj?.customer == '否'}" >否</option> 
 | 
                </select> 
 | 
            </div> 
 | 
            <label class="col-sm-2 control-label">是否允许门店分配本角色</label> 
 | 
            <div class="col-sm-4"> 
 | 
                <select class="form-control" name="shopAble"> 
 | 
                    <option th:selected="${obj?.shopAble == 1}" value="1" >是</option> 
 | 
                    <option th:selected="${obj?.shopAble == 2}" value="2">否</option> 
 | 
                </select> 
 | 
            </div> 
 | 
        </div> 
 | 
  
 | 
        <div class="form-group"> 
 | 
            <label class="col-sm-2 control-label">功能权限</label> 
 | 
            <div class=" ztree col-sm-9" id="treeRole"></div> 
 | 
        </div> 
 | 
  
 | 
        <div class="form-group "> 
 | 
            <div class="col-sm-12 text-center"> 
 | 
                <a href="javascript:;" onclick="myForm.submit()" 
 | 
                   class="btn btn-success radius"><i class="fa fa-check"></i> 保存</a>     
 | 
                <a class="btn btn-danger radius" href="javascript:;" 
 | 
                   onclick="MTools.closeForm()"><i class="fa fa-close"></i> 关闭</a> 
 | 
            </div> 
 | 
        </div> 
 | 
    </form> 
 | 
</div> 
 | 
<script type="text/javascript" th:src="@{/js/systools/MJsBase.js}"></script> 
 | 
<script th:inline="javascript"> 
 | 
    var invokeUrl = basePath + "/admin/sysRole/su/addRole"; 
 | 
  
 | 
    /*<![CDATA[*/ 
 | 
    var obj =/*[[${obj}]]*/ 
 | 
    /*]]>*/ 
 | 
  
 | 
    // 权限数据 
 | 
    /*<![CDATA[*/ 
 | 
    var roleArr =/*[[${functions}]]*/ 
 | 
    /*]]>*/ 
 | 
    if (obj.roleId != null) { 
 | 
        invokeUrl = basePath + "/admin/sysRole/su/modifyRole"; 
 | 
    } 
 | 
  
 | 
    $(function () { 
 | 
        myForm = MForm.initForm({ 
 | 
            invokeUrl: invokeUrl, 
 | 
            beforeSubmit: function () { 
 | 
                // 加入权限参数 
 | 
                var tree = $.fn.zTree.getZTreeObj("treeRole"); 
 | 
                var items = tree.getCheckedNodes(); 
 | 
  
 | 
                console.log(items); 
 | 
                // 分为菜单  按钮 
 | 
                var menuKeys = ""; 
 | 
                var btnKeys = ""; 
 | 
                for (var i = 0; i < items.length; i++) { 
 | 
                    // 判断是哪种类型的 
 | 
                    var btnValue = items[i]["btnValue"]; 
 | 
                    if (btnValue) { 
 | 
                        // 父ID 
 | 
                        var parentFnId = items[i]["pId"]; 
 | 
                        // 按钮 
 | 
                        btnKeys += parentFnId + "-" + btnValue + ","; 
 | 
                    } else { 
 | 
                        if(items[i]["id"]){ 
 | 
                            menuKeys += items[i]["id"] + ","; 
 | 
                        } 
 | 
                    } 
 | 
  
 | 
                } 
 | 
                myForm.initParam.extendParam = { 
 | 
                    "menuKeys": menuKeys, 
 | 
                    "btnKeys": btnKeys 
 | 
                }; 
 | 
            }, 
 | 
            afterSubmit: function () { 
 | 
                parent.myGrid.serchData(); 
 | 
            }, 
 | 
  
 | 
        }); 
 | 
        initFunctionRoleTree(roleArr); 
 | 
    }); 
 | 
  
 | 
  
 | 
    // 树节点 
 | 
    var zNodes = []; 
 | 
  
 | 
    var setting = { 
 | 
        check: { 
 | 
            enable: true, 
 | 
            nocheckInherit: true 
 | 
        }, 
 | 
        data: { 
 | 
            simpleData: { 
 | 
                enable: true, 
 | 
                idKey: "id", 
 | 
                pIdKey: "pId", 
 | 
                rootPId: 0 
 | 
            } 
 | 
        } 
 | 
    }; 
 | 
  
 | 
    function nocheckNode(e) { 
 | 
        var zTree = $.fn.zTree.getZTreeObj("treeRole"), 
 | 
            nocheck = e.data.nocheck, 
 | 
            nodes = zTree.getSelectedNodes(); 
 | 
        if (nodes.length == 0) { 
 | 
            alert("Please select one node at first..."); 
 | 
        } 
 | 
  
 | 
        for (var i = 0, l = nodes.length; i < l; i++) { 
 | 
            nodes[i].nocheck = nocheck; 
 | 
            zTree.updateNode(nodes[i]); 
 | 
        } 
 | 
    } 
 | 
  
 | 
    //var roleArr = []; 
 | 
    // 权限树 
 | 
    function initFunctionRoleTree(functions) { 
 | 
        console.log(functions); 
 | 
        // 根据角色权限构建权限树 
 | 
        // functions 是一个功能集合 
 | 
        //if (functions) { 
 | 
        //    roleArr = eval('(' + functions + ')'); 
 | 
        //} 
 | 
        // 构建树节点 createRoleNodes(roleArr) 
 | 
        $.fn.zTree.init($("#treeRole"), setting, createRoleNodes(roleArr)); 
 | 
        $("#nocheckFalse").bind("click", {nocheck: false}, nocheckNode); 
 | 
  
 | 
    } 
 | 
  
 | 
    function createRoleNodes(roleArr) { 
 | 
        console.log("服务器返回权限"); 
 | 
        console.log(roleArr); 
 | 
        // 遍历权限集合 
 | 
        for (var i = 0; i < roleArr.length; i++) { 
 | 
            // 权限 最外层的为菜单组 
 | 
            var role = roleArr[i]; 
 | 
            console.log(role.fnName) 
 | 
            var o1 = new Object(); 
 | 
            o1.id = role["fnId"]; 
 | 
            o1.pId = role["fnParentId"]; 
 | 
            o1.name = role["fnName"]; 
 | 
            if (role["hasThisFn"] == true) { 
 | 
                o1.checked = true; 
 | 
            } else { 
 | 
                o1.checked = false; 
 | 
            } 
 | 
            o1.btnValue = ""; 
 | 
            o1.open = false; 
 | 
            zNodes.push(o1); 
 | 
            console.log("zNodes.length", zNodes.length) 
 | 
            // 还需要构建子菜单的 
 | 
            var childs = role["childs"]; 
 | 
            if (childs) { 
 | 
  
 | 
                console.log("二级菜单",childs); 
 | 
                for (var j = 0; j < childs.length; j++) { 
 | 
                    var childRole = childs[j]; 
 | 
                    var o2 = new Object(); 
 | 
                    o2.id = childRole["fnId"]; 
 | 
                    o2.pId = childRole["fnParentId"]; 
 | 
                    o2.name = childRole["fnName"]; 
 | 
                    if (childRole["hasThisFn"] == true) { 
 | 
                        o2.checked = true; 
 | 
                    } else { 
 | 
                        o2.checked = false; 
 | 
                    } 
 | 
                    o2.btnValue = ""; 
 | 
                    o2.open = false; 
 | 
  
 | 
                    zNodes.push(o2); 
 | 
  
 | 
  
 | 
                    //三级菜单 
 | 
                    var childsThird = childRole["childs"]; 
 | 
                    if (childsThird) { 
 | 
                        console.log("三级菜单",childs); 
 | 
                        for (var k = 0; k < childsThird.length; k++) { 
 | 
                            var childRoleThird = childsThird[k]; 
 | 
                            var o3 = new Object(); 
 | 
                            o3.id = childRoleThird["fnId"]; 
 | 
                            o3.pId = childRoleThird["fnParentId"]; 
 | 
                            o3.name = childRoleThird["fnName"]; 
 | 
                            if (childRoleThird["hasThisFn"] == true) { 
 | 
                                o3.checked = true; 
 | 
                            } else { 
 | 
                                o3.checked = false; 
 | 
                            } 
 | 
                            o3.btnValue = ""; 
 | 
                            o3.open = false; 
 | 
  
 | 
                            zNodes.push(o3); 
 | 
  
 | 
                            // 按钮 
 | 
                            var btns = childRoleThird["sysFnBtnRel"]; 
 | 
                            console.log(btns); 
 | 
                            if (btns) { 
 | 
                                for (var m = 0; m < btns.length; m++) { 
 | 
                                    var btn = btns[m]; 
 | 
                                    var o4 = new Object(); 
 | 
                                    o4.id = btn["fbId"]; 
 | 
                                    o4.pId = btn["fnId"]; 
 | 
                                    o4.name = btn["btnKey"]; 
 | 
                                    if (btn["hasThisBtn"] == true) { 
 | 
                                        o4.checked = true; 
 | 
                                    } else { 
 | 
                                        o4.checked = false; 
 | 
                                    } 
 | 
                                    o4.btnValue = btn["btnValue"]; 
 | 
                                    o4.open = false; 
 | 
                                    zNodes.push(o4); 
 | 
                                } 
 | 
                            } 
 | 
                        } 
 | 
                    } 
 | 
                } 
 | 
            } 
 | 
        } 
 | 
        console.log("返回节点", zNodes.length) 
 | 
        return zNodes; 
 | 
  
 | 
    } 
 | 
  
 | 
    $(document).ready(function () { 
 | 
        //$.fn.zTree.init($("#treeRole"), setting, zNodes); 
 | 
        //$("#nocheckTrue").bind("click", {nocheck: true}, nocheckNode); 
 | 
        //$("#nocheckFalse").bind("click", {nocheck: false}, nocheckNode); 
 | 
    }); 
 | 
</script> 
 | 
</body> 
 | 
</html> 
 |