Extjs 3.4 管理系统框架模型

通常管理系统都是采用extjs 的border布局，即左边菜单中心工作区，顶部是log还有个人信息，状态等，由于之前对Extjs不太熟悉，各个组件写的比较散乱，层次结构很糟乱，这样会导致程序维护麻烦，代码重复比较多，非常影响浏览速度，找了很多资料，《Extjs in Action》给了我很大的启发，目前已经将自己构建的系统框架雏形已经完成，基本实现我的需求，代码如下，方便来日参考，无奈是使用的3版本，4中已经有Ext.define 这样的句子了，顺带说一句尽量用4版本

Ext.BLANK_IMAGE_URL = 'images/s.gif';
Ext.QuickTips.init();
Ext.lib.Ajax.defaultPostHeader += ";charset=utf-8";

/**
 * @class Kingnet.Yunwei.App
 * 运维管理系统前端APP
 *
 * @constructor
 * @singleton
 **/
//名称空间
Ext.ns("Kingnet", "Kingnet.Yunwei");

//Kingnet.Yunwei.App = function(){
Kingnet.Yunwei.App= function(){
    var viewport,loginWindow,cookieUtil = Ext.util.Cookies;
    //treepanel 默认属性
    var deFaults = {
        loader:new Ext.tree.TreeLoader({
            dataUrl:'/test/getTree.php',
            listeners:{
                'beforeload':function(loader,node,cb){
                    loader.dataUrl = '/test/getTree.php?&id='+ node.id;
                }

            }
        }),
        listeners:{
            'click':function(node,event){
                if(node && node.isLeaf()){
                    LazyLoad.js(Ext.util.Format.capitalize(node.attributes.id)+'.js',function(){
                            var ct,tp,p,np;
                            ct = node.getOwnerTree().ownerCt.ownerCt;
                            tp = ct.getComponent('main');//取得主工作区
                            p = tp.getComponent(node.id);
                            if(p){
                                tp.setActiveTab(p)
                            }
                            else{
                                tp.add(new Test.Office.FinancialPanel({
                                    title:node.attributes.text,
                                    closable : true,
                                    itemId:node.attributes.id
                                })).show();

                            }
                    })

                }
            }
        }
    };

    return {
        init:function(){

            if(!cookieUtil.get('loginCookie')){
                if (! loginWindow){
                    loginWindow = this.buildLoginWindow();
                    //console.log('not login!');
                }
                loginWindow.show();
            }
            else{
                //console.log(Ext.get(this.header.contentEl));
                console.log('logined!!!');
                this.buildViewport();
                username = cookieUtil.get('loginCookie');
                console.log(cookieUtil.get('loginCookie'));
                //this.test();
            }

        },

        buildLoginWindow:function(){
            return new Kingnet.Yunwei.UserLoginWindow({
                title    :'登入运维管理系统',
                scope : this,
                handler : this.onLogin
            })
        },

        //顶部
        buildHeader : function(){
            return {
                xtype:'panel',
                region : 'north',
                border:false,
                height:60,
                bbar:new Ext.Toolbar({
                    defaults:{height:60},
                    items:[
                    '->',{
                        xtype:'label',
                        text:'当前用户',
                    },
                    '-',{
                        xtype:'label',
                        html:''+cookieUtil.get('loginCookie')+'',
                    },
                    '-',{
                        xtype:'button',
                        text:'修改密码',
                        scope:this,
                        handler:function(){}
                    },
                    '-',{
                        xtype:'button',
                        text:'退出系统',
                        scope:this,
                        handler:this.onLogOut
                    }]
                })
            }
        },


        //底部
        footer:new Ext.Panel({
            region : 'south',
            height:35,
            html : ''
                + ''
                + 'Power By:    Anthony

'

                + ''

                + '版权所有：

'

                + '