KERNEL-11286 && REPORT-77087 fix: 【新引擎新前端】允许直接编辑的下拉树展开的情况下点击图标不能收起

src/less/widget/multilayerselecttree/multilayerselecttree.combo.less

@@ -1,7 +1,22 @@
 @import "../../index.less";
 
+@val: transform .3s ease;
 .bi-multilayer-select-tree-combo {
 
+  // 此combo的trigger_button是absolute上去的，与bi-combo在同一层级，独立写一下
+  & .bi-combo.bi-combo-popup + .bi-trigger-icon-button {
+    & .x-icon {
+      .rotate(180deg);
+      .transition(@val);
+    }
+  }
+
+  &:hover {
+    &.bi-border, &.bi-border-bottom {
+      border-color: @color-bi-border-hover-combo;
+    }
+  }
+
   &.status-error {
     &.bi-border, &.bi-border-bottom {
       border-color: @border-color-negative;

src/widget/multilayerselecttree/multilayerselecttree.combo.js

@@ -10,6 +10,7 @@ BI.MultiLayerSelectTreeCombo = BI.inherit(BI.Widget, {
             isDefaultInit: false,
             height: 24,
             text: "",
+            defaultText: "",
             itemsCreator: BI.emptyFn,
             items: [],
             value: "",
@@ -31,14 +32,47 @@ BI.MultiLayerSelectTreeCombo = BI.inherit(BI.Widget, {
     render: function () {
         var self = this, o = this.options;
 
-        return (o.itemsCreator === BI.emptyFn) ? this._getSyncConfig() : this._getAsyncConfig();
+        var cls = (o.simple ? "bi-border-bottom " : "bi-border bi-border-radius ") + (BI.isKey(o.status) ? ("status-" + o.status) : "");
+
+        var baseConfig = this._getBaseConfig();
+
+        if (o.allowEdit) {
+            return {
+                type: "bi.absolute",
+                cls,
+                items: [
+                    {
+                        el: BI.extend(baseConfig, this._getSearchConfig()),
+                        top: 0, bottom: 0, right: 0, left: 0
+                    }, {
+                        el: self._getTriggerIconButton(),
+                        top: 0, bottom: 0, right: 0,
+                    },
+                ]
+            };
+        }
+
+        return BI.extend(baseConfig, {
+            el: {
+                type: "bi.single_tree_trigger",
+                ref: function (_ref) {
+                    self.textTrigger = _ref;
+                },
+                text: o.text,
+                defaultText: o.defaultText,
+                height: o.height,
+                items: o.items,
+                value: o.value,
+                tipType: o.tipType,
+                warningTitle: o.warningTitle,
+            }
+        }, { cls });
     },
 
     _getBaseConfig: function () {
         var self = this, o = this.options;
         return {
             type: "bi.combo",
-            cls: (o.simple ? "bi-border-bottom " : "bi-border bi-border-radius ") + (BI.isKey(o.status) ? ("status-" + o.status) : ""),
             container: o.container,
             destroyWhenHide: o.destroyWhenHide,
             adjustLength: 2,
@@ -105,6 +139,7 @@ BI.MultiLayerSelectTreeCombo = BI.inherit(BI.Widget, {
                 // height: o.height - (o.simple ? 1 : 2),
                 height: o.height,
                 text: o.text,
+                defaultText: o.defaultText,
                 value: o.value,
                 tipType: o.tipType,
                 warningTitle: o.warningTitle,
@@ -153,7 +188,7 @@ BI.MultiLayerSelectTreeCombo = BI.inherit(BI.Widget, {
                 // IE11下，popover(position: fixed)下放置下拉控件(position: fixed), 滚动的时候会异常卡顿
                 // 通过container参数将popup放置于popover之外解决此问题, 其他下拉控件由于元素少或者有分页，所以
                 // 卡顿不明显, 先在此做尝试, 并在FineUI特殊处理待解决文档中标记跟踪
-                return !(o.container && self.trigger.getSearcher().isSearching() && self.trigger.getSearcher().getView().element.find(e.target).length > 0);
+                return (o.container && self.trigger.getSearcher().isSearching() && self.trigger.getSearcher().getView().element.find(e.target).length > 0) ? false : self.triggerBtn?.element.find(e.target).length === 0;
 
             },
             listeners: [{
@@ -170,28 +205,29 @@ BI.MultiLayerSelectTreeCombo = BI.inherit(BI.Widget, {
         };
     },
 
-    _getSyncConfig: function () {
+    _getTriggerIconButton: function () {
-        var o = this.options, self = this;
+        var self = this, o = this.options;
-        var baseConfig = this._getBaseConfig();
+        return {
-        return BI.extend(baseConfig, o.allowEdit ? this._getSearchConfig() : {
+            type: "bi.trigger_icon_button",
-            el: {
+            cls: "trigger-icon-button",
-                type: "bi.single_tree_trigger",
             ref: function (_ref) {
-                    self.textTrigger = _ref;
+                self.triggerBtn = _ref;
             },
-                text: o.text,
+            width: o.height,
             height: o.height,
-                items: o.items,
+            listeners: [
-                value: o.value,
+                {
-                tipType: o.tipType,
+                    eventName: BI.TriggerIconButton.EVENT_CHANGE,
-                warningTitle: o.warningTitle,
+                    action: function () {
+                        if (self.combo.isViewVisible()) {
+                            self.combo.hideView();
+                        } else {
+                            self.combo.showView();
                         }
-        });
+                    }
-    },
+                }
-
+            ]
-    _getAsyncConfig: function () {
+        };
-        var config = this._getBaseConfig();
-        return BI.extend(config, this._getSearchConfig());
     },
 
     setValue: function (v) {

src/widget/multilayerselecttree/multilayerselecttree.trigger.js

@@ -102,17 +102,8 @@ BI.MultiLayerSelectTreeTrigger = BI.inherit(BI.Trigger, {
                         }]
                     },
                     width: "fill",
-                }, {
+                    rgap: 24
-                    el: {
-                        type: "bi.trigger_icon_button",
-                        cls: "trigger-icon-button",
-                        ref: function (_ref) {
-                            self.triggerBtn = _ref;
                         },
-                        width: 24,
-                    },
-                    width: 24,
-                }
             ]
         };
     },