jsp写的角色管理前端代码,基于tree

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ taglib uri="http://www.xinxin.com/functions/acl" prefix="acl" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="renderer" content="webkit">
<meta http-equiv="Cache-Control" content="no-siteapp" />
<meta name="keywords" content="ISIP后台管理">
<meta name="description" content="后台管理">
<link href="${pageContext.request.contextPath}/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="${pageContext.request.contextPath}/bootstrap/css/style.min.css" rel="stylesheet">
<link href="${pageContext.request.contextPath}/bootstrap/css/font-awesome.min93e3.css?v=4.4.0" rel="stylesheet">
<link href="${pageContext.request.contextPath}/bootstrap/css/animate.min.css" rel="stylesheet">
<link href="${pageContext.request.contextPath}/bootstrap/css/plugins/dataTables/dataTables.bootstrap.css" rel="stylesheet">
<link href="${pageContext.request.contextPath}/bootstrap/css/plugins/awesome-bootstrap-checkbox/awesome-bootstrap-checkbox.css" rel="stylesheet">
<link href="${pageContext.request.contextPath}/bootstrap/css/plugins/sweetalert/sweetalert.css" rel="stylesheet">
<link rel="stylesheet" href="${pageContext.request.contextPath}/bootstrap/css/zTreeStyle.css" />
<link href="${pageContext.request.contextPath}/bootstrap/css/plugins/bootsrap-select/bootstrap-select.min.css" rel="stylesheet">
<style type="text/css">
.ipt-left {padding-left: 0px;}
.btn-info {background: #fff;color:#333; border-color:#e5e6e7;}
    .btn-info:hover{background: #fff !important;color:#333 !important;}
    .open .btn-info {background: #fff !important;color:#333 !important;}
    .dropdown-menu-right {right: auto !important; left: 0px !important;}
    .btn-info.active, .btn-info:active, .btn-info:focus, .btn-info:hover, .open .dropdown-toggle.btn-info{background: #fff !important;color:#333 !important;}
ul.ztree {width: 100%; min-height: 500px; height: auto;}
ul.ztree li span.button.switch{margin-right:5px}
    ul.ztree ul ul li.level3{ display: inline-block; white-space:normal;}
    ul.ztree>li>ul>li{padding:5px; }
    ul.ztree>li{background: #dae6f0}
    ul.ztree>li:nth-child(even)>ul>li:nth-child(even){background: #eef5fa}
    ul.ztree>li:nth-child(even)>ul>li:nth-child(odd){background: #f6fbff}
    ul.ztree>li:nth-child(odd)>ul>li:nth-child(even){background: #eef5fa}
    ul.ztree>li:nth-child(odd)>ul>li:nth-child(odd){background: #f6fbff}
    ul.ztree>li>ul{margin-top:12px}
    ul.ztree>li{padding:15px;padding-right:25px}
    ul.ztree li{white-space:normal!important}
    ul.ztree>li>a>span{font-size:15px;font-weight:700}
    .ibox-content {position: relative;}
    .spiner-example {position: absolute;top: 35%;left: 0px;width: 100%; z-index: 9999; }
.loadingPurview {display: none;position: absolute; top: 0; right: 0; bottom: 0; left: 0; opacity: .75; background: #666; filter: alpha(opacity=75); z-index:9999; text-align: center;}
.loadingPurview  .sk-spinner {position: relative;top: 40%;left: 0px;width: 100%; z-index: 9999; } 
.loadingPurview  .load-text {position: relative;top: 40%;left: 0px;width: 100%; z-index: 9999; color: #fff;}
</style>
</head>
<body class="gray-bg""> 
<div class="row  border-bottom white-bg dashboard-header animated fadeInRight">
<input id="moduleId" type="hidden" name="moduleId" value="${moduleId}"/>
<div class="row">
<div class="col-sm-12">
<div class="ibox float-e-margins">
<div class="row">
<div class="col-sm-12" >
<div class="ibox-content">
    <div class="row form-body form-horizontal m-t">
  <div class="col-md-12 droppable sortable">
  <div class="col-md-1">
<c:if test="${acl:def(moduleId,'c')}">
<a id="addRoleBtn" class="btn btn-primary" type="button" data-toggle="modal" data-target="#addRoelDiv">添加</a>
</c:if>
<%-- <c:if test="${acl:def(moduleId,'a')}">
<a id="addUserBtn" class="btn btn-primary" type="button" data-toggle="modal" data-target="#updateUserDiv">修改</a>
</c:if>
<c:if test="${acl:def(moduleId,'a')}">
<a id="addUserBtn" class="btn btn-primary" type="button" data-toggle="modal" data-target="#inforUserDiv">用户信息</a>
</c:if>
<c:if test="${acl:def(moduleId,'a')}">
<a id="addUserBtn" class="btn btn-primary" type="button" data-toggle="modal" data-target="#roleDiv">分配角色</a>
</c:if>
<c:if test="${acl:def(moduleId,'a')}">
<a id="addUserBtn" class="btn btn-primary" type="button" data-toggle="modal" data-target="#updatePasswordDiv">修改密码</a>
</c:if> --%>
</div>
  <form id="getRolePageForm" action="#" method="post">
<div class="col-md-4">
    <div class="form-group">
        <label class="col-sm-3 control-label">所属部门:</label>
        <div class="col-sm-5 ">
    <div style="width: 240px;">
    <select id="orgPathSelects" name="orgPath" data-actions-box="false" data-live-search="true" data-done-button="true"></select>
    </div>
        </div>
    </div>
</div>
<div class="col-md-3">
<div class="form-group">
        <div class="col-sm-1">
      <input id="selectBtn" class="btn btn-pirmary" style="background: #5bc0de; border-color: #5bc0de; color:#fff;" type="button" value="查询" >
      </div>
     </div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<div class="ibox-content">
<table class="table table-striped table-bordered table-hover" id="roleTable" width="100%">
<thead>
<tr>
<th>角色ID</th>
<th>所属机构ID</th>
<th>角色名称</th>
                                <th>所属部门</th>
<th>描述</th>
<th>操作</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<!-- 新增页面DIV(开始) -->
    <div class="modal inmodal fade animated fadeInRight" id="addRoelDiv" tabindex="-1" role="dialog"  aria-hidden="true">
    <div class="col-sm-12">
<div class="ibox float-e-margins">
<div class="ibox-title" style="height: 58px;">
<h5 id="organizationName" style="color: blue;"></h5>
<div class="ibox-tools">
<button class="btn btn-primary" type="button" data-dismiss="modal">关闭</button>
</div>
</div>
<div class="ibox-content" id="messTableDiv">
<div class="row">
<div class="col-sm-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>添加角色</h5> 
                    </div>
<div class="ibox-content">
                        <form id="addRoleForm" role="form" autocomplete="off" class="form-horizontal m-t" action="" method="POST">
                        <input type="hidden" name="moduleId" value="${moduleId}">
                        <div class="form-group draggable">
                                <label class="col-sm-2 control-label"><i class="text-danger">*&nbsp;</i>角色名称:</label>
                                <div class="col-sm-5">
                                    <input type="text" name="roleName" class="form-control">
                                </div>
                            </div>
                            <div class="form-group draggable">
                                <label class="col-sm-2 control-label"><i class="text-danger">*&nbsp;</i>所属部门:</label>
                                <div class="col-sm-5">
                                  <input type="text" name="orgId" id="orgIdA" class="form-control" style=" display: none;">
  <select id="selectUserOrgIdA" data-actions-box="false" data-live-search="true" data-done-button="true"></select>
                                </div>
                            </div>
                            <div class="form-group draggable">
                                <label class="col-sm-2 control-label"><i class="text-danger">*&nbsp;</i>描述:</label>
                                 <div class="col-sm-5">
                                <textarea id="configDescriptionU" name="roleDescription" class="form-control" maxlength="255"></textarea>
                                </div>
                            </div>
                            <div class="form-group draggable">
                                <div class="col-sm-12 col-sm-offset-2">
                                    <button class="btn btn-w-m btn-primary" id="addform" type="button">保存</button>
                                    <button class="btn btn-white" type="button" data-dismiss="modal">取消</button>
                                </div>
                            </div>
                        </form>
                    </div>
</div>
            </div>
</div>
</div>
</div>           
</div>                    
  </div>
<!-- 新增页面DIV(结束) -->
<!-- 修改页面DIV(开始) -->
    <div class="modal inmodal fade animated fadeInRight" id="updateRoleDiv" tabindex="-1" role="dialog"  aria-hidden="true">
    <div class="col-sm-12">
<div class="ibox float-e-margins">
<div class="ibox-title" style="height: 58px;">
<h5 id="organizationName" style="color: blue;"></h5>
<div class="ibox-tools">
<button class="btn btn-primary" type="button" data-dismiss="modal">关闭</button>
</div>
</div>
<div class="ibox-content" id="messTableDiv">
<div class="row">
<div class="col-sm-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>修改角色信息</h5> 
                    </div>
<div class="ibox-content">
                        <form id="updateRoleForm" autocomplete="off" role="form" class="form-horizontal m-t" action="" method="POST">
                        <input type="hidden" name="moduleId" value="${moduleId}">
                        <input type="hidden" name="roleId">
                        <div class="form-group draggable">
                                <label class="col-sm-2 control-label"><i class="text-danger">*&nbsp;</i>角色名称:</label>
                                <div class="col-sm-5">
                                    <input type="text" name="roleName" class="form-control">
                                </div>
                            </div>
                            <div class="form-group draggable">
                                <label class="col-sm-2 control-label"><i class="text-danger">*&nbsp;</i>所属部门:</label>
                                <div class="col-sm-5">
                                <input type="text" name="orgId" id="orgIdU" value class="form-control" style="display: none;">
                                    <select id="selectUserOrgIdU" class="form-control" ></select>
                                </div>
                            </div>
                            <div class="form-group draggable">
                                <label class="col-sm-2 control-label"><i class="text-danger">*&nbsp;</i>描述:</label>
                                 <div class="col-sm-5">
                                <textarea id="configDescriptionU" name="roleDescription" class="form-control" maxlength="255"></textarea>
                                </div>
                            </div>
                            <div class="form-group draggable">
                                <div class="col-sm-12 col-sm-offset-2">
                                    <button class="btn btn-w-m btn-primary" id="updateform" type="button">保存</button>
                                    <button class="btn btn-white" type="button" data-dismiss="modal">取消</button>
                                </div>
                            </div>
                        </form>
                    </div>
</div>
            </div>
</div>
</div>
</div>           
</div>                    
  </div>
<!-- 修改页面DIV(结束) -->
<!-- 分配角色页面DIV(开始) -->
    <div class="modal inmodal fade animated fadeInRight" id="roleDiv" tabindex="-1" role="dialog"  aria-hidden="true">
    <div class="col-sm-12">
<div class="ibox float-e-margins">
<div class="ibox-title" style="height: 58px;">
<h5 id="organizationName" style="color: blue;"></h5>
<div class="ibox-tools">
<button class="btn btn-primary" type="button" data-dismiss="modal">关闭</button>
</div>
</div>
<div class="ibox-content" id="messTableDiv">
<div class="row">
<div class="col-sm-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>菜单权限分配</h5> 
                    </div>
<div class="ibox-content">
<input id="roleIdPurview" name="roleId" type="hidden"/>
<div class="spiner-example">
                            <div class="sk-spinner sk-spinner-three-bounce">
                                <div class="sk-bounce1"></div>
                                <div class="sk-bounce2"></div>
                                <div class="sk-bounce3"></div>
                            </div>
                        </div>
                        
                        <ul id="tree" class="ztree loading"></ul>
                        <div class="form-group draggable" style="margin-top: 20px;">
                        <span class="help-block m-b-none" id="message" style="color: red;"></span>
                        <button id="saveRolePurview" class="btn btn-w-m btn-primary" type="button">保存权限</button>
                        <button class="btn btn-white" type="button" data-dismiss="modal">取消</button>
                        </div>
                    </div>
</div>
            </div>
</div>
</div>
</div>           
</div>                    
  </div>
  <div class="loadingPurview">
        <div class="sk-spinner sk-spinner-three-bounce">
                <div class="sk-bounce1"></div>
                <div class="sk-bounce2"></div>
                <div class="sk-bounce3"></div>
            </div>
        <div class="load-text">正在分配权限请稍后(勾选越多,速度越慢)...</div>
        </div>
<!-- 分配角色页面DIV(结束) -->
<!-- 分配角色页面DIV(开始) -->
    <div class="modal inmodal fade animated fadeInRight" id="roleDiv" tabindex="-1" role="dialog"  aria-hidden="true">
    <div class="col-sm-12">
<div class="ibox float-e-margins">
<div class="ibox-title" style="height: 58px;">
<h5 id="organizationName" style="color: blue;"></h5>
<div class="ibox-tools">
<button class="btn btn-primary" type="button" data-dismiss="modal">关闭</button>
</div>
</div>
<div class="ibox-content" id="messTableDiv">
<div class="row">
<div class="col-sm-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>操作权限分配</h5> 
                    </div>
<div class="ibox-content">

                        <div class="form-group draggable" style="margin-top: 20px;">
                        <span class="help-block m-b-none" id="message" style="color: red;"></span>
                        <button id="saveRolePurview" class="btn btn-w-m btn-primary" type="button">保存权限</button>
                        <button class="btn btn-white" type="button" data-dismiss="modal">取消</button>
                        </div>
                    </div>
</div>
            </div>
</div>
</div>
</div>           
</div>                    
  </div>
</body>
<script src="${pageContext.request.contextPath}/bootstrap/js/jquery.min.js?v=2.1.4"></script>
  <script src="${pageContext.request.contextPath}/bootstrap/js/bootstrap.min.js?v=3.3.6"></script>
  <script src="${pageContext.request.contextPath}/bootstrap/js/plugins/dataTables/jquery.dataTables.js"></script>
<script src="${pageContext.request.contextPath}/bootstrap/js/plugins/dataTables/dataTables.bootstrap.js"></script>
<script src="${pageContext.request.contextPath}/bootstrap/js/plugins/sweetalert/sweetalert.min.js"></script>
    <script src="${pageContext.request.contextPath}/bootstrap/js/plugins/layer/layer.min.js"></script>
    <script src="${pageContext.request.contextPath}/bootstrap/js/plugins/iCheck/icheck.min.js"></script>
    <script src="${pageContext.request.contextPath}/bootstrap/js/plugins/bootsrap-select/bootstrap-select.min.js"></script>
    <script src="${pageContext.request.contextPath}/bootstrap/js/plugins/slimscroll/jquery.slimscroll.min.js"></script>
<script src="${pageContext.request.contextPath}/bootstrap/js/plugins/layer/layer.min.js"></script>
<script src="${pageContext.request.contextPath}/js/jquery.ztree.all.js" type="text/javascript"></script>
<script src="${pageContext.request.contextPath}/js/common/common-utils.js"></script>

<script type="text/javascript">
var moduleId = $("#moduleId").val();
var roleTable;
$(function(){
$('#orgPathSelects').selectpicker({//组织机构
    style: 'btn-info',
    noneSelectedText:"请选择",
    liveSearchPlaceholder:"",
    dropdownAlignRight: true,
    liveSearchPlaceholder:"关键字",
    noneResultsText:"搜索不存在",
    width:"240px"
  });
$('#selectUserOrgIdA').selectpicker({//组织机构
    style: 'btn-info',
    noneSelectedText:"请选择",
    liveSearchPlaceholder:"",
    dropdownAlignRight: true,
    liveSearchPlaceholder:"关键字",
    noneResultsText:"搜索不存在",
    width:"auto"
  });
$('#selectUserOrgIdU').selectpicker({//组织机构
    style: 'btn-info',
    noneSelectedText:"请选择",
    liveSearchPlaceholder:"",
    dropdownAlignRight: true,
    liveSearchPlaceholder:"关键字",
    noneResultsText:"搜索不存在",
    width:"200px"
  });
        $.ajax({
    url:"${pageContext.request.contextPath}/role/getRoleAllDictionary.do", 
    type:"post",
    async:true,//取消异步请求
    data:{"moduleId":moduleId}, 
    beforeSend:function(){
    return true;
    },
        success: function (result) {
        if(result.code == 0){
        $("#orgPathSelects").empty();
        //组装机构
        var orgPathSelectHTML = "<option value=''>请选择</option>";
        $.each(result.data.searchOrgList,function(i,data){
        orgPathSelectHTML += "<option value=\'"+data.orgPath+"\'>" + data.orgName + "</option>";
        });
        $('#orgPathSelects').append(orgPathSelectHTML);
        //组装机构
    $('#orgPathSelects').selectpicker('val', '');
    $('#orgPathSelects').selectpicker('refresh');
    $('#orgPathSelects').selectpicker('render');
        } else if (result.code == 1) {
layer.alert(result.message, {icon: 2});
} else if(result.code == 407 || result.code == "407"){
                layer.alert(result.message, {icon: 2}, function(){
                window.location.href = "/dtadmin/main/loginOut.do";
                });
                }
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
$("#addform").button('reset');
if (XMLHttpRequest.status === 0) {
layer.alert("服务器正在开小差,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 404) {
layer.alert("请求路径不存在,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 500) {
layer.alert("服务器异常,请联系管理员解决!", {icon: 2});
}
}
    });
      //所属机构
  $('#orgPathSelects').on('hidden.bs.select', function (e) {
  var tmpSelected = $('#orgPathSelects').val();
              if(tmpSelected != null){
                  $('#orgPathSelects').val(tmpSelected);
              }else {
                  $('#orgPathSelects').val("");
              }
  });
  //添加所属单位
  $('#selectUserOrgIdA').on('hidden.bs.select', function (e) {
  var tmpSelected = $('#selectUserOrgIdA').val();
              if(tmpSelected != null){
                  $('#orgIdA').val(tmpSelected);
              }else {
                  $('#orgIdA').val("");
              }
  });
  //修改所属单位
  $('#selectUserOrgIdU').on('hidden.bs.select', function (e) {
  var tmpSelected = $('#selectUserOrgIdU').val();
              if(tmpSelected != null){
                  $('#orgIdU').val(tmpSelected);
              }else {
                  $('#orgIdU').val("");
              }
  });

  roleTable =  $("#roleTable").dataTable({
        "bAutoWidth":true,
             serverSide: true,//分页,取数据等等的都放到服务端去
             processing: true,//载入数据的时候是否显示“载入中”
             pageLength: 10,//首次加载的数据条数
             ordering: false,//排序操作在服务端进行,所以可以关了。
//  "order": [[ 0, "asc" ]],
searching: false,
bAutoWidth:false,
               ajax: {//类似jquery的ajax参数,基本都可以用。
                   type: "post",//后台指定了方式,默认get,外加datatable默认构造的参数很长,有可能超过get的最大长度。
                   url: "${pageContext.request.contextPath}/role/getRolePage.do",
                   data: function (d) {//d 是原始的发送给服务器的数据,默认很长。
                       var param = {"moduleId":moduleId};//因为服务端排序,可以新建一个参数对象
                       param.start = d.start;//开始的序号
                       param.length = d.length;//要取的数据的
                       var formData = $("#getRolePageForm").serializeArray();//把form里面的数据序列化成数组
                       formData.forEach(function (e) {
                           param[e.name] = e.value;
                       });
                       return param;//自定义需要传递的参数。
                   },
                   dataSrc:"data",
                   dataFilter: function(data, type){
                        var json = jQuery.parseJSON( data );
                        if(json.code == 0){
                        if(json.data == null){
                            json.recordsTotal ="0"
                                 json.recordsFiltered = "0";
                            json.data =""
                            } else{
                            json.recordsTotal = json.data.page.totalPage;
                                json.recordsFiltered = json.data.page.totalRecord;
                                json.data = json.data.page.data;
                            }
                        return JSON.stringify( json );
                    } else if(json.code == 1){
                    layer.alert(json.message, {icon: 2});
                    }
                    }, 
                    error: function(XMLHttpRequest, textStatus, errorThrown){
                    if (XMLHttpRequest.status === 0) {
layer.alert("服务器正在开小差,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 404) {
layer.alert("请求路径不存在,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 500) {
layer.alert("服务器异常,请联系管理员解决!", {icon: 2});
}
                    }
               },
               columns: [
               { data: "roleId", "visible": false },//角色名称ID
               { data: "orgId", "visible": false },//所属机构ID
               { data: "roleName" },//角色名称
                   { data: "orgName" },//所属机构名称
                   { data: "description" },//描述
                   {
                      data: function (v) {//这里给最后一列返回一个操作列表
                           //e是得到的json数组中的一个item ,可以用于控制标签的属性。
                           if ("${acl:def(moduleId,'u')}"=="true") {
                           var b = '';
                        b += '<button id="updateRole" class="btn btn-xs btn-primary" type="button" style="margin-left:10px;" data-toggle="modal" data-target="#updateRoleDiv">修改</button>';
                          b += '<button id="updateRolePurview" class="btn btn-xs btn-success" type="button" style="margin-left: 10px;" data-toggle="modal" data-target="#roleDiv">分配菜单权限</button>';
                           return b;
                       } else {
                       return "没有操作权限";
                       }
                       }
                   } 
              ],
               initComplete: function (setting, json) {
                   //初始化完成之后替换原先的搜索框。
                   //本来想把form标签放到hidden_filter 里面,因为事件绑定的缘故,还是拿出来。
// $(tablePrefix + "filter").html("<form id='filter_form'>" + $("#hidden_filter").html() + "</form>");
               },
               language: {
//lengthMenu: '<select class="form-control input-xsmall">' + '<option value="5">5</option>' + '<option value="10">10</option>' + '<option value="20">20</option>' + '<option value="30">30</option>' + '<option value="40">40</option>' + '<option value="50">50</option>' + '</select>条记录',//左上角的分页大小显示。
                   processing: "<img src='${pageContext.request.contextPath}/bootstrap/img/loading-upload.gif'>载入中",//处理页面数据的时候的显示
                   paginate: {//分页的样式文本内容。
                       previous: "上一页",
                    next: "下一页",
                    first: "第一页",
                    last: "最后一页"
                   },                   zeroRecords: "没有内容",//table tbody内容为空时,tbody的内容。
                   //下面三者构成了总体的左下角的内容。
                   info: "共 _TOTAL_ 条记录,当前显示第 _PAGE_ 页",//左下角的信息显示,大写的词为关键字。
                   infoEmpty: "0条记录",//筛选为空时左下角的显示。
                   infoFiltered: ""//筛选之后的左下角筛选提示(另一个是分页信息显示,在上面的info中已经设置,所以可以不显示),
               }
           });
           
           $("#selectBtn").click(function(){
    var url = roleTable.api().ajax.url("${pageContext.request.contextPath}/role/getRolePage.do?moduleId="+moduleId);
    url.load();
    });
           
        $(document).on("click", "#updateRole", function () {
            $('#updateRoleForm')[0].reset();
            var roleId = JSON.stringify($("#roleTable").DataTable().row($(this).parents("tr")).data().roleId).replace('"','').replace('"','');
            var roleName = JSON.stringify($("#roleTable").DataTable().row($(this).parents("tr")).data().roleName).replace('"','').replace('"','');
            var orgId = JSON.stringify($("#roleTable").DataTable().row($(this).parents("tr")).data().orgId).replace('"','').replace('"','');
            var description = JSON.stringify($("#roleTable").DataTable().row($(this).parents("tr")).data().description).replace('"','').replace('"','');
            $("#updateRoleForm :input[name='roleId']").val(roleId);
          $("#updateRoleForm :input[name='roleName']").val(roleName);
          $("#updateRoleForm :input[name='orgId']").val(orgId);
          $("#updateRoleForm :input[name='roleDescription']").val(description);
          $("#selectUserOrgIdU option[value='"+orgId+"']").prop("selected",true);
          $.ajax({
    url:"${pageContext.request.contextPath}/role/getRoleAllDictionary.do", 
    type:"post",
    async:true,//取消异步请求
    data:{"moduleId":moduleId}, 
    beforeSend:function(){
    return true;
    },
        success: function (result) {
        if (result.code == 0) {
        $("#selectUserOrgIdU").empty();
        var selectUserOrgIdUHTML = "<option value=''>请选择</option>";
        $.each(result.data.orgList,function(i,data){
        selectUserOrgIdUHTML += "<option value=\'"+data.orgId+"\'>" + data.orgName + "</option>";
        });
        $('#selectUserOrgIdU').append(selectUserOrgIdUHTML);
        //添加所属单位
    $('#selectUserOrgIdU').selectpicker('val', orgId);
    $('#selectUserOrgIdU').selectpicker('refresh');
    $('#selectUserOrgIdU').selectpicker('render');
        } else if (result.code == 1) {
layer.alert(result.message, {icon: 2});
}
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
if (XMLHttpRequest.status === 0) {
layer.alert("服务器正在开小差,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 404) {
layer.alert("请求路径不存在,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 500) {
layer.alert("服务器异常,请联系管理员解决!", {icon: 2});
}
}
    });
           });
           //$('#addRoleBtn').on('click', function () {
            $.ajax({
    url:"${pageContext.request.contextPath}/role/getRoleAllDictionary.do", 
    type:"post",
    async:true,//取消异步请求
    data:{"moduleId":moduleId}, 
    beforeSend:function(){
    return true;
    },
        success: function (result) {
        if (result.code == 0) {
        $("#selectUserOrgIdA").empty();
        var selectUserOrgIdAHTML = "<option value=''>请选择</option>";
        $.each(result.data.orgList,function(i,data){
        selectUserOrgIdAHTML += "<option value=\'"+data.orgId+"\'>" + data.orgName + "</option>";
        });
        $('#selectUserOrgIdA').append(selectUserOrgIdAHTML);
        //添加所属单位
    $('#selectUserOrgIdA').selectpicker('val', '');
    $('#selectUserOrgIdA').selectpicker('refresh');
    $('#selectUserOrgIdA').selectpicker('render');
        } else if (result.code == 1) {
layer.alert(result.message, {icon: 2});
}
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
if (XMLHttpRequest.status === 0) {
layer.alert("服务器正在开小差,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 404) {
layer.alert("请求路径不存在,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 500) {
layer.alert("服务器异常,请联系管理员解决!", {icon: 2});
}
}
    });
          // })
           $('#addRoleDiv').on('hidden.bs.modal', function () {
            $('.filter-option').text('请选择');
            $('#addRoleForm')[0].reset();
           });
           $('#updateRoleDiv').on('hidden.bs.modal', function () {
            $('#updateRoleForm')[0].reset();
           });
//给form表单绑定相关的操作
$("#addform").click(function(){
var orgId = $("#orgIdA");
var roleName = $("#addRoleForm :input[name='roleName']");
var roleDescription = $("#addRoleForm :input[name='roleDescription']");
if(roleName.val() == ""){
layer.tips('角色名称不能为空!', roleName, {
  tips: [2, '#3595CC'],
  time: 3000
});
roleName.focus();
return false;
}
if (orgId.val() == "") {
layer.tips('请选择所属部门!', "#selectUserOrgIdA", {
  tips: [2, '#3595CC'],
  time: 3000
});
$("#selectUserOrgIdA").focus();
return false;
}
if(roleDescription.val() == ""){
layer.tips('描述不能为空!', roleDescription, {
  tips: [2, '#3595CC'],
  time: 3000
});
roleDescription.focus();
return false;
}

if(roleDescription.val().length >= 255 ){
layer.tips('描述最长为255个字符!', roleDescription, {
  tips: [2, '#3595CC'],
  time: 3000
});
roleDescription.focus();
return false;
}
var requestVo = {
"orgId":orgId.val(),
"roleName":roleName.val(),
"roleDescription":roleDescription.val(),
"moduleId":$("#moduleId").val()
}
$.ajax({
url: "${pageContext.request.contextPath}/role/addRole.do",
type: "post",
async: true, //异步请求
data: requestVo,
dataType:"json",
beforeSend: function () {
$("#addform").button('loading').delay(1000).queue(function() {});
},
success:function(jsonObject){
$("#addform").button('reset');
if (jsonObject.code==0) {
$('#addRoleForm')[0].reset();
$('#addRoelDiv').modal('hide');
swal("成功", jsonObject.message, "success");
$("#roleTable").DataTable().ajax.reload(null, false);// 刷新表格数据,分页信息不会重置
} else if(jsonObject.code==1){
layer.alert(jsonObject.message, {icon: 2});
$("#roleTable").DataTable().ajax.reload(null, false);// 刷新表格数据,分页信息不会重置
}
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
$("#addform").button('reset');
if (XMLHttpRequest.status === 0) {
layer.alert("服务器正在开小差,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 404) {
layer.alert("请求路径不存在,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 500) {
layer.alert("服务器异常,请联系管理员解决!", {icon: 2});
}
}
});
});
           //修改用户信息
           $("#updateform").click(function(){
var orgId = $("#orgIdU");
var roleId = $("#updateRoleForm :input[name='roleId']");
var roleName = $("#updateRoleForm :input[name='roleName']");
var roleDescription = $("#updateRoleForm :input[name='roleDescription']");
if(roleName.val() == ""){
layer.tips('角色名称不能为空!', roleName, {
  tips: [2, '#3595CC'],
  time: 3000
});
roleName.focus();
return false;
}
if (orgId.val() == "") {
layer.tips('请选择所属部门!', "#selectUserOrgIdU", {
  tips: [2, '#3595CC'],
  time: 3000
});
$("#selectUserOrgIdU").focus();
return false;
}
if(roleDescription.val() == ""){
layer.tips('描述不能为空!', roleDescription, {
  tips: [2, '#3595CC'],
  time: 3000
});
roleDescription.focus();
return false;
}

if(roleDescription.val().length >= 255 ){
layer.tips('描述最长为255个字符!', roleDescription, {
  tips: [2, '#3595CC'],
  time: 3000
});
roleDescription.focus();
return false;
}
var requestVo = {
"orgId":orgId.val(),
"roleId":roleId.val(),
"roleName":roleName.val(),
"roleDescription":roleDescription.val(),
"moduleId":$("#moduleId").val()
}

$.ajax({
url: "${pageContext.request.contextPath}/role/updateRole.do",
type: "post",
async: true, //异步请求
data: requestVo,
dataType:"json",
beforeSend: function () {
$("#updateform").button('loading').delay(1000).queue(function() {});
},
success:function(jsonObject){
$("#updateform").button('reset');
if (jsonObject.code==0) {
$('#updateRoleForm')[0].reset();
$('#updateRoleDiv').modal('hide');
swal("成功", jsonObject.message, "success");
$("#roleTable").DataTable().ajax.reload(null, false);// 刷新表格数据,分页信息不会重置
} else if(jsonObject.code==1){
layer.alert(jsonObject.message, {icon: 2});
$("#roleTable").DataTable().ajax.reload(null, false);// 刷新表格数据,分页信息不会重置
} else if(jsonObject.code == 407 || jsonObject.code == "407"){
                layer.alert(jsonObject.message, {icon: 2}, function(){
                window.location.href = "/dtadmin/main/loginOut.do";
                });
                }
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
$("#updateform").button('reset');
if (XMLHttpRequest.status === 0) {
layer.alert("服务器正在开小差,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 404) {
layer.alert("请求路径不存在,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 500) {
layer.alert("服务器异常,请联系管理员解决!", {icon: 2});
}
}
});
});
});

    
        $(document).on("click", "#updateRolePurview", function () {
        $(".spiner-example").show();
        var roleId = JSON.stringify($("#roleTable").DataTable().row($(this).parents("tr")).data().roleId).replace('"','').replace('"','');
        $("#roleIdPurview").val(roleId);
        var setTree = {
async:{
//开启异步加载模式
enable: true,
//发送异步请求的路径
url: "${pageContext.request.contextPath}/role/getTree.do?moduleId="+moduleId+"&roleId="+roleId,
},
view: {
//禁止树上的节点多选
selectedMulti: false,
showLine: false,
showIcon: false,
dblClickExpand: false
},
check: {
enable: true,
chkStyle: "checkbox",
chkboxType: { "Y": "ps", "N": "ps" },
nocheckInherit: true,
chkDisabledInherit: true
},
data: {
simpleData: {
enable: true
}
},
callback:{
//单击树上节点的时候  执行的操作
onClick:function(){
var treeObj = $.fn.zTree.getZTreeObj("tree");
var nodes = treeObj.getSelectedNodes();
if (nodes.length > 0) {
var isOpen = nodes[0].open;
if (isOpen) {
treeObj.expandNode(nodes[0], !isOpen, false, false);
}else {
treeObj.expandNode(nodes[0], !isOpen, false, false);
}
}
},
onAsyncSuccess: zTreeOnAsyncSuccess
}


};
function zTreeOnAsyncSuccess(event, treeId, treeNode, msg) {
var treeObj = $.fn.zTree.getZTreeObj("tree");
var nodes = treeObj.getNodes();
if (nodes.length>0) {
$(".spiner-example").hide();
                        treeObj.expandAll(true);
                        //骆孝宇 修改为默认全展开
// treeObj.expandNode(nodes[0], true, false, true);
for (var i = 0;i<nodes.length;i++) {
show(nodes[i]);
function show(nodes) {
if (nodes.isParent) {
treeObj.updateNode(nodes);
for(var i = 0;i<nodes.children.length;i++){
show(nodes.children[i]);
}
}else {
treeObj.updateNode(nodes);
}
}
}
}
}
$.fn.zTree.init($("#tree"), setTree);
    });
$(function(){
$("#saveRolePurview").click(function(){
var roleId = $("#roleIdPurview").val();
var permissionIds = "";
var moduleId = "";
var treeObj = $.fn.zTree.getZTreeObj("tree");
var nodes = treeObj.getCheckedNodes(true);
var temp_addModulePermissionsVOList = new Array();
$.each(nodes,function(i,n){
if (!n.isParent) {
getArray(n);
}
});

function getArray(n){
if(!n.children){
temp_addModulePermissionsVOList.push({
"moduleId":n.moduleId,
"permissionIds":n.id,
"name":n.name
});
}

var pNode = n.getParentNode();
if (pNode.level != 0) {
getArray(pNode);
}
}
//console.log('归类前');
//console.log(temp_addModulePermissionsVOList);
//分类整理
var addModulePermissionsVOList = new Array();
$.each(temp_addModulePermissionsVOList,function(i,node1){
//判断是否已存在模块id
var flag_isPermissionId = false;
$.each(addModulePermissionsVOList,function(i,node3){
if(node3.moduleId === node1.moduleId){
flag_isPermissionId = true;
}
});
if(!flag_isPermissionId){
var permissionIds = new Array();
$.each(temp_addModulePermissionsVOList,function(i,node2){
if(node1.moduleId === node2.moduleId){
permissionIds.push(node2.permissionIds);
}
});
addModulePermissionsVOList.push({
"moduleId":node1.moduleId,
"permissionIds":permissionIds.toString()
});
}
});
//console.log('归类后');
//console.log(addModulePermissionsVOList);
var updateRoleModuleVO = {
"roleId":roleId,
"modulePermissionsStr":JSON.stringify(addModulePermissionsVOList)
}
var moduleId = $("#moduleId").val();
$.ajax({
url:"${pageContext.request.contextPath}/role/updateAcl.do",
type:"POST",
data:updateRoleModuleVO,
//data:JSON.stringify(updateRoleModuleVO), 
// dataType:'json',
beforeSend:function(){
$(".loadingPurview").show();
$("#saveRolePurview").button('loading').delay(1000).queue(function() {});
return true;
},
success:function(jsonObject){
$(".loadingPurview").hide();
$("#saveRolePurview").button('reset');
if (jsonObject.code == 0) {
swal("成功", jsonObject.message, "success");
$('#roleDiv').modal('hide');
$("#roleTable").DataTable().ajax.reload(null, false);// 刷新表格数据,分页信息不会重置
} else if (jsonObject.code == 1) {
layer.alert(jsonObject.message, {icon: 2});
$("#roleTable").DataTable().ajax.reload(null, false);// 刷新表格数据,分页信息不会重置
}
},
error: function(XMLHttpRequest, textStatus, errorThrown){
$(".loadingPurview").hide();
$("#saveRolePurview").button('reset');
if (XMLHttpRequest.status === 0) {
layer.alert("服务器正在开小差,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 404) {
layer.alert("请求路径不存在,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 500) {
layer.alert("服务器异常,请联系管理员解决!", {icon: 2});
}
}
}); 
});
});
var setting = {
selectall : function(a, b) {
   //a表示全选name值,b表示子checkbox的name值
var $select_all = $("input[name='" + a + "']");
var $childBox = $("input[name='" + b + "']");
for(var i = 0; i < $select_all.length; i++) {
$select_all[i].onclick = function() {
var checkTure = $(this).prop("checked");
var l = $("input[type='checkbox']").length;
for(var j = 0; j <= l; j++) {
var childAll = $("input[type='checkbox']").eq(j);
if(checkTure) {
childAll.prop("checked", true);
childAll.parent().addClass("active");
} else {
childAll.prop("checked", false);
childAll.parent().removeClass("active");
}
}
};
}
for(var i = 0; i < $childBox.length; i++) {
$childBox[i].onclick = function() {
var checkTure = $(this).prop("checked");
//判断点击商品选中状态
var childlen = $("input[name='" + b + "']:checked").length;
//判断商品是否选中个数
if(childlen != $childBox.length) {
//判断全选下面的商品是否全部选中
$(this).prop("checked", false);
for(var m = 0; m <= $select_all.length; m++) {
//取消全选样式
var notSelect = $("input[name='" + a + "']").eq(m);
notSelect.prop("checked", false);
notSelect.parent().removeClass("active");
}
} else {
//点击商品选中
$(this).prop("checked", true);
var childlen = $("input[name='" + b + "']:checked").length;
//判断商品是否选中个数
if(childlen != $childBox.length) {
//判断商品是否全部选中
for(var m = 0; m <= $select_all.length; m++) {
var notSelect = $("input[name='" + a + "']").eq(m);
notSelect.prop("checked", false);
notSelect.parent().removeClass("active");
}
} else {
for(var m = 0; m <= $select_all.length; m++) {
var notSelect = $("input[name='" + a + "']").eq(m);
notSelect.prop("checked", true);
notSelect.parent().addClass("active");
}
}
}
if(checkTure) {
//控制本身是否选中
$(this).prop("checked", true);
$(this).parent().addClass("active");
} else {
$(this).prop("checked", false);
$(this).parent().removeClass("active");
}
};
}
}
}
</script>
<html><%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ taglib uri="http://www.xinxin.com/functions/acl" prefix="acl" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="renderer" content="webkit">
<meta http-equiv="Cache-Control" content="no-siteapp" />
<meta name="keywords" content="ISIP后台管理">
<meta name="description" content="后台管理">
<link href="${pageContext.request.contextPath}/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="${pageContext.request.contextPath}/bootstrap/css/style.min.css" rel="stylesheet">
<link href="${pageContext.request.contextPath}/bootstrap/css/font-awesome.min93e3.css?v=4.4.0" rel="stylesheet">
<link href="${pageContext.request.contextPath}/bootstrap/css/animate.min.css" rel="stylesheet">
<link href="${pageContext.request.contextPath}/bootstrap/css/plugins/dataTables/dataTables.bootstrap.css" rel="stylesheet">
<link href="${pageContext.request.contextPath}/bootstrap/css/plugins/awesome-bootstrap-checkbox/awesome-bootstrap-checkbox.css" rel="stylesheet">
<link href="${pageContext.request.contextPath}/bootstrap/css/plugins/sweetalert/sweetalert.css" rel="stylesheet">
<link rel="stylesheet" href="${pageContext.request.contextPath}/bootstrap/css/zTreeStyle.css" />
<link href="${pageContext.request.contextPath}/bootstrap/css/plugins/bootsrap-select/bootstrap-select.min.css" rel="stylesheet">
<style type="text/css">
.ipt-left {padding-left: 0px;}
.btn-info {background: #fff;color:#333; border-color:#e5e6e7;}
    .btn-info:hover{background: #fff !important;color:#333 !important;}
    .open .btn-info {background: #fff !important;color:#333 !important;}
    .dropdown-menu-right {right: auto !important; left: 0px !important;}
    .btn-info.active, .btn-info:active, .btn-info:focus, .btn-info:hover, .open .dropdown-toggle.btn-info{background: #fff !important;color:#333 !important;}
ul.ztree {width: 100%; min-height: 500px; height: auto;}
ul.ztree li span.button.switch{margin-right:5px}
    ul.ztree ul ul li.level3{ display: inline-block; white-space:normal;}
    ul.ztree>li>ul>li{padding:5px; }
    ul.ztree>li{background: #dae6f0}
    ul.ztree>li:nth-child(even)>ul>li:nth-child(even){background: #eef5fa}
    ul.ztree>li:nth-child(even)>ul>li:nth-child(odd){background: #f6fbff}
    ul.ztree>li:nth-child(odd)>ul>li:nth-child(even){background: #eef5fa}
    ul.ztree>li:nth-child(odd)>ul>li:nth-child(odd){background: #f6fbff}
    ul.ztree>li>ul{margin-top:12px}
    ul.ztree>li{padding:15px;padding-right:25px}
    ul.ztree li{white-space:normal!important}
    ul.ztree>li>a>span{font-size:15px;font-weight:700}
    .ibox-content {position: relative;}
    .spiner-example {position: absolute;top: 35%;left: 0px;width: 100%; z-index: 9999; }
.loadingPurview {display: none;position: absolute; top: 0; right: 0; bottom: 0; left: 0; opacity: .75; background: #666; filter: alpha(opacity=75); z-index:9999; text-align: center;}
.loadingPurview  .sk-spinner {position: relative;top: 40%;left: 0px;width: 100%; z-index: 9999; } 
.loadingPurview  .load-text {position: relative;top: 40%;left: 0px;width: 100%; z-index: 9999; color: #fff;}
</style>
</head>
<body class="gray-bg""> 
<div class="row  border-bottom white-bg dashboard-header animated fadeInRight">
<input id="moduleId" type="hidden" name="moduleId" value="${moduleId}"/>
<div class="row">
<div class="col-sm-12">
<div class="ibox float-e-margins">
<div class="row">
<div class="col-sm-12" >
<div class="ibox-content">
    <div class="row form-body form-horizontal m-t">
  <div class="col-md-12 droppable sortable">
  <div class="col-md-1">
<c:if test="${acl:def(moduleId,'c')}">
<a id="addRoleBtn" class="btn btn-primary" type="button" data-toggle="modal" data-target="#addRoelDiv">添加</a>
</c:if>
<%-- <c:if test="${acl:def(moduleId,'a')}">
<a id="addUserBtn" class="btn btn-primary" type="button" data-toggle="modal" data-target="#updateUserDiv">修改</a>
</c:if>
<c:if test="${acl:def(moduleId,'a')}">
<a id="addUserBtn" class="btn btn-primary" type="button" data-toggle="modal" data-target="#inforUserDiv">用户信息</a>
</c:if>
<c:if test="${acl:def(moduleId,'a')}">
<a id="addUserBtn" class="btn btn-primary" type="button" data-toggle="modal" data-target="#roleDiv">分配角色</a>
</c:if>
<c:if test="${acl:def(moduleId,'a')}">
<a id="addUserBtn" class="btn btn-primary" type="button" data-toggle="modal" data-target="#updatePasswordDiv">修改密码</a>
</c:if> --%>
</div>
  <form id="getRolePageForm" action="#" method="post">
<div class="col-md-4">
    <div class="form-group">
        <label class="col-sm-3 control-label">所属部门:</label>
        <div class="col-sm-5 ">
    <div style="width: 240px;">
    <select id="orgPathSelects" name="orgPath" data-actions-box="false" data-live-search="true" data-done-button="true"></select>
    </div>
        </div>
    </div>
</div>
<div class="col-md-3">
<div class="form-group">
        <div class="col-sm-1">
      <input id="selectBtn" class="btn btn-pirmary" style="background: #5bc0de; border-color: #5bc0de; color:#fff;" type="button" value="查询" >
      </div>
     </div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<div class="ibox-content">
<table class="table table-striped table-bordered table-hover" id="roleTable" width="100%">
<thead>
<tr>
<th>角色ID</th>
<th>所属机构ID</th>
<th>角色名称</th>
                                <th>所属部门</th>
<th>描述</th>
<th>操作</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<!-- 新增页面DIV(开始) -->
    <div class="modal inmodal fade animated fadeInRight" id="addRoelDiv" tabindex="-1" role="dialog"  aria-hidden="true">
    <div class="col-sm-12">
<div class="ibox float-e-margins">
<div class="ibox-title" style="height: 58px;">
<h5 id="organizationName" style="color: blue;"></h5>
<div class="ibox-tools">
<button class="btn btn-primary" type="button" data-dismiss="modal">关闭</button>
</div>
</div>
<div class="ibox-content" id="messTableDiv">
<div class="row">
<div class="col-sm-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>添加角色</h5> 
                    </div>
<div class="ibox-content">
                        <form id="addRoleForm" role="form" autocomplete="off" class="form-horizontal m-t" action="" method="POST">
                        <input type="hidden" name="moduleId" value="${moduleId}">
                        <div class="form-group draggable">
                                <label class="col-sm-2 control-label"><i class="text-danger">*&nbsp;</i>角色名称:</label>
                                <div class="col-sm-5">
                                    <input type="text" name="roleName" class="form-control">
                                </div>
                            </div>
                            <div class="form-group draggable">
                                <label class="col-sm-2 control-label"><i class="text-danger">*&nbsp;</i>所属部门:</label>
                                <div class="col-sm-5">
                                  <input type="text" name="orgId" id="orgIdA" class="form-control" style=" display: none;">
  <select id="selectUserOrgIdA" data-actions-box="false" data-live-search="true" data-done-button="true"></select>
                                </div>
                            </div>
                            <div class="form-group draggable">
                                <label class="col-sm-2 control-label"><i class="text-danger">*&nbsp;</i>描述:</label>
                                 <div class="col-sm-5">
                                <textarea id="configDescriptionU" name="roleDescription" class="form-control" maxlength="255"></textarea>
                                </div>
                            </div>
                            <div class="form-group draggable">
                                <div class="col-sm-12 col-sm-offset-2">
                                    <button class="btn btn-w-m btn-primary" id="addform" type="button">保存</button>
                                    <button class="btn btn-white" type="button" data-dismiss="modal">取消</button>
                                </div>
                            </div>
                        </form>
                    </div>
</div>
            </div>
</div>
</div>
</div>           
</div>                    
  </div>
<!-- 新增页面DIV(结束) -->
<!-- 修改页面DIV(开始) -->
    <div class="modal inmodal fade animated fadeInRight" id="updateRoleDiv" tabindex="-1" role="dialog"  aria-hidden="true">
    <div class="col-sm-12">
<div class="ibox float-e-margins">
<div class="ibox-title" style="height: 58px;">
<h5 id="organizationName" style="color: blue;"></h5>
<div class="ibox-tools">
<button class="btn btn-primary" type="button" data-dismiss="modal">关闭</button>
</div>
</div>
<div class="ibox-content" id="messTableDiv">
<div class="row">
<div class="col-sm-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>修改角色信息</h5> 
                    </div>
<div class="ibox-content">
                        <form id="updateRoleForm" autocomplete="off" role="form" class="form-horizontal m-t" action="" method="POST">
                        <input type="hidden" name="moduleId" value="${moduleId}">
                        <input type="hidden" name="roleId">
                        <div class="form-group draggable">
                                <label class="col-sm-2 control-label"><i class="text-danger">*&nbsp;</i>角色名称:</label>
                                <div class="col-sm-5">
                                    <input type="text" name="roleName" class="form-control">
                                </div>
                            </div>
                            <div class="form-group draggable">
                                <label class="col-sm-2 control-label"><i class="text-danger">*&nbsp;</i>所属部门:</label>
                                <div class="col-sm-5">
                                <input type="text" name="orgId" id="orgIdU" value class="form-control" style="display: none;">
                                    <select id="selectUserOrgIdU" class="form-control" ></select>
                                </div>
                            </div>
                            <div class="form-group draggable">
                                <label class="col-sm-2 control-label"><i class="text-danger">*&nbsp;</i>描述:</label>
                                 <div class="col-sm-5">
                                <textarea id="configDescriptionU" name="roleDescription" class="form-control" maxlength="255"></textarea>
                                </div>
                            </div>
                            <div class="form-group draggable">
                                <div class="col-sm-12 col-sm-offset-2">
                                    <button class="btn btn-w-m btn-primary" id="updateform" type="button">保存</button>
                                    <button class="btn btn-white" type="button" data-dismiss="modal">取消</button>
                                </div>
                            </div>
                        </form>
                    </div>
</div>
            </div>
</div>
</div>
</div>           
</div>                    
  </div>
<!-- 修改页面DIV(结束) -->
<!-- 分配角色页面DIV(开始) -->
    <div class="modal inmodal fade animated fadeInRight" id="roleDiv" tabindex="-1" role="dialog"  aria-hidden="true">
    <div class="col-sm-12">
<div class="ibox float-e-margins">
<div class="ibox-title" style="height: 58px;">
<h5 id="organizationName" style="color: blue;"></h5>
<div class="ibox-tools">
<button class="btn btn-primary" type="button" data-dismiss="modal">关闭</button>
</div>
</div>
<div class="ibox-content" id="messTableDiv">
<div class="row">
<div class="col-sm-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>菜单权限分配</h5> 
                    </div>
<div class="ibox-content">
<input id="roleIdPurview" name="roleId" type="hidden"/>
<div class="spiner-example">
                            <div class="sk-spinner sk-spinner-three-bounce">
                                <div class="sk-bounce1"></div>
                                <div class="sk-bounce2"></div>
                                <div class="sk-bounce3"></div>
                            </div>
                        </div>
                        
                        <ul id="tree" class="ztree loading"></ul>
                        <div class="form-group draggable" style="margin-top: 20px;">
                        <span class="help-block m-b-none" id="message" style="color: red;"></span>
                        <button id="saveRolePurview" class="btn btn-w-m btn-primary" type="button">保存权限</button>
                        <button class="btn btn-white" type="button" data-dismiss="modal">取消</button>
                        </div>
                    </div>
</div>
            </div>
</div>
</div>
</div>           
</div>                    
  </div>
  <div class="loadingPurview">
        <div class="sk-spinner sk-spinner-three-bounce">
                <div class="sk-bounce1"></div>
                <div class="sk-bounce2"></div>
                <div class="sk-bounce3"></div>
            </div>
        <div class="load-text">正在分配权限请稍后(勾选越多,速度越慢)...</div>
        </div>
<!-- 分配角色页面DIV(结束) -->
<!-- 分配角色页面DIV(开始) -->
    <div class="modal inmodal fade animated fadeInRight" id="roleDiv" tabindex="-1" role="dialog"  aria-hidden="true">
    <div class="col-sm-12">
<div class="ibox float-e-margins">
<div class="ibox-title" style="height: 58px;">
<h5 id="organizationName" style="color: blue;"></h5>
<div class="ibox-tools">
<button class="btn btn-primary" type="button" data-dismiss="modal">关闭</button>
</div>
</div>
<div class="ibox-content" id="messTableDiv">
<div class="row">
<div class="col-sm-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>操作权限分配</h5> 
                    </div>
<div class="ibox-content">

                        <div class="form-group draggable" style="margin-top: 20px;">
                        <span class="help-block m-b-none" id="message" style="color: red;"></span>
                        <button id="saveRolePurview" class="btn btn-w-m btn-primary" type="button">保存权限</button>
                        <button class="btn btn-white" type="button" data-dismiss="modal">取消</button>
                        </div>
                    </div>
</div>
            </div>
</div>
</div>
</div>           
</div>                    
  </div>
</body>
<script src="${pageContext.request.contextPath}/bootstrap/js/jquery.min.js?v=2.1.4"></script>
  <script src="${pageContext.request.contextPath}/bootstrap/js/bootstrap.min.js?v=3.3.6"></script>
  <script src="${pageContext.request.contextPath}/bootstrap/js/plugins/dataTables/jquery.dataTables.js"></script>
<script src="${pageContext.request.contextPath}/bootstrap/js/plugins/dataTables/dataTables.bootstrap.js"></script>
<script src="${pageContext.request.contextPath}/bootstrap/js/plugins/sweetalert/sweetalert.min.js"></script>
    <script src="${pageContext.request.contextPath}/bootstrap/js/plugins/layer/layer.min.js"></script>
    <script src="${pageContext.request.contextPath}/bootstrap/js/plugins/iCheck/icheck.min.js"></script>
    <script src="${pageContext.request.contextPath}/bootstrap/js/plugins/bootsrap-select/bootstrap-select.min.js"></script>
    <script src="${pageContext.request.contextPath}/bootstrap/js/plugins/slimscroll/jquery.slimscroll.min.js"></script>
<script src="${pageContext.request.contextPath}/bootstrap/js/plugins/layer/layer.min.js"></script>
<script src="${pageContext.request.contextPath}/js/jquery.ztree.all.js" type="text/javascript"></script>
<script src="${pageContext.request.contextPath}/js/common/common-utils.js"></script>

<script type="text/javascript">
var moduleId = $("#moduleId").val();
var roleTable;
$(function(){
$('#orgPathSelects').selectpicker({//组织机构
    style: 'btn-info',
    noneSelectedText:"请选择",
    liveSearchPlaceholder:"",
    dropdownAlignRight: true,
    liveSearchPlaceholder:"关键字",
    noneResultsText:"搜索不存在",
    width:"240px"
  });
$('#selectUserOrgIdA').selectpicker({//组织机构
    style: 'btn-info',
    noneSelectedText:"请选择",
    liveSearchPlaceholder:"",
    dropdownAlignRight: true,
    liveSearchPlaceholder:"关键字",
    noneResultsText:"搜索不存在",
    width:"auto"
  });
$('#selectUserOrgIdU').selectpicker({//组织机构
    style: 'btn-info',
    noneSelectedText:"请选择",
    liveSearchPlaceholder:"",
    dropdownAlignRight: true,
    liveSearchPlaceholder:"关键字",
    noneResultsText:"搜索不存在",
    width:"200px"
  });
        $.ajax({
    url:"${pageContext.request.contextPath}/role/getRoleAllDictionary.do", 
    type:"post",
    async:true,//取消异步请求
    data:{"moduleId":moduleId}, 
    beforeSend:function(){
    return true;
    },
        success: function (result) {
        if(result.code == 0){
        $("#orgPathSelects").empty();
        //组装机构
        var orgPathSelectHTML = "<option value=''>请选择</option>";
        $.each(result.data.searchOrgList,function(i,data){
        orgPathSelectHTML += "<option value=\'"+data.orgPath+"\'>" + data.orgName + "</option>";
        });
        $('#orgPathSelects').append(orgPathSelectHTML);
        //组装机构
    $('#orgPathSelects').selectpicker('val', '');
    $('#orgPathSelects').selectpicker('refresh');
    $('#orgPathSelects').selectpicker('render');
        } else if (result.code == 1) {
layer.alert(result.message, {icon: 2});
} else if(result.code == 407 || result.code == "407"){
                layer.alert(result.message, {icon: 2}, function(){
                window.location.href = "/dtadmin/main/loginOut.do";
                });
                }
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
$("#addform").button('reset');
if (XMLHttpRequest.status === 0) {
layer.alert("服务器正在开小差,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 404) {
layer.alert("请求路径不存在,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 500) {
layer.alert("服务器异常,请联系管理员解决!", {icon: 2});
}
}
    });
      //所属机构
  $('#orgPathSelects').on('hidden.bs.select', function (e) {
  var tmpSelected = $('#orgPathSelects').val();
              if(tmpSelected != null){
                  $('#orgPathSelects').val(tmpSelected);
              }else {
                  $('#orgPathSelects').val("");
              }
  });
  //添加所属单位
  $('#selectUserOrgIdA').on('hidden.bs.select', function (e) {
  var tmpSelected = $('#selectUserOrgIdA').val();
              if(tmpSelected != null){
                  $('#orgIdA').val(tmpSelected);
              }else {
                  $('#orgIdA').val("");
              }
  });
  //修改所属单位
  $('#selectUserOrgIdU').on('hidden.bs.select', function (e) {
  var tmpSelected = $('#selectUserOrgIdU').val();
              if(tmpSelected != null){
                  $('#orgIdU').val(tmpSelected);
              }else {
                  $('#orgIdU').val("");
              }
  });

  roleTable =  $("#roleTable").dataTable({
        "bAutoWidth":true,
             serverSide: true,//分页,取数据等等的都放到服务端去
             processing: true,//载入数据的时候是否显示“载入中”
             pageLength: 10,//首次加载的数据条数
             ordering: false,//排序操作在服务端进行,所以可以关了。
//  "order": [[ 0, "asc" ]],
searching: false,
bAutoWidth:false,
               ajax: {//类似jquery的ajax参数,基本都可以用。
                   type: "post",//后台指定了方式,默认get,外加datatable默认构造的参数很长,有可能超过get的最大长度。
                   url: "${pageContext.request.contextPath}/role/getRolePage.do",
                   data: function (d) {//d 是原始的发送给服务器的数据,默认很长。
                       var param = {"moduleId":moduleId};//因为服务端排序,可以新建一个参数对象
                       param.start = d.start;//开始的序号
                       param.length = d.length;//要取的数据的
                       var formData = $("#getRolePageForm").serializeArray();//把form里面的数据序列化成数组
                       formData.forEach(function (e) {
                           param[e.name] = e.value;
                       });
                       return param;//自定义需要传递的参数。
                   },
                   dataSrc:"data",
                   dataFilter: function(data, type){
                        var json = jQuery.parseJSON( data );
                        if(json.code == 0){
                        if(json.data == null){
                            json.recordsTotal ="0"
                                 json.recordsFiltered = "0";
                            json.data =""
                            } else{
                            json.recordsTotal = json.data.page.totalPage;
                                json.recordsFiltered = json.data.page.totalRecord;
                                json.data = json.data.page.data;
                            }
                        return JSON.stringify( json );
                    } else if(json.code == 1){
                    layer.alert(json.message, {icon: 2});
                    }
                    }, 
                    error: function(XMLHttpRequest, textStatus, errorThrown){
                    if (XMLHttpRequest.status === 0) {
layer.alert("服务器正在开小差,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 404) {
layer.alert("请求路径不存在,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 500) {
layer.alert("服务器异常,请联系管理员解决!", {icon: 2});
}
                    }
               },
               columns: [
               { data: "roleId", "visible": false },//角色名称ID
               { data: "orgId", "visible": false },//所属机构ID
               { data: "roleName" },//角色名称
                   { data: "orgName" },//所属机构名称
                   { data: "description" },//描述
                   {
                      data: function (v) {//这里给最后一列返回一个操作列表
                           //e是得到的json数组中的一个item ,可以用于控制标签的属性。
                           if ("${acl:def(moduleId,'u')}"=="true") {
                           var b = '';
                        b += '<button id="updateRole" class="btn btn-xs btn-primary" type="button" style="margin-left:10px;" data-toggle="modal" data-target="#updateRoleDiv">修改</button>';
                          b += '<button id="updateRolePurview" class="btn btn-xs btn-success" type="button" style="margin-left: 10px;" data-toggle="modal" data-target="#roleDiv">分配菜单权限</button>';
                           return b;
                       } else {
                       return "没有操作权限";
                       }
                       }
                   } 
              ],
               initComplete: function (setting, json) {
                   //初始化完成之后替换原先的搜索框。
                   //本来想把form标签放到hidden_filter 里面,因为事件绑定的缘故,还是拿出来。
// $(tablePrefix + "filter").html("<form id='filter_form'>" + $("#hidden_filter").html() + "</form>");
               },
               language: {
//lengthMenu: '<select class="form-control input-xsmall">' + '<option value="5">5</option>' + '<option value="10">10</option>' + '<option value="20">20</option>' + '<option value="30">30</option>' + '<option value="40">40</option>' + '<option value="50">50</option>' + '</select>条记录',//左上角的分页大小显示。
                   processing: "<img src='${pageContext.request.contextPath}/bootstrap/img/loading-upload.gif'>载入中",//处理页面数据的时候的显示
                   paginate: {//分页的样式文本内容。
                       previous: "上一页",
                    next: "下一页",
                    first: "第一页",
                    last: "最后一页"
                   },                   zeroRecords: "没有内容",//table tbody内容为空时,tbody的内容。
                   //下面三者构成了总体的左下角的内容。
                   info: "共 _TOTAL_ 条记录,当前显示第 _PAGE_ 页",//左下角的信息显示,大写的词为关键字。
                   infoEmpty: "0条记录",//筛选为空时左下角的显示。
                   infoFiltered: ""//筛选之后的左下角筛选提示(另一个是分页信息显示,在上面的info中已经设置,所以可以不显示),
               }
           });
           
           $("#selectBtn").click(function(){
    var url = roleTable.api().ajax.url("${pageContext.request.contextPath}/role/getRolePage.do?moduleId="+moduleId);
    url.load();
    });
           
        $(document).on("click", "#updateRole", function () {
            $('#updateRoleForm')[0].reset();
            var roleId = JSON.stringify($("#roleTable").DataTable().row($(this).parents("tr")).data().roleId).replace('"','').replace('"','');
            var roleName = JSON.stringify($("#roleTable").DataTable().row($(this).parents("tr")).data().roleName).replace('"','').replace('"','');
            var orgId = JSON.stringify($("#roleTable").DataTable().row($(this).parents("tr")).data().orgId).replace('"','').replace('"','');
            var description = JSON.stringify($("#roleTable").DataTable().row($(this).parents("tr")).data().description).replace('"','').replace('"','');
            $("#updateRoleForm :input[name='roleId']").val(roleId);
          $("#updateRoleForm :input[name='roleName']").val(roleName);
          $("#updateRoleForm :input[name='orgId']").val(orgId);
          $("#updateRoleForm :input[name='roleDescription']").val(description);
          $("#selectUserOrgIdU option[value='"+orgId+"']").prop("selected",true);
          $.ajax({
    url:"${pageContext.request.contextPath}/role/getRoleAllDictionary.do", 
    type:"post",
    async:true,//取消异步请求
    data:{"moduleId":moduleId}, 
    beforeSend:function(){
    return true;
    },
        success: function (result) {
        if (result.code == 0) {
        $("#selectUserOrgIdU").empty();
        var selectUserOrgIdUHTML = "<option value=''>请选择</option>";
        $.each(result.data.orgList,function(i,data){
        selectUserOrgIdUHTML += "<option value=\'"+data.orgId+"\'>" + data.orgName + "</option>";
        });
        $('#selectUserOrgIdU').append(selectUserOrgIdUHTML);
        //添加所属单位
    $('#selectUserOrgIdU').selectpicker('val', orgId);
    $('#selectUserOrgIdU').selectpicker('refresh');
    $('#selectUserOrgIdU').selectpicker('render');
        } else if (result.code == 1) {
layer.alert(result.message, {icon: 2});
}
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
if (XMLHttpRequest.status === 0) {
layer.alert("服务器正在开小差,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 404) {
layer.alert("请求路径不存在,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 500) {
layer.alert("服务器异常,请联系管理员解决!", {icon: 2});
}
}
    });
           });
           //$('#addRoleBtn').on('click', function () {
            $.ajax({
    url:"${pageContext.request.contextPath}/role/getRoleAllDictionary.do", 
    type:"post",
    async:true,//取消异步请求
    data:{"moduleId":moduleId}, 
    beforeSend:function(){
    return true;
    },
        success: function (result) {
        if (result.code == 0) {
        $("#selectUserOrgIdA").empty();
        var selectUserOrgIdAHTML = "<option value=''>请选择</option>";
        $.each(result.data.orgList,function(i,data){
        selectUserOrgIdAHTML += "<option value=\'"+data.orgId+"\'>" + data.orgName + "</option>";
        });
        $('#selectUserOrgIdA').append(selectUserOrgIdAHTML);
        //添加所属单位
    $('#selectUserOrgIdA').selectpicker('val', '');
    $('#selectUserOrgIdA').selectpicker('refresh');
    $('#selectUserOrgIdA').selectpicker('render');
        } else if (result.code == 1) {
layer.alert(result.message, {icon: 2});
}
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
if (XMLHttpRequest.status === 0) {
layer.alert("服务器正在开小差,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 404) {
layer.alert("请求路径不存在,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 500) {
layer.alert("服务器异常,请联系管理员解决!", {icon: 2});
}
}
    });
          // })
           $('#addRoleDiv').on('hidden.bs.modal', function () {
            $('.filter-option').text('请选择');
            $('#addRoleForm')[0].reset();
           });
           $('#updateRoleDiv').on('hidden.bs.modal', function () {
            $('#updateRoleForm')[0].reset();
           });
//给form表单绑定相关的操作
$("#addform").click(function(){
var orgId = $("#orgIdA");
var roleName = $("#addRoleForm :input[name='roleName']");
var roleDescription = $("#addRoleForm :input[name='roleDescription']");
if(roleName.val() == ""){
layer.tips('角色名称不能为空!', roleName, {
  tips: [2, '#3595CC'],
  time: 3000
});
roleName.focus();
return false;
}
if (orgId.val() == "") {
layer.tips('请选择所属部门!', "#selectUserOrgIdA", {
  tips: [2, '#3595CC'],
  time: 3000
});
$("#selectUserOrgIdA").focus();
return false;
}
if(roleDescription.val() == ""){
layer.tips('描述不能为空!', roleDescription, {
  tips: [2, '#3595CC'],
  time: 3000
});
roleDescription.focus();
return false;
}

if(roleDescription.val().length >= 255 ){
layer.tips('描述最长为255个字符!', roleDescription, {
  tips: [2, '#3595CC'],
  time: 3000
});
roleDescription.focus();
return false;
}
var requestVo = {
"orgId":orgId.val(),
"roleName":roleName.val(),
"roleDescription":roleDescription.val(),
"moduleId":$("#moduleId").val()
}
$.ajax({
url: "${pageContext.request.contextPath}/role/addRole.do",
type: "post",
async: true, //异步请求
data: requestVo,
dataType:"json",
beforeSend: function () {
$("#addform").button('loading').delay(1000).queue(function() {});
},
success:function(jsonObject){
$("#addform").button('reset');
if (jsonObject.code==0) {
$('#addRoleForm')[0].reset();
$('#addRoelDiv').modal('hide');
swal("成功", jsonObject.message, "success");
$("#roleTable").DataTable().ajax.reload(null, false);// 刷新表格数据,分页信息不会重置
} else if(jsonObject.code==1){
layer.alert(jsonObject.message, {icon: 2});
$("#roleTable").DataTable().ajax.reload(null, false);// 刷新表格数据,分页信息不会重置
}
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
$("#addform").button('reset');
if (XMLHttpRequest.status === 0) {
layer.alert("服务器正在开小差,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 404) {
layer.alert("请求路径不存在,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 500) {
layer.alert("服务器异常,请联系管理员解决!", {icon: 2});
}
}
});
});
           //修改用户信息
           $("#updateform").click(function(){
var orgId = $("#orgIdU");
var roleId = $("#updateRoleForm :input[name='roleId']");
var roleName = $("#updateRoleForm :input[name='roleName']");
var roleDescription = $("#updateRoleForm :input[name='roleDescription']");
if(roleName.val() == ""){
layer.tips('角色名称不能为空!', roleName, {
  tips: [2, '#3595CC'],
  time: 3000
});
roleName.focus();
return false;
}
if (orgId.val() == "") {
layer.tips('请选择所属部门!', "#selectUserOrgIdU", {
  tips: [2, '#3595CC'],
  time: 3000
});
$("#selectUserOrgIdU").focus();
return false;
}
if(roleDescription.val() == ""){
layer.tips('描述不能为空!', roleDescription, {
  tips: [2, '#3595CC'],
  time: 3000
});
roleDescription.focus();
return false;
}

if(roleDescription.val().length >= 255 ){
layer.tips('描述最长为255个字符!', roleDescription, {
  tips: [2, '#3595CC'],
  time: 3000
});
roleDescription.focus();
return false;
}
var requestVo = {
"orgId":orgId.val(),
"roleId":roleId.val(),
"roleName":roleName.val(),
"roleDescription":roleDescription.val(),
"moduleId":$("#moduleId").val()
}

$.ajax({
url: "${pageContext.request.contextPath}/role/updateRole.do",
type: "post",
async: true, //异步请求
data: requestVo,
dataType:"json",
beforeSend: function () {
$("#updateform").button('loading').delay(1000).queue(function() {});
},
success:function(jsonObject){
$("#updateform").button('reset');
if (jsonObject.code==0) {
$('#updateRoleForm')[0].reset();
$('#updateRoleDiv').modal('hide');
swal("成功", jsonObject.message, "success");
$("#roleTable").DataTable().ajax.reload(null, false);// 刷新表格数据,分页信息不会重置
} else if(jsonObject.code==1){
layer.alert(jsonObject.message, {icon: 2});
$("#roleTable").DataTable().ajax.reload(null, false);// 刷新表格数据,分页信息不会重置
} else if(jsonObject.code == 407 || jsonObject.code == "407"){
                layer.alert(jsonObject.message, {icon: 2}, function(){
                window.location.href = "/dtadmin/main/loginOut.do";
                });
                }
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
$("#updateform").button('reset');
if (XMLHttpRequest.status === 0) {
layer.alert("服务器正在开小差,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 404) {
layer.alert("请求路径不存在,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 500) {
layer.alert("服务器异常,请联系管理员解决!", {icon: 2});
}
}
});
});
});

    
        $(document).on("click", "#updateRolePurview", function () {
        $(".spiner-example").show();
        var roleId = JSON.stringify($("#roleTable").DataTable().row($(this).parents("tr")).data().roleId).replace('"','').replace('"','');
        $("#roleIdPurview").val(roleId);
        var setTree = {
async:{
//开启异步加载模式
enable: true,
//发送异步请求的路径
url: "${pageContext.request.contextPath}/role/getTree.do?moduleId="+moduleId+"&roleId="+roleId,
},
view: {
//禁止树上的节点多选
selectedMulti: false,
showLine: false,
showIcon: false,
dblClickExpand: false
},
check: {
enable: true,
chkStyle: "checkbox",
chkboxType: { "Y": "ps", "N": "ps" },
nocheckInherit: true,
chkDisabledInherit: true
},
data: {
simpleData: {
enable: true
}
},
callback:{
//单击树上节点的时候  执行的操作
onClick:function(){
var treeObj = $.fn.zTree.getZTreeObj("tree");
var nodes = treeObj.getSelectedNodes();
if (nodes.length > 0) {
var isOpen = nodes[0].open;
if (isOpen) {
treeObj.expandNode(nodes[0], !isOpen, false, false);
}else {
treeObj.expandNode(nodes[0], !isOpen, false, false);
}
}
},
onAsyncSuccess: zTreeOnAsyncSuccess
}


};
function zTreeOnAsyncSuccess(event, treeId, treeNode, msg) {
var treeObj = $.fn.zTree.getZTreeObj("tree");
var nodes = treeObj.getNodes();
if (nodes.length>0) {
$(".spiner-example").hide();
                        treeObj.expandAll(true);
                        //骆孝宇 修改为默认全展开
// treeObj.expandNode(nodes[0], true, false, true);
for (var i = 0;i<nodes.length;i++) {
show(nodes[i]);
function show(nodes) {
if (nodes.isParent) {
treeObj.updateNode(nodes);
for(var i = 0;i<nodes.children.length;i++){
show(nodes.children[i]);
}
}else {
treeObj.updateNode(nodes);
}
}
}
}
}
$.fn.zTree.init($("#tree"), setTree);
    });
$(function(){
$("#saveRolePurview").click(function(){
var roleId = $("#roleIdPurview").val();
var permissionIds = "";
var moduleId = "";
var treeObj = $.fn.zTree.getZTreeObj("tree");
var nodes = treeObj.getCheckedNodes(true);
var temp_addModulePermissionsVOList = new Array();
$.each(nodes,function(i,n){
if (!n.isParent) {
getArray(n);
}
});

function getArray(n){
if(!n.children){
temp_addModulePermissionsVOList.push({
"moduleId":n.moduleId,
"permissionIds":n.id,
"name":n.name
});
}

var pNode = n.getParentNode();
if (pNode.level != 0) {
getArray(pNode);
}
}
//console.log('归类前');
//console.log(temp_addModulePermissionsVOList);
//分类整理
var addModulePermissionsVOList = new Array();
$.each(temp_addModulePermissionsVOList,function(i,node1){
//判断是否已存在模块id
var flag_isPermissionId = false;
$.each(addModulePermissionsVOList,function(i,node3){
if(node3.moduleId === node1.moduleId){
flag_isPermissionId = true;
}
});
if(!flag_isPermissionId){
var permissionIds = new Array();
$.each(temp_addModulePermissionsVOList,function(i,node2){
if(node1.moduleId === node2.moduleId){
permissionIds.push(node2.permissionIds);
}
});
addModulePermissionsVOList.push({
"moduleId":node1.moduleId,
"permissionIds":permissionIds.toString()
});
}
});
//console.log('归类后');
//console.log(addModulePermissionsVOList);
var updateRoleModuleVO = {
"roleId":roleId,
"modulePermissionsStr":JSON.stringify(addModulePermissionsVOList)
}
var moduleId = $("#moduleId").val();
$.ajax({
url:"${pageContext.request.contextPath}/role/updateAcl.do",
type:"POST",
data:updateRoleModuleVO,
//data:JSON.stringify(updateRoleModuleVO), 
// dataType:'json',
beforeSend:function(){
$(".loadingPurview").show();
$("#saveRolePurview").button('loading').delay(1000).queue(function() {});
return true;
},
success:function(jsonObject){
$(".loadingPurview").hide();
$("#saveRolePurview").button('reset');
if (jsonObject.code == 0) {
swal("成功", jsonObject.message, "success");
$('#roleDiv').modal('hide');
$("#roleTable").DataTable().ajax.reload(null, false);// 刷新表格数据,分页信息不会重置
} else if (jsonObject.code == 1) {
layer.alert(jsonObject.message, {icon: 2});
$("#roleTable").DataTable().ajax.reload(null, false);// 刷新表格数据,分页信息不会重置
}
},
error: function(XMLHttpRequest, textStatus, errorThrown){
$(".loadingPurview").hide();
$("#saveRolePurview").button('reset');
if (XMLHttpRequest.status === 0) {
layer.alert("服务器正在开小差,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 404) {
layer.alert("请求路径不存在,请联系管理员解决!", {icon: 2});
} else if (XMLHttpRequest.status === 500) {
layer.alert("服务器异常,请联系管理员解决!", {icon: 2});
}
}
}); 
});
});
var setting = {
selectall : function(a, b) {
   //a表示全选name值,b表示子checkbox的name值
var $select_all = $("input[name='" + a + "']");
var $childBox = $("input[name='" + b + "']");
for(var i = 0; i < $select_all.length; i++) {
$select_all[i].onclick = function() {
var checkTure = $(this).prop("checked");
var l = $("input[type='checkbox']").length;
for(var j = 0; j <= l; j++) {
var childAll = $("input[type='checkbox']").eq(j);
if(checkTure) {
childAll.prop("checked", true);
childAll.parent().addClass("active");
} else {
childAll.prop("checked", false);
childAll.parent().removeClass("active");
}
}
};
}
for(var i = 0; i < $childBox.length; i++) {
$childBox[i].onclick = function() {
var checkTure = $(this).prop("checked");
//判断点击商品选中状态
var childlen = $("input[name='" + b + "']:checked").length;
//判断商品是否选中个数
if(childlen != $childBox.length) {
//判断全选下面的商品是否全部选中
$(this).prop("checked", false);
for(var m = 0; m <= $select_all.length; m++) {
//取消全选样式
var notSelect = $("input[name='" + a + "']").eq(m);
notSelect.prop("checked", false);
notSelect.parent().removeClass("active");
}
} else {
//点击商品选中
$(this).prop("checked", true);
var childlen = $("input[name='" + b + "']:checked").length;
//判断商品是否选中个数
if(childlen != $childBox.length) {
//判断商品是否全部选中
for(var m = 0; m <= $select_all.length; m++) {
var notSelect = $("input[name='" + a + "']").eq(m);
notSelect.prop("checked", false);
notSelect.parent().removeClass("active");
}
} else {
for(var m = 0; m <= $select_all.length; m++) {
var notSelect = $("input[name='" + a + "']").eq(m);
notSelect.prop("checked", true);
notSelect.parent().addClass("active");
}
}
}
if(checkTure) {
//控制本身是否选中
$(this).prop("checked", true);
$(this).parent().addClass("active");
} else {
$(this).prop("checked", false);
$(this).parent().removeClass("active");
}
};
}
}
}
</script>

<html>







  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
1:集成最新,最流行,,最成熟悉的技术框架 springMVC4.1.4,spring4.1.4,mybaits3.2.8,MySQL5.6 2:前端界面采用当前最流行的响应式布局设计 bootstrap3,html5,CSS3,JQueryAjax 特点: 1:基于mybaits插件完成对于基本的增,删,改,查的功能,不需要任何SQL语句,代码一键调用即可.具有很好的灵活性,方便性,快速性.这样就大大减少代码开发时间,提高开发效率,为企业或个人有效率地节约人力资源的成本! 2:对JAVA的封装,多态,继承特性做了充分的运用,其中也用到了JAVA的一个重要机制--反射机制! 3:对于简单业务的单表增,删,改,查只需要一个entity,不需要任何的controller,service,mapper等代码,也不需要任何的sql语句,让程序员更专注于前端 4:具有安全,可靠能快速,方便,高效地进行开发 5:系统具有可扩展性,可控性,通用性强的基础 6:基础的业务性不强的列表界面采取直接配置方式,不需要任何代码,直接生成界面,具有快捷,快速,方便地查看实时功能效果 7:集成监控功能,随时监控系统内存,CPU,磁盘的最新变化 8:新增告警邮件触发功能,让用户随时了解服务器状况 目标: 1:提升开发效率,规范开发标准 2:提高质量,降低复杂度 3:打造一个开发简单.效率快..性能好.. 易上手的框架 兼容性: 1:设备:兼容IPAD,手机,电脑,笔记本等等 2:界面:兼容IE8+,firefox,google等等 3:数据库:兼容MySQL,oracel,sqlserver2008 通用性: 让项目只注重业务,为企业或个人有效率地节约人力资源的成本! 1:系统具有最基本的用户角色,资源,权限管理,日志管理等通用性功能,企业或个人可直接在此基础上进行开发,扩展,添加各自的需求和业务功能!
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值