1 /** 2 * @author sux 3 * @time 2011-1-14 4 * @desc 部门信息显示 5 */ 6 deptInfoGridPanel = Ext.extend(Ext.grid.EditorGridPanel,{ 7 id: 'deptInfoPanel', 8 //renderTo: Ext.getBody(), //渲染到body 9 constructor: function(){ 10 Ext.QuickTips.init(); 11 this['store'] = new Ext.data.JsonStore({ 12 url: 'dept_list.action',//如果有值传入,会为该URL创建一个HttpProxy对象 13 root: 'root',//JSON对象的key指定,这里指的是服务器传递过来的json变量的命名 14 totalProperty: 'totalProperty',//这里指的是查询出来的条数,也是由服务器传递过来 15 //record 16 fields: ['deptId','deptName', 17 'deptNum','deptMgr','deptRemark']//对象数组集合在实际应用中fields我们可以使用遍历list等方式往里面传值。 18 }); 19 var rowNumber = new Ext.grid.RowNumberer(); //序列号 20 var checkbox = new Ext.grid.CheckboxSelectionModel(); //{默认是多选singleSelect: false} 21 deptInfoGridPanel.superclass.constructor.call(this,{ 22 width: Ext.getCmp('mainTab').getActiveTab().getInnerWidth(),//获取当前活动的tab 23 height: Ext.getCmp('mainTab').getActiveTab().getInnerHeight(), 24 /**表格高度自适应 document.body.clientHeight浏览器页面高度 start**/ 25 monitorResize: true, 26 doLayout: function() { //必须在调用doLayout()方法,更新一下布局,Ext中表格自适应高度 27 this.setWidth(document.body.clientWidth-205); 28 this.setHeight(document.body.clientHeight-140); 29 Ext.grid.GridPanel.prototype.doLayout.call(this); 30 } , 31 /**end**/ 32 viewConfig: {//表格视图的配置对象 33 forceFit: true, 34 columnsText : "显示/隐藏列",//表格标题菜单中列对应的文字描述 35 sortAscText : "正序排列",//表格标题菜单中升序的文字描述 36 sortDescText : "倒序排列"//表格标题菜单中降序的文字描述 37 }, 38 sm: checkbox,//表格的选择模式,默认为Ext.grid.RowSelectionModel 39 columns: [ 40 rowNumber, checkbox, 41 { 42 header: '部门编号',//表头文字 43 dataIndex: 'deptId',//设置列与数据集中数据记录的对应关系,值为数据记录中的字段名称 44 align: 'center'//列数据的对齐方式 45 },{ 46 header: '部门名称', 47 dataIndex: 'deptName', 48 align: 'center' 49 },{ 50 header: '部门人数', 51 dataIndex: 'deptNum', 52 align: 'center' 53 },{ 54 header: '部门经理', 55 dataIndex: 'deptMgr', 56 align: 'center' 57 },{ 58 header: '备注', 59 dataIndex: 'deptRemark', 60 name: 'deptRemark', 61 renderer: Ext.hrmsys.grid.tooltip.subLength,//设置列的自定义单元格渲染函数 62 align: 'center' 63 }], 64 tbar: new Ext.Toolbar({//多行工具栏 65 style: 'padding: 5px;', 66 id: 'departToolbar', 67 items: ['条目:',{ 68 xtype: 'combo', 69 width: 80, 70 triggerAction: 'all', 71 editable: false, 72 mode: 'local', 73 store: new Ext.data.SimpleStore({ 74 fields: ['name','value'], 75 data: [[" ","全部"],["deptId","部门编号"],["deptName","部门名称"],["deptMgr","部门经理"]] 76 }), 77 id: 'condition_dept', 78 displayField: 'value', 79 valueField: 'name', 80 emptyText: '请选择' 81 },'内容:',{ 82 id: 'condition_dept_value', 83 xtype: 'textfield', 84 listeners : { 85 specialkey : function(field, e) {//添加回车事件 86 if (e.getKey() == Ext.EventObject.ENTER) { 87 queryDeptFn(); 88 } 89 } 90 } 91 },{ 92 text: '查询', 93 tooltip: '查询部门', 94 iconCls: 'search', 95 hidden: 'true', 96 id: 'dept_query', 97 handler: queryDeptFn 98 },{ 99 text: '删除',100 tooltip: '删除部门',101 id: 'dept_delete',102 iconCls: 'delete',103 hidden: 'true',104 handler: delDeptFn105 },{106 text: '添加',107 tooltip: '添加部门',108 id: 'dept_add',109 hidden: 'true',110 iconCls: 'add',111 handler: addDeptFn112 },{113 text: '修改',114 id: 'dept_update',115 iconCls: 'update',116 hidden: 'true',117 tooltip: '修改部门',118 handler: updateDeptFn119 }]120 }),121 bbar: new PagingToolbar(this['store'], 20)//分页工具栏122 });123 this.getStore().load({124 params:{125 start: 0,126 limit: 20127 }128 });129 //new Ext.Viewport().render();130 }131 });132 133 addDeptFn = function(){134 deptAddWin = new DeptAddWin();135 deptAddWin.show();136 };137 138 delDeptFn = function(){139 gridDel('deptInfoPanel','deptId', 'dept_delete.action');140 };141 142 updateDeptFn = function(){143 deptAddWin = new DeptAddWin();144 deptAddWin.title = '部门信息修改';145 var selectionModel = Ext.getCmp('deptInfoPanel').getSelectionModel();146 var record = selectionModel.getSelections();147 if(record.length != 1){148 Ext.Msg.alert('提示','请选择一个');149 return;150 }151 var deptId = record[0].get('deptId');152 Ext.getCmp('deptAddFormId').getForm().load({153 url: 'dept_intoUpdate.action',154 params: {155 deptId: deptId156 }157 })158 deptAddWin.show();159 };160 161 queryDeptFn = function(){162 var condition = Ext.getCmp('condition_dept').getValue();163 var conditionValue = Ext.getCmp("condition_dept_value").getValue();164 Ext.getCmp("deptInfoPanel").getStore().reload({165 params: {166 condition: condition,167 conditionValue : conditionValue,168 start: 0,169 limit: 20170 }171 })172 };