UI调整

frontend/saas-web/app/Application.scss

@@ -230,10 +230,10 @@ body.launching {
 }
 
 .x-panel-default-outer-border-rl {
-  border-right-color: #ABDAFF;
-  border-right-width: 1px;
-  border-left-color: #ABDAFF;
-  border-left-width: 1px;
+  border-right-color: #ABDAFF !important;
+  border-right-width: 1px !important;
+  border-left-color: #ABDAFF !important;
+  border-left-width: 1px !important;
 }
 
 .x-grid-item-alt {

frontend/saas-web/app/view/core/base/BasePanel.js

@@ -13,8 +13,8 @@ Ext.define('saas.view.core.base.BasePanel', {
     //基础属性
     frame:false,
     autoScroll: true,
-    border: 1,
-    bodyPadding: 5,
+    border: 0,
+    bodyPadding: 0,
     layout: 'fit',
     
     fieldDefaults: {
@@ -46,10 +46,12 @@ Ext.define('saas.view.core.base.BasePanel', {
                 xtype: 'toolbar',
                 dock: 'top',
                 style: {
-                    'border-bottom': '1px solid #35baf6 !important'
+                    // 'border-bottom': '1px solid #35baf6 !important',
+                    margin: '0 0 12px 0',
+                    padding: '10px 0 14px 8px',
                 },
                 items: me.searchField.concat([{
-                    cls:'x-formpanel-btn-orange',
+                    // cls:'x-formpanel-btn-orange',
                     xtype: 'button',
                     text: '查询',
                     handler: 'query'
@@ -58,6 +60,7 @@ Ext.define('saas.view.core.base.BasePanel', {
             items: [{
                 layout: 'fit',
                 xtype: 'core-base-gridpanel',
+                padding: '8 12',
                 dataUrl: gridDataUrl,
                 idField: gridIdField,
                 codeField: gridCodeField,

frontend/saas-web/app/view/core/base/BasePanel.scss

@@ -1,4 +1,6 @@
 .core-base-basepanel{
+    background: #EEF4F9;
+
     .x-panel-default-outer-border-trl {
         border-top-color: #fff !important;
         border-top-width: 1px !important;

frontend/saas-web/app/view/core/base/GridPanel.js

@@ -222,7 +222,7 @@ Ext.define('saas.view.core.base.GridPanel', {
     insertFirstColumn:function(columns){
         var me=this;
         if(columns.length>0 && columns[0].xtype!='actioncolumn'){
-            return Ext.Array.insert(columns,0,[{
+            Ext.Array.insert(columns,0,[{
                 xtype:'actioncolumn',
                 width:70,
                 dataIndex:'actioncolumn',
@@ -239,6 +239,12 @@ Ext.define('saas.view.core.base.GridPanel', {
                 }]
             }]);
         }
+        if(columns[columns.length - 1].flex != 1) {
+            columns.push({
+                flex: 1,
+                allowBlank: true
+            });
+        }
         return columns;
     },
 

frontend/saas-web/app/view/core/query/QueryGridPanel.js

@@ -155,6 +155,7 @@ Ext.define('saas.view.core.query.QueryGridPanel', {
                     handler: me.onAudit,
                     menu: {
                         cls:'x-query-menu',
+                        anchor: '100%',
                         items: [{
                             text:'反审核',
                             handler:function(){
@@ -243,6 +244,7 @@ Ext.define('saas.view.core.query.QueryGridPanel', {
                 }]
             }, {
                 xtype: 'pagingtoolbar',
+                cls: 'core-query-pagingtoolbar',
                 dock: 'bottom',
                 displayInfo: true,
                 store: me.store

frontend/saas-web/app/view/core/query/QueryGridPanel.scss

@@ -4,8 +4,32 @@
 
         .x-grid-cell-inner {
             text-decoration: underline;
-            color: blue;
+            color: #3E80F6;
             cursor: pointer;
         }
     }
+
+    .x-panel-default-outer-border-trl {
+        border-top-color: #fff !important;
+        border-top-width: 1px !important;
+        border-right-color: #fff !important;
+        border-right-width: 1px !important;
+        border-left-color: #fff !important;
+        border-left-width: 1px !important;
+    }
+    .x-panel-default-outer-border-rbl {
+        border-top-color: #fff !important;
+        border-top-width: 1px !important;
+        border-right-color: #fff !important;
+        border-right-width: 1px !important;
+        border-left-color: #fff !important;
+        border-left-width: 1px !important;
+        border-bottom-color: #fff !important;
+        border-bottom-width: 1px !important;
+    }
+
+    .core-query-pagingtoolbar {
+        border:1px solid #abdaff !important;
+        border-top-width: 0 !important;
+    }
 }

frontend/saas-web/app/view/document/employee/BasePanel.js

@@ -46,31 +46,27 @@ Ext.define('saas.view.document.employee.BasePanel', {
             text : "账号", 
             width : 200.0, 
             dataIndex : "em_code", 
-            xtype : "", 
         }, 
         {
             text : "姓名", 
             dataIndex : "em_name", 
-            width : 120.0, 
-            xtype : "", 
+            width : 180.0, 
         },
         {
             text : "密码", 
             dataIndex : "em_password", 
-            width : 120.0, 
-            xtype : ""
+            width : 180.0, 
         }, 
         {
             text : "类型", 
             dataIndex : "em_class", 
-            width : 0, 
-            xtype : ""
+            width : 120.0, 
+            hidden : true,
         }, 
         {
             text : "电话", 
             dataIndex : "em_mobile", 
-            width : 120.0, 
-            xtype : "",
+            width : 120.0,
         }]
     },
 

frontend/saas-web/app/view/home/charts/MonthIO.js

@@ -9,7 +9,7 @@ Ext.define('saas.view.home.charts.MonthIO', {
         Ext.apply(me, {
             items: [{
                 xtype: 'cartesian',
-                reference: 'chart',
+                insetPadding: '28 0 0 0',
                 colors: [
                     '#2C82BE',
                     '#82CCFF'
@@ -38,6 +38,9 @@ Ext.define('saas.view.home.charts.MonthIO', {
                     adjustByMajorUnit: true,
                     fields: ['main'],
                     minimum: 0,
+                    label: {
+                        fillStyle: '#485465'
+                    },
                     grid: {
                         even: {
                             stroke: '#F7F8FA'
@@ -54,6 +57,9 @@ Ext.define('saas.view.home.charts.MonthIO', {
                     type: 'category',
                     position: 'bottom',
                     fields: ['x'],
+                    label: {
+                        fillStyle: '#485465'
+                    },
                     style: {
                         fill: '#F7F8FA',
                         strokeStyle: 'transparent'

frontend/saas-web/app/view/home/charts/MonthPurchase.js

@@ -10,6 +10,7 @@ Ext.define('saas.view.home.charts.MonthPurchase', {
         Ext.apply(me, {
             items: [{
                 xtype: 'cartesian',
+                insetPadding: '28 0 0 0',
                 colors: [
                     '#34BAF6'
                 ],
@@ -18,12 +19,10 @@ Ext.define('saas.view.home.charts.MonthPurchase', {
                     captions: {
                         title: {
                             text: '本月采购额（万元）：{month_purchase_amount}',
+                            align: 'left',
                             style: {
-                                'font-size': '14px',
                                 'color': '#485465',
-                                'letter-spacing': '-0.07px'
                             },
-                            align: 'left'
                         }
                     },
                 },
@@ -31,6 +30,9 @@ Ext.define('saas.view.home.charts.MonthPurchase', {
                     type: 'category',
                     fields: ['x'],
                     position: 'bottom',
+                    label: {
+                        fillStyle: '#485465'
+                    },
                     style: {
                         fill: '#F7F8FA',
                         strokeStyle: 'transparent'
@@ -48,6 +50,10 @@ Ext.define('saas.view.home.charts.MonthPurchase', {
                             stroke: '#F7F8FA',
                         }
                     },
+                    label: {
+                        fillStyle: '#485465',
+                        textAlign: 'end'
+                    },
                     style: {
                         fill: '#fff',
                         strokeStyle: 'transparent'

frontend/saas-web/app/view/home/charts/MonthSale.js

@@ -10,7 +10,8 @@ Ext.define('saas.view.home.charts.MonthSale', {
         Ext.apply(me, {
             items: [{
                 xtype: 'polar',
-                reference: 'chart',
+                width: '100%',
+                height: '100%',
                 bind: {
                     captions: {
                         title: {
@@ -49,33 +50,45 @@ Ext.define('saas.view.home.charts.MonthSale', {
                     '#1E90FF',
                     '#B0E0E6'
                 ],
-                width: '100%',
-                innerPadding: 20,
-                // legend: {
-                //     type: 'dom',
-                //     docked: 'right'
-                // },
+                innerPadding: 0,
+                legend: {
+                    type: 'dom',
+                    docked: 'right',
+                    width: 120,
+                    padding: 0,
+                    bodyPadding: 0,
+                    border: 0,
+                    // liveDrag: true,
+                    cls: 'x-pie-legend'
+                },
                 style: {
+                    lineWidth: 0,
                     stroke: "#789"
                 },
-                interactions: ['rotate', 'itemhighlight'],
+                // interactions: [{
+                //     type: 'panzoom',
+                //     zoomOnPan: true
+                // }],
                 series: [{
                     type: 'pie',
                     angleField: 'y',
                     donut: 55,
                     label: {
                         field: 'x',
-                        renderer: me.onLabelRender
+                        display: 'inside',
+                        renderer: me.onLabelRender,
+                        color: '#fff',
+                        font: '12px Microsoft YaHei'
                     },
+                    // label: {
+                    //     field: 'x',
+                    //     renderer: me.onLabelRender
+                    // },
                     highlight: true,
                     tooltip: {
                         trackMouse: true,
                         renderer: me.onSeriesTooltipRender
-                    },
-                    style: {
-                        lineWidth: 0,
-                        strokeStyle: 'transparent',
-                    },
+                    }
                 }]
             }],
         });
@@ -86,7 +99,10 @@ Ext.define('saas.view.home.charts.MonthSale', {
     onLabelRender: function(text, sprite, config, rendererData, index) {
         var homeModel = Ext.getCmp('home').getViewModel();
         var monthSaleAmount = homeModel.get('month_sale_amount');
-        return text;
+        var store = rendererData.store;
+        var data = store.getAt(index);
+        var v = data.get('y');
+        return Ext.util.Format.number((v/monthSaleAmount)*100, '0.00') + '%';
     },
 
     onSeriesTooltipRender: function (tooltip, record, item) {

frontend/saas-web/app/view/home/charts/MonthSale.scss

@@ -0,0 +1,19 @@
+.x-pie-legend {
+
+    .x-legend-inner {
+        padding: 0;
+
+        .x-legend-container {
+
+            .x-legend-item {
+                border: none !important;
+                outline: none !important;
+                text-align: left;
+
+                .x-legend-item-marker {
+                    border-radius: 50%;
+                }
+            }
+        }
+    }
+}

frontend/saas-web/app/view/home/charts/PurchaseTrend.js

@@ -10,21 +10,22 @@ Ext.define('saas.view.home.charts.PurchaseTrend', {
         Ext.apply(me, {
             items: [{
                 xtype: 'cartesian',
+                insetPadding: '28 0 0 0',
                 colors: [
                     '#34BAF6'
                 ],
-                captions: {
-                    title: {
-                        text: '采购金额（万元）',
-                        style: {
-                            'font-size': '14px',
-                            'color': '#485465',
-                            'letter-spacing': '-0.07px'
-                        },
-                        align: 'left'
-                    }
-                },
                 bind: {
+                    captions: {
+                        title: {
+                            text: '采购金额（万元）',
+                            style: {
+                                'font-size': '14px',
+                                'color': '#485465',
+                                'letter-spacing': '-0.07px'
+                            },
+                            align: 'left'
+                        }
+                    },
                     store: '{purchase_trend}',
                 },
                 axes: [{
@@ -35,6 +36,9 @@ Ext.define('saas.view.home.charts.PurchaseTrend', {
                     type: 'category',
                     fields: ['x'],
                     position: 'bottom',
+                    label: {
+                        fillStyle: '#485465'
+                    },
                     style: {
                         fill: '#F7F8FA',
                         strokeStyle: 'transparent'
@@ -52,6 +56,9 @@ Ext.define('saas.view.home.charts.PurchaseTrend', {
                             stroke: '#F7F8FA',
                         }
                     },
+                    label: {
+                        fillStyle: '#485465'
+                    },
                     style: {
                         fill: '#fff',
                         strokeStyle: 'transparent'

frontend/saas-web/app/view/home/charts/SaleTrend.js

@@ -10,22 +10,23 @@ Ext.define('saas.view.home.charts.SaleTrend', {
         Ext.apply(me, {
             items: [{
                 xtype: 'cartesian',
+                insetPadding: '28 0 0 0',
                 colors: [
                     '#64B0E4',
                     '#FF1038'
                 ],
-                captions: {
-                    title: {
-                        text: '销售趋势图',
-                        style: {
-                            'font-size': '14px',
-                            'color': '#485465',
-                            'letter-spacing': '-0.07px'
-                        },
-                        align: 'left'
-                    }
-                },
                 bind: {
+                    captions: {
+                        title: {
+                            text: '销售趋势图',
+                            style: {
+                                'font-size': '14px',
+                                'color': '#485465',
+                                'letter-spacing': '-0.07px'
+                            },
+                            align: 'left'
+                        }
+                    },
                     store: '{sale_trend}',
                 },
                 // legend: {
@@ -42,9 +43,7 @@ Ext.define('saas.view.home.charts.SaleTrend', {
                     fields: ['x'],
                     position: 'bottom',
                     label: {
-                        style: {
-                            fontSize: 12,
-                        }
+                        fillStyle: '#485465',
                     },
                     style: {
                         fill: '#F7F8FA',
@@ -63,6 +62,9 @@ Ext.define('saas.view.home.charts.SaleTrend', {
                             stroke: '#F7F8FA',
                         }
                     },
+                    label: {
+                        fillStyle: '#485465',
+                    },
                     style: {
                         fill: '#fff',
                         strokeStyle: 'transparent'

frontend/saas-web/app/view/home/charts/StockAmount.js

@@ -10,21 +10,22 @@ Ext.define('saas.view.home.charts.StockAmount', {
         Ext.apply(me, {
             items: [{
                 xtype: 'cartesian',
+                insetPadding: '28 0 0 0',
                 colors: [
                     '#34BAF6'
                 ],
-                captions: {
-                    title: {
-                        text: '库存金额（万元）',
-                        style: {
-                            'font-size': '14px',
-                            'color': '#485465',
-                            'letter-spacing': '-0.07px'
-                        },
-                        align: 'left'
-                    }
-                },
                 bind: {
+                    captions: {
+                        title: {
+                            text: '库存金额（万元）',
+                            style: {
+                                'font-size': '14px',
+                                'color': '#485465',
+                                'letter-spacing': '-0.07px'
+                            },
+                            align: 'left'
+                        }
+                    },
                     store: '{stock_amount}',
                 },
                 axes: [{
@@ -35,6 +36,9 @@ Ext.define('saas.view.home.charts.StockAmount', {
                     type: 'category',
                     fields: ['x'],
                     position: 'bottom',
+                    label: {
+                        fillStyle: '#485465'
+                    },
                     style: {
                         fill: '#F7F8FA',
                         strokeStyle: 'transparent'
@@ -52,6 +56,9 @@ Ext.define('saas.view.home.charts.StockAmount', {
                             stroke: '#F7F8FA',
                         }
                     },
+                    label: {
+                        fillStyle: '#485465'
+                    },
                     style: {
                         fill: '#fff',
                         strokeStyle: 'transparent'