76.培训记录信息 Extjs 页面
1.培训记录信息页面jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>"> <title>培训记录</title> <script type="text/javascript">
var trainRecordPanel = new TrainRecordPanel();
var tabId = Ext.getCmp('mainTab').getActiveTab().id.split('_')[1];
juage(tabId,"trainr",trainRecordPanel,"trainRecord");
</script> </head>
<body>
<div id="trainRecord" ></div>
</body>
</html>
2.培训记录页面js
TrainRecordPanel = Ext.extend(Ext.Panel,{
id: 'trainRecordPanelId',
constructor: function(){
tRecordQueryPanel = new TRecordQueryPanel();
tRecordInfoGridPanel = new TRecordInfoGridPanel();
TrainRecordPanel.superclass.constructor.call(this,{
style: 'margin:0 auto',
border: false,
//layout: 'fit',
//autoWidth: true,
//autorHeight: true,
items: [tRecordQueryPanel, tRecordInfoGridPanel]
})
}
})
3.
Ext.namespace("hrmsys.trainRecord.info");
/**
* 培训记录信息表格
* @author sux 2011-02-19
* @memberOf {TypeName}
* @return {TypeName}
*/
TRecordInfoGridPanel = Ext.extend(Ext.grid.GridPanel,{
id: 'tRecordInfoGridId',
constructor: function(){
Ext.QuickTips.init();
var sm = new Ext.grid.CheckboxSelectionModel();
var number = new Ext.grid.RowNumberer();
var cm = new Ext.grid.ColumnModel([
number, sm,
{
header: '编号',
dataIndex: 'tRecordId',
align: 'center'
},{
header: '培训对象',
dataIndex: 'empName',
align: 'center'
},{
header: '培训人',
dataIndex: 'trainPerson',
align: 'center'
},{
header: '培训时间',
dataIndex: 'trainDate',
align: 'center'
},{
header: '培训主题',
dataIndex: 'trainTitle',
align: 'center'
},{
header: '培训地点',
dataIndex: 'trainPlace',
align: 'center'
},{
header: '结果',
dataIndex: 'trainResult',
align: 'center',
renderer: function(value){
if(value == 0){
return "未参加";
}else if( value == 1){
return "优秀";
}else if( value == 2){
return "良好";
}else if( value == 3){
return "及格";
}else if( value == 4){
return "不及格";
}
}
}]);
var trainStore = new Ext.data.JsonStore({
url: 'tRecord_list.action',
root: 'root',
totalProperty: 'totalProperty',
fields: ['tRecordId','empName','trainPerson','trainDate','trainTitle','trainPlace','trainResult']
});
TRecordInfoGridPanel.superclass.constructor.call(this, {
width: Ext.getCmp('mainTab').getActiveTab().getInnerWidth(),
height: Ext.getCmp('mainTab').getActiveTab().getInnerHeight(),
/**表格高度自适应 document.body.clientHeight浏览器页面高度 start**/
monitorResize: true,
doLayout: function() {
this.setWidth(document.body.clientWidth-205);
this.setHeight(document.body.clientHeight-250);
Ext.grid.GridPanel.prototype.doLayout.call(this);
} ,
viewConfig: {
forceFit: true,
autoFill: true,
columnsText : "显示/隐藏列",
sortAscText : "正序排列",
sortDescText : "倒序排列"
},
border: false,
height: 500,
frame: true,
cm: cm,
sm: sm,
store: trainStore,
tbar: new Ext.Toolbar({
items: [{
text: '显示全部',
iconCls: 'all',
handler: function(){
trainStore.load();
}
},{
text: '删除',
iconCls: 'delete',
id: 'trainr_delete',
handler: delTRecordFn
},{
text: '添加',
iconCls: 'add',
id: 'trainr_add',
handler: addTRecordFn
},{
text: '修改',
iconCls: 'update',
id: 'trainr_update',
handler: updateTRecordFn
},{
text: '详情',
iconCls: 'detail',
id: 'trainr_detail',
handler: detailTRecordFn
}]
}),
bbar: new PagingToolbar(trainStore,20)
});
trainStore.load({
params: {
start: 0,
limit: 20
}
});
}
});
delTRecordFn = function(){
gridDel('tRecordInfoGridId','tRecordId','tRecord_delete.action');
};
addTRecordFn = function(){
var trainRecordAddWin = new TrainRecordAddWin()
trainRecordAddWin.show();
}
/**
* 培训记录查询面板
* @memberOf {TypeName}
* @author sux 2011-02-19
*/
var TRecordQueryPanel = Ext.extend(Ext.Panel,{
id: 'tRecordQueryId',
constructor: function(){
TRecordQueryPanel.superclass.constructor.call(this,{
collapsible: true,
titleCollapse: true, //单击整个collapse都有效
//collapsed: true, //渲染后即闭合
title: '条件查询',
border: false,
frame: true,
autoWidth: true,
defaultType: 'fieldset',
items: [{
title: '条件',
layout: 'table',
layoutConfig: {
columns: 7
},
defaults: {
labelWidth: 60,
labelAlign: 'right'
},
items: [{
layout: 'form',
items: [{
xtype: 'textfield',
fieldLabel: '培训对象',
id: 'empName',
width: 100
}]
},{
layout: 'form',
items: [{
xtype: 'textfield',
fieldLabel: '培训人',
width: 100,
id: 'trainPerson'
}]
},{
layout: 'form',
items: [{
xtype: 'textfield',
fieldLabel: '培训主题',
width: 100,
id: 'trainTitle'
}]
},{
layout: 'form',
items: [{
xtype: 'datefield',
fieldLabel: '开始时间',
format: 'Y-m-d',
width: 100,
id: 'startDate'
}]
},{
layout: 'form',
items: [{
xtype: 'datefield',
fieldLabel: '结束时间',
format: 'Y-m-d',
width: 100,
id: 'endDate'
}]
},{
style: 'margin: 0px 10px 0px 20px;',
xtype: 'button',
text: '查询',
iconCls: 'search',
handler: queryTRecordFn
},{
xtype: 'button',
text: '取消',
iconCls: 'cancel',
handler: cancelTRecordFn
}]
}]
})
}
});
queryTRecordFn = function(){
var empName = Ext.get("empName").dom.value;
var trainPerson = Ext.get("trainPerson").dom.value;
var trainTitle = Ext.get("trainTitle").dom.value;
var startDate = Ext.get("startDate").dom.value;
var endDate = Ext.get("endDate").dom.value;
Ext.getCmp('tRecordInfoGridId').getStore().load({
params: {
type: 'query',
empName: empName,
startDate: startDate,
endDate: endDate,
trainTitle: trainTitle,
trainPerson: trainPerson,
start: 0,
limit: 20
}
})
};
cancelTRecordFn = function(){
Ext.get("empName").dom.value = "";
Ext.get("trainPerson").dom.value = "";
Ext.get("trainTitle").dom.value = "";
Ext.get("startDate").dom.value = "";
Ext.get("endDate").dom.value = "";
};
updateTRecordFn = function(){
var trainRecordAddWin = new TrainRecordAddWin()
trainRecordAddWin.title = '培训记录修改';
var selectionModel = Ext.getCmp('tRecordInfoGridId').getSelectionModel();
var record = selectionModel.getSelections();
if(record.length != 1){
Ext.Msg.alert('提示','请选择一个');
return;
}
var tRecordId = record[0].get('tRecordId');
Ext.getCmp('tRecordAddPanelId').getForm().load({
url: 'tRecord_edit.action',
params: {
trainRecordId: tRecordId
}
})
trainRecordAddWin.show();
};
detailTRecordFn = function(){
var trainRecordDetailWin = new TrainRecordDetailWin()
var selectionModel = Ext.getCmp('tRecordInfoGridId').getSelectionModel();
var record = selectionModel.getSelections();
if(record.length != 1){
Ext.Msg.alert('提示','请选择一个');
return;
}
var tRecordId = record[0].get('tRecordId');
Ext.getCmp('tRecordDetailPanelId').getForm().load({
url: 'tRecord_edit.action',
params: {
trainRecordId: tRecordId
}
})
trainRecordDetailWin.show();
};
5.培训信息添加窗口
TrainRecordAddWin = Ext.extend(Ext.Window,{
id: 'tRecordAddWinId',
constructor: function(){
var trainRecordAddPanel = new TrainRecordAddPanel();
TrainRecordAddWin.superclass.constructor.call(this, {
width: 500,
height: 300,
resizable: false, //不能改变窗体大小
title: '培训记录信息录入',
collapsible: true,
modal: true,
items: [trainRecordAddPanel]
})
}
})
TrainRecordAddPanel = Ext.extend(Ext.form.FormPanel,{
id: 'tRecordAddPanelId',
constructor: function(){
Ext.QuickTips.init();
var reader = new Ext.data.JsonReader({},[{
name: 'trainRecord.trecordId', mapping: 'trecordId'
},{
name: 'title', mapping: 'train.trainTitle'
},{
name: 'trainRecord.train.trainId', mapping: 'train.trainId'
},{
name: 'trainRecord.employee.empId', mapping: 'employee.empId'
},{
name: 'trainRecord.trecordResult', mapping: 'trecordResult'
},{
name: 'trainRecord.trecordRemark', mapping: 'trecordRemark'
}]);
TrainRecordAddPanel.superclass.constructor.call(this,{
width: 520,
border: false,
height: 270,
frame: true,
reader: reader,
defaults: {
labelWidth: 60,
labelAlign: 'right'
},
items:[{
layout: 'form',
items: [{
xtype: 'hidden',
name: 'trainRecord.trecordId'
},{
xtype: 'textfield',
fieldLabel: '培训主题',
width: 150,
allowBlank: false,
msgTarget: 'side',
blankText: '不能为空',
name: 'title',
id: 'title',
listeners: {'focus': function(){
var trainGridWin = new TrainGridWin();
trainGridWin.show();
}
}
},{
xtype: 'textfield',
fieldLabel: '工号',
allowBlank: false,
msgTarget: 'side',
blankText: '不能为空',
width: 150,
name: 'trainRecord.employee.empId'
},{
xtype: 'combo',
fieldLabel: '培训结果',
width: 150,
allowBlank: false,
msgTarget: 'side',
blankText: '不能为空',
triggerAction: 'all',
editable: false,
mode: 'local',
store: new Ext.data.SimpleStore({
fields: ['name','value'],
data: [["未参加","0"],["优秀","1"],["良好","2"],["及格","3"],["不及格","4"]]
}),
displayField: 'name',
valueField: 'value',
hiddenName: 'trainRecord.trecordResult'
},{
layout: 'form',
items: [{
xtype: 'textarea',
fieldLabel: '备注',
width: 370,
height: 100,
name: 'trainRecord.trecordRemark'
},{
xtype: 'hidden',
name: 'trainRecord.train.trainId',
id: 'trainId'
}]
}]
}],
buttonAlign: 'center',
buttons: [{
columnWidth: .5,
text: '保存',
iconCls: 'save',
handler: this.saveTRecordFn
},{
columnWidth: .5,
text: '关闭',
iconCls: 'cancel',
handler: this.cancelTRecordFn
}]
})
},
saveTRecordFn : function(){
if(!Ext.getCmp('tRecordAddPanelId').getForm().isValid()){
return;
}
Ext.getCmp('tRecordAddPanelId').getForm().submit({
url: 'tRecord_save.action',
method: 'post',
waitTitle: '提示',
waitMsg: '正在保存数据...',
success: saveTRecordSuccessFn,
failure: saveTRecordFailureFn
})},
cancelTRecordFn : function(){
Ext.getCmp('tRecordAddWinId').destroy();
}
});
saveTRecordSuccessFn = function(form, action){
Ext.Msg.confirm('提示',action.result.msg, function(button, text){
if(button == "yes"){
form.reset();
Ext.getCmp('tRecordAddWinId').destroy();
Ext.getCmp('tRecordInfoGridId').getStore().reload();
}
})
};
saveTRecordFailureFn = function(form, action){
Ext.Msg.alert('提示','连接失败', function(button, text){});
};
76.培训记录信息 Extjs 页面的更多相关文章
- 75.培训管理-培训信息发布 Extjs 页面
1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8&quo ...
- 如何进行SCCM中客户端记录信息维护
SCCM 部署完毕之后,不久我们就会发现客户端代理状态,因为重装系统,非正常的退域,长时间不开机,导致客户端状态有不可用的,有过期的,重复的记录很多.当然我们可以手动的快速删除重复的记录,那么怎么能做 ...
- 网页调试技巧：抓取马上跳转的页面POST信息或者页面内容
http://www.qs5.org/Post/625.html 网页调试技巧:抓取马上跳转的页面POST信息或者页面内容 2016/02/02 | 心得分享 | 0 Replies 有时候调试网页或 ...
- 通过cookie记录，设置页面访问的跳转页
通过cookie记录,设置页面访问的跳转页 转载自:http://blog.csdn.net/yixiao_naihe/article/details/26679515. 目的: 1.访问fm.htm ...
- 26.Extjs 部门列表信息展示页面
/** * @author sux * @time 2011-1-14 * @desc 部门信息显示 */ deptInfoGridPanel = Ext.extend(Ext.grid.Editor ...
- 78.员工个人信息保镖页面 Extjs 页面
1 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8" ...
- 83.个人信息维护页面 Extjs 页面
1 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8" ...
- 69.资金管理-税率表管理extjs 页面
1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8&quo ...
- js记录用户访问页面和停留时间
1.setInterval setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式. setInterval(code,millisec[,"lang" ...
随机推荐
- dubbo之连接控制
连接控制 服务端连接控制 限制服务器端接受的连接不能超过 10 个 1: <dubbo:provider protocol="dubbo" accepts="10& ...
- JavaScript：颜色辨别
<script> //参考文章:http://www.cnblogs.com/xuechenlei/p/5940729.html //游戏页面:http://www.webhek.com/ ...
- 扩增子图表解读1箱线图：Alpha多样性
箱线图 箱形图(Box-plot)又称为盒须图.盒式图或箱线图,是一种用作显示一组数据分散情况资料的统计图.因形状如箱子而得名.在宏基因组领域,常用于展示样品组中各样品Alpha多样性的分布 第一种情 ...
- 【HTTP/S】透明代理、匿名代理、混淆代理、高匿代理有什么区别？
这4种代理,主要是在代理服务器端的配置不同,导致其向目标地址发送请求时,REMOTE_ADDR, HTTP_VIA,HTTP_X_FORWARDED_FOR三个变量不同. 1.透明代理(Transpa ...
- MFC CAD控制权问题
begineditorcommand(); 隐藏对话框 把控制权交给CAD completeeditorcommand(); 完成交互返回到应用程序 canceleditorcommand CAD被 ...
- js生成web安全色
256色里有40种颜色在Macintosh和Windows里显示的效果不一样,所以能安全使用的只有216色. <!DOCTYPE HTML> <html> <head&g ...
- BZOJ 4561: [JLoi2016]圆的异或并 扫描线 + set
看题解看了半天...... Code: #include<bits/stdc++.h> #define maxn 200010 #define ll long long using nam ...
- 【Linq】
" }; var l1 = strs.ToLookup(a => "a"); //Key=a elements=1,3 var l2 = strs.ToLookup ...
- [HDU5807] Keep In Touch
\(Keep\ In\ Touch\):保持联络 \(Informatik\ verbindet\ dich\ und\ mich.\) 信息将你我连结? 发现这个方程很容易列出来. \(f[i][j ...
- WEB 移动端 CSS3动画性能 优化
很多时候,我们在开发移动端的时候要使自己的网页兼容不同的机型,很多时候会采用CSS3动画,但是很多时候在安卓机下,动画明显会出现卡顿,很难看,那么这里我介绍几个CSS 属性进行硬件加速那么就会得到明显 ...