样式修改

app/Application.scss

@@ -3,3 +3,90 @@
  *  styling should be located the view's corresponding scss file.
  */
 $enable-font-awesome: dynamic(true);
+
+
+/**date-picker*/
+.x-datepicker-month .x-btn-inner {
+    font-size: 12px;
+  }
+  
+  .x-datepicker {
+    width: 212px;
+  }
+  
+  .x-datepicker-column-header {
+    width: 30px;
+  }
+  
+  .x-datepicker-column-header-inner {
+    line-height: 25px;
+    padding: 0 9px 0 0;
+  }
+  
+  .x-datepicker-cell {
+    text-align: right;
+    border: 1px solid #fff;
+  }
+  
+  .x-datepicker-date {
+    padding: 0 7px 0 0;
+    cursor: pointer;
+    line-height: 23px;
+  }
+  
+  .x-datepicker-footer,
+  .x-monthpicker-buttons {
+    padding: 3px 0;
+    text-align: center;
+  }
+  
+  .x-monthpicker {
+    width: 212px;
+    border-width: 1px;
+  }
+  
+  .x-monthpicker-months {
+    width: 105px;
+  }
+  
+  .x-monthpicker-item-inner {
+    margin: 0 5px 0 5px;
+    line-height: 22px;
+  }
+  
+  .x-monthpicker-months .x-monthpicker-item {
+    width: 52px;
+  }
+  
+  .x-monthpicker-years {
+    width: 105px;
+  }
+  
+  .x-monthpicker-years .x-monthpicker-item {
+    width: 52px;
+  }
+  
+  .x-monthpicker-yearnav {
+    height: 34px;
+  }
+  
+  .x-monthpicker-yearnav-button-ct {
+    width: 52px;
+  }
+  
+  .x-monthpicker-yearnav-button {
+    height: 12px;
+    width: 12px;
+    cursor: pointer;
+    margin-top: 11px;
+  }
+  
+  .x-datepicker-footer .x-btn-default-toolbar-small {
+    padding: 2px 2px 2px 2px;
+    min-width: 56px;
+  }
+  
+  .x-monthpicker-buttons .x-btn-default-toolbar-small {
+    padding: 2px 2px 2px 2px;
+    min-width: 56px;
+  }

app/store/DataListGridStore.js

@@ -2,7 +2,7 @@
  * @Description: 列表store
  * @Author: hy
  * @Date: 2019-08-12 18:34:16
- * @LastEditTime: 2019-08-12 18:45:17
+ * @LastEditTime: 2019-08-13 08:40:20
  */
 Ext.define('uas.store.DataListGridStore', {
     extend: 'Ext.data.Store',
@@ -10,7 +10,7 @@ Ext.define('uas.store.DataListGridStore', {
     model: 'uas.model.DataListGridModel',
     proxy: {
         type: 'ajax',
-        url: 'data/DataListData.json',
+        url: 'resources/json/DataListData.json',
         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-12 18:46:40
+ * @LastEditTime: 2019-08-13 09:04:44
  */
 Ext.define('uas.view.grid.dataList.DataListPanel', {
     extend: 'Ext.grid.Panel',
@@ -11,11 +11,7 @@ Ext.define('uas.view.grid.dataList.DataListPanel', {
         'uas.view.plugins.gridHeaderFilter.GridHeaderFilter',
         'uas.store.DataListGridStore'
     ],
-
-    title: '筛选头列表',
-    collapsible: true,
     frame: true,
-    height: 600,
     resizable: true,
 
     plugins: {
@@ -48,7 +44,7 @@ Ext.define('uas.view.grid.dataList.DataListPanel', {
     columns: [{
         dataIndex: 'id',
         text: 'Id',
-        width: 50
+        flex:1,
 
         // Specify that this column has an associated Filter. This is
         // processed by the gridfilters plugin. If this is a string,
@@ -67,7 +63,6 @@ Ext.define('uas.view.grid.dataList.DataListPanel', {
     }, {
         dataIndex: 'price',
         text: 'Price',
-        width: 90,
         formatter: 'usMoney',
         flex: 1,
 
@@ -77,7 +72,6 @@ Ext.define('uas.view.grid.dataList.DataListPanel', {
     }, {
         dataIndex: 'size',
         text: 'Size',
-        width: 120,
         flex: 1,
 
         filter: {
@@ -93,7 +87,6 @@ Ext.define('uas.view.grid.dataList.DataListPanel', {
         xtype: 'datecolumn',
         dataIndex: 'date',
         text: 'Date',
-        width: 120,
         flex: 1,
 
         filter: {
@@ -102,7 +95,6 @@ Ext.define('uas.view.grid.dataList.DataListPanel', {
     }, {
         dataIndex: 'visible',
         text: 'Visible',
-        width: 80,
         flex: 1,
     }]
 });

app/view/main/ContentPanel.js

@@ -1,6 +1,13 @@
+/*
+ * @Description: 
+ * @Author: hy
+ * @Date: 2019-08-12 17:59:33
+ * @LastEditTime: 2019-08-13 09:06:14
+ */
 Ext.define('uas.view.main.ContentPanel', {
     extend: 'Ext.panel.Panel',
     xtype: 'contentPanel',
     id: 'content-panel',
+    layout:'fit',
     scrollable: true,
 });

app/view/main/Main.js

@@ -1,23 +1,32 @@
+/*
+ * @Description: 修改样式
+ * @Author: hy
+ * @Date: 2019-08-12 17:59:33
+ * @LastEditTime: 2019-08-13 08:59:31
+ */
 Ext.define('uas.view.main.Main', {
     extend: 'Ext.container.Viewport',
 
     layout: 'border',
     
     items: [{
+        height:32,
         region: 'north',
-        html: '<h1 class="x-panel-header">Page Title</h1>',
+        html: '<span class="x-panel-header-title">UAS2.0组件实例</span>',
         border: false,
-        margin: '0 0 5 0'
+        margin: '0 0 2 0'
     }, {
         region: 'west',
         collapsible: true,
-        title: '目1录',
+        title: '目录',
         width: 150,
+        split:true,
         items: [{
             xtype: 'navigation-tree'
         }]
         // could use a TreePanel or AccordionLayout for navigational items
     }, {
+        split:true,
         region: 'center',
         xtype: 'contentPanel',
         reference: 'contentPanel',

app/view/main/Main.scss

@@ -84,4 +84,12 @@
 .x-panel-header-title-navigation > .x-title-text-navigation:after {
     top: 30px;
     right: -24px;
+}
+
+.x-panel-header-title{
+    margin-left: 10px;
+    line-height: 30px;
+    font-size: 18px;
+    font-weight: 600;
+    font-family: sans-serif;
 }

ext/classic/theme-base/sass/src/Component.scss

@@ -1,13 +1,13 @@
 @if $ext-trial or $ext-beta {
     @font-face {
-        font-family: 'ext-watermark';
-        src:url(get-resource-path('ext-watermark/fonts/ext-watermark.eot?n6lnws', $packageName:'ext'));
-        src:url(get-resource-path('ext-watermark/fonts/ext-watermark.eot?#iefixn6lnws', $packageName:'ext')) format('embedded-opentype'),
-        url(get-resource-path('ext-watermark/fonts/ext-watermark.woff?n6lnws', $packageName:'ext')) format('woff'),
-        url(get-resource-path('ext-watermark/fonts/ext-watermark.ttf?n6lnws', $packageName:'ext')) format('truetype'),
-        url(get-resource-path('ext-watermark/fonts/ext-watermark.svg?n6lnws#ext-watermark', $packageName:'ext')) format('svg');
-        font-weight: normal;
-        font-style: normal;
+        // font-family: 'ext-watermark';
+        // src:url(get-resource-path('ext-watermark/fonts/ext-watermark.eot?n6lnws', $packageName:'ext'));
+        // src:url(get-resource-path('ext-watermark/fonts/ext-watermark.eot?#iefixn6lnws', $packageName:'ext')) format('embedded-opentype'),
+        // url(get-resource-path('ext-watermark/fonts/ext-watermark.woff?n6lnws', $packageName:'ext')) format('woff'),
+        // url(get-resource-path('ext-watermark/fonts/ext-watermark.ttf?n6lnws', $packageName:'ext')) format('truetype'),
+        // url(get-resource-path('ext-watermark/fonts/ext-watermark.svg?n6lnws#ext-watermark', $packageName:'ext')) format('svg');
+        // font-weight: normal;
+        // font-style: normal;
     }
 }
 

ext/classic/theme-neutral/sass/var/panel/Panel.scss

@@ -953,9 +953,9 @@ $panel-ignore-frame-padding: dynamic(false);
 
                 @if $ext-trial {
                     &:after {
-                        font-family: ext-watermark;
+                        //font-family: ext-watermark;
                         font-size: ($ui-header-line-height + vertical($ui-header-padding)) * 0.75;
-                        content: 'd';
+                        //content: 'd';
                         position: absolute;
                         top: 0;
                         right: 0;
@@ -973,9 +973,9 @@ $panel-ignore-frame-padding: dynamic(false);
                 }
                 @if $ext-beta {
                     &:after {
-                        font-family: ext-watermark;
+                        //font-family: ext-watermark;
                         font-size: ($ui-header-line-height + vertical($ui-header-padding)) * 0.75;
-                        content: 'b';
+                        //content: 'b';
                         position: absolute;
                         top: 0;
                         right: 0;

ext/modern/theme-base/sass/src/viewport/Viewport.scss

@@ -13,10 +13,10 @@
 
 @if $ext-trial {
     #ext-viewport:after {
-        font-family: ext-watermark;
+        //font-family: ext-watermark;
         text-shadow: 1px 1px #fff;
         font-size: 2em;
-        content: 'd';
+        //content: 'd';
         position: absolute;
         bottom: .5em;
         right: .5em;
@@ -27,10 +27,10 @@
 
 @if $ext-beta {
     #ext-viewport:after {
-        font-family: ext-watermark;
+        //font-family: ext-watermark;
         text-shadow: 1px 1px #fff;
         font-size: 2em;
-        content: 'b';
+        //content: 'b';
         position: absolute;
         bottom: .5em;
         right: .5em;

resources/json/DataListData.json

@@ -0,0 +1,193 @@
+{
+    "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"
+    }]
+}