zoukankan      html  css  js  c++  java
  • extjs3 用户管理 页面

    <%@ page language="java" contentType="text/html; charset=UTF-8"	pageEncoding="UTF-8" %>
    <%@include  file="/webapp/systempublic/common.jsp" %>
    <html>
      	<head>
    	    
    	    <title>客户清单管理</title>
    	    
    		<meta http-equiv="content-type" content="text/html; charset=utf-8" />
    		<script type="text/javascript" src="../resources/Datetime2.js"></script>
    		<script type="text/javascript">
    		var orgGrid;	//系统用户GRID
    		var store;
    		var check;
    		var rolestore;
    		
    		Ext.onReady(function(){
    			Ext.QuickTips.init();
    			var myMask = new Ext.LoadMask(Ext.getBody(), {
    				msg : "正在处理数据,请稍候..."     
    			});
    		
    		rolestore = new Ext.data.Store({
    				proxy: new Ext.data.HttpProxy({url: '<%=basepath%>/usermanage/queryrolemanage.action'}),  
    				reader: new Ext.data.JsonReader(
    				{   
    				    totalProperty:"total",
    	    			root:"data"
    	  			}, 
    	  			[
    	  				{name:'ROLEID', mapping:'ROLEID',type:'string'},
    	  				{name:'NAME', mapping:'NAME',type:'string'}
    	  			]
    	  			),
    				listeners:{
    					load: loadStoreError                //JsonStore执行好触发的事件
    				} 
    			});
    		
    		store = new Ext.data.Store({
    				proxy: new Ext.data.HttpProxy({url: '<%=basepath%>/usermanage/queryusermanage.action'}),  
    				reader: new Ext.data.JsonReader(
    				{   
    	    			totalProperty:"total",
    	    			root:"data"
    	  			}, 
    	  			[
    	  				{name:'USERID', mapping:'USERID', type:'string'},
    	  				{name:'NAME', mapping:'NAME',type:'string'},
    	  				{name:'STATUS', mapping:'STATUS',type:'int'},
    	  				{name:'ROLEID', mapping:'ROLEID',type:'string'},
    	  				{name:'ROLENAME', mapping:'ROLENAME',type:'string'}
    	  			]
    	  			),
    				listeners:{
    					load: loadStoreError                //JsonStore执行好触发的事件
    				} 
    			});
    	    	store.on("beforeload",storeLoadFun);
    	    	function storeLoadFun(storeObj){
    				//if(Ext.getCmp('ORG_NAME') != null){
    				//	storeObj.baseParams.orgName = Ext.getCmp('ORG_NAME').getValue();
    				//}
    				//if(Ext.getCmp('synchronizationEpgis') != null){
    				//	storeObj.baseParams.synchronizationEpgis = Ext.getCmp('synchronizationEpgis').getValue();
    				//}
    	    	};
    	    	
    			check = new Ext.grid.CheckboxSelectionModel({singleSelect:false});
    			
    			orgGrid = new Ext.grid.GridPanel({
    				renderTo:Ext.getBody(),
    				title:"<center>数据查询</center>",
    				loadMask: {msg:'正在加载数据,请稍侯……'},
    				stripeRows: true, 
    				bodyStyle:'100%',
    				viewConfig: {forceFit: true},
    				autoScroll:true,
    				//disableSelection:true,
    				sm:check,
    	        	store: store,
    				columns:[check,{
    			            header:'用户编号',
    			            align: 'center',
    			            dataIndex: 'USERID',
    			             80,
    			            sortable: false
    		            },{
    			            header: '用户名',
    			            align: 'center',
    			            dataIndex: 'NAME',
    			             120,           
    		            	sortable: true
    		            	//renderer: changeSf
    		        	},
    		        	{
    			            header: '关联编号角色',
    			            align: 'center',
    			            dataIndex: 'ROLEID',
    			             120,           
    		            	sortable: true
    		            	//renderer: changeSf
    		        	},
    		        	{
    			            header: '关联角色名称',
    			            align: 'center',
    			            dataIndex: 'ROLENAME',
    			             120,           
    		            	sortable: true
    		            	//renderer: changeSf
    		        	},
    		        	{
    			            header: '用户状态',
    			            align: 'center',
    			            dataIndex: 'STATUS',
    			             120,           
    		            	sortable: true,
    		            	renderer: changeStatus
    		        	}
    		        	],
    		            tbar: new Ext.Toolbar({
    					items:[
    					{
    						xtype:"button",
    						text:"添加",
    						tooltip:"添加",
    						iconCls:'addIcon'
    						,handler:addUser				
    					},{
    						text: '删除',
    						tooltip:"删除",
    						iconCls:'deleteIcon',
    			        	handler:deleteUser	        	
    					},{
    						text:"修改",
    						tooltip:"有且仅能选择一条修改数据",
    						iconCls:'modifyIcon',
    						handler:updateUser				
    					}]        	
                        }),
    		        	listeners:{"render": function(){
    		        		
    		      		}
    	        	}
    	        
    			});
    			
    			//给orgGrid加监听事件
    			new Ext.KeyMap(orgGrid.getEl(), [{
    		           key: 13,
    		      	   fn: btnSearchClick
    			}]);
    	
    			store.load();	
    			
    			//设置Grid充满整个窗体
    		    orgGrid.setWidth(Ext.getBody().getWidth()); 
    		    orgGrid.setHeight(Ext.getBody().getHeight()); 
    	});	
    			
    			
    	  //保存
    	  function addUser()
    	  {
    	      var addUserWin;
    	      var addUserbar;
    	      var addUserForm;
    	  
    	      addUserForm = new Ext.form.FormPanel
    			({
    			  	autoWidth:true,
    			  	autoHeight:true,
    			  	method:"POST",
    			  	labelWidth:100,
    			  	layout:"form",
    			  	labelAlign:"right",
    			  	frame:true,	
    			  	bodyStyle:'padding:5px 5px 5px 5px',
    		        items: [{
    				                    xtype:'textfield',
    				                    fieldLabel: "用户名称<span style='color:red;'>*</span>",
    				                    id:'name',
    				                    name: 'NAME',
    				                    maxLength:16,
    				                    maxLengthText:"用户名称不能超过16个字符",
    				                    allowBlank:false,
    				                    blankText:'用户名称不能为空',	                    
    				                    anchor:'95%'
    				               },
    				               {
    				                    xtype:'textfield',
    				                    fieldLabel: "用户密码<span style='color:red;'>*</span>",
    				                    id:'password',
    				                    name: 'PASSWORD',
    				                    maxLength:8,
    				                    maxLengthText:"系用户密码描述不能超过8个字符",
    				                    allowBlank:false,
    				                    blankText:'系用户密码描述不能为空',	                    
    				                    anchor:'95%'
    				               },
    				               {
    				                    xtype:'combo',
    				                    fieldLabel: "用户状态<span style='color:red;'>*</span>",
    				                    id:'status',
    				                    name: 'STATUS',
    				                    allowBlank:false,
    				                    anchor:'95%',
    				                    editable:false,
    						  		    triggerAction:"all",
    						  		    mode:'local',
    				                    valueField: 'value',
              							displayField: 'name',
    				                    store:new Ext.data.SimpleStore({
    		                         			fields:["value","name"],
    		                         			data:[['1','正常'],['2','已删除']]
    		                                   })
    				               },
    				               {
    				                    fieldLabel: "角色编号",
    				                    id:'roleid',
    				                    name: 'ROLEID',
    				                    allowBlank: false,
    				                    xtype: 'hidden'
    				               },
    				               {
    				                    xtype:'combo',
    				                    fieldLabel: "角色名称<span style='color:red;'>*</span>",
    				                    id:'rolename',
    				                    name: 'ROLENAME',
    				                    allowBlank: true,
    				                    mode: 'remote',	                    
    				                    anchor:'95%',
    				                    store:rolestore,
    				                    triggerAction:"all",
    				                    editable:false,
    				                    valueField: 'ROLEID',
              							displayField: 'NAME',
              							blankText: '请选择角色',	                    
    				                    emptyText: '请选择角色',
    				                    listeners:{//添加一个监听事件
             										'select':function(com,record,op) { //选择的时候的事件
             										      //alert(op);
             										      //alert(record.data.ROLEID);
             										      Ext.getCmp('roleid').setValue(record.data.ROLEID)
              										      //var va = Ext.getCmp('roleid').getValue(); 
    		  										}
    		  							}
    				               }] 
    		   });
    		   
    	     addUserbar = new Ext.Toolbar({
    				items:[
    				{
    				  	text:"提交",
    				  	tooltip:"提交记录后返回列表界面"	,
    					iconCls:'addIcon',
    					handler: addUserSubmit									
    				},{
    				  	text:"返回",
    				  	tooltip:"返回列表界面",
    					iconCls:'addIcon',
    					handler: closeAddUserWin		      	
    				}]        	
    			});
    		
    		 
    	    //示例化一个添加窗口
    		addUserWin = new Ext.Window({
    				title: "用户信息维护",
    				plain: true, 
    				height:200,
    				 600, 
    				modal: true, //模式窗体 
    				// onEsc: Ext.emptyFn, 
    				closeAction: "close",
    				items: [addUserForm,addUserbar] 						
    		});  
    	    rolestore.on("beforeload",loadFun);
    	    rolestore.load();
    	    addUserWin.show();
    	    
    	    function closeAddUserWin(){
       		   addUserWin.close(); //窗体关闭
             } 
    	    
    	    
    	    function addUserSubmit()
    	    {
    	        addUserForm.form.submit({
    				url: 'updateuser.action',
    				params:{
    				    //userid:addUserForm.findById("userid").getRawValue(),
    					name : addUserForm.findById("name").getRawValue(),
    					status:addUserForm.findById("status").getRawValue(),
    					roleid:addUserForm.findById("roleid").getRawValue(),
    					rolename:addUserForm.findById("rolename").getRawValue(),
    					password:addUserForm.findById("password").getRawValue()
    				},
    				waitTitle: "请稍候",
    				waitMsg: "正在提交表单数据,请稍候.........",
    				success: function(action, form){	
    				    Ext.Msg.alert('提示', '数据保存或更新成功!');	
    					store.reload();
    				    closeAddUserWin();	
    				},
    				failure: function(action,form){
    					if(form.result.msg == null || form.result.msg.toString().length == 0){
    						Ext.Msg.alert('错误', '数据保存失败!');
    					}else{
    						Ext.Msg.alert('错误', form.result.msg);
    					}
    				}     	
        	      });   
    	    }
    	  }
    	  
    	  function loadFun(obj)
    	  {
    	  }
    	  
    	  //删除
    	  function deleteUser()
    	  {
    	    var selections = orgGrid.getSelectionModel().getSelections();
    		
    		if(selections.length == 0){
    	    	Ext.Msg.alert("提示", '请选择一行或多行数据进行删除。');
    	    	return;
    	    }
    	    Ext.MessageBox.confirm("提示", '您确定要删除所选的用户吗?',function(btnId){
    	    	if(btnId == 'yes'){
    	    		 var userIdList = "";
    			     for(var i = 0; i < selections.length; i++){
    			    	userIdList += selections[i].get("USERID") + ",";       //用于获得用户所选的userId
    			     }
    	    		deleteJZNS(userIdList);
    	    	}
    	    })
       	}
    	
    	function deleteJZNS(userIdList)
    	{
    		//myMask.show();//加载提示信息
    		Ext.Ajax.request({
    			url:'<%=basepath%>/usermanage/deleteuser.action',
    			params:{
    				userIdList: userIdList
    			},
    			success:function(response,option){
    			    if(response.responseText == "" || response.responseText.length == 0){
    					Ext.Msg.alert('提示',"加载失败!没有获得后台的任何信息");
    				}else{
    				    Ext.Msg.alert('提示',"删除成功.");
    				    store.reload();
    				}
    			},
    			failure:function(action,form){
    				Ext.Msg.alert('提示',"删除失败!没有与服务器连接!");
    			}
    		});
    	 }
    		
    	  //修改用户信息
          function updateUser()
          { 
    			var selections = orgGrid.getSelectionModel().getSelections();
    			if(selections.length != 1)
    			{
    				Ext.Msg.alert('提示',"请选择一行系统参数进行修改!");
    				return;
    			}
    			
    		  var addUserWin;
    	      var addUserbar;
    	      var addUserForm;
    	  
    	      addUserForm = new Ext.form.FormPanel
    			({
    			  	autoWidth:true,
    			  	autoHeight:true,
    			  	method:"POST",
    			  	labelWidth:100,
    			  	layout:"form",
    			  	labelAlign:"right",
    			  	frame:true,	
    			  	bodyStyle:'padding:5px 5px 5px 5px',
    		        items: [{
    				            	id:'userid',
    							  	name: 'USERID',
    							  	fieldLabel: '用户编号',
    							  	xtype: 'hidden'
    							  },
    				               {
    				                    xtype:'textfield',
    				                    fieldLabel: "用户名称<span style='color:red;'>*</span>",
    				                    id:'name',
    				                    name: 'NAME',
    				                    maxLength:16,
    				                    maxLengthText:"用户名称不能超过16个字符",
    				                    allowBlank:false,
    				                    blankText:'用户名称不能为空',	                    
    				                    anchor:'95%'
    				               },
    				               {
    				                    xtype:'textfield',
    				                    fieldLabel: "用户密码<span style='color:red;'>*</span>",
    				                    id:'password',
    				                    name: 'PASSWORD',
    				                    maxLength:8,
    				                    maxLengthText:"系用户密码描述不能超过8个字符",
    				                    allowBlank:false,
    				                    blankText:'系用户密码描述不能为空',	                    
    				                    anchor:'95%'
    				               },
    				               {
    				                    xtype:'combo',
    				                    fieldLabel: "用户状态<span style='color:red;'>*</span>",
    				                    id:'status',
    				                    name: 'STATUS',
    				                    allowBlank:false,
    				                    anchor:'95%',
    				                    editable:false,
    						  		    triggerAction:"all",
    						  		    mode:'local',
    				                    valueField: 'value',
              							displayField: 'name',
    				                    store:new Ext.data.SimpleStore({
    		                         			fields:["value","name"],
    		                         			data:[['1','正常'],['2','已删除']]
    		                                   })
    				               },
    				               {
    				                    fieldLabel: "角色编号",
    				                    id:'roleid',
    				                    name: 'ROLEID',
    				                    allowBlank: false,
    				                    xtype: 'hidden'
    				               },
    				               {
    				                    xtype:'combo',
    				                    fieldLabel: "角色名称<span style='color:red;'>*</span>",
    				                    id:'rolename',
    				                    name: 'ROLENAME',
    				                    allowBlank: true,
    				                    mode: 'remote',	                    
    				                    anchor:'95%',
    				                    store:rolestore,
    				                    triggerAction:"all",
    				                    editable:false,
    				                    valueField: 'ROLEID',
              							displayField: 'NAME',
              							blankText: '请选择角色',	                    
    				                    emptyText: '请选择角色',
    				                    listeners:{//添加一个监听事件
             										'select':function(com,record,op) { //选择的时候的事件
             										      //alert(op);
             										      //alert(record.data.ROLEID);
             										      Ext.getCmp('roleid').setValue(record.data.ROLEID)
              										      //var va = Ext.getCmp('roleid').getValue(); 
    		  										}
    		  							}
    				               }] 
    		   });
    		   
    	     addUserbar = new Ext.Toolbar({
    				items:[
    				{
    				  	text:"提交",
    				  	tooltip:"提交记录后返回列表界面"	,
    					iconCls:'addIcon',
    					handler: addUpdateUserSubmit									
    				},{
    				  	text:"返回",
    				  	tooltip:"返回列表界面",
    					iconCls:'addIcon',
    					handler: closeAddUserWin		      	
    				}]        	
    			});
    		
    		 
    	    //示例化一个添加窗口
    		addUserWin = new Ext.Window({
    				title: "用户信息维护",
    				plain: true, 
    				height:200,
    				 600, 
    				modal: true, //模式窗体 
    				// onEsc: Ext.emptyFn, 
    				closeAction: "close",
    				items: [addUserForm,addUserbar] 	
    				});
    		    
    			rolestore.on("beforeload",loadFun);
    	        rolestore.load();
    			
    	     	//建立系统参数管理窗体
    	    	//createSysParaWin(userId);
    	    	//对窗体中的部分信息进行修正 
    	    	Ext.getCmp('userid').setValue(selections[0].get("USERID")); 
    	    	Ext.getCmp('name').setValue(selections[0].get("NAME")); 
    	    	Ext.getCmp('status').setValue(selections[0].get("STATUS")); 
    	    	Ext.getCmp('roleid').setValue(selections[0].get("ROLEID"));
    	    	Ext.getCmp('rolename').setValue(selections[0].get("ROLENAME"));
    	    	 
    	    	addUserWin.show(); 
    	    	addUserWin.setTitle('修改用户信息');
    			//addSysParaWin.show();  
    			
    		function closeAddUserWin(){
       		   addUserWin.close(); //窗体关闭
             }  
             function addUpdateUserSubmit()
             {
             	closeAddUserWin();	
             	
        		if(!addUserForm.form.isValid()){
        			Ext.Msg.alert('提示', '录入有误!请填写完整。');
        			return false;
        			}  	
        		addUserForm.form.submit({
    				url: 'updateuser.action',
    				params:{
    				    userid:addUserForm.findById("userid").getRawValue(),
    					name : addUserForm.findById("name").getRawValue(),
    					status:addUserForm.findById("status").getRawValue(),
    					roleid:addUserForm.findById("roleid").getRawValue(),
    					rolename:addUserForm.findById("rolename").getRawValue(),
    					password:addUserForm.findById("password").getRawValue()
    				},
    				waitTitle: "请稍候",
    				waitMsg: "正在提交表单数据,请稍候.........",
    				success: function(action, form){	
    				    Ext.Msg.alert('提示', '数据保存或更新成功!');	
    					store.reload();
    				    closeAddUserWin();	
    				},
    				failure: function(action,form){
    					if(form.result.msg == null || form.result.msg.toString().length == 0){
    						Ext.Msg.alert('错误', '数据保存失败!');
    					}else{
    						Ext.Msg.alert('错误', form.result.msg);
    					}
    				}     	
        		});   	
             }  
            }
        
    	 	
    	    function resize(){
    		    //设置Grid充满整个窗体
    	    	orgGrid.setWidth(Ext.getBody().getWidth()); 
    	    	orgGrid.setHeight(Ext.getBody().getHeight());
    		}
    		
    		function changeStatus(value){
    			if(value == "1"){
    				return "正常";
    			}else if(value == "2"){
    			    return "已删除";
    			}else{
    				return "";
    			}
    		}
    		function changeSf(value){
    			if(value == "0"){
    				return "否";
    			}else if(value == "1"){
    			    return "是";
    			}else{
    				return "";
    			}
    		}
    		
    		function btnSearchClick(){
    	 		if(Ext.getCmp("0").getRawValue().trim().length >16)
    			{
    				Ext.MessageBox.alert("提示","单位名称不能超过16个字节。");
    			}
    			else
    			{
    				//store.reload({params:{start:0,limit:20}});
    			}	
    	 	}
    	 	
    		</script>
      	</head>
      	<body onresize="resize();">
        </body>
    </html>
    
  • 相关阅读:
    Robot Framework-取出接口返回的字段
    利用VBA宏批量解决Word中图片大小、居中设置
    封装和继承
    Shiro的学习
    Redis集群搭建
    Mysql主从架构
    idea修改maven的默认配置不生效
    Mybatis笔记
    【python】文件的读写方法(r;r+;rb;w;w+;wb;a;a+;ab)
    【Python】Xpath语法&示例
  • 原文地址:https://www.cnblogs.com/xue88ming/p/7183012.html
Copyright © 2011-2022 走看看