1.

1 /**2 * @author sux3 * @time 2011-1-114 * @desc main page5 */6
7 var mainPage = Ext.extend(Ext.Viewport,{8
9
10 /**11 * 构造方法中进行整体布局12 */13 constructor: function(username, date){14 //这个意思就是调用父类的构造函数 作用域是当前子类 传入config参数 将来config中有什么属性 会为子类构造出什么属性15 mainPage.superclass.constructor.call(this,{16 //方位布局17 layout: 'border',18 items: [{19 //我们需要在items中使用region参数来给它定位。20 region: 'north',21 xtype: 'panel',22 //html: '人力资源管理系统',23 bodyStyle: 'height: 66px;',24 layout: 'absolute',25                  html: '<tableclass="header"><tr><tdclass="header_left"></td><tdclass="header_center"></td>' +26                          '<tdclass="header_right"><divid="user_header">'+date+'&nbsp;<imgsrc="img/user.png"/>&nbsp;' +27                                username+'&nbsp;&nbsp;<ahref="user_exit.action">注销</a>' +28                            '</div></td>' +29                        '</tr></table>'30 },{31 region: 'west',32 frame: 'true',33 width: '200',34 id: 'menu_tree',35 xtype: 'panel',36 autoScroll: true,37 title: '人力资源管理系统',38 split: true,39 collapsible: true,//可折叠40 items: [{41 xtype: 'treepanel',42 title: '',43 autoScroll: true,44 border: false,45 id: 'tree',46 rootVisible:true,//不隐藏根节点47 //                     tools: [{48 //                         id: 'refresh',49 //                         handler: '',50 //                         scope: this51 //                     }],52 //loader：树节点的加载器，默认为Ext.tree.TreeLoader53 loader: new Ext.tree.TreeLoader({54 dataUrl: 'menu.action'// dataUrl：获取子节点的URL地址。55 }),56 //每加入进来的节点，若为非叶子节点则做为根节点继续进行查找57 // root：树的根节点。58 root: new Ext.tree.AsyncTreeNode({59 text: '人力资源管理',60 expanded :true,// expanded：是否展开节点，默认为false61 id: '1' //加载数据时每次以变量node传入id的值如: node=162 //leaf: false //数据库中存储的为1/063 }),64 listeners: {65 'click': {66 fn: this.clickNode,67 scope: this68 }69 }70 }]71 },this.center,{72 region: 'south',73 width: '100%',74 frame: true,75 height: 30,76                  html: "<divid='author'>Copyright &copy 201204 TRJ1101 & 张勇</div>"77 }]78 });79 },80
81 center: new Ext.TabPanel({82 id: 'mainTab',83 frame: true,84 region: 'center',85 activeTab: 0,// 初始激活的tab，索引或者id值，默认为none,从0开始86 autoScroll: false,87 enableTabScroll : true, //溢出时滚动tab88 split: true,89 //TabCloseMenu一个显示右键菜单的插件90 //添加编辑插件91 plugins: new Ext.ux.TabCloseMenu(),92
93 items: [{94 closable: false,// tab是否可关闭，默认为false95 title: '首页',96 iconCls: 'main',//css样式97
98              html: '<iframesrc="/hrmsys/jsp/first.jsp"frameborder=0width=100%height=100%/>'99          }]100 }),101
102 /**103 * 在中间区域添加新的面板104 */105 addTab : function(nodeId, nodeUrl, nodeText, nodeIcon){106 var tabId= 'tab_'+nodeId; //tabId为新建面板的id107 var tabTitle= nodeText;108           var tabUrl= nodeUrl;109           var centerPanel= Ext.getCmp('mainTab');110           var tab= centerPanel.getComponent(tabId);111           if(parseInt(nodeId)==28){112 Ext.getCmp('mainTab').remove(Ext.getCmp('tab_30'));113 }114 if(parseInt(nodeId)==30){115 Ext.getCmp('mainTab').remove(Ext.getCmp('tab_28'));116 }117 //如果已存在此面板则只需要激活便可118 if(!tab){119 var newTab= centerPanel.add(//ADD方法添加组建120               new Ext.Panel({121 //bodyStyle: 'background-color:#dfe8f6;',122 frame: true,123 title: tabTitle,124 iconCls: nodeIcon,125 id: tabId,126 closable: true127 //                  listeners: {//监听激活事件设置页面大小128 //                      active: this.activeTabSize,129 //                      scope: this130 //                  }131 })132 );133 //激活新面板134 centerPanel.setActiveTab(newTab);135 //加载页面数据136 newTab.load({137 url: tabUrl,138 method: 'post',139 scope: this,140 nocache : true, // 不缓存141 timeout: 3000,142 scripts : true //设置允许加载的页面执行js,很重要143 });144 }else{145 centerPanel.setActiveTab(tab);146 };147 //this.juage(nodeId);148 },149
150 /**151 * 树结点的单击事件152 * 若为叶子节点则弹出一个窗口153 */154 clickNode : function(node, e){155 if(node.attributes.leaf){156 var nodeId= node.attributes.id;157               var nodeUrl= node.attributes.menuUrl;158               var nodeText= node.attributes.text;159               var nodeIcon= node.attributes.menuIcon;160               this.addTab(nodeId, nodeUrl, nodeText, nodeIcon);161 };162 }163
164 /**165 * 激活页面时设置页面大小166 */167 //       activeTabSize : function(){168 //          console.log('jin ru');169 //               var w= Ext.getCmp('mainTab').getActiveTab().getInnerWidth();170 //               var h= Ext.getCmp('mainTab').getActiveTab().getInnerHeight();171 //               var activeTabId= Ext.getCmp('mainTab').getActiveTab().id;172 //               var activeTab= Ext.getCmp('activeTabId');173 //               if(activeTab){174 //                   activeTab.setHeight(h);175 //                   activeTab.setWidth(w);176 //               }177 //       }178 });179