Merge branch 'dev' of ssh://10.10.100.21/source/saas-platform into dev

frontend/saas-web/app/util/FormUtil.js

@@ -108,10 +108,12 @@ Ext.define('saas.util.FormUtil', {
 
     loadData: function(form) {
         var me = this;
+        form.setLoading(true);
         if(form.initId && form.initId!=0) {
-            var url = form._readUrl + form.initId,async=false;
-            me.BaseUtil.request({url,async })
+            var url = form._readUrl + form.initId;
+            me.BaseUtil.request({url })
             .then(function(response) {
+                form.setLoading(false);
                 var res = Ext.decode(response.responseText);
                 if(res.success) {
                     form.setFormData({
@@ -121,39 +123,39 @@ Ext.define('saas.util.FormUtil', {
                 }
             })
             .catch(function(response) {
+                form.setLoading(false);
                 console.error(response);
             });
         }else{
             //取后台编号
-            var code;
-            Ext.Ajax.request({
+            me.BaseUtil.request({
                 url: 'http://192.168.253.58:8900/number/getMaxnumber',
                 params: {
                     caller:form.caller
                 },
-                async:false,
                 method: 'POST',
-                success: function(response, opts) {
-                    var res = Ext.decode(response.responseText);
-                    if(res.success){
-                        code = res.data.code
+            }).then(function(response) {
+                form.setLoading(false);
+                var res = Ext.decode(response.responseText);
+                if(res.success){
+                    var code = res.data.code;
+                    var viewModel = form.getViewModel();
+                    var detailStore = viewModel.get('_detailStore');
+                    var detno = 0,datas=[];
+                    Ext.Array.each(new Array(10), function() {
+                        detno += 1;
+                        var data = {};
+                        data[form._detnoColumn] = detno;
+                        datas.push(data);
+                    })
+                    detailStore.loadData(datas);
+                    if(code){
+                        viewModel.set(form._codeField,code);
                     }
-                },
-                failure: function(response, opts) {}
-            }); 
-            var viewModel = form.getViewModel();
-            var detailStore = viewModel.get('_detailStore');
-            var detno = 0,datas=[];
-            Ext.Array.each(new Array(10), function() {
-                detno += 1;
-                var data = {};
-                data[form._detnoColumn] = detno;
-                datas.push(data);
+                }
+            }).catch(function() {
+                form.setLoading(false);
             })
-            detailStore.loadData(datas);
-            if(code){
-                viewModel.set(form._codeField,code);
-            }
         }
     }
 });

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

@@ -78,6 +78,7 @@ Ext.define('saas.view.main.Navigation', {
             listeners: {
                 itemmouseenter: me.showNavMenu,
                 itemmouseleave: me.hideNavMenu,
+                itemClick: me.clickNavMenu,
                 scope: me
             }
         });
@@ -90,6 +91,11 @@ Ext.define('saas.view.main.Navigation', {
         me.callParent();
     },
 
+    clickNavMenu: function(view, record, item, index, e, eOpts) {
+        var me = this;
+        this.showNavMenu(view, record, item, index, e, eOpts);
+    },
+
     showNavMenu: function(view, record, item, index, e, eOpts) {
         var recData = record.data,
         menuItems = recData.items || [],
@@ -110,18 +116,18 @@ Ext.define('saas.view.main.Navigation', {
                         '<tpl for=".">',
                         '<div class="menu">',
                             '<h3 class="menu-title">{text}</h3>',
-                            '<ul class="menu-content">',
+                            '<div class="menu-content">',
                                 '<tpl for="items">',
-                                '<li class="menuitem">',
-                                    '<span class="item-text" data-id="{id}" data-text="{text}" data-type="query" data-queryType="{queryType}">',
+                                '<div class="menuitem">',
+                                    '<div class="item-text" title="{text}" data-id="{id}" data-text="{text}" data-type="query" data-queryType="{queryType}">',
                                         '{text}',
-                                    '</span>',
+                                    '</div>',
                                     '<tpl if="{formType}">',
-                                    '<i class="item-icon" data-id="{id}" data-text="{text}" data-type="form" data-formType="{formType}">新增</i>',
+                                    '<div class="item-icon" data-id="{id}" data-text="{text}" data-type="form" data-formType="{formType}">新增</div>',
                                     '</tpl>',
-                                '</li>',
+                                '</div>',
                                 '</tpl>',
-                            '</ul>',
+                            '</div>',
                         '</div>',
                         '</tpl>',
                     '</div>',
@@ -144,8 +150,14 @@ Ext.define('saas.view.main.Navigation', {
                         menu.setHeight(menuViewHeight);
                         menu.updateLayout();
 
-                        view.el.dom.addEventListener('mouseleave', function() {
-                            menu.hide();
+                        view.el.dom.addEventListener('mouseleave', function(e) {
+                            var ex = e.clientX,
+                            ey = e.clientY,
+                            box = menuView.getBoundingClientRect();
+
+                            if(ey <= box.top || ex >= (box.left + box.width) || ey >= (box.top + box.height) || (ex <= box.left && ey >= (box.top + 64))) {
+                                menu.hide();
+                            }
                         });
 
                         Ext.Array.each(menuItem, function(mi) {
@@ -181,6 +193,10 @@ Ext.define('saas.view.main.Navigation', {
             var menu = Ext.create('Ext.menu.Menu', {
                 id: menuId,
                 width: window.innerWidth,
+                style: {
+                    borderTopRightRadius: '4px',
+                    borderBottomRightRadius: '4px'
+                },
                 items: [view]
             });
         }

frontend/saas-web/app/view/main/Navigation.scss

@@ -93,9 +93,6 @@
     .nav-menu-body {
         display: flex;
         padding: 5px;
-        border: 4px solid #c7c7c7;
-        border-color: rgba(0,0,0,.2);
-        border-left: 0;
         border-top-right-radius: 4px;
         border-bottom-right-radius: 4px;
 
@@ -110,7 +107,7 @@
             }
             
             .menu-title {
-                padding-left: 10px;
+                margin: 5px;
             }
 
             .menu-content {
@@ -119,23 +116,40 @@
                 padding-right: 10px;
 
                 .menuitem {
-                    margin: 5px 0;
+                    padding: 5px;
+                    display: flex;
+                    border-radius: 4px;
+                    align-content: space-between;
 
                     .item-text {
                         cursor: pointer;
+                        line-height: 24px;
+                        white-space: nowrap;
+                        width: 124px;
+                        overflow: hidden;
+                        text-overflow: ellipsis;
                     }
 
                     .item-icon {
                         cursor: pointer;
-                        display: none;
                         float: right;
-                        font-style: inherit;
-                        background: green;
-                        color: white;
-                        border-radius: 4px;
+                        display: none;
+                        background: #64b448;
+                        color: #fff;
+                        font-size: 11px;
+                        padding: 3px 6px;
+                        border-radius: 3px;
+                        margin-right: 5px;
+                        font-weight: 400;
+                        width: 40px;
+
+                        &:hover {
+                            opacity: 0.7;
+                        }
                     }
 
                     &:hover {
+                        background-color: #E4E4E4;
 
                         .item-icon {
                             display: block;