V120902 - 自動設定子畫面 - Grid的高度 , - 判斷元件是否已顯示在畫面(.el)

目的: 視窗大小調整時, 設定 Grid的度度

處理說明 :  1>Grid的高度 = Form.高度 - 過濾Panel.高度  - 按鈕Panel.高度;
                     2>若 Grid 已 Create, 但是尚未顯示在畫面,則無法 getHeight() 及 getWidth()

                          判斷元件是否已顯示在畫面 ,     typeof Ext.getCmp("grid_M").el
                          --> if  (typeof Ext.getCmp("grid_M").el != undefined)      
                                        Ext.getCmp("grid_M").getHeight();

 // [缺勤記錄維護]鈕  - 子畫面欄位

     var mySub2 = [
            {
                type: 'panel', bodyStyle: "background-color:transparent;", border: 0, layout: { type: 'vbox', align: 'stretch' }, padding: "5",
                items: [
                    {
                        xtype: 'panel',
                        id: 'sub2_panel1',
                        //title: 'sub2_panel1',
                        layout: { type: 'hbox', align: 'stretch' },
                        flex: 0,
                        border: 1,
                        items: [
                            {
                                xtype: 'panel',
                                id: 'sub2_panel11',
                                layout: { type: 'vbox', align: 'stretch' },
                                flex: 15,
                                border: 0,
                                items: [{
                                 xtype: "fieldcontainer", fieldLabel: "日期", labelWidth: 60, layout: "hbox", flex: 2,
 items: [{ xtype: "tmdatefield", id: "sub2_DT", name: "sub2_DT", width: 100, padding: "0 4 0 0", },]
                                }, // end of s_日期
                      
                                ]
                            }, //end of sub2_panel11 , flex:20
                      
                            }, //end of sub2_panel12 , flex:20
                            {
                                //xtype: 'toolbar',
                                xtype: 'panel',
                                id: 'sub2_panel13',
                                layout: { type: 'vbox', align: 'right' },
                                flex: 5,
                                border: 0,
                                items: [
                                    {
                                        xtype: 'button',
                                        id: 'sub2_btn_Show',
                                        flex: 2,
                                        border: 1,
                                        text: '資料顯示',  //sub2
                                        iconCls: 'icon-search',
                                        handler: function () {
                                            var np = {};
                                            np["sub2_DT"] = Ext.getCmp("sub2_DT").getValue();
                                            np["sub2_DEP"] = Ext.getCmp("sub2_DEP").getValue();
                                            np["sub2_LDMAN"] = Ext.getCmp("sub2_LDMAN").getValue();
                                            //console.log('np:', np);
             Ext.getCmp('sub2_Grid').store.getProxy().url = '../api/V120902API/getsub2Data';
              Ext.getCmp('sub2_Grid').store.getProxy().extraParams = np;　//分頁OK,篩選條件OK
                                            Ext.getCmp('sub2_Grid').reloadGirdData();                                            
Ext.getCmp('mySubForm').getHeight());
Ext.getCmp('sub2_panel1').getHeight());
Ext.getCmp('sub2_panel2').getHeight());
Ext.getCmp('sub2_Grid').getHeight());
Ext.getCmp('sub2_Grid').getHeight());
                                        }
                                    },  // end of 顯示資料
                                    {
                                        xtype: 'button',
                                        id: 'sub2_btn_clear',
                                        flex: 2,
                                        border: 1,
                                        text: '清除條件',
                                        iconCls: 'icon-clear',
                                        handler: function () {
                                            var f = Query.getForm();
                                            f.reset();
                                        }
                                    },  // end of 清除條件                                   
                                ]  // end of items of [顯示資料][清除條件]
                            }   // end of panel13
                        ]
                    },  //end of panel1                    
                    {
                        xtype: 'panel',
                        id: 'sub2_panel2',
                        //title: 'sub2_panel2',
                        layout: { type: 'vbox', align: 'stretch' },
                        //flex: 60,
                        border: 1,
                        items: [sub2_Grid]
                    },
                ] // end of   layout: "vbox", padding: "5", items: [
            }  //end of  my_Sub2 , items[{
        ]      //end of  my_Sub2 , items[
        var win = getMyWindow("缺勤記錄維護", mySub2, mySub2_Btns);

        win.width = 700;

        win.height = 400;

        win.on('resize', function (me, width, height, eOpts) {

            //console.log("win.resize height=",height);

            var Tmp_okpanel_Height = Ext.getCmp('mySub2_OkBtn').getHeight() + 20;            

            var Tmp_rHeight = Ext.getCmp('mySubForm').getHeight() - Ext.getCmp('sub2_panel1').getHeight() - Tmp_okpanel_Height;            

            Ext.getCmp('sub2_panel2').setHeight(Tmp_rHeight);

            //console.log("win.resize Tmp_rHeight=", Tmp_rHeight);            

        });

        win.show();