文件回退

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

@@ -5,9 +5,8 @@ Ext.define('saas.view.core.form.MultiCombo', {
     extend: 'Ext.form.field.Trigger',
     alias: 'widget.multicombo',
     editable : false,
-    displayField:'display',
-    valueField:'value',
     matchFieldWidth: true,
+    value: [],
     cachedConfig: {
         menuAlign: 'tl-bl?',
         destroyMenu: true
@@ -16,7 +15,23 @@ Ext.define('saas.view.core.form.MultiCombo', {
         var me = this;
         me.callParent(arguments);
     },
-    onTriggerClick:function(f){
+    listeners:{
+        afterrender:function(f){
+            this.mon(f.el,{
+                mouseover: this.onMouseOver,
+                mouseleave:this.onMouseLeave,
+                scope:this
+            });
+        }
+
+    },
+    onMouseOver:function(){
+       this.showMenu();
+    },
+    onMouseLeave:function(a,b,c){
+        this.hideMenu(a.parentEvent?a:b);//el光标离开第二个参数为Event对象
+    },
+    onTriggerClick:function(){
         this.showMenu();
     },
     getMenu: function() {
@@ -26,10 +41,12 @@ Ext.define('saas.view.core.form.MultiCombo', {
 
             me.menu = Ext.create('Ext.menu.Menu',{
                 hideOnParentHide: false,
-                items: me.getMenuItems()
-                //listners
+                items: me.getMenuItems(),
+                listeners:{
+                    mouseleave:me.onMouseLeave,
+                    scope:me
+                }
             });
-            me.fireEvent('menucreate', me, me.menu);
         }
         return me.menu;
     },
@@ -37,14 +54,18 @@ Ext.define('saas.view.core.form.MultiCombo', {
         var me = this,
             i = 0,
             item,
-            items = me.datas;
-        itemsLn = me.datas.length,
-            menuItems = [];
+            items = me.datas,
+            itemsLn = me.datas.length,
+            menuItems = [],
+            value = me.value;
         for (; i < itemsLn; i++) {
             item = items[i];
+            var checked = !!value.find(function(v) {
+                return v.value = iem[0];
+            });
             menuItem = new Ext.menu.CheckItem({
                 text: item[1],
-                checked: item.checked,
+                checked: checked,
                 checkValue:item[0],
                 hideOnClick: false,
                 checkHandler: this.onCheckChange,
@@ -56,34 +77,61 @@ Ext.define('saas.view.core.form.MultiCombo', {
     },
     onCheckChange:function(checkItem, checked){
         var items=this.menu.items.items,
-            rawV,v;
+            checkedItems = [];
         Ext.Array.each(items,function(item){
             if(item.checked){
-                rawV=rawV?rawV+','+item.text:item.text;
-                v=v?v+","+"'"+item.checkValue+"'":"'"+item.checkValue+"'";
+                checkedItems.push({
+                    text: item.text,
+                    value: item.checkValue
+                });
             }
         });
+        this.setValue(checkedItems);
+    },
+
+    setValue: function(items) {
+        var me = this, rawV = '',
+        datas = me.datas,
+        menu = me.menu;
+        if(!Ext.isArray(items)) {
+            items = [items]
+        }
+        items.map(function(item, index) {
+            if(Ext.isString(item)) {
+                var data = datas.find(function(d) {
+                    return d[0] == item;
+                });
+                items[index] = {
+                    text: data[1],
+                    value: data[0]
+                }
+            }
+        })
+        rawV = items.map(function(item) {
+            return item.text
+        }).join(',');
         this.setRawValue(rawV);
-        this.value=v;
+        this.value = items;
+        if(menu) {
+            Ext.Array.each(menu.items.items, function(item) {
+                item.setChecked(!!items.find(function(i) {
+                    return i.value == item.checkValue;
+                }));
+            });
+        }
+        this.publishState('value', items);
     },
 
     showMenu: function (e, menu) {
-        var isPointerEvent = !e || e.pointerType;
-
         menu = menu || this.getMenu();
         /**
          * menu上边框样式待处理
          * */
         if (menu) {
             if (menu.isVisible()) {
-                // Click/tap toggles the menu visibility.
-                if (isPointerEvent) {
-                    menu.hide();
-                } else {
                     menu.focus();
-                }
             } else {
-                menu.autoFocus = !isPointerEvent;
+                menu.autoFocus = true;
                 if(this.matchFieldWidth){
                     menu.setWidth(this.bodyEl.getWidth());
                 }
@@ -96,5 +144,18 @@ Ext.define('saas.view.core.form.MultiCombo', {
                 }
             }
         }
+    },
+    hideMenu: function(b) {
+        if (this.hasVisibleMenu()) {
+            var target=b.parentEvent.relatedTarget;
+            if(!((target.className && target.className.indexOf('x-menu')!=-1) || (target.name && target.name.indexOf(this.name)!=-1))){
+                this.menu.hide();
+            }
+        }
+        return this;
+    },
+    hasVisibleMenu: function() {
+        var menu = this.menu;
+        return menu && menu.rendered && menu.isVisible();
     }
 });