首页交互调整，基础界面初始化

frontend/saas-web/app/view/core/form/Controller.js

@@ -0,0 +1,5 @@
+Ext.define('saas.view.core.form.Controller', {
+    extend: 'Ext.app.ViewController',
+    alias: 'controller.core-formpanel-controller',
+
+});

frontend/saas-web/app/view/core/form/Panel.js

@@ -0,0 +1,10 @@
+Ext.define('saas.view.core.form.Panel', {
+    extend: 'Ext.form.Panel',
+    xtype: 'core-formpanel',
+    controller: 'core-formpanel-controller',
+
+    items: [{
+        xtype: 'textfield',
+        fieldLabel: '字段'
+    }]
+});

frontend/saas-web/app/view/core/grid/Controller.js

@@ -0,0 +1,5 @@
+Ext.define('saas.view.core.grid.Controller', {
+    extend: 'Ext.app.ViewController',
+    alias: 'controller.core-gridpanel-controller',
+
+});

frontend/saas-web/app/view/core/grid/Panel.js

@@ -0,0 +1,55 @@
+Ext.define('saas.view.core.grid.Panel', {
+    extend: 'Ext.grid.Panel',
+    xtype: 'core-gridpanel',
+    controller: 'core-gridpanel-controller',
+
+    requires: [
+        'Ext.grid.column.Action'
+    ],
+
+    multiSelect: true,
+    headerBorders: false,
+
+    viewConfig: {
+        enableTextSelection: true
+    },
+
+    columns: [{
+        text: 'Company',
+        flex: 1,
+        dataIndex: 'name'
+    }, {
+        text: 'Price',
+        width: 95,
+        formatter: 'usMoney',
+        dataIndex: 'price'
+    }, {
+        text: 'Change',
+        width: 80,
+        renderer: 'renderChange',
+        dataIndex: 'priceChange'
+    }, {
+        text: '% Change',
+        width: 100,
+        renderer: 'renderPercent',
+        dataIndex: 'priceChangePct'
+    }, {
+        text: 'Last Updated',
+        width: 115,
+        formatter: 'date("m/d/Y")',
+        dataIndex: 'priceLastChange'
+    }, {
+        xtype: 'actioncolumn',
+        width: 50,
+        menuDisabled: true,
+        sortable: false,
+
+        items: [{
+            iconCls: 'x-fa fa-check green',
+            handler: 'onApprove'
+        }, {
+            iconCls: 'x-fa fa-ban red',
+            handler: 'onDecline'
+        }]
+    }],
+});

frontend/saas-web/app/view/main/Main.js

@@ -82,43 +82,7 @@ Ext.define('saas.view.main.Main', {
             ]
         },
         {
-            xtype: 'maincontainerwrap',
-            id: 'main-view-detail-wrap',
-            reference: 'mainContainerWrap',
-            flex: 1,
-            items: [
-                {
-                    xtype: 'treelist',
-                    reference: 'navigationTreeList',
-                    itemId: 'navigationTreeList',
-                    ui: 'nav',
-                    bind: '{navItems}',
-                    width: 250,
-                    expanderFirst: false,
-                    expanderOnly: false,
-                    floatLeafItems: true,
-                    listeners: {
-                        selectionchange: 'onNavigationTreeSelectionChange'
-                    }
-                },
-                {
-                    xtype: 'tabpanel',
-                    flex: 1,
-                    reference: 'mainTabPanel',
-                    cls: 'main-right-tabpanel',
-                    itemId: 'contentPanel',
-                    defaults: {
-                        closable: true
-                    },
-                    items: [
-                        {
-                            xtype: 'home',
-                            title: '首页',
-                            closable: false
-                        }
-                    ]
-                }
-            ]
+            xtype: 'maincontainerwrap'
         }
     ]
 });

frontend/saas-web/app/view/main/MainContainerWrap.js

@@ -2,25 +2,67 @@ Ext.define('saas.view.main.MainContainerWrap', {
     extend: 'Ext.container.Container',
     xtype: 'maincontainerwrap',
 
-    requires : [
-        'Ext.layout.container.HBox'
-    ],
+    // requires : [
+    //     'Ext.layout.container.HBox'
+    // ],
+
+    id: 'main-view-detail-wrap',
+    reference: 'mainContainerWrap',
+    flex: 1,
 
-    scrollable: 'y',
+    layout: 'border',
 
-    layout: {
-        type: 'hbox',
-        align: 'stretchmax',
+    // layout: {
+    //     type: 'hbox',
+    //     align: 'stretchmax',
 
-        // Tell the layout to animate the x/width of the child items.
-        animate: true,
-        animatePolicy: {
-            x: true,
-            width: true
+    //     // Tell the layout to animate the x/width of the child items.
+    //     animate: true,
+    //     animatePolicy: {
+    //         x: true,
+    //         width: true
+    //     }
+    // },
+
+    items: [
+        {
+            xtype: 'treelist',
+            region: 'west',
+            reference: 'navigationTreeList',
+            itemId: 'navigationTreeList',
+            ui: 'nav',
+            bind: '{navItems}',
+            width: 250,
+            expanderFirst: false,
+            expanderOnly: false,
+            floatLeafItems: true,
+            listeners: {
+                selectionchange: 'onNavigationTreeSelectionChange'
+            }
+        },
+        {
+            xtype: 'tabpanel',
+            region: 'center',
+            flex: 1,
+            reference: 'mainTabPanel',
+            cls: 'main-right-tabpanel',
+            itemId: 'contentPanel',
+            defaults: {
+                closable: true,
+                margin: 10
+            },
+            items: [
+                {
+                    xtype: 'home',
+                    title: '首页',
+                    closable: false
+                }
+            ]
         }
-    },
+    ],
 
     beforeLayout : function() {
+        console.log(11231);
         // We setup some minHeights dynamically to ensure we stretch to fill the height
         // of the viewport minus the top toolbar
 
@@ -31,9 +73,11 @@ Ext.define('saas.view.main.MainContainerWrap', {
             navTree = me.getComponent('navigationTreeList');
 
         me.minHeight = height;
+        me.maxHeight = height;
 
         navTree.setStyle({
-            'min-height': height + 'px'
+            'min-height': height + 'px',
+            'max-height': height + 'px'
         });
 
         me.callParent(arguments);

frontend/saas-web/app/view/main/MainController.js

@@ -8,25 +8,23 @@ Ext.define('saas.view.main.MainController', {
     alias: 'controller.main',
 
     onNavigationTreeSelectionChange: function (tree, node) {
-        if (node) {
-            this.setActiveTab(node.get('viewType'), node.get('text'));
+        if (node && node.get('viewType')) {
+            this.setActiveTab(node.get('id'), node.get('viewType'), node.get('text'));
         }
     },
 
-    setActiveTab: function(type, title) {
+    setActiveTab: function(id, type, title) {
         var me = this,
             refs = me.getReferences(),
             mainTab = refs.mainTabPanel,
-            existingItem = mainTab.child(type),
+            // existingItem = mainTab.child(type),
+            existingItem = mainTab.down('[id=' + id + ']'),
             newView;
 
         lastView = mainTab.getActiveTab();
 
         if (!existingItem) {
-            newView = Ext.create({
-                xtype: type,
-                title: title
-            });
+            newView = me.createTab({ type: type, title: title, id: id });
         }
 
         if (!newView || !newView.isWindow) {
@@ -53,6 +51,44 @@ Ext.define('saas.view.main.MainController', {
         }
     },
 
+    createTab: function(tabConfig) {
+        var me = this,
+            type = tabConfig.type;
+        
+        if(type == 'grid') {
+            return me.createGrid(tabConfig);
+        }else if(type == 'form') {
+            return me.createForm(tabConfig);
+        }else {
+            var { id, title } = tabConfig;
+            return Ext.create('Ext.panel.Panel', {
+                id,
+                title,
+                html: '无效类型'
+            });
+        }
+    },
+
+    createGrid: function(tabConfig) {
+        var me = this;
+        var { id, title } = tabConfig;
+        var grid = Ext.create('saas.view.core.grid.Panel', {
+            id,
+            title
+        });
+        return grid;
+    },
+
+    createForm: function(tabConfig) {
+        var me = this;
+        var { id, title } = tabConfig;
+        var form = Ext.create('saas.view.core.form.Panel', {
+            id,
+            title
+        });
+        return form;
+    },
+
     onToggleNavigationSize: function () {
         var me = this,
             refs = me.getReferences(),

frontend/saas-web/app/view/main/MainModel.js

@@ -17,33 +17,58 @@ Ext.define('saas.view.main.MainModel', {
                 expanded: true,
                 children: [
                     {
+                        id: 'gh',
                         text: '购货',
                         iconCls: 'x-fa fa-shopping-basket',
                         children: [
                             {
+                                id: 'cgdj',
                                 text: '采购单据',
                                 children: [
                                     {
+                                        id: 'list1',
+                                        text: '列表界面1',
+                                        viewType: 'grid',
+                                        leaf: true
+                                    },
+                                    {
+                                        id: 'list2',
+                                        text: '列表界面2',
+                                        viewType: 'grid',
+                                        leaf: true
+                                    },
+                                    {
+                                        id: 'form1',
+                                        text: '主从表界面1',
+                                        viewType: 'form',
+                                        leaf: true
+                                    },
+                                    {
+                                        id: 'ghdd',
                                         text: '购货订单',
                                         viewType: 'mainlist',
                                         leaf: true
                                     },
                                     {
+                                        id: 'ghd',
                                         text: '购货单',
                                         viewType: 'mainlist',
                                         leaf: true
                                     },
                                     {
+                                        id: 'ghthd',
                                         text: '购货退货单',
                                         viewType: 'mainlist',
                                         leaf: true
                                     },
                                     {
+                                        id: 'yxdgkb',
                                         text: '以销定购看板',
                                         viewType: 'mainlist',
                                         leaf: true
                                     },
                                     {
+                                        id: 'znbh',
                                         text: '智能补货',
                                         viewType: 'mainlist',
                                         leaf: true