<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<title>系统用户管理</title>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<%@ include file="/include/header2.jsp"%>
<link type="text/css" rel="stylesheet" href="${ctx}/css/baseFrame.css" />
<!-- 下拉树 -->
<%@ include file="/include/zTree.jsp" %>
<style>
	/*.page a {
		color: #333;
	}*/
	input.page_input{
		border:1px solid #ddd;
	}
	.table_list {
		margin-top: 0px;
	}
	#queryDiv div {
	    height: inherit;
	    line-height: inherit;
	    margin-top: 5px;
}
</style>
<!-- 模块化框架配置 -->
<script type="text/javascript">
    // seajs 的简单配置
    seajs.config({
        base: "${ctx}/js",
        alias: {

        }
    });
</script>
</head>
<body class="">
	<div class="">
  		<div class="b_box" style="height:25px">
        <div class="p_bar">您当前的位置：角色管理/批量关联用户</div>
	<!--	<table class="c_table m_t10">
			<tr>
				<td width="15%" class="t_tit">
					P13账号:
				</td>
				<td width="46%">
					<input type="text" name="username" id="username" value="" class="input_txt"/>
					<input type="button" value="查询" id="searchBtn" class="a_btn"/>
				</td>
				<td></td>
			</tr>
		</table>-->		
		</div>
		<input type="hidden" name="deptId" id="deptId" value="" class="input_txt"/>
		<input type="hidden" name="deleteFlag" id="deleteFlag" value="-1" />
		<input type="hidden" name="checkId" id="checkId" value="${sysUserQueryVo.userId}" style="width:100%;height:180px"/>
		<div class="action_box m_t10 t_c" id="queryDiv" style="overflow:hidden;">
			<!-- 查询条件 : 注意加上 data-qname -->
			<!-- 行政级别编码: <input type="text" data-qname="code" class="input_txt" /> -->
			<div style="width:50%; float:left;">
				<span>
					P13账号：
					<input id="username"type="text" name="roleName" class="input_txt"/>
				</span>
			</div>
			<div style="width:50%;float:right">
				<span>
			<!--	<hna:permission privilege="sysRole.toAddUser"></hna:permission>-->
					<input type="button" class="btn btn-primary addBtn" value="搜索"  />
					
				</span>
				<!--<span>
					<input type="button" class="a_btn" value="查询" id="searchBtn" />
				</span>-->
			</div>
		</div>
		<div class="action_box m_t10 t_r">
			<span class="action_tit">角色信息/选择用户<!--：${sysUserQueryVo.userCnName}[${sysUserQueryVo.username}]--></span>
			<input type="button" value="保存" id="saveBtn" class="b_btn"/>
		</div>
		<div>
			<div style="height:400px; background-color:white;">
				<table id="tbwrap" class="table_list"></table>
				<div class="page eui-pager-custom" id="j_pager"></div>
			</div>
		</div>
		</div>
		
		<script type="text/html" id="tb_template">
	    <thead>
			<tr>
				<th>操作</th>
				<th>P13账号</th>
			</tr>
		</thead>
		<tbody data-type="body" id="queryTable">
    		<!if(list.length>0) { !>
        		<!for(var i=0,len=list.length;i<len;i++){
            		var item = list[i],classItem = (i%2!=0)?"odd td_odd":"even";
          		!>
		    	<tr class="gradeA <!=classItem!>">
					<td>
						<input type="checkbox" value="<!=item["userId"]!>" class="isChecked" name="roleArry"/>
					</td>
			    	<td><!=item["username"]!></td>
		   		</tr>
        	<!}!>
    		<!}else{!>
				<tr>
		    		<td colspan="12">暂无数据</td>
				</tr>
    		<!}!>
 		</tbody>
	</script>
	
	<script type="text/javascript">
		$(function(){
			//1、保存角色关系。
			$("#saveBtn").click(function(){
				// 验证
				if($("#checkId").val() == "")
				{
					alert("请至少选中一个角色.");
					return;
				} 
				var checked=$("#checkId").val();
				var checkedId=checked.substr(0,checked.length-1);
				//提交数值
				$.post("${ctx}/sysRole/setUser.do", {
					 userId: checkedId,
					 roleId:"${sysRole.roleId}",
					 deptId:$("#deptId").val(),
					 csrfToken:"${csrfToken}"
					}, 
					function (result) {
		            if ("succ" == result) {
		            	alert("操作成功");
						// 刷新列表页面
		                parent.location.replace("${ctx}/sysRole/list.do"); //如果发表成功则跳到列表界面 
						// 关闭弹窗窗口
		    			parent.sysUserDialog.close();
		            }else if("notThroughSecurityCheck" == result["isThroughSecurityCheck"]) {// 如果不通过安全检查
		                var mess = result["mess"];
		                $.post("${ctx}/common/notThroughSecurityCheck.do?ts="+new Date().getTime(), mess, function(res){
		                    alert(res);
		                },"json");
		            }else {
		            	alert(result);
		            }
		        }, "json");
			});
			
			//2、复选框，选中坚挺
			$("#tbwrap").delegate(".isChecked", "click", function () {
				var userId = $(this).val();//$(this).data("value");
			    if(this.checked == true){
			    	 var aa =  $("#checkId").val();
			    	 aa += userId + ",";
			    	 $("#checkId").val(aa);// 把记录的ID数组字符串赋给隐藏传递的chBoxId
			     }
			     else{
			    	 var aa =  $("#checkId").val();
			    	 var strTemp=userId+",";//临时变量
			    	 aa=aa.replace(strTemp,"");
			    	 $("#checkId").val(aa);
			     }
			});
			//3、保存角色关系。
			$("#addBtn").click(function(){
				search();
			});
			search();
	
		
		// 4、添加
			$("#queryDiv").delegate(".addBtn", "click", function() {
				search();
			
			});
		});	
	</script> 
	
	<script type="text/javascript">
		var firstExpend=0;
		//检查浏览器
		function checkIE(){
			var Sys = {};
	        var ua = navigator.userAgent.toLowerCase();
	        if (window.ActiveXObject) //ie
	           return '1'
	        else if (document.getBoxObjectFor) //firfox
	           return '2'
	        else if (window.MessageEvent && !document.getBoxObjectFor) //chrome
	           return '3'
	        else if (window.opera) //opera
	           return '4'
	        else if (window.openDatabase) //safari
	        	return '5'
		}
		//根据checkId渲染复选框
		function initChecked(){
			 var id = $("#checkId").val();
			 if(checkIE()=='3'){ //浏览器兼容
			 	roleArry=$("input[name=roleArry]")
			 }
	         var data = id.split(",");
	         for(var i = 0; i < data.length; i++){
	             for(var j = 0; j < roleArry.length; j++){
	            	 if(data[i] == roleArry[j].value){
	                	 roleArry[j].checked = true;
	            	 }
	             }
	         }
		}
		
		function search() {
	        seajs.use(["component/table"], function (uiTable) {
		        $.post("${ctx}/sysUser/ajaxPageExceptRoleId.do",
		        {
		        	page: 1,
		        	username:$("#username").val(),
					roleId:"${sysRole.roleId}",
					deleteFlag:$("#deleteFlag").val()
		        }, function (result) {
	            	var table = new uiTable({
	                	"con": "#tbwrap",
	                    "data": {
	                         "list": result.dataList
	                    },
	                    "template": "tb_template",
	                    "pager": {
	                    	"con": "#j_pager",
	                        "data": {
	                        	"currentPage": result.currentPage,
	                            "pageCount": result.pageCount,
	                            "rowCount": result.rowCount
	                        },
	                         //翻页样式
							 template: '<ul class="pagination" style="margin: 0;"><li><a title="首页" class="page_first" data-role="first" href="#">首页</a></li><li><a title="上一页" class="page_prev" href="#" data-role="prev">上一页</a></li><li class="pageNum" data-value="pageNum"><a></a></li><li><a title="下一页" class="page_next" href="#" data-role="next">下一页</a></li><li><a title="尾页" class="page_last" href="#" data-role="last">尾页</a></li></ul><div class="pageGo">共<span data-role="rowCount"></span>条 跳转到 <input  type="text" data-target="input" class="input_txt" style="width:80px;"/><a href="#" data-role="go" class="btn btn-primary go">GO</a></div>'
	                    }
	                });
	            	
	            	if(result.dataList.length>0){
	            		initChecked();//初始化勾选
	            	}
	                table.getPager().bind("changePage", function (event, page, hander) {
						console.log($("#userCnName").val());
	                	$.post("${ctx}/sysUser/ajaxPageExceptRoleId.do",  {
	    		        	page: page,
	    		        	username:$("#username").val(),
							roleId:"${sysRole.roleId}",
							deleteFlag:$("#deleteFlag").val()
	    		        },
	                    function (result) {
	                    	table.render({"list": result.dataList});
		                    hander({"currentPage": result.currentPage, "pageCount": result.pageCount, "rowCount": result.rowCount });
		                   // fullRows("queryTable");
		                   if(result.dataList.length>0){
	            				initChecked();//初始化勾选
	            			}
	    		        }, "json");
	                });
	        	}, "json");
	      	});
		}
	</script>
</body>
</html>