<%@ 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:'width:100%',
viewConfig: {forceFit: true},
autoScroll:true,
//disableSelection:true,
sm:check,
store: store,
columns:[check,{
header:'用户编号',
align: 'center',
dataIndex: 'USERID',
width: 80,
sortable: false
},{
header: '用户名',
align: 'center',
dataIndex: 'NAME',
width: 120,
sortable: true
//renderer: changeSf
},
{
header: '关联编号角色',
align: 'center',
dataIndex: 'ROLEID',
width: 120,
sortable: true
//renderer: changeSf
},
{
header: '关联角色名称',
align: 'center',
dataIndex: 'ROLENAME',
width: 120,
sortable: true
//renderer: changeSf
},
{
header: '用户状态',
align: 'center',
dataIndex: 'STATUS',
width: 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,
width: 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,
width: 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>
相关推荐
在"EXTJS图书管理系统页面（JAVA）"这个项目中，我们主要关注的是EXTJS在图书管理系统中的应用，以及它与Java后端的交互。 EXTJS提供了一套完整的组件库，包括表格、表单、面板、窗口、菜单等，使得开发者可以方便...
这个后台管理框架是利用EXTJS4.0.7的功能，构建了一个功能丰富的交互式用户界面，通常包括数据管理、表格、图表、窗口、菜单等组件，用于后台系统的管理和操作。 在描述中提到的“动态树”是指可以实时更新和交互的...
3、通过实现角色管理、用户管理、部门管理三个基础的功能模块，演示了Viewport、Container、Panel、Grid、Window、Form、Tree等常用组件的用法，以及border、column、form、fit、accordion、hbox等常用布局方式；...
"ExtJs教学管理系统"是一个基于ExtJs框架和.Net后端技术构建的应用程序，旨在提供一套教育机构或学校使用的教学管理解决方案。此系统可能包括学生管理、课程管理、成绩管理、教师管理等多个模块，以帮助教育工作者...
"ExtJS 网站后台管理系统"是一款基于ExtJS框架构建的高效、功能丰富的网站管理平台，主要用于实现用户权限管理、文章编辑与发布、页面静态化以及集成lucene搜索引擎等功能。这一系统旨在提供一站式的网站信息管理和...
在本系统中，Extjs负责前端交互和展示，实现页面无刷新更新，提供流畅的用户体验。 2. **Visual Studio 2005 (VS2005)**：是Microsoft的集成开发环境，用于编写.NET Framework应用。在这个项目中，VS2005作为开发...
ASP.NET是.NET Framework的一部分，用于构建Web应用程序和服务，它提供了诸如页面生命周期管理、内置的安全性、状态管理等特性，与ExtJS的结合，可以创建出既有美观界面又具有强大功能的Web应用。 综上所述，这个...
它利用ASP.NET 处理业务逻辑和数据操作，使用ExtJS 创建交互式、响应式的用户界面，提供实时的租车收入和支出统计，从而帮助租车公司有效管理运营，提升服务质量。通过这种技术组合，开发者可以构建出高效、用户友好...
3. **页面布局**：ExtJS提供了多种布局方式，如Fit、Border、Form等，可以根据需求灵活组合，构建出复杂的后台管理界面。 4. **数据展示与操作**：ExtJS的组件如GridPanel和FormPanel可以用于数据的展示和编辑，配合...
在本项目中，ExtJS4.0用于设计权限管理系统的前端页面，提供动态的数据加载、交互式操作以及自定义布局等功能。 基于角色的权限设计（Role-Based Access Control，RBAC）是一种常见的权限管理模式。系统中，权限...
在学生信息管理系统中，ExtJS用于创建交互式的前端界面，提升用户体验。 3. MVC架构：Model-View-Controller是软件设计的一种模式，常用于Web开发。模型（Model）负责数据处理和业务逻辑，视图（View）显示数据，...
**JSP与EXTJS在EFS管理系统的应用** 在IT领域，JSP（JavaServer Pages）和EXTJS是两种常用的技术，它们在构建Web应用程序时发挥着重要作用。本项目"jsp extjs Efs管理系统"结合了这两者的优点，提供了一个完整的、...
这可能是全面的ExtJS 3.x教程，涵盖了从基础到进阶的所有内容，包括组件体系、布局管理、数据绑定、AJAX通信、事件处理等。 通过深入学习以上知识点，你将能够熟练地运用ExtJS 3.x来开发功能丰富的Web应用。在实际...
3. **布局管理**：ExtJS拥有多种布局方式，如Fit布局、Border布局、Table布局等，适应各种复杂的页面布局需求。 4. **Ajax支持**：通过AJAX，ExtJS可以实现异步数据交换，提供无缝的用户体验，无需刷新整个页面即可...
EXTJS页面编辑器则将这一强大的功能集进一步提升，提供了直观的图形用户界面，让开发者无需编写大量代码即可设计出专业的EXTJS应用界面。 在EXTJS编辑器中，你可以： 1. **拖放组件**：通过内置的组件库，你可以...
此外，Extjs 2.0支持AJAX技术，使得页面无需刷新即可实现数据的动态更新，提升了系统的响应速度。 其次，我们来看看系统采用的ASP.NET框架。ASP.NET是由微软提供的一个用于构建Web应用程序的平台，它支持C#编程语言...
ExtJS是一个广泛应用于构建富客户端Web应用程序的JavaScript框架，它以其强大的组件库、优雅的数据绑定机制和可定制的用户界面而闻名。标题“extjs3源文件下载”指的是获取ExtJS 3版本的源代码，这通常是开发者为了...
ExtJS是一个强大的JavaScript库，主要用于构建富客户端应用程序，尤其是那些具有复杂用户界面和数据管理需求的Web应用。在这个场景中，“部分纯静态页面”可能意味着这些页面主要依赖于前端代码来呈现和操作数据，不...
在"学生管理系统"这个项目中，ExtJS 被用来创建用户界面，提供丰富的组件和交互效果，使得系统操作更加直观、高效。 Java 和 JSP（JavaServer Pages）则在后端发挥了关键作用。Java 作为一个广泛使用的后端编程语言...
尽管源码部分未完整提供，但根据以上信息，我们可以了解到ExtJS框架在构建动态交互式Web应用时如何通过丰富的组件和样式来实现复杂的用户界面，以及如何通过状态管理来保存用户界面的状态，提供更加流畅的用户体验。...