baozhangfang/WebRoot/WEB-INF/jsp/user/userList.jsp

<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<jsp:include page="../../common/include.jsp" />
<% String basePath = request.getScheme()+ "://" + request.getServerName() + ":" +request.getServerPort() + request.getContextPath(); %>

<script type="text/javascript">

	//性别
	var sexObj = null;

	var sex_array = null;
	
	//用户组
	var groupObj = null;
	
	var group_array = null;

	$(function(){
		$.ajax({
		    type: "post",//使用post方法访问后台
		    dataType: "json",//返回json格式的数据
		    url: "groupAction_findAll",//要访问的后台地址
		    complete :function(){$("#load").hide();},//AJAX请求完成时隐藏loading提示
		    success: function(msg){//msg为返回的数据，在这里做数据绑定
		    	if(msg.success){
		    		var data = msg.obj;
		    		var arr = data.split(";");
		    		var ids = arr[0].split(",");
		    		var names = arr[1].split(",");
		    		var select_arr = [];
		    		for(var i = 0; i < ids.length; i++ ){
						select_arr.push("<option value="+ids[i]+">"+names[i]+"</option>");
					}
		    		group_array = select_arr.join("");
		    		$("#group").append(select_arr);
		    	}
		    }
		});
		
		//性别
		$.ajax({
		    type: "post",//使用post方法访问后台
		    dataType: "json",//返回json格式的数据
		    url: "aa10Action_listAa10All",//要访问的后台地址
		    data:{"aa10.letter":"sex" ,"aa10.name":"性别" },
		    complete :function(){$("#load").hide();},//AJAX请求完成时隐藏loading提示
		    success: function(msg){//msg为返回的数据，在这里做数据绑定
		    	if(msg.success){
		    		sexObj = msg.obj.rows;
		    		var select_arr = [];
					var data = sexObj;
					for(var nItem = 0; nItem < data.length; nItem++ ){
						select_arr.push("<option value="+data[nItem].code+">"+data[nItem].value+"</option>");
					}
					sex_array = select_arr.join("");
		    	}
		    }
		});
		
	})

	/**用户显示区*/
	$(function() {
		$('#userDataGrid').datagrid({
			rownumbers:true,
			fit:true,
			pageSize:20,
			pageList : [ 10, 20, 30, 40, 50 ],
			fitColumns:false,
			border:false,
			sortOrder:'desc',
			pagination:true,
			idField:'id',
			url:whzl.basePath + '/userAction_listUser',
			toolbar:'#searchtool',
			checkOnSelect:true,
			selectOnCheck:false,
			nowrap:true,
			loadFilter:function(result){
					if(result.success){
						return result.obj;
					}else{
						$.messager.alert("提示",result.message);
						return ;
					}							
				}
			}
		);
	});
	
	/**查询*/
	function searchFun(){
		$("#userDataGrid").datagrid("load", {
			 "user.name":$("#tblQuery").find("input[id='name']").val(),
             "user.fullName":$("#tblQuery").find("input[id='fullName']").val(),
             "user.group.id":$("#tblQuery").find("select[id='group']").val()
        });
	}
	
	/*清除查询条件**/
    function ClearQuery() {
        $("#tblQuery").find("input").val("");
        $("#tblQuery").find("select").val("-1");
    }
    
    /**详细*/
	var groupNameFormatter = function(value , row , index){
		return row.group.name; 
	};
	
	var departmentName = function(value , row , index){
		if(row.group.id=='3'){
			return row.department.name; 
		}else{
			return ""; 
		}
	};
    
	/**详细*/
	var detailsFormatter = function(value , row , index){
		return "<img src='<%=basePath%>/js/easyui/themes/itemicon/detail.png' title='查看详情' onclick=userDetails(" + row.id + ") style='cursor:pointer' />";
	};
	
	
	/**详细页面对话框*/
	var userDetails = function(id){
		$("#detailUserDialog").dialog(
			{
				buttons : [
					{
						text : '确定', 
						iconCls : 'icon-ok', 
						handler : function(){ 
							$("#detailUserDialog").dialog("close");
						}
					}
				],
				onLoad : function(){
					 $.ajax({
			            type: "post",//使用get方法访问后台
			            dataType: "json",//返回json格式的数据
			            url: "userAction_findById",//要访问的后台地址
			            data: "user.id="+id,//要发送的数据
			            complete :function(){$("#load").hide();},//AJAX请求完成时隐藏loading提示
			            success: function(msg){//msg为返回的数据，在这里做数据绑定
			            	$("#id_detail").text(msg.obj.id);
			            	$("#name_detail").text(msg.obj.name);
			            	$("#fullName_detail").text(msg.obj.fullName);
			            	$("#phone_detail").text(msg.obj.phone);
			            	$("#group_detail").text(msg.obj.group.name);
			            	
			            	if(msg.obj.sex == 1){
			            		$("#sex_detail").text("男");
			            	}else{
			            		$("#sex_detail").text("女");
			            	}
					   		
			            }
					 });
				}
			}
		);
	};
	
	/**更新*/
	var updateFormatter = function(value , row , index){
		return "<img src='<%=basePath%>/js/easyui/themes/itemicon/update.png' title='修改' onclick=updateRow(" + row.id + ") style='cursor:pointer' />";
	};
	
	/**更新事件*/
	function updateRow(id){
		var updateIndex = $('#userDataGrid').datagrid('getRowIndex', id);
		$('#updateUserDialog').dialog(
			{
				buttons : [
					{
						text : '提交', 
						iconCls : 'icon-ok', 
						handler : function(){
							$('#updateUserForm').form('submit',
								{
									url : whzl.basePath+'/userAction_updateUser',
									success : function(result){
										var parseResult = $.parseJSON(result);
										if(parseResult.success){
											//修改完数据，更新对应行的数据
											$('#userDataGrid').datagrid('updateRow',
												{
													index : updateIndex,
													row : parseResult.obj
												}
											);
											$("#updateUserDialog").dialog("close");
											$('#userDataGrid').datagrid('reload');
										}else{
											$.messager.alert("提示",parseResult.message);
										}
									}
								}
							);
						}
					},
					{
						text : '取消', 
						iconCls : 'icon-cancel', 
						handler : function(){ 
							$("#updateUserDialog").dialog("close");
						}
					}
				],
				onLoad : function(){
					$.ajax({
			            type: "post",//使用get方法访问后台
			            dataType: "json",//返回json格式的数据
			            url: "userAction_findById",//要访问的后台地址
			            data: "user.id="+id,//要发送的数据
			            complete :function(){$("#load").hide();},//AJAX请求完成时隐藏loading提示
			            success: function(msg){//msg为返回的数据，在这里做数据绑定
			            	$("#id_update").val(msg.obj.id);
			            	$("#password_update").val(msg.obj.password);
			            	$("#name_update").val(msg.obj.name);
			            	$("#fullName_update").val(msg.obj.fullName);
			            	$("#phone_update").val(msg.obj.phone);
			            	$("#group_update").combobox('setValue',msg.obj.group.id);
			            	$("#sex_update").val(msg.obj.sex);
			            	if(msg.obj.department.id>0){
				            	$('#dept_update').combotree('setValue',msg.obj.department.id);
			            	}
			            }
				 	});
				}
			}
		);
	}
	
	
	/**删除*/
	var delFormatter = function(value , row , index){
		return "<img src='<%=basePath%>/js/easyui/themes/itemicon/delete.png' title='删除' onclick=deleteRow(" + row.id + ") style='cursor:pointer' />";
	};
	
	/**删除功能*/
	function deleteRow(id){
		$.messager.confirm('删除提示', '确定删除这条记录吗？', function(r){
			if (r){
				$.ajax({
		            type: "post",//使用get方法访问后台
		            dataType: "json",//返回json格式的数据
		            url: "userAction_deleteUser",//要访问的后台地址
		            data: "user.id="+id,//要发送的数据
		            complete :function(){$("#load").hide();},//AJAX请求完成时隐藏loading提示
		            success: function(msg){//msg为返回的数据，在这里做数据绑定
		            	if(msg.success){
		            		$.messager.alert('提示','删除成功！');
		            		$('#userDataGrid').datagrid('reload');
		            	}else{
		            		$.messager.alert('提示','删除失败！');
		            	}
		            }
			 	});
			}
		});
	}
	
	/**初始化密码*/
	var initPWDFormatter = function(value , row , index){
		return "<img src='<%=basePath%>/js/easyui/themes/itemicon/initialize.png' title='初始化密码' onclick=initPWD(" + row.id + ") style='cursor:pointer' />";
	};
	
	/**初始化密码*/
	function initPWD(id){
		$.messager.confirm('提示', '确定初始化该用户密码吗？', function(r){
			if (r){
				$.ajax({
		            type: "post",//使用get方法访问后台
		            dataType: "json",//返回json格式的数据
		            url: "userAction_initPwd",//要访问的后台地址
		            data: "user.id="+id,//要发送的数据
		            complete :function(){$("#load").hide();},//AJAX请求完成时隐藏loading提示
		            success: function(msg){//msg为返回的数据，在这里做数据绑定
		            	if(msg.success){
		            		$.messager.alert('提示','初始化成功！初始密码888888');
		            		$('#userDataGrid').datagrid('reload');
		            	}else{
		            		$.messager.alert('提示','初始化失败！');
		            	}
		            }
			 	});
			}
		});
	}
	
	/**增加用户*/
	function userAdd(){
		$('#addUserDialog').dialog(
				{
					buttons : [
						{
							text : '提交', 
							iconCls : 'icon-ok', 
							handler : function(){
								$('#addUserForm').form('submit',
									{
										url : whzl.basePath+'/userAction_addUser',
										success : function(result){
											var parseResult = $.parseJSON(result);
											if(parseResult.success){
												$("#addUserDialog").dialog("close");
												$('#userDataGrid').datagrid('reload');
											}else{
												$.messager.alert("提示",parseResult.message);
											}
										}
									}
								);
							}
						},
						{
							text : '取消', 
							iconCls : 'icon-cancel', 
							handler : function(){ 
								$("#addUserDialog").dialog("close");
							}
						}
					],
					onLoad : function(){
						$("#group_add").append(group_array);
							
						$("#sex_add").append(sex_array);
					}
				}
			);
	}

</script>

<div class="easyui-layout" data-options="fit:true,border:false">

	<div data-options="region:'center',border:false">
		<div id="searchtool" data-options="region:'north' , border:false">
			<div class="clear"></div>
			<table id="tblQuery" style="width:100%;">
				<tr>
					<td align="right" style="width: 10%;"><span>登录名</span></td><td style="width: 10%;"><input id="name" name="user.name" type="text" style="width: 100px;"/></td>
					<td align="right" style="width: 8%;"><span>用户全名</span></td><td style="width: 10%;"><input id="fullName" name="user.fullName" type="text" style="width: 100px;"/></td>
					<td align="right" style="width: 8%;"><span>用户组</span></td>
					<td style="width: 14%;">
						<select id="group" name="user.group.id" style="width:100px">
							<option value="">全部</option>
						</select>
					</td>
					<td align="left" style="width: 40%;">
						<a href="javascript:searchFun();" class="easyui-linkbutton" data-options="iconCls:'icon-search',plain:true">查询</a>
						<a href="javascript:ClearQuery();" class="easyui-linkbutton" data-options="iconCls:'icon-emptied',plain:true">清空</a>
						<a href="javascript:userAdd();" class="easyui-linkbutton" data-options="iconCls:'icon-add',plain:true">增加</a>
					</td>
				</tr>
				
			</table>
			<div class="clear"></div>
		</div>
	
		<table id="userDataGrid">
			<thead frozen="true">
        		<tr>
        			<th data-options="field:'id',checkbox:true,width:30">ID</th>
            		<th data-options="field:'name',sortable:true,width:100">用户名</th>
        		</tr>
        	</thead>
        	<thead>  
        		<tr>
            		<th data-options="field:'fullName',sortable:true,width:125">全名</th>
            		<th data-options="field:'groupName',sortable:true,width:125,formatter:groupNameFormatter">所属组</th>
            		<th data-options="field:'departmentName',sortable:true,width:125,formatter:departmentName">所属街道办</th>
            		<th data-options="field:'phone',sortable:true,width:100">手机号码</th>
            		<th data-options="field:'details',align:'center',width:60,formatter:detailsFormatter">查看详情</th> 
            		<th data-options="field:'update',align:'center',width:38,formatter:updateFormatter">修改</th>
            		<th data-options="field:'init',align:'center',width:65,formatter:initPWDFormatter">初始化密码</th>
            		<th data-options="field:'delete',align:'center',width:38,formatter:delFormatter">删除</th>
        		</tr>  
    		</thead>
		</table>
		
	</div>
</div>
<div id="detailUserDialog" data-options="title:'&nbsp;用户详细信息',iconCls:'icon-details',width:500,height:300,modal:true,href:'<%=basePath %>/userAction_toDetail'">
</div>
<div id="updateUserDialog" data-options="title:'&nbsp;修改用户信息',iconCls:'icon-edit',width:500,height:300,modal:true,href:'<%=basePath %>/userAction_toUpdate'">
</div>
<div id="addUserDialog" data-options="title:'&nbsp;增加用户信息',iconCls:'icon-add',width:500,height:300,modal:true,href:'<%=basePath %>/userAction_toAdd'">
</div>
<script type="text/javascript">
<!--
	parent.$.messager.progress('close');
//-->
</script>