extjs tabpanel動的パネル追加

index =  Ext.extend(Ext.Viewport,{
        center : new Ext.TabPanel({
		            id : 'mainview',
		            region : 'center',
		            activeTab : 0,
                    width : 600,
		            height : 250,
                    minTabWidth: 115,
                    tabWidth:135,
                    enableTabScroll:true,
		            split : true,
                    layoutOnTabChange:true,
                    tabPosition : 'top',
                    resizeTabs:true,
                    defaults : {autoScroll:true},
		            plugins : new Ext.ux.TabCloseMenu(),
		            items :{
		                id : 'start-panel',
					    title : 'MainView',
                        iconCls : 'tabs',
					    layout : 'fit',
					    bodyStyle : 'padding:25px',
					    html : '<img src="../images/bg.jpg"/>'
		            }
        }),
        constructor : function(){
            //var clock = new Ext.Toolbar.TextItem('');
            index.superclass.constructor.call(this,{
                layout : 'border',
                items : [{
                   region : 'north',
                   xtype : 'panel',
                   height : 25,
                   layout : 'column',
                   border : false,
                   items : [{
                        columnWidth : 1,
                        border : false,
                        layout : 'fit',
                        items : [{
                            xtype : 'panel',
                            id : 'logo-header',
                            border : false,
                            tbar : [
                                {
                                    text : currentUser
                                },{
                                    text : new Date().format('Y m d ')
                                },'->',{
                                    text:'  '
                                    ,iconCls:'logout'
                                    ,handler:function(){
                                        Ext.Msg.show({
                                           title:'    ',
                                           msg: '  :            ,      ?',
                                           buttons: Ext.Msg.YESNO,
                                           fn: function(btn){
                                                if(btn=='yes'){
                                                    Ext.Ajax.request({
                                                       url : 'logout.action',
			                                           success : function() {
			                                                location = '../main/index.jsp';
			                                            },
			                                            failure : function() {
			                                                Ext.Msg.show({
			                                                    title : '    ',
			                                                    msg : '      !',
			                                                    icon : Ext.Msg.ERROR,
			                                                    buttons : Ext.Msg.OK
			                                                });
			                                            }
                                                    });
                                                }
                                           }
                                        });
                                    }
                                }
                            ]
                        }]
                   }]
                },{
                    region : 'west',
                    xtype : 'panel',
                    layout : 'accordion',
                    title : '        ',
                    split : true,
                    minSize : 200,
                    maxSize : 250,
                    //margins : '2 0 5 5',
                    collapsible : true,
                    collapseMode:'mini',
                    width : 200,
                    layoutConfig : {
                        animate : true
                    },
                    listeners : {
                        'expand' :{
                          fn : this.onExpandPanel,
                          scope : this
                        },
                        'collapse' :{
                            fn : this.onCollapsePanel,
                            scope : this
                        }
                    },
                    items : [{
                        title : '   ',
                        iconCls : 'icon-nav',
                        xtype : 'treepanel',
                        autoScroll : true,
                        border : false,
                        id : 'treepanel',
                        tools : [{
                               id : 'refresh',
                               handler : this.onRefreshTreeNodes,
                               scope : this
                        },{
	                        id:'expanded',
	                        tooltip:'  ',
	                        handler:function(){
	                            Ext.getCmp('treepanel').expandAll();
	                        }
                    }],
                        loader : new Ext.tree.JsonPluginTreeLoader({
                                    url : 'findTree.action'
                                }),
                        root : new Ext.tree.AsyncTreeNode({text : '  ', expanded:true}),
                        listeners : {
                            'click' : {
                                fn :this.onTreeNodeClick,
                                scope : this
                            },
                            'afterrender':{
                                fn : this.onExpandAll,
                                scope : this
                            }
                        }
                    }]
                },this.center]
            })
        },
        addTab : function(name,id,css,link){
            var tabId = 'tab_'+id;
            var tabTitle = name;
            var tabLink = link;
            var centerPanel = Ext.getCmp('mainview');
            var tab =centerPanel.getComponent(tabId);
            var subMainId = 'tab_'+id+'_main';
            if(!tab){
                var newTab = centerPanel.add(new Ext.Panel({
                    id : tabId,
                    title : tabTitle,
                    iconCls : 'tabs',
                    border : false,
                    closable : true,
                    layout : 'fit',
                    listeners : {
                        activate : this.onActiveTabSize,
                        scope : this
                    }
                }));
                centerPanel.setActiveTab(newTab);
                newTab.load({
                    url : tabLink,
                    method : 'post',
                    params : {
                        subMainId : subMainId
                    },
                    scope : this,
                    discardUrl : true,
                    nocache : true, //    
                    text : '   ,   ...',
                    timeout : 3000,
                    scripts : true
                });
            }else{
                centerPanel.setActiveTab(tab);
            }
        },
        onActiveTabSize : function(){
            var w = Ext.getCmp('mainview').getActiveTab().getInnerWidth();
            var h = Ext.getCmp('mainview').getActiveTab().getInnerHeight();
            var Atab = Ext.getCmp('mainview').getActiveTab().id;
            var submain = Ext.getCmp(Atab+'_main');
            if(submain){
                submain.setWidth(w);
                submain.setHeight(h);
            }
        },
        onRefreshTreeNodes : function(){
            Ext.getCmp('treepanel').root.reload(); 
        },
        onTreeNodeClick : function(_node,_e){
            if(_node.isLeaf()){
                var _nodeText = _node.attributes.text;
                var _nodeLink = _node.attributes.url;
                var _nodeId = _node.attributes.id;
                this.addTab(_nodeText,_nodeId,'_css',_nodeLink)
            }
        },
        onExpandPanel : function(_nowCmp){
            this.onActiveTabSize();
        },
        onCollapsePanel : function(_nowCmp){
            this.onActiveTabSize();
        },
        onExpandAll : function(){
            Ext.getCmp('treepanel').expandAll();
        }
})