懒加载文件

app.js

@@ -1,3 +1,9 @@
+/*
+ * @Description: 
+ * @Author: hy
+ * @Date: 2019-08-12 17:59:33
+ * @LastEditTime: 2019-08-14 18:09:30
+ */
 /*
  * This file launches the application by asking Ext JS to create
  * and launch() the Application class.
@@ -10,6 +16,6 @@ Ext.application({
     requires: [
         // This will automatically load all classes in the uas namespace
         // so that application classes do not need to require each other.
-        'uas.*'
+        'uas.Application'
     ],
 });

app/Application.js

@@ -2,11 +2,16 @@
  * @Description: 
  * @Author: hy
  * @Date: 2019-08-12 17:59:33
- * @LastEditTime: 2019-08-13 14:05:09
+ * @LastEditTime: 2019-08-14 18:21:37
  */
 Ext.define('uas.Application', {
     extend: 'Ext.app.Application',
 
+    requires: [
+        'uas.view.main.*',
+        'uas.controller.Global'
+    ],
+
     name: 'uas',
 
     controllers: [

app/controller/Global.js

@@ -2,15 +2,14 @@
  * @Description: 
  * @Author: hy
  * @Date: 2019-08-12 17:59:33
- * @LastEditTime: 2019-08-13 13:44:57
+ * @LastEditTime: 2019-08-15 09:24:55
  */
 Ext.define('uas.controller.Global', {
     extend: 'Ext.app.Controller',
     namespace: 'uas',
 
     stores: [
-        'Navigation',
-        'Companies'
+        'Navigation'
     ],
 
     config: {
@@ -34,23 +33,36 @@ Ext.define('uas.controller.Global', {
 
     beforeHandleRoute: function(target, action) {
         let me = this,
-            className = Ext.ClassManager.getNameByAlias('widget.' + target),
-            ViewClass = Ext.ClassManager.get(className);
+            store = Ext.StoreMgr.get('Navigation'),
+            node = store.findNode('target', target),
+            path = node.get('path');
+        className = Ext.ClassManager.getNameByAlias('widget.' + target),
+        ViewClass = Ext.ClassManager.get(className);
 
         if(!!ViewClass) {
             //resume action
             action.resume();
         }else {
-            Ext.Msg.alert(
-                '创建组件失败',
-                '确定以返回首页',
-                function() {
-                    // TODO 路由跳转并不会引起页面刷新，待解决
-                    me.redirectTo(me.getApplication().getDefaultToken());
+            new Ext.Promise(function (resolve, reject) {
+                Ext.require(path,function(){
+                    resolve();
+                });
+            }).then(function(){ 
+                if(!!Ext.ClassManager.get(className)) {
+                    action.resume();
+                }else{
+                    Ext.Msg.alert(
+                        '创建组件失败',
+                        '确定以返回首页',
+                        function() {
+                            // TODO 路由跳转并不会引起页面刷新，待解决
+                            me.redirectTo(me.getApplication().getDefaultToken());
+                        }
+                    );
+                    //stop action
+                    action.stop();
                 }
-            );
-            //stop action
-            action.stop();
+            })
         }
     },
 

app/data/DataList.js

@@ -0,0 +1,252 @@
+/*
+ * @Description: 
+ * @Author: hy
+ * @Date: 2019-08-14 17:41:15
+ * @LastEditTime: 2019-08-14 17:41:15
+ */
+Ext.define('uas.data.DataList', {
+    requires: [
+        'uas.data.Init'
+    ]
+}, function() {
+    var dataLists = {
+        "total": "27",
+        "data": [{
+            "id": "1",
+            "price": "71.72",
+            "company": "3m Co",
+            "date": "2007-09-01",
+            "size": "large",
+            "visible": "1"
+        }, {
+            "id": "2",
+            "price": "31.61",
+            "company": "AT&T Inc.",
+            "date": "2008-02-01",
+            "size": "extra large",
+            "visible": "0"
+        }, {
+            "id": "3",
+            "price": "29.01",
+            "company": "Aloca Inc",
+            "date": "2007-08-01",
+            "size": "medium",
+            "visible": "0"
+        }, {
+            "id": "4",
+            "price": "83.81",
+            "company": "Altria Group Inc",
+            "date": "2007-08-03",
+            "size": "large",
+            "visible": "0"
+        }, {
+            "id": "5",
+            "price": "52.55",
+            "company": "American Express Company",
+            "date": "2008-01-04",
+            "size": "extra large",
+            "visible": "1"
+        }, {
+            "id": "6",
+            "price": "64.13",
+            "company": "American International Group Inc.",
+            "date": "2008-03-04",
+            "size": "small",
+            "visible": "1"
+        }, {
+            "id": "7",
+            "price": "75.43",
+            "company": "Boeing Co.",
+            "date": "2008-01-01",
+            "size": "large",
+            "visible": "1"
+        }, {
+            "id": "8",
+            "price": "67.27",
+            "company": "Caterpillar Inc.",
+            "date": "2007-12-03",
+            "size": "medium",
+            "visible": "1"
+        }, {
+            "id": "9",
+            "price": "49.37",
+            "company": "Citigroup, Inc.",
+            "date": "2007-11-24",
+            "size": "large",
+            "visible": "1"
+        }, {
+            "id": "10",
+            "price": "40.48",
+            "company": "E.I. du Pont de Nemours and Company",
+            "date": "2007-05-09",
+            "size": "extra large",
+            "visible": "0"
+        }, {
+            "id": "11",
+            "price": "68.1",
+            "company": "Exxon Mobile Corp",
+            "date": "2007-12-12",
+            "size": "large",
+            "visible": "1"
+        }, {
+            "id": "12",
+            "price": "34.14",
+            "company": "General Electric Company",
+            "date": "2008-06-16",
+            "size": "extra large",
+            "visible": "1"
+        }, {
+            "id": "13",
+            "price": "30.27",
+            "company": "General Motors Corporation",
+            "date": "2006-12-07",
+            "size": "medium",
+            "visible": "1"
+        }, {
+            "id": "14",
+            "price": "36.53",
+            "company": "Hewlett-Packard Co.",
+            "date": "2007-05-13",
+            "size": "large",
+            "visible": "1"
+        }, {
+            "id": "15",
+            "price": "38.77",
+            "company": "Honweywell Intl Inc",
+            "date": "2006-11-07",
+            "size": "medium",
+            "visible": "0"
+        }, {
+            "id": "16",
+            "price": "19.88",
+            "company": "Intel Corporation",
+            "date": "2007-01-09",
+            "size": "small",
+            "visible": "1"
+        }, {
+            "id": "17",
+            "price": "81.41",
+            "company": "International Business Machines",
+            "date": "2005-01-21",
+            "size": "extra large",
+            "visible": "1"
+        }, {
+            "id": "18",
+            "price": "64.72",
+            "company": "Johnson & Johnson",
+            "date": "2008-01-10",
+            "size": "extra large",
+            "visible": "1"
+        }, {
+            "id": "19",
+            "price": "45.73",
+            "company": "JP Morgan & Chase & Co",
+            "date": "2008-02-20",
+            "size": "large",
+            "visible": "0"
+        }, {
+            "id": "20",
+            "price": "36.76",
+            "company": "McDonald's Corporation",
+            "date": "2007-06-12",
+            "size": "large",
+            "visible": "1"
+        }, {
+            "id": "21",
+            "price": "27.96",
+            "company": "Pfizer Inc",
+            "date": "2007-12-30",
+            "size": "small",
+            "visible": "0"
+        }, {
+            "id": "22",
+            "price": "45.07",
+            "company": "The Coca-Cola Company",
+            "date": "2007-01-30",
+            "size": "medium",
+            "visible": "0"
+        }, {
+            "id": "23",
+            "price": "34.64",
+            "company": "The Home Depot, Inc",
+            "date": "2006-12-31",
+            "size": "small",
+            "visible": "1"
+        }, {
+            "id": "24",
+            "price": "61.91",
+            "company": "The Procter & Gamble Company",
+            "date": "2007-04-08",
+            "size": "extra large",
+            "visible": "1"
+        }, {
+            "id": "25",
+            "price": "63.26",
+            "company": "United Technologies Corporation",
+            "date": "2006-06-04",
+            "size": "medium",
+            "visible": "1"
+        }, {
+            "id": "26",
+            "price": "35.57",
+            "company": "Verizon Communications",
+            "date": "2005-07-09",
+            "size": "small",
+            "visible": "0"
+        }, {
+            "id": "27",
+            "price": "45.45",
+            "company": "Wal-Mart Stores, Inc",
+            "date": "2006-09-09",
+            "size": "large",
+            "visible": "1"
+        }]
+    };
+
+    //from https://git.daplie.com/Daplie/knuth-shuffle/
+    function shuffle (array) {
+        array = Ext.Array.clone(array);
+
+        var currentIndex = array.length,
+            temporaryValue, randomIndex;
+
+        // While there remain elements to shuffle...
+        while (0 !== currentIndex) {
+            // Pick a remaining element...
+            randomIndex = Math.floor(Math.random() * currentIndex);
+
+            currentIndex -= 1;
+
+            // And swap it with the current element.
+            temporaryValue = array[currentIndex];
+
+            array[currentIndex] = array[randomIndex];
+            array[randomIndex]  = temporaryValue;
+        }
+
+        return array;
+    }
+
+    Ext.ux.ajax.SimManager.register({
+        type: 'json',
+        delay: 300,
+        url: /\/uas\/DataList(\/\d+)?/,
+
+        data: function(ctx) {
+            var idPart = ctx.url.match(this.url)[1],
+                id;
+
+            if (idPart) {
+                id = parseInt(idPart.substring(1), 10);
+
+                return Ext.Array.findBy(dataLists, function(dataList) {
+                    return dataList.id === id;
+                });
+            } else if (ctx.params.shuffle) {
+                return shuffle(dataLists);
+            }
+
+            return dataLists;
+        }
+    });
+});

app/data/DataListData.json

@@ -1,193 +0,0 @@
-{
-    "total": "27",
-    "data": [{
-        "id": "1",
-        "price": "71.72",
-        "company": "3m Co",
-        "date": "2007-09-01",
-        "size": "large",
-        "visible": "1"
-    }, {
-        "id": "2",
-        "price": "31.61",
-        "company": "AT&T Inc.",
-        "date": "2008-02-01",
-        "size": "extra large",
-        "visible": "0"
-    }, {
-        "id": "3",
-        "price": "29.01",
-        "company": "Aloca Inc",
-        "date": "2007-08-01",
-        "size": "medium",
-        "visible": "0"
-    }, {
-        "id": "4",
-        "price": "83.81",
-        "company": "Altria Group Inc",
-        "date": "2007-08-03",
-        "size": "large",
-        "visible": "0"
-    }, {
-        "id": "5",
-        "price": "52.55",
-        "company": "American Express Company",
-        "date": "2008-01-04",
-        "size": "extra large",
-        "visible": "1"
-    }, {
-        "id": "6",
-        "price": "64.13",
-        "company": "American International Group Inc.",
-        "date": "2008-03-04",
-        "size": "small",
-        "visible": "1"
-    }, {
-        "id": "7",
-        "price": "75.43",
-        "company": "Boeing Co.",
-        "date": "2008-01-01",
-        "size": "large",
-        "visible": "1"
-    }, {
-        "id": "8",
-        "price": "67.27",
-        "company": "Caterpillar Inc.",
-        "date": "2007-12-03",
-        "size": "medium",
-        "visible": "1"
-    }, {
-        "id": "9",
-        "price": "49.37",
-        "company": "Citigroup, Inc.",
-        "date": "2007-11-24",
-        "size": "large",
-        "visible": "1"
-    }, {
-        "id": "10",
-        "price": "40.48",
-        "company": "E.I. du Pont de Nemours and Company",
-        "date": "2007-05-09",
-        "size": "extra large",
-        "visible": "0"
-    }, {
-        "id": "11",
-        "price": "68.1",
-        "company": "Exxon Mobile Corp",
-        "date": "2007-12-12",
-        "size": "large",
-        "visible": "1"
-    }, {
-        "id": "12",
-        "price": "34.14",
-        "company": "General Electric Company",
-        "date": "2008-06-16",
-        "size": "extra large",
-        "visible": "1"
-    }, {
-        "id": "13",
-        "price": "30.27",
-        "company": "General Motors Corporation",
-        "date": "2006-12-07",
-        "size": "medium",
-        "visible": "1"
-    }, {
-        "id": "14",
-        "price": "36.53",
-        "company": "Hewlett-Packard Co.",
-        "date": "2007-05-13",
-        "size": "large",
-        "visible": "1"
-    }, {
-        "id": "15",
-        "price": "38.77",
-        "company": "Honweywell Intl Inc",
-        "date": "2006-11-07",
-        "size": "medium",
-        "visible": "0"
-    }, {
-        "id": "16",
-        "price": "19.88",
-        "company": "Intel Corporation",
-        "date": "2007-01-09",
-        "size": "small",
-        "visible": "1"
-    }, {
-        "id": "17",
-        "price": "81.41",
-        "company": "International Business Machines",
-        "date": "2005-01-21",
-        "size": "extra large",
-        "visible": "1"
-    }, {
-        "id": "18",
-        "price": "64.72",
-        "company": "Johnson & Johnson",
-        "date": "2008-01-10",
-        "size": "extra large",
-        "visible": "1"
-    }, {
-        "id": "19",
-        "price": "45.73",
-        "company": "JP Morgan & Chase & Co",
-        "date": "2008-02-20",
-        "size": "large",
-        "visible": "0"
-    }, {
-        "id": "20",
-        "price": "36.76",
-        "company": "McDonald's Corporation",
-        "date": "2007-06-12",
-        "size": "large",
-        "visible": "1"
-    }, {
-        "id": "21",
-        "price": "27.96",
-        "company": "Pfizer Inc",
-        "date": "2007-12-30",
-        "size": "small",
-        "visible": "0"
-    }, {
-        "id": "22",
-        "price": "45.07",
-        "company": "The Coca-Cola Company",
-        "date": "2007-01-30",
-        "size": "medium",
-        "visible": "0"
-    }, {
-        "id": "23",
-        "price": "34.64",
-        "company": "The Home Depot, Inc",
-        "date": "2006-12-31",
-        "size": "small",
-        "visible": "1"
-    }, {
-        "id": "24",
-        "price": "61.91",
-        "company": "The Procter & Gamble Company",
-        "date": "2007-04-08",
-        "size": "extra large",
-        "visible": "1"
-    }, {
-        "id": "25",
-        "price": "63.26",
-        "company": "United Technologies Corporation",
-        "date": "2006-06-04",
-        "size": "medium",
-        "visible": "1"
-    }, {
-        "id": "26",
-        "price": "35.57",
-        "company": "Verizon Communications",
-        "date": "2005-07-09",
-        "size": "small",
-        "visible": "0"
-    }, {
-        "id": "27",
-        "price": "45.45",
-        "company": "Wal-Mart Stores, Inc",
-        "date": "2006-09-09",
-        "size": "large",
-        "visible": "1"
-    }]
-}

app/store/DataListGridStore.js

@@ -2,15 +2,18 @@
  * @Description: 列表store
  * @Author: hy
  * @Date: 2019-08-12 18:34:16
- * @LastEditTime: 2019-08-13 08:40:20
+ * @LastEditTime: 2019-08-15 08:54:04
  */
 Ext.define('uas.store.DataListGridStore', {
     extend: 'Ext.data.Store',
     alias: 'store.dataListGridStore',
     model: 'uas.model.DataListGridModel',
+    requires: [
+        'uas.data.DataList'
+    ],
     proxy: {
         type: 'ajax',
-        url: 'resources/json/DataListData.json',
+        url: '/uas/DataList',
         reader: {
             type: 'json',
             rootProperty: 'data',

app/view/grid/dataList/DataListPanel.js

@@ -2,7 +2,7 @@
  * @Description: 数据列表
  * @Author: hy
  * @Date: 2019-08-12 18:33:04
- * @LastEditTime: 2019-08-13 14:19:02
+ * @LastEditTime: 2019-08-15 08:55:14
  */
 Ext.define('uas.view.grid.dataList.DataListPanel', {
     extend: 'Ext.grid.Panel',
@@ -23,13 +23,18 @@ Ext.define('uas.view.grid.dataList.DataListPanel', {
     // Set a stateId so that this grid's state is persisted.
     stateId: 'stateful-filter-grid',
 
-    store: {
-        type: 'dataListGridStore',
-        url: 'data/grid/grid-filter.json',
-        autoLoad: true,
-        autoDestroy: true
+    viewModel:{
+        stores: {
+            dataListGridStore:{
+                type: 'dataListGridStore',
+                autoLoad: true,
+                autoDestroy: true
+            }
+        },
     },
 
+    bind:'{dataListGridStore}',
+
     // Dispatch named listener and handler methods to this instance
     defaultListenerScope: true,
 

app/view/plugins/gridHeaderFilter/GridHeaderFilter.js

@@ -2,7 +2,7 @@
  * @Description: 列表筛选头
  * @Author: hy
  * @Date: 2019-07-29 15:22:51
- * @LastEditTime: 2019-08-14 17:16:25
+ * @LastEditTime: 2019-08-15 09:22:17
  */
 Ext.define('uas.view.plugins.gridHeaderFilter.GridHeaderFilter', {
     extend: 'Ext.plugin.Abstract',
@@ -261,6 +261,7 @@ Ext.define('uas.view.plugins.gridHeaderFilter.GridHeaderFilter', {
         };
         //加入到表头
         let filterContainer = column.insert(0,DateFilter);
+        filterContainer.render(column.el);
         //绑定到列
         column.filterContainer = filterContainer;
         filterContainer.items.items.map((item)=>{
@@ -323,6 +324,7 @@ Ext.define('uas.view.plugins.gridHeaderFilter.GridHeaderFilter', {
         };
         //加入到表头
         let filterContainer = column.insert(0,ComboFilter);
+        filterContainer.render(column.el);
         //绑定到列
         column.filterContainer = filterContainer;
         filterContainer.items.items.map((item)=>{
@@ -461,6 +463,7 @@ Ext.define('uas.view.plugins.gridHeaderFilter.GridHeaderFilter', {
         }
         //加入到表头
         let filterContainer = column.insert(0,NumberFilter);
+        filterContainer.render(column.el);
         //绑定到列
         column.filterContainer = filterContainer;
         filterContainer.items.items.map((item)=>{
@@ -577,6 +580,7 @@ Ext.define('uas.view.plugins.gridHeaderFilter.GridHeaderFilter', {
         let filterContainer = column.insert(0,StringFilter);
         //绑定到列
         column.filterContainer = filterContainer;
+        filterContainer.render(column.el);
         //更改作用域
         filterContainer.items.items.map((item)=>{
             item.on({

resources/json/navigation.json

@@ -19,6 +19,7 @@
             {
                 "text": "筛选头",
                 "target": "dataListPanel",
+                "path": "uas.view.grid.dataList.DataListPanel",
                 "leaf": true,
                 "iconCls": "x-fa fa-smile-o"
             },