<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<c:set var="ctx" value="${pageContext.request.contextPath}" />

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="en">
<head>

<title>角色管理</title>
<script type="text/javascript">
	$(document).ready(function() {
         roleInfoTable();
	});
</script>

</head>

<body>
    <form action="#" id="authority"></form>
	<div id="sticky-wrap"></div>

	<div>
		<div class="container">
			<ol class="breadcrumb">
				<li><a href="${ctx}/index">首页</a></li>
				<li>基础管理</li>
				<li class="active">权限管理</li>
			</ol>
		</div>
	</div>

	<div id="main-container main-tab-container">
		<div id="content" class="container">
			<div class="tab-bar-bt">
				<ul class="nav nav-tabs">
					<li><a id="RoleManage" href="${ctx}/BaseManage/AuthorityManage">用户</a>
					</li>
					<li class="active"><a id="roleManage" href="#" data-toggle="tab">角色</a>
					</li>
				</ul>
			</div>
			<div class="section">
				<div class="tab-content">

					<div class="tab-pane fade in active" id="home">
						<div class="row me-row">
							<div id="slidePushMenus2" class="cbp-spmenu-push">
								<div class="slideMenu" id="cbp-spmenu-s2" style="">
									<div class="form"></div>
								</div>
								<div class="main col-xs-12">
									<div class="content clearfix">
										<div class="block clearfix">
										<div class='form-horizontal'>
								<!-- 			<div class='col-sm-1'>
												<button class="btn btn-primary" onclick="javascript:createRole()">添加</button>
											</div> -->
											<div class='col-sm-1'>
												<button class="btn btn-primary" id="modifyRole" disabled onclick="javascript:modifyRole()">修改</button>
											</div>
								<!-- 			<div class='col-sm-1'>
												<button class="btn btn-primary" id="deleteRole" disabled onclick="javascript:deleteRole()">删除</button>
											</div> -->
										</div>
											<div class="bt-list-import">
												<a href="#" id="upload" class=""> <span
													class="glyphicon glyphicon-import"></span> <span
													class="glyphicon-class">导出Excel</span> </a>
											</div>
										</div>
										<div class="row">
											<div class="col-xs-12">
												<div class="table-header">角色列表</div>
												<table id="roleInfoTable"
													class="table table-hover table-striped">
												</table>
												<input type="hidden" id="authm" name="authm" value='${roleList}' />
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
<script type="text/javascript" src="${ctx}/static/js/roleInfoTable.js"></script>
<script type="text/javascript">
//创建角色
function createRole(){
   $.dialog({
		id: "createrole",
		title: "创建角色",
		content: "<div style='width:497px;height:559px'><div class='form-horizontal' id='createForm'><label class='control-label'>角色信息</label><br>"
        +"<div class='form-group'><div class='col-sm-2'><label class='control-label'>角色名称:</label></div><div class='col-sm-6'><input id='rolename' name='rolename' class='form-control' type='text' value='' /></div></div>"
        + "<div class='form-group'><div class='col-sm-2'><label class='control-label'>角色描述:</label></div><div class='col-sm-8'><textarea id='roledescription' name='roledescription' class='form-control' rows='3'></textarea></div></div>"
        +"<label class='control-label'>功能关联</label><br>"
        +"<div class='form-horizontal'>"
        +"<label class='control-label col-sm-2' style='margin:0 -29px;'>功能ID</label><label class='control-label col-sm-2' style='margin:0 33px;'>功能名称</label><label class='control-label col-sm-2' style='margin:0 117px;'>所属模块</label><input style='margin:0 -60px;' type='checkbox' id='createcbAll' name='createcbAll'><div>"
        +"<div style='position:relative;width:497px;height:346px;overflow-y:auto'><table id='roleTable' class='table table-hover table-striped'>"
        +"<tbody>"
        +"<c:forEach items='${functionList}' var='perFun'><tr>"
        +"<td>${perFun.functionId}</td><td>${perFun.functionName}</td><td>${perFun.belongModule}</td><td><input type='checkbox' class='createcb' name='createcb' value='${perFun.functionId}'></td></tr></c:forEach>"
        +"</tbody></table>"
        +"</div></div></div>",
		initialize: function () {
        document.getElementById('rolename').focus();
        $(".d-buttons input:first").css({
	              "color": "#ffffff",
	                       "background": "#428bca",
	                       "border-color": "#357ebd"
	      });
        $("#createcbAll").click(function(){
            if($("#createcbAll").attr("checked")=="checked"){
                 $(".createcb").attr("checked","checked");
            }else{
                 $(".createcb").attr("checked",false);
            }
        });
        
         $(".createcb").click(function(){
            $("#createcbAll").attr("checked",false);
         });
        },
        button: [{
        value: "提交",
        callback: function () {
              if($.trim($("#rolename").val())==null||$.trim($("#rolename").val())==""){//为空
                    $("#rolename").focus();
                    return false;
              }
              if($.trim($("#roledescription").val())==null||$.trim($("#roledescription").val())==""){
                    $("#roledescription").focus();
                    return false;
              }
             if($("input[name='createcb']:checked").length ==0){
                    return false;
             }
             
             var id_array=new Array();
             $('input[name="createcb"]:checked').each(function(){
	               id_array.push($(this).val());//向数组中添加元素
             });
             var idstr=id_array.join(',');//将数组元素连接起来以构建一个字符串
             var roleinfo='?rolename='+$.trim($("#rolename").val())+'&roledescription='+$.trim($("#roledescription").val())+'&createcb='+idstr+'&random='+Math.random();   
             $.ajax({
			    type : 'GET',
				contentType : 'application/json',
				url: encodeURI(encodeURI('${ctx}/BaseManage/AuthorityManage/createRole/'+roleinfo)),
				dataType : 'text',
				beforeSend: function(data) {
				},
				success: function(data) {
					$("#authm").val(data);
					roleInfoTable();
				}
			});
          }  
        },
        {
        value: "取消",
        callback: function () {}  
        }], 
		lock: true
	});
	
}

//修改角色
function modifyRole(){
   var curRoleName;
   $.dialog({
		id: "modifyrole",
		title: "修改角色",
		content: "<div style='width:497px;height:563px'><div class='form-horizontal' id='modifyForm'><label class='control-label'>角色信息</label><br>"
	    +"<div class='form-group'><div class='col-sm-2'><label class='control-label'>角色ID:</label></div><div class='col-sm-6'><label class='control-label'><span id='m_roleid'></span></label></div></div>"
        +"<div class='form-group'><div class='col-sm-3'><label class='control-label'>角色名称(<font color='red'>*</font>):</label></div><div class='col-sm-6' style='margin:0 -43px'><input id='rolename1' name='rolename1' class='form-control' type='text' value='' /></div></div>"
        + "<div class='form-group'><div class='col-sm-3'><label class='control-label'>角色描述(<font color='red'>*</font>):</label></div><div class='col-sm-8' style='margin:0 -43px'><textarea id='roledescription1' name='roledescription1' class='form-control' rows='3'></textarea></div></div>"
        +"<label class='control-label'>功能关联</label><br>"
        +"<div class='form-horizontal'>"
        +"<label class='control-label col-sm-2' style='margin:0 -29px;'>功能ID</label><label class='control-label col-sm-2' style='margin:0 30px;'>功能名称</label><label class='control-label col-sm-2' style='margin:0 123px;'>所属模块</label><input style='margin:0 -64px;' type='checkbox' id='modifycbAll' name='modifycbAll'></div>"
        +"<div style='position:relative;width:497px;height:346px;overflow-y:auto'><table id='roleTable' class='table table-hover table-striped'>"
        +"<tbody>"
        +"<c:forEach items='${functionList}' var='perFun'><tr>"
        +"<td>${perFun.functionId}</td><td>${perFun.functionName}</td><td>${perFun.belongModule}</td><td><input type='checkbox' class='modifycb' name='modifycb' value='${perFun.functionId}'></td></tr></c:forEach>"
        +"</tbody></table>"
        +"</div></div>",
		initialize: function () {
	    $(".d-buttons input:first").css({
	              "color": "#ffffff",
	                       "background": "#428bca",
	                       "border-color": "#357ebd"
	      });
		var roleListObj=JSON.parse(document.getElementById("authm").value);
		$("#m_roleid").text(checkedIds[checkedIds.length-1]);
		for(var t=0;t<roleListObj.length;t++){
		      if(roleListObj[t].roleId==checkedIds[checkedIds.length-1]){
		             curRoleName = roleListObj[t].roleName;
                     $("#rolename1").val(roleListObj[t].roleName);
                     $("#roledescription1").val(roleListObj[t].roleDescription);
		      }
		}
       var timestamp = Date.parse(new Date());
	   $.ajax({//获取该角色对应的角色id
			    type : 'GET',
				contentType : 'application/json',
				url: '${ctx}/BaseManage/AuthorityManage/getRoleFunIds/'+checkedIds[checkedIds.length-1]+'/'+timestamp,
				dataType : 'text',
				beforeSend: function(data) {
				},
				success: function(data) {
				   var functionIdObj=JSON.parse(data);
				    for(var n=0;n<functionIdObj.length;n++){
				        $('input[name="modifycb"]').each(function(){
                               if($(this).val()==functionIdObj[n].functionId){
                                  $(this).attr("checked","checked");
                               }
                        });
				    }
				    
				}
		});
			
  //      document.getElementById('rolename1').focus();
        $("#modifycbAll").click(function(){
            if($("#modifycbAll").attr("checked")=="checked"){
                 $(".modifycb").attr("checked","checked");
            }else{
                 $(".modifycb").attr("checked",false);
            }
        });
        
         $(".modifycb").click(function(){
            $("#modifycbAll").attr("checked",false);
         });
        },
        button: [{
        value: "提交",
        callback: function () {
              if($.trim($("#rolename1").val())==null||$.trim($("#rolename1").val())==""){//为空
                    $.alert("输入的角色的名称不能为空!");
                    $("#rolename1").focus();
                    return false;
              } else {
                    var reg = /^[\u4E00-\u9FA5]+$/; 
		            if(!reg.test($("#rolename1").val())){ 
	                    $.alert("角色名称只能输入中文!");
		                $("#rolename1").focus();
			    		return false; 
					} 
              }
              
            var validationRoleName; 
           	//Ajax判断角色名称是否重复        
            $.ajax({
			    type : 'GET',
				contentType: 'application/x-www-form-urlencoded;charset=UTF-8',
				url: encodeURI(encodeURI('${ctx}/BaseManage/AuthorityManage/validationRoleName/'+'?&rolename1='+$.trim($("#rolename1").val() + '&random=' + Math.random()))),
				dataType : 'text',
				async:false,   
				beforeSend: function(data) {},
				success: function(data) {
                       validationRoleName = JSON.parse(data);
				}
			});
	           if(validationRoleName == "1" && curRoleName != $("#rolename1").val()) {
	               $.alert("角色名称不能出现重复!");
	               $("#rolename1").focus();
	               return false;
               }
   
              if($.trim($("#roledescription1").val())==null||$.trim($("#roledescription1").val())==""){
                    $.alert("输入的角色描述信息不能为空!");
                    $("#roledescription1").focus();
                    return false;
              }
             if($("input[name='modifycb']:checked").length ==0){
                    $.alert("选择的功能不能为空!");
                    return false;
             }
             var id_array=new Array();
             $('input[name="modifycb"]:checked').each(function(){
	               id_array.push($(this).val());//向数组中添加元素
             });
             var idstr=id_array.join(',');//将数组元素连接起来以构建一个字符串
             var roleinfo='?roleId='+checkedIds[checkedIds.length-1]+'&rolename1='+$.trim($("#rolename1").val())+'&roledescription1='+$.trim($("#roledescription1").val())+'&modifycb='+idstr+'&random='+Math.random();   
             $.ajax({
			    type : 'GET',
				contentType : 'application/json',
				url: encodeURI(encodeURI('${ctx}/BaseManage/AuthorityManage/modifyRole/'+roleinfo)),
				dataType : 'text',
				beforeSend: function(data) {
				},
				success: function(data) {
					$("#authm").val(data);
					roleInfoTable();
				}
			});
          }  
        },
        {
        value: "取消",
        callback: function () { }  
        }], 
		lock: true
	});
	
}

//删除角色
function deleteRole(){
     var checkedIdsStr=checkedIds.join(',');//将数组元素连接起来以构建一个字符串
     $.confirm('你确定要删除这'+checkedIds.length+'个角色吗?', function () {
          var timestamp = Date.parse(new Date());
           $.ajax({
			    type : 'GET',
				contentType : 'application/json',
				url: '${ctx}/BaseManage/AuthorityManage/deleteRole/'+checkedIdsStr+'/'+timestamp,
				dataType : 'text',
				beforeSend: function(data) {
				},
				success: function(data) {
				    checkedIds = [];
				   	document.getElementById("deleteRole").disabled=true;
					$("#authm").val(data);
					roleInfoTable();
				}
			});
			
         }, function () {
            return 0;
     });
     
}	

  //导出角色列表为Excel格式
  $("#upload").click(function(){
		   var listForm=$("#authority");
		   listForm.attr("method","post");
		   listForm.attr("action","${ctx}/BaseManage/AuthorityManage/getRoleInfoExcel");
		   listForm.submit();
		   listForm.attr("action","#");
		  
   });
   
   
 //查看角色
function roleInfo(roleId){
   $.dialog({
        id: "roleInfo",
        title: "角色信息",
        content: "<div style='width:497px;height:563px'><div class='form-horizontal' id='modifyForm'><label class='control-label'>角色信息</label><br>"
        //+"<div class='form-group'><div class='col-sm-2'><label class='control-label'>角色ID:</label></div><div class='col-sm-6'><label class='control-label'><span id='m_roleid'></span></label></div></div>"
        +"<div class='form-group'><div class='col-sm-3'><label class='control-label'>角色名称:</label></div><div class='col-sm-6' style='margin:0 -43px'><label id='rolename1' name='rolename1' class='form-control' type='text' value='' /></div></div>"
        + "<div class='form-group'><div class='col-sm-3'><label class='control-label'>角色描述:</label></div><div class='col-sm-8' style='margin:0 -43px'><textarea id='roledescription1' name='roledescription1' class='form-control' rows='3' disabled='disabled'></textarea></div></div>"
        +"<label class='control-label'>功能关联</label><br>"
        +"<div class='form-horizontal'>"
        +"<label class='control-label col-sm-2' style='margin:0 -29px;'>功能ID</label><label class='control-label col-sm-2' style='margin:0 30px;'>功能名称</label><label class='control-label col-sm-2' style='margin:0 123px;'>所属模块</label></div>"
        +"<div style='position:relative;width:497px;height:346px;overflow-y:auto'><table id='roleTable' class='table table-hover table-striped'>"
        +"<tbody>"
        +"<c:forEach items='${functionList}' var='perFun'><tr>"
        +"<td>${perFun.functionId}</td><td>${perFun.functionName}</td><td>${perFun.belongModule}</td><td><input type='checkbox' class='modifycb' name='modifycb' value='${perFun.functionId}' disabled></td></tr></c:forEach>"
        +"</tbody></table>"
        +"</div></div></div>",
        initialize: function () {
        $(".d-buttons input:first").css({
                  "color": "#ffffff",
                           "background": "#428bca",
                           "border-color": "#357ebd"
          });
        var roleListObj=JSON.parse(document.getElementById("authm").value);
       // $("#m_roleid").text(checkedIds[checkedIds.length-1]);
        for(var t=0;t<roleListObj.length;t++){
              if(roleListObj[t].roleId==roleId){
                     //curRoleName = roleListObj[t].roleName;
                     $("#rolename1").html(roleListObj[t].roleName);
                     $("#roledescription1").html(roleListObj[t].roleDescription);
              }
        }
       var timestamp = Date.parse(new Date());
       $.ajax({//获取该角色对应的角色id
                type : 'GET',
                contentType : 'application/json',
                url: '${ctx}/BaseManage/AuthorityManage/getRoleFunIds/'+roleId+'/'+timestamp,
                dataType : 'text',
                beforeSend: function(data) {
                },
                success: function(data) {
                   var functionIdObj=JSON.parse(data);
                    for(var n=0;n<functionIdObj.length;n++){
                        $('input[name="modifycb"]').each(function(){
                               if($(this).val()==functionIdObj[n].functionId){
                                  $(this).attr("checked","checked");
                               }
                        });
                    }
                    
                }
        });
            
  //      document.getElementById('rolename1').focus();
        $("#modifycbAll").click(function(){
            if($("#modifycbAll").attr("checked")=="checked"){
                 $(".modifycb").attr("checked","checked");
            }else{
                 $(".modifycb").attr("checked",false);
            }
        });
        
         $(".modifycb").click(function(){
            $("#modifycbAll").attr("checked",false);
         });
        }, 
        lock: false
    });
    
}
 
     
</script>
</body>
</html>