extjs简易viewport左右结构的使用

Ext.ux.ArchiveViewport = Ext.extend(Ext.Panel, {
    layout : 'border',
    getWestPanel : function() {
        this.westPanel = new Ext.Panel({
                    html : '重写getWestPanel'
                });
        return this.westPanel;
    },
    getCenterPanel : function() {
        this.centerPanel = new Ext.Panel({
                    html : '重写getCenterPanel'
                });
        return this.centerPanel;
    },
    westWidth :200,
    westMinSize :200,
    westMaxSize :200,
    westConfig : function() {
        return this.treeConfig = {
            region : 'west',
            split : false,
            width : this.westWidth,
            border : true,
            minSize : this.westMinSize,
            maxSize : this.westMaxSize,
            autoScroll : false,
            layout : 'fit',
            bodyStyle : 'border-bottom:0px;border-left:0px;border-top:0px;',
            items : [this.getWestPanel()]
        }
    },
    centerConfig : function() {
        return this.gridConfig = {
            region : 'center',
            border : false,
            layout : 'fit',
            autoScroll : false,
            items : [this.getCenterPanel()]
        }
    },
    border : false,
    constructor : function(config) {
        config=config||{};
        Ext.apply(this,config);
        this.items = [this.westConfig(), this.centerConfig()]
        Ext.ux.ArchiveViewport.superclass.constructor.call(this);
    }
})