Merge pull request #290439 in DEC/fineui from final/11.0 to persist/11.0

* commit '07b2b1371adcd419c4d2d011a88120b7de24a2e3':
  BI-155273 fix: 新增一些方法
  BI-154149 fix: 无法点击清空
  BI-154214 fix：国际化
  Reapply "Pull request #16: Feature/x"
  BI-154374 Revert "BI-144276 fix: 【来源POC项目】增量更新开始时间"
  无JIRA tab添加子card destory监听
  Revert "Pull request #16: Feature/x"
  Revert "无JIRA layout 的updateChildren过程中传递context"
  无JIRA tab添加子card destory监听
  BI-154253 fix: 点击报错
  BI-154136 fix: 按钮被遮挡
  Uploaded files
  KERNEL-18940 refactor: 处理搜索，新增一些属性和方法
  BI-153053 fix: 展开的加载按钮异常
  BI-124572 fix: 过滤组件主题色修复
  KERNEL-18940 refactor: 类型补充
  KERNEL-18940 refactor: 新增一些属性和方法
  无JIRA layout 的updateChildren过程中传递context
  REPORT-125909 fix: 【公共模型引入BI】低版本chrome，维度指标集在组件分析区域不显示

packages/fineui/src/base/combination/tab.js

@@ -13,7 +13,8 @@ import {
     contains,
     any,
     isEqual,
-    LogicFactory
+    LogicFactory,
+    Events,
 } from "@/core";
 
 /**
@@ -106,7 +107,11 @@ export class Tab extends Widget {
             Widget.execWithContext(this, () => {
                 this.cardMap[v] = cardCreator(v);
             });
-            this.layout.addCardByName(v, this.cardMap[v]);
+            const card = this.layout.addCardByName(v, this.cardMap[v]);
+            card.on(Events.DESTROY, () => {
+                this.layout.deleteCardByName(v);
+                delete this.cardMap[v];
+            });
         }
     }
 

packages/fineui/src/base/single/input/radio/radio.js

@@ -56,13 +56,4 @@ export class Radio extends BasicButton {
             this.fireEvent(Radio.EVENT_CHANGE);
         }
     }
-
-    setSelected(b) {
-        super.setSelected(b);
-        if (b) {
-            this.radio.element.addClass("bi-high-light-background");
-        } else {
-            this.radio.element.removeClass("bi-high-light-background");
-        }
-    }
 }

packages/fineui/src/case/combo/iconcombo/combo.icon.js

@@ -8,6 +8,7 @@ export class IconCombo extends Widget {
     static xtype = "bi.icon_combo";
 
     static EVENT_CHANGE = "EVENT_CHANGE";
+    static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
 
     _defaultConfig() {
         return extend(super._defaultConfig(...arguments), {
@@ -55,18 +56,18 @@ export class IconCombo extends Widget {
             value: o.value,
             isShowDown: o.isShowDown,
         });
-        this.popup = createWidget(o.popup, {
+        this.popupEl = createWidget(o.popup, {
             type: IconComboPopup.xtype,
             chooseType: o.chooseType,
             items: o.items,
             value: o.value,
         });
-        this.popup.on(IconComboPopup.EVENT_CHANGE, () => {
+        this.popupEl.on(IconComboPopup.EVENT_CHANGE, () => {
-            this.setValue(this.popup.getValue());
+            this.setValue(this.popupEl.getValue());
             this.iconCombo.hideView();
             this.fireEvent(IconCombo.EVENT_CHANGE);
         });
-        this.popup.on(Controller.EVENT_CHANGE, (...args) => {
+        this.popupEl.on(Controller.EVENT_CHANGE, (...args) => {
             this.fireEvent(Controller.EVENT_CHANGE, ...args);
         });
         this.iconCombo = createWidget({
@@ -82,11 +83,20 @@ export class IconCombo extends Widget {
             el: this.trigger,
             hideWhenAnotherComboOpen: o.hideWhenAnotherComboOpen,
             popup: {
-                el: this.popup,
+                el: this.popupEl,
                 maxWidth: o.maxWidth,
                 maxHeight: o.maxHeight,
                 minWidth: o.minWidth,
+                ref: (ref) => {
+                    this.popup = ref;
                 },
+            },
+            listeners: [{
+                eventName: Combo.EVENT_BEFORE_POPUPVIEW,
+                action: () => {
+                    this.fireEvent(IconCombo.EVENT_BEFORE_POPUPVIEW);
+                },
+            }],
         });
     }
 
@@ -100,15 +110,19 @@ export class IconCombo extends Widget {
 
     setValue(v) {
         this.trigger.setValue(v);
-        this.popup.setValue(v);
+        this.popupEl.setValue(v);
     }
 
     getValue() {
-        const value = this.popup.getValue();
+        const value = this.popupEl.getValue();
 
         return isNull(value) ? [] : isArray(value) ? value : [value];
     }
 
+    getPopup() {
+        return this.popup;
+    }
+
     populate(items) {
         this.options.items = items;
         this.iconCombo.populate(items);

packages/fineui/src/case/toolbar/toolbar.multiselect.js

@@ -126,6 +126,7 @@ export class MultiSelectBar extends BasicButton {
     }
 
     setSelected(v) {
+        super.setSelected(v);
         this.checkbox.setSelected(v);
         this.setHalfSelected(false);
     }

packages/fineui/src/case/ztree/asynctree.js

@@ -221,15 +221,11 @@ export class AsyncTree extends TreeView {
                     {
                         el: {
                             type: IconLabel.xtype,
-                            width: 20,
-                            height: 20,
                             cls: "button-loading-font anim-rotate bi-card",
                             ref: ref => {
                                 loadingIcon = ref;
                             },
                         },
-                        left: 5,
-                        top: 5,
                     },
                 ],
             });

packages/fineui/src/core/2.base.js

@@ -1518,7 +1518,7 @@ export function getTime() {
     }
     if (isNotNull(BI.timeZone)) {
         // BI-33791 1901年以前的东8区标准是GMT+0805, 统一无论是什么时间，都以整的0800这样的为基准
-        return dt.getTime() + BI.timeZone + new Date().getTimezoneOffset() * 60000;
+        return dt.getTime() - BI.timeZone - new Date().getTimezoneOffset() * 60000;
     }
 
     return dt.getTime();

packages/fineui/src/core/utils/dom.js

@@ -743,12 +743,13 @@ export function getComboPosition(combo, popup, extraWidth, extraHeight, needAdap
     }
     if (needAdaptHeight === true && popup.resetHeight) {
         const comboRect = combo.element[0].getBoundingClientRect();
+        const scale = comboRect.height === 0 ? 1 : comboRect.height / combo.element.height();
         const relativeOffset = positionRelativeElement ? positionRelativeElement.getBoundingClientRect().top : 0;
         const positionTop = position.top + relativeOffset;
         if (positionTop < comboRect.top) {
-            popup.resetHeight(Math.min(viewportBounds.height - positionTop, comboRect.top, maxHeight));
+            popup.resetHeight(Math.min((viewportBounds.height - positionTop) / scale, comboRect.top / scale, maxHeight));
         } else if (positionTop >= comboRect.bottom) {
-            popup.resetHeight(Math.min(viewportBounds.height - positionTop, viewportBounds.height - comboRect.bottom, maxHeight));
+            popup.resetHeight(Math.min((viewportBounds.height - positionTop) / scale, (viewportBounds.height - comboRect.bottom) / scale, maxHeight));
         }
     }
 

packages/fineui/src/less/base/tree/ztree.less

@@ -335,3 +335,10 @@
   margin-right: 2px;
   vertical-align: top;
 }
+
+.ztree .button-loading-font {
+  .use-scale(width, 20px);
+  .use-scale(height, 20px);
+  .use-scale(left, 5px);
+  .use-scale(top, 5px);
+}

packages/fineui/src/widget/downlist/combo.downlist.js

@@ -108,6 +108,9 @@ export class DownListCombo extends Widget {
                 stopPropagation: o.stopPropagation,
                 maxHeight: o.maxHeight,
                 minWidth: o.minWidth,
+                ref: (ref) => {
+                    this.popup = ref;
+                },
                 ...o.popup,
             },
         });
@@ -125,6 +128,10 @@ export class DownListCombo extends Widget {
         this.downlistcombo.showView(e);
     }
 
+    getPopup() {
+        return this.popup;
+    }
+
     populate(items) {
         this.popupView.populate(items);
     }

packages/fineui/src/widget/dynamicdate/dynamicdate.combo.js

@@ -208,7 +208,7 @@ export class DynamicDateCombo extends Single {
                                 min: opts.minDate,
                                 max: opts.maxDate,
                                 ref: _ref => {
-                                    this.popup = _ref;
+                                    this.popupEl = _ref;
                                 },
                                 listeners: [
                                     {
@@ -238,7 +238,7 @@ export class DynamicDateCombo extends Single {
                                     {
                                         eventName: DynamicDatePopup.BUTTON_OK_EVENT_CHANGE,
                                         action: () => {
-                                            const value = this.popup.getValue();
+                                            const value = this.popupEl.getValue();
                                             if (this._checkValue(value)) {
                                                 this.setValue(value);
                                             }
@@ -249,7 +249,7 @@ export class DynamicDateCombo extends Single {
                                     {
                                         eventName: DynamicDatePopup.EVENT_CHANGE,
                                         action: () => {
-                                            this.setValue(this.popup.getValue());
+                                            this.setValue(this.popupEl.getValue());
                                             this.combo.hideView();
                                             this.fireEvent(DynamicDateCombo.EVENT_CONFIRM);
                                         },
@@ -262,6 +262,10 @@ export class DynamicDateCombo extends Single {
                                     }
                                 ],
                             },
+                            ref: (ref) => {
+                                this.popup = ref;
+                            },
+                            ...opts.popup,
                         },
                         // // DEC-4250 和复选下拉一样，点击triggerBtn不默认收起
                         // hideChecker: function (e) {
@@ -271,9 +275,9 @@ export class DynamicDateCombo extends Single {
                             {
                                 eventName: Combo.EVENT_BEFORE_POPUPVIEW,
                                 action: () => {
-                                    this.popup.setMinDate(opts.minDate);
+                                    this.popupEl.setMinDate(opts.minDate);
-                                    this.popup.setMaxDate(opts.maxDate);
+                                    this.popupEl.setMaxDate(opts.maxDate);
-                                    this.popup.setValue(this.storeValue);
+                                    this.popupEl.setValue(this.storeValue);
                                     this.fireEvent(DynamicDateCombo.EVENT_BEFORE_POPUPVIEW);
                                 },
                             }
@@ -332,14 +336,14 @@ export class DynamicDateCombo extends Single {
         const o = this.options;
         o.minDate = minDate;
         this.trigger.setMinDate(minDate);
-        this.popup && this.popup.setMinDate(minDate);
+        this.popupEl && this.popupEl.setMinDate(minDate);
     }
 
     setMaxDate(maxDate) {
         const o = this.options;
         o.maxDate = maxDate;
         this.trigger.setMaxDate(maxDate);
-        this.popup && this.popup.setMaxDate(maxDate);
+        this.popupEl && this.popupEl.setMaxDate(maxDate);
     }
 
     setValue(v) {
@@ -356,6 +360,10 @@ export class DynamicDateCombo extends Single {
         return this.trigger.getKey();
     }
 
+    getPopup() {
+        return this.popup;
+    }
+
     hidePopupView() {
         this.combo.hideView();
     }

packages/fineui/src/widget/dynamicdate/dynamicdate.param.item.js

@@ -79,7 +79,7 @@ export class DynamicDateParamItem extends Widget {
                             value: 0,
                         },
                         {
-                            text: i18nText("BI-Basic_Behind"),
+                            text: i18nText("BI-Basic_Later"),
                             value: 1,
                         }
                     ],

packages/fineui/src/widget/dynamicdatetime/dynamicdatetime.combo.js

@@ -216,7 +216,7 @@ export class DynamicDateTimeCombo extends Single {
                                 min: opts.minDate,
                                 max: opts.maxDate,
                                 ref: _ref => {
-                                    this.popup = _ref;
+                                    this.popupEl = _ref;
                                 },
                                 listeners: [
                                     {
@@ -249,7 +249,7 @@ export class DynamicDateTimeCombo extends Single {
                                     {
                                         eventName: DynamicDateTimePopup.BUTTON_OK_EVENT_CHANGE,
                                         action: () => {
-                                            const value = this.popup.getValue();
+                                            const value = this.popupEl.getValue();
                                             if (this._checkValue(value)) {
                                                 this.setValue(value);
                                             }
@@ -260,7 +260,7 @@ export class DynamicDateTimeCombo extends Single {
                                     {
                                         eventName: DynamicDateTimePopup.EVENT_CHANGE,
                                         action: () => {
-                                            this.setValue(this.popup.getValue());
+                                            this.setValue(this.popupEl.getValue());
                                             this.combo.hideView();
                                             this.fireEvent(DynamicDateTimeCombo.EVENT_CONFIRM);
                                         }
@@ -271,16 +271,20 @@ export class DynamicDateTimeCombo extends Single {
                                             this.fireEvent(DynamicDateTimeCombo.EVENT_BEFORE_YEAR_MONTH_POPUPVIEW);
                                         }
                                     }
-                                ]
+                                ],
-                            }
+                            },
+                            ref: (ref) => {
+                                this.popup = ref;
+                            },
+                            ...opts.popup,
                         },
                         listeners: [
                             {
                                 eventName: Combo.EVENT_BEFORE_POPUPVIEW,
                                 action: () => {
-                                    this.popup.setMinDate(opts.minDate);
+                                    this.popupEl.setMinDate(opts.minDate);
-                                    this.popup.setMaxDate(opts.maxDate);
+                                    this.popupEl.setMaxDate(opts.maxDate);
-                                    this.popup.setValue(this.storeValue);
+                                    this.popupEl.setValue(this.storeValue);
                                     this.fireEvent(DynamicDateTimeCombo.EVENT_BEFORE_POPUPVIEW);
                                 }
                             }
@@ -339,14 +343,14 @@ export class DynamicDateTimeCombo extends Single {
         const o = this.options;
         o.minDate = minDate;
         this.trigger.setMinDate(minDate);
-        this.popup && this.popup.setMinDate(minDate);
+        this.popupEl && this.popupEl.setMinDate(minDate);
     }
 
     setMaxDate(maxDate) {
         const o = this.options;
         o.maxDate = maxDate;
         this.trigger.setMaxDate(maxDate);
-        this.popup && this.popup.setMaxDate(maxDate);
+        this.popupEl && this.popupEl.setMaxDate(maxDate);
     }
 
     setValue(v) {
@@ -363,6 +367,10 @@ export class DynamicDateTimeCombo extends Single {
         return this.trigger.getKey();
     }
 
+    getPopup() {
+        return this.popup;
+    }
+
     hidePopupView() {
         this.combo.hideView();
     }

packages/fineui/src/widget/multiselect/multiselect.insert.combo.js

@@ -47,12 +47,16 @@ export class MultiSelectInsertCombo extends Single {
     static REQ_GET_ALL_DATA = "-1";
     static EVENT_FOCUS = "EVENT_FOCUS";
     static EVENT_BLUR = "EVENT_BLUR";
+    static EVENT_START = "EVENT_START";
     static EVENT_STOP = "EVENT_STOP";
     static EVENT_SEARCHING = "EVENT_SEARCHING";
     static EVENT_CLICK_ITEM = "EVENT_CLICK_ITEM";
     static EVENT_CONFIRM = "EVENT_CONFIRM";
     static EVENT_ADD_ITEM = "EVENT_ADD_ITEM";
     static EVENT_AFTER_HIDEVIEW = "EVENT_AFTER_HIDEVIEW";
+    static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
+    static EVENT_BEFORE_NUMBER_COUNTER_POPUPVIEW = "EVENT_BEFORE_NUMBER_COUNTER_POPUPVIEW";
+    static EVENT_AFTER_NUMBER_COUNTER_POPUPVIEW = "EVENT_AFTER_NUMBER_COUNTER_POPUPVIEW";
 
     _defaultConfig() {
         return extend(super._defaultConfig(...arguments), {
@@ -62,6 +66,8 @@ export class MultiSelectInsertCombo extends Single {
             height: 24,
             itemHeight: SIZE_CONSANTS.LIST_ITEM_HEIGHT,
             allowEdit: true,
+            popup: {},
+            masker: {},
         });
     }
 
@@ -97,6 +103,8 @@ export class MultiSelectInsertCombo extends Single {
 
         this.trigger = createWidget({
             type: MultiSelectInsertTrigger.xtype,
+            popup: o.popup,
+            masker: o.masker,
             allowEdit: o.allowEdit,
             height: toPix(o.height, o.simple ? 1 : 2),
             text: o.text,
@@ -122,6 +130,7 @@ export class MultiSelectInsertCombo extends Single {
         this.trigger.on(MultiSelectInsertTrigger.EVENT_START, function() {
             self._setStartValue("");
             this.getSearcher().setValue(self.storeValue);
+            self.fireEvent(MultiSelectInsertCombo.EVENT_START);
         });
         this.trigger.on(MultiSelectInsertTrigger.EVENT_STOP, () => {
             self._setStartValue("");
@@ -241,12 +250,14 @@ export class MultiSelectInsertCombo extends Single {
                         self.trigger.getSearcher().adjustView();
                     });
                 },
+                ...o.popup,
             },
             value: o.value,
             hideChecker(e) {
                 return (
                     triggerBtn.element.find(e.target).length === 0 &&
-                    self.numberCounter.element.find(e.target).length === 0
+                    size(self.numberCounter.getView()?.element.find(e.target)) === 0 &&
+                    size(self.trigger.getSearcher().getSearcher().getView()?.element.find(e.target)) === 0
                 );
             },
         });
@@ -259,6 +270,7 @@ export class MultiSelectInsertCombo extends Single {
             nextTick(() => {
                 self._populate();
             });
+            self.fireEvent(MultiSelectInsertCombo.EVENT_BEFORE_POPUPVIEW);
         });
         // 当退出的时候如果还在处理请求，则等请求结束后再对外发确定事件
         this.wants2Quit = false;
@@ -290,6 +302,8 @@ export class MultiSelectInsertCombo extends Single {
             valueFormatter: o.valueFormatter,
             itemsCreator: bind(this._itemsCreator4Trigger, this),
             value: o.value,
+            masker: o.masker,
+            popup: o.popup,
         });
         this.numberCounter.on(MultiSelectCheckSelectedSwitcher.EVENT_TRIGGER_CHANGE, () => {
             if (!self.combo.isViewVisible()) {
@@ -298,6 +312,10 @@ export class MultiSelectInsertCombo extends Single {
         });
         this.numberCounter.on(MultiSelectCheckSelectedSwitcher.EVENT_BEFORE_POPUPVIEW, function() {
             this.updateSelectedValue(self.storeValue);
+            self.fireEvent(MultiSelectInsertCombo.EVENT_BEFORE_NUMBER_COUNTER_POPUPVIEW);
+        });
+        this.numberCounter.on(MultiSelectCheckSelectedSwitcher.EVENT_AFTER_POPUPVIEW, function() {
+            self.fireEvent(MultiSelectInsertCombo.EVENT_AFTER_NUMBER_COUNTER_POPUPVIEW);
         });
 
         this.numberCounter.on(Events.VIEW, b => {
@@ -555,4 +573,16 @@ export class MultiSelectInsertCombo extends Single {
         this._populate(...arguments);
         this.numberCounter.populateSwitcher(...arguments);
     }
+
+    getPopup() {
+        return this.popup;
+    }
+
+    getNumberCounter() {
+        return this.numberCounter;
+    }
+
+    getTrigger() {
+        return this.trigger;
+    }
 }

packages/fineui/src/widget/multiselect/multiselect.insert.trigger.js

@@ -50,7 +50,7 @@ export class MultiSelectInsertTrigger extends Trigger {
             itemFormatter: o.itemFormatter,
             itemHeight: o.itemHeight,
             watermark: o.watermark,
-            popup: {},
+            popup: o.popup,
             adapter: o.adapter,
             masker: o.masker,
             value: o.value,

packages/fineui/src/widget/multiselect/multiselect.trigger.js

@@ -50,7 +50,7 @@ export class MultiSelectTrigger extends Trigger {
             valueFormatter: o.valueFormatter,
             itemFormatter: o.itemFormatter,
             watermark: o.watermark,
-            popup: {},
+            popup: o.popup,
             adapter: o.adapter,
             masker: o.masker,
             value: o.value,

packages/fineui/src/widget/multiselect/trigger/searcher.multiselect.insert.js

@@ -132,6 +132,10 @@ export class MultiSelectInsertSearcher extends Widget {
         }
     }
 
+    getSearcher() {
+        return this.searcher;
+    }
+
     adjustView() {
         this.searcher.adjustView();
     }

packages/fineui/src/widget/multiselect/trigger/switcher.checkselected.js

@@ -9,6 +9,7 @@ export class MultiSelectCheckSelectedSwitcher extends Widget {
 
     static EVENT_TRIGGER_CHANGE = "EVENT_TRIGGER_CHANGE";
     static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
+    static EVENT_AFTER_POPUPVIEW = "EVENT_AFTER_POPUPVIEW";
     static EVENT_AFTER_HIDEVIEW = "EVENT_AFTER_HIDEVIEW";
 
     _defaultConfig() {
@@ -72,6 +73,7 @@ export class MultiSelectCheckSelectedSwitcher extends Widget {
             const me = this;
             nextTick(() => {
                 me._populate();
+                self.fireEvent(MultiSelectCheckSelectedSwitcher.EVENT_AFTER_POPUPVIEW);
             });
         });
     }
@@ -80,6 +82,10 @@ export class MultiSelectCheckSelectedSwitcher extends Widget {
         this.switcher.adjustView();
     }
 
+    getView() {
+        return this.switcher.getView();
+    }
+
     hideView() {
         this.switcher.empty();
         this.switcher.hideView();

packages/fineui/src/widget/multitree/multi.tree.combo.js

@@ -10,7 +10,7 @@ import {
     VerticalAdaptLayout,
     deepClone,
     Selection,
-    SIZE_CONSANTS
+    size
 } from "@/core";
 import { Single, Combo } from "@/base";
 import { MultiTreeSearcher } from "./trigger/searcher.multi.tree";
@@ -27,12 +27,15 @@ export class MultiTreeCombo extends Single {
 
     static EVENT_FOCUS = "EVENT_FOCUS";
     static EVENT_BLUR = "EVENT_BLUR";
+    static EVENT_START = "EVENT_START";
     static EVENT_STOP = "EVENT_STOP";
     static EVENT_SEARCHING = "EVENT_SEARCHING";
     static EVENT_CLICK_ITEM = "EVENT_CLICK_ITEM";
     static EVENT_CONFIRM = "EVENT_CONFIRM";
     static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
     static EVENT_AFTER_HIDEVIEW = "EVENT_AFTER_HIDEVIEW";
+    static EVENT_BEFORE_NUMBER_COUNTER_POPUPVIEW = "EVENT_BEFORE_NUMBER_COUNTER_POPUPVIEW";
+    static EVENT_AFTER_NUMBER_COUNTER_POPUPVIEW = "EVENT_AFTER_NUMBER_COUNTER_POPUPVIEW";
 
     _defaultConfig() {
         return extend(super._defaultConfig(...arguments), {
@@ -42,6 +45,8 @@ export class MultiTreeCombo extends Single {
             height: 24,
             allowEdit: true,
             isNeedAdjustWidth: true,
+            popup: {},
+            masker: {},
         });
     }
 
@@ -63,23 +68,20 @@ export class MultiTreeCombo extends Single {
         this.storeValue = { value: o.value || {} };
 
         this.trigger = createWidget({
-            type: "bi.multi_select_trigger",
+            type: MultiSelectTrigger.xtype,
+            popup: o.popup,
+            masker: o.masker,
             allowEdit: o.allowEdit,
             height: toPix(o.height, o.simple ? 1 : 2),
             valueFormatter: o.valueFormatter,
             text: o.text,
             defaultText: o.defaultText,
             watermark: o.watermark,
-            masker: {
+            adapter: () => {
-                offset: {
+                return this.popup.getView();
-                    left: 0,
-                    top: 0,
-                    right: 0,
-                    bottom: SIZE_CONSANTS.LIST_ITEM_HEIGHT + 1,
-                },
             },
             searcher: {
-                type: "bi.multi_tree_searcher",
+                type: MultiTreeSearcher.xtype,
                 itemsCreator: o.itemsCreator,
                 listeners: [
                     {
@@ -104,8 +106,6 @@ export class MultiTreeCombo extends Single {
                 type: MultiTreePopup.xtype,
                 ref() {
                     self.popup = this;
-                    self.trigger.setAdapter(this);
-                    self.numberCounter.setAdapter(this);
                 },
                 listeners: [
                     {
@@ -160,13 +160,16 @@ export class MultiTreeCombo extends Single {
                     });
                 },
                 maxWidth: o.isNeedAdjustWidth ? "auto" : 500,
+                ...o.popup,
             },
             isNeedAdjustWidth: o.isNeedAdjustWidth,
             value: { value: o.value || {} },
             hideChecker(e) {
                 return (
                     triggerBtn.element.find(e.target).length === 0 &&
-                    self.numberCounter.element.find(e.target).length === 0
+                    size(self.numberCounter.getView()?.element.find(e.target)) === 0 &&
+                    size(self.trigger.getSearcher().getSearcher().getView()?.element.find(e.target)) === 0 &&
+                    self.trigger.getSearcher().getSearcher().getView()?.element[0] !== e.target
                 );
             },
         });
@@ -193,6 +196,7 @@ export class MultiTreeCombo extends Single {
             self.storeValue = { value: self.combo.getValue() };
             this.setValue(self.storeValue);
             self.numberCounter.setValue(self.storeValue);
+            self.fireEvent(MultiTreeCombo.EVENT_START);
         });
         this.trigger.on(MultiSelectTrigger.EVENT_STOP, function () {
             self.storeValue = { value: this.getValue() };
@@ -295,23 +299,18 @@ export class MultiTreeCombo extends Single {
         });
 
         this.numberCounter = createWidget({
-            type: "bi.multi_select_check_selected_switcher",
+            type: MultiSelectCheckSelectedSwitcher,
             el: {
-                // type: "bi.multi_tree_check_selected_button",
                 type: MultiTreeCheckSelectedButton.xtype,
             },
             popup: {
-                // type: "bi.multi_tree_check_pane",
                 type: MultiTreeCheckPane.xtype,
+                ...o.popup,
             },
-            masker: {
+            adapter: () => {
-                offset: {
+                return this.popup.getView();
-                    left: 0,
-                    top: 0,
-                    right: 0,
-                    bottom: SIZE_CONSANTS.LIST_ITEM_HEIGHT + 1,
-                },
             },
+            masker: o.masker,
             itemsCreator: o.itemsCreator,
             valueFormatter: o.valueFormatter,
             value: { value: o.value || {} },
@@ -334,8 +333,12 @@ export class MultiTreeCombo extends Single {
                     want2showCounter = null;
                     showCounter();
                 }
+                this.fireEvent(MultiTreeCombo.EVENT_BEFORE_NUMBER_COUNTER_POPUPVIEW);
             }
         );
+        this.numberCounter.on(MultiSelectCheckSelectedSwitcher.EVENT_AFTER_POPUPVIEW, function() {
+            self.fireEvent(MultiTreeCombo.EVENT_AFTER_NUMBER_COUNTER_POPUPVIEW);
+        });
 
         this.numberCounter.on(Events.VIEW, b => {
             nextTick(() => {
@@ -443,4 +446,16 @@ export class MultiTreeCombo extends Single {
     setWaterMark(v) {
         this.trigger.setWaterMark(v);
     }
+
+    getPopup() {
+        return this.popup;
+    }
+
+    getNumberCounter() {
+        return this.numberCounter;
+    }
+
+    getTrigger() {
+        return this.trigger;
+    }
 }

packages/fineui/src/widget/multitree/multi.tree.popup.js

@@ -105,4 +105,8 @@ export class MultiTreePopup extends Pane {
     resetWidth(w) {
         this.popupView.resetWidth(w);
     }
+
+    getView() {
+        return this.popupView.getView();
+    }
 }

packages/fineui/src/widget/multitree/trigger/searcher.multi.tree.js

@@ -220,6 +220,10 @@ export class MultiTreeSearcher extends Widget {
         return this.editor.getState();
     }
 
+    getSearcher() {
+        return this.searcher;
+    }
+
     setValue(ob) {
         this.setState(ob);
         this.searcher.setValue(ob);

packages/fineui/src/widget/numberinterval/numberinterval.js

@@ -41,6 +41,8 @@ export class NumberInterval extends Single {
     static EVENT_CONFIRM = "EVENT_CONFIRM";
     static EVENT_VALID = "EVENT_VALID";
     static EVENT_ERROR = "EVENT_ERROR";
+    static EVENT_BEFORE_LEFT_POPUPVIEW = "EVENT_BEFORE_LEFT_POPUPVIEW";
+    static EVENT_BEFORE_RIGHT_POPUPVIEW = "EVENT_BEFORE_RIGHT_POPUPVIEW";
 
     _defaultConfig() {
         const conf = super._defaultConfig(...arguments);
@@ -151,6 +153,8 @@ export class NumberInterval extends Single {
         });
         this.smallCombo = createWidget({
             type: IconCombo.xtype,
+            container: o.container,
+            popup: o.popup,
             cls: `number-interval-small-combo${
                 o.simple ? "" : " bi-border-top bi-border-bottom bi-border-right bi-border-corner-right-radius"
             }`,
@@ -168,6 +172,12 @@ export class NumberInterval extends Single {
                     iconCls: "less-equal-font",
                 },
             ],
+            listeners: [{
+                eventName: IconCombo.EVENT_BEFORE_POPUPVIEW,
+                action: () => {
+                    this.fireEvent(NumberInterval.EVENT_BEFORE_LEFT_POPUPVIEW);
+                },
+            }],
         });
         if (o.closeMin === true) {
             this.smallCombo.setValue(1);
@@ -176,6 +186,8 @@ export class NumberInterval extends Single {
         }
         this.bigCombo = createWidget({
             type: IconCombo.xtype,
+            container: o.container,
+            popup: o.popup,
             cls: `number-interval-big-combo${
                 o.simple ? "" : " bi-border-top bi-border-bottom bi-border-left bi-border-corner-left-radius"
             }`,
@@ -193,6 +205,12 @@ export class NumberInterval extends Single {
                     iconCls: "less-equal-font",
                 },
             ],
+            listeners: [{
+                eventName: IconCombo.EVENT_BEFORE_POPUPVIEW,
+                action: () => {
+                    this.fireEvent(NumberInterval.EVENT_BEFORE_RIGHT_POPUPVIEW);
+                },
+            }],
         });
         if (o.closeMax === true) {
             this.bigCombo.setValue(1);
@@ -621,6 +639,14 @@ export class NumberInterval extends Single {
         this.bigEditor.focus();
     }
 
+    getLeftCombo() {
+        return this.smallCombo;
+    }
+
+    getRightCombo() {
+        return this.bigCombo;
+    }
+
     destroyed() {
         const c = this.constants;
         Bubbles.remove(c.typeError);

packages/fineui/src/widget/singleselect/singleselect.insert.combo.js

@@ -10,7 +10,8 @@ import {
     isNotNull,
     nextTick,
     AbsoluteLayout,
-    makeObject
+    makeObject,
+    size
 } from "@/core";
 import { Single, Combo } from "@/base";
 import { SingleSelectTrigger } from "./singleselect.trigger";
@@ -25,10 +26,12 @@ export class SingleSelectInsertCombo extends Single {
     static REQ_GET_ALL_DATA = -1;
     static EVENT_FOCUS = "EVENT_FOCUS";
     static EVENT_BLUR = "EVENT_BLUR";
+    static EVENT_START = "EVENT_START";
     static EVENT_STOP = "EVENT_STOP";
     static EVENT_SEARCHING = "EVENT_SEARCHING";
     static EVENT_CLICK_ITEM = "EVENT_CLICK_ITEM";
     static EVENT_CONFIRM = "EVENT_CONFIRM";
+    static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW"
 
     _defaultConfig() {
         return extend(super._defaultConfig(...arguments), {
@@ -40,6 +43,8 @@ export class SingleSelectInsertCombo extends Single {
             height: 24,
             allowEdit: true,
             watermark: i18nText("BI-Basic_Search_And_Patch_Paste"),
+            popup: {},
+            masker: {},
         });
     }
 
@@ -57,6 +62,7 @@ export class SingleSelectInsertCombo extends Single {
 
         this.trigger = createWidget({
             type: SingleSelectTrigger.xtype,
+            masker: o.masker,
             watermark: o.watermark,
             height: toPix(o.height, o.simple ? 1 : 2),
             allowNoSelect: o.allowNoSelect,
@@ -77,6 +83,7 @@ export class SingleSelectInsertCombo extends Single {
             searcher: {
                 popup: {
                     type: SingleSelectSearchInsertPane.xtype,
+                    ...o.popup,
                 },
             },
         });
@@ -91,6 +98,7 @@ export class SingleSelectInsertCombo extends Single {
         this.trigger.on(SingleSelectTrigger.EVENT_START, function () {
             self._setStartValue();
             this.getSearcher().setValue(self.storeValue);
+            self.fireEvent(SingleSelectInsertCombo.EVENT_START);
         });
         this.trigger.on(SingleSelectTrigger.EVENT_STOP, () => {
             self._setStartValue();
@@ -156,9 +164,13 @@ export class SingleSelectInsertCombo extends Single {
                         self.trigger.getSearcher().adjustView();
                     });
                 },
+                ...o.popup,
             },
             hideChecker(e) {
-                return triggerBtn.element.find(e.target).length === 0;
+                return (
+                    triggerBtn.element.find(e.target).length === 0 &&
+                    size(self.trigger.getSearcher().getSearcher().getView()?.element.find(e.target)) === 0
+                );
             },
             value: o.value,
         });
@@ -171,6 +183,7 @@ export class SingleSelectInsertCombo extends Single {
             nextTick(() => {
                 self.populate();
             });
+            self.fireEvent(SingleSelectInsertCombo .EVENT_BEFORE_POPUPVIEW);
         });
         // 当退出的时候如果还在处理请求，则等请求结束后再对外发确定事件
         this.wants2Quit = false;
@@ -261,4 +274,12 @@ export class SingleSelectInsertCombo extends Single {
     populate() {
         this.combo.populate(...arguments);
     }
+
+    getPopup() {
+        return this.popup;
+    }
+
+    getTrigger() {
+        return this.trigger;
+    }
 }

packages/fineui/src/widget/singleselect/trigger/searcher.singleselect.js

@@ -131,6 +131,10 @@ export class SingleSelectSearcher extends Widget {
         return this.searcher.getView() && this.searcher.getView().hasChecked();
     }
 
+    getSearcher() {
+        return this.searcher;
+    }
+
     setAdapter(adapter) {
         this.searcher.setAdapter(adapter);
     }

packages/fineui/src/widget/textvaluedownlistcombo/combo.textvaluedownlist.js

@@ -20,6 +20,7 @@ export class TextValueDownListCombo extends Widget {
     static xtype = "bi.text_value_down_list_combo";
 
     static EVENT_CHANGE = "EVENT_CHANGE";
+    static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
 
     _defaultConfig(config) {
         return extend(super._defaultConfig(...arguments), {
@@ -42,6 +43,7 @@ export class TextValueDownListCombo extends Widget {
         this.combo = createWidget({
             type: DownListCombo.xtype,
             element: this,
+            container: o.container,
             chooseType: Selection.Single,
             adjustLength: 2,
             width: toPix(o.width, 2),
@@ -59,6 +61,7 @@ export class TextValueDownListCombo extends Widget {
             },
             value: isNull(value) ? [] : [value],
             items: deepClone(o.items),
+            popup: o.popup,
         });
 
         this.combo.on(DownListCombo.EVENT_CHANGE, () => {
@@ -76,6 +79,10 @@ export class TextValueDownListCombo extends Widget {
                 this.fireEvent(TextValueDownListCombo.EVENT_CHANGE);
             }
         });
+
+        this.combo.on(DownListCombo.EVENT_BEFORE_POPUPVIEW, () => {
+            this.fireEvent(TextValueDownListCombo.EVENT_BEFORE_POPUPVIEW);
+        });
     }
 
     _createValueMap() {
@@ -114,4 +121,8 @@ export class TextValueDownListCombo extends Widget {
         this.combo.populate(items);
         this._createValueMap();
     }
+
+    getPopup() {
+        return this.combo.getPopup();
+    }
 }

packages/fineui/src/widget/timeinterval/dateinterval.js

@@ -30,6 +30,8 @@ export class DateInterval extends Single {
     static EVENT_ERROR = "EVENT_ERROR";
     static EVENT_CHANGE = "EVENT_CHANGE";
     static EVENT_BEFORE_YEAR_MONTH_POPUPVIEW = "EVENT_BEFORE_YEAR_MONTH_POPUPVIEW";
+    static EVENT_BEFORE_START_POPUPVIEW = "EVENT_BEFORE_START_POPUPVIEW";
+    static EVENT_BEFORE_END_POPUPVIEW = "EVENT_BEFORE_END_POPUPVIEW";
 
     _defaultConfig() {
         const conf = super._defaultConfig(...arguments);
@@ -50,6 +52,13 @@ export class DateInterval extends Single {
         this.left = this._createCombo(o.value.start, o.watermark?.start);
         this.right = this._createCombo(o.value.end, o.watermark?.end);
 
+        this.left.on(DynamicDateCombo.EVENT_BEFORE_POPUPVIEW, () => {
+            this.fireEvent(DateInterval.EVENT_BEFORE_START_POPUPVIEW);
+        })
+        this.right.on(DynamicDateCombo.EVENT_BEFORE_POPUPVIEW, () => {
+            this.fireEvent(DateInterval.EVENT_BEFORE_END_POPUPVIEW);
+        })
+
         return {
             type: HorizontalFillLayout.xtype,
             columnSize: ["fill", "", "fill"],
@@ -79,6 +88,8 @@ export class DateInterval extends Single {
         const o = this.options;
         const combo = createWidget({
             type: DynamicDateCombo.xtype,
+            container: o.container,
+            popup: o.popup,
             isPreview: o.isPreview,
             supportDynamic: o.supportDynamic,
             minDate: o.minDate,
@@ -243,4 +254,11 @@ export class DateInterval extends Single {
             end: this.right.getValue(),
         };
     }
+
+    getPopup() {
+        return {
+            start: this.left.getPopup(),
+            end: this.right.getPopup(),
+        };
+    }
 }

packages/fineui/src/widget/timeinterval/timeinterval.js

@@ -29,6 +29,8 @@ export class TimeInterval extends Single {
     static EVENT_VALID = "EVENT_VALID";
     static EVENT_ERROR = "EVENT_ERROR";
     static EVENT_CHANGE = "EVENT_CHANGE";
+    static EVENT_BEFORE_START_POPUPVIEW = "EVENT_BEFORE_START_POPUPVIEW";
+    static EVENT_BEFORE_END_POPUPVIEW = "EVENT_BEFORE_END_POPUPVIEW";
 
     _defaultConfig() {
         const conf = super._defaultConfig(...arguments);
@@ -48,6 +50,13 @@ export class TimeInterval extends Single {
         this.left = this._createCombo(o.value.start, o.watermark?.start);
         this.right = this._createCombo(o.value.end, o.watermark?.end);
 
+        this.left.on(DynamicDateTimeCombo.EVENT_BEFORE_POPUPVIEW, () => {
+            this.fireEvent(TimeInterval.EVENT_BEFORE_START_POPUPVIEW);
+        })
+        this.right.on(DynamicDateTimeCombo.EVENT_BEFORE_POPUPVIEW, () => {
+            this.fireEvent(TimeInterval.EVENT_BEFORE_END_POPUPVIEW);
+        })
+
         return {
             type: HorizontalFillLayout.xtype,
             columnSize: ["fill", "", "fill"],
@@ -77,6 +86,8 @@ export class TimeInterval extends Single {
         const o = this.options;
         const combo = createWidget({
             type: DynamicDateTimeCombo.xtype,
+            container: o.container,
+            popup: o.popup,
             isPreview: o.isPreview,
             timeSelectTypes: o.timeSelectTypes,
             simple: o.simple,
@@ -250,4 +261,11 @@ export class TimeInterval extends Single {
             end: this.right.getValue(),
         };
     }
+
+    getPopup() {
+        return {
+            start: this.left.getPopup(),
+            end: this.right.getPopup(),
+        };
+    }
 }

packages/fineui/src/widget/year/combo.year.js

@@ -98,13 +98,13 @@ export class DynamicYearCombo extends Widget {
                     supportDynamic: o.supportDynamic,
                     isPreview: o.isPreview,
                     ref: _ref => {
-                        this.popup = _ref;
+                        this.popupEl = _ref;
                     },
                     listeners: [
                         {
                             eventName: DynamicYearPopup.EVENT_CHANGE,
                             action: () => {
-                                this.setValue(this.popup.getValue());
+                                this.setValue(this.popupEl.getValue());
                                 this.combo.hideView();
                                 this.fireEvent(DynamicYearCombo.EVENT_CONFIRM);
                             },
@@ -129,7 +129,7 @@ export class DynamicYearCombo extends Widget {
                         {
                             eventName: DynamicYearPopup.BUTTON_OK_EVENT_CHANGE,
                             action: () => {
-                                this.setValue(this.popup.getValue());
+                                this.setValue(this.popupEl.getValue());
                                 this.combo.hideView();
                                 this.fireEvent(DynamicDateCombo.EVENT_CONFIRM);
                             },
@@ -140,12 +140,16 @@ export class DynamicYearCombo extends Widget {
                     max: o.maxDate,
                 },
                 value: o.value || "",
+                ref: (ref) => {
+                    this.popup = ref;
+                },
+                ...o.popup,
             },
         });
         this.combo.on(Combo.EVENT_BEFORE_POPUPVIEW, () => {
-            this.popup.setMinDate(o.minDate);
+            this.popupEl.setMinDate(o.minDate);
-            this.popup.setMaxDate(o.maxDate);
+            this.popupEl.setMaxDate(o.maxDate);
-            this.popup.setValue(this.storeValue);
+            this.popupEl.setValue(this.storeValue);
             this.fireEvent(DynamicYearCombo.EVENT_BEFORE_POPUPVIEW);
         });
 
@@ -205,14 +209,14 @@ export class DynamicYearCombo extends Widget {
         const o = this.options;
         o.minDate = minDate;
         this.trigger.setMinDate(minDate);
-        this.popup && this.popup.setMinDate(minDate);
+        this.popupEl && this.popupEl.setMinDate(minDate);
     }
 
     setMaxDate(maxDate) {
         const o = this.options;
         o.maxDate = maxDate;
         this.trigger.setMaxDate(maxDate);
-        this.popup && this.popup.setMaxDate(maxDate);
+        this.popupEl && this.popupEl.setMaxDate(maxDate);
     }
 
     hideView() {
@@ -240,6 +244,10 @@ export class DynamicYearCombo extends Widget {
     setWaterMark(v) {
         this.trigger.setWaterMark(v);
     }
+
+    getPopup() {
+        return this.popup;
+    }
 }
 extend(DynamicYearCombo, {
     Static: 1,

packages/fineui/src/widget/yearmonth/combo.yearmonth.js

@@ -109,13 +109,13 @@ export class DynamicYearMonthCombo extends Single {
                     supportDynamic: o.supportDynamic,
                     isPreview: o.isPreview,
                     ref: _ref => {
-                        this.popup = _ref;
+                        this.popupEl = _ref;
                     },
                     listeners: [
                         {
                             eventName: DynamicYearMonthPopup.EVENT_CHANGE,
                             action: () => {
-                                this.setValue(this.popup.getValue());
+                                this.setValue(this.popupEl.getValue());
                                 this.combo.hideView();
                                 this.fireEvent(DynamicYearMonthCombo.EVENT_CONFIRM);
                             },
@@ -147,7 +147,7 @@ export class DynamicYearMonthCombo extends Single {
                         {
                             eventName: DynamicYearMonthPopup.BUTTON_OK_EVENT_CHANGE,
                             action: () => {
-                                const value = this.popup.getValue();
+                                const value = this.popupEl.getValue();
                                 if (this._checkValue(value)) {
                                     this.setValue(value);
                                 }
@@ -161,12 +161,16 @@ export class DynamicYearMonthCombo extends Single {
                     max: o.maxDate,
                 },
                 value: o.value || "",
+                ref: (ref) => {
+                    this.popup = ref;
+                },
+                ...o.popup,
             },
         });
         this.combo.on(Combo.EVENT_BEFORE_POPUPVIEW, () => {
-            this.popup.setMinDate(o.minDate);
+            this.popupEl.setMinDate(o.minDate);
-            this.popup.setMaxDate(o.maxDate);
+            this.popupEl.setMaxDate(o.maxDate);
-            this.popup.setValue(this.storeValue);
+            this.popupEl.setValue(this.storeValue);
             this.fireEvent(DynamicYearMonthCombo.EVENT_BEFORE_POPUPVIEW);
         });
 
@@ -241,14 +245,18 @@ export class DynamicYearMonthCombo extends Single {
         const o = this.options;
         o.minDate = minDate;
         this.trigger.setMinDate(minDate);
-        this.popup && this.popup.setMinDate(minDate);
+        this.popupEl && this.popupEl.setMinDate(minDate);
     }
 
     setMaxDate(maxDate) {
         const o = this.options;
         o.maxDate = maxDate;
         this.trigger.setMaxDate(maxDate);
-        this.popup && this.popup.setMaxDate(maxDate);
+        this.popupEl && this.popupEl.setMaxDate(maxDate);
+    }
+
+    getPopup() {
+        return this.popup;
     }
 
     hideView() {

packages/fineui/src/widget/yearmonthinterval/yearmonthinterval.js

@@ -20,6 +20,8 @@ export class YearMonthInterval extends Single {
     static EVENT_ERROR = "EVENT_ERROR";
     static EVENT_CHANGE = "EVENT_CHANGE";
     static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
+    static EVENT_BEFORE_START_POPUPVIEW = "EVENT_BEFORE_START_POPUPVIEW";
+    static EVENT_BEFORE_END_POPUPVIEW = "EVENT_BEFORE_END_POPUPVIEW";
 
     constants = {
         width: 25,
@@ -43,6 +45,13 @@ export class YearMonthInterval extends Single {
         this.left = this._createCombo(o.value.start, o.watermark?.start);
         this.right = this._createCombo(o.value.end, o.watermark?.end);
 
+        this.left.on(DynamicYearMonthCombo.EVENT_BEFORE_POPUPVIEW, () => {
+            this.fireEvent(YearMonthInterval.EVENT_BEFORE_START_POPUPVIEW);
+        })
+        this.right.on(DynamicYearMonthCombo.EVENT_BEFORE_POPUPVIEW, () => {
+            this.fireEvent(YearMonthInterval.EVENT_BEFORE_END_POPUPVIEW);
+        })
+
         return {
             type: HorizontalFillLayout.xtype,
             columnSize: ["fill", "", "fill"],
@@ -72,6 +81,8 @@ export class YearMonthInterval extends Single {
         const o = this.options;
         const combo = createWidget({
             type: DynamicYearMonthCombo.xtype,
+            container: o.container,
+            popup: o.popup,
             isPreview: o.isPreview,
             simple: o.simple,
             supportDynamic: o.supportDynamic,
@@ -235,4 +246,11 @@ export class YearMonthInterval extends Single {
     getValue() {
         return { start: this.left.getValue(), end: this.right.getValue() };
     }
+
+    getPopup() {
+        return {
+            start: this.left.getPopup(),
+            end: this.right.getPopup(),
+        };
+    }
 }

packages/fineui/src/widget/yearquarter/combo.yearquarter.js

@@ -112,13 +112,13 @@ export class DynamicYearQuarterCombo extends Widget {
                     supportDynamic: o.supportDynamic,
                     isPreview: o.isPreview,
                     ref: _ref => {
-                        this.popup = _ref;
+                        this.popupEl = _ref;
                     },
                     listeners: [
                         {
                             eventName: DynamicYearQuarterPopup.EVENT_CHANGE,
                             action: () => {
-                                this.setValue(this.popup.getValue());
+                                this.setValue(this.popupEl.getValue());
                                 this.combo.hideView();
                                 this.fireEvent(DynamicYearQuarterCombo.EVENT_CONFIRM);
                             },
@@ -150,7 +150,7 @@ export class DynamicYearQuarterCombo extends Widget {
                         {
                             eventName: DynamicYearQuarterPopup.BUTTON_OK_EVENT_CHANGE,
                             action: () => {
-                                const value = this.popup.getValue();
+                                const value = this.popupEl.getValue();
                                 if (this._checkValue(value)) {
                                     this.setValue(value);
                                 }
@@ -164,12 +164,16 @@ export class DynamicYearQuarterCombo extends Widget {
                     max: o.maxDate,
                 },
                 value: o.value || "",
+                ref: (ref) => {
+                    this.popup = ref;
+                },
+                ...o.popup,
             },
         });
         this.combo.on(Combo.EVENT_BEFORE_POPUPVIEW, () => {
-            this.popup.setMinDate(o.minDate);
+            this.popupEl.setMinDate(o.minDate);
-            this.popup.setMaxDate(o.maxDate);
+            this.popupEl.setMaxDate(o.maxDate);
-            this.popup.setValue(this.storeValue);
+            this.popupEl.setValue(this.storeValue);
             this.fireEvent(DynamicYearQuarterCombo.EVENT_BEFORE_POPUPVIEW);
         });
 
@@ -244,14 +248,18 @@ export class DynamicYearQuarterCombo extends Widget {
         const o = this.options;
         o.minDate = minDate;
         this.trigger.setMinDate(minDate);
-        this.popup && this.popup.setMinDate(minDate);
+        this.popupEl && this.popupEl.setMinDate(minDate);
     }
 
     setMaxDate(maxDate) {
         const o = this.options;
         o.maxDate = maxDate;
         this.trigger.setMaxDate(maxDate);
-        this.popup && this.popup.setMaxDate(maxDate);
+        this.popupEl && this.popupEl.setMaxDate(maxDate);
+    }
+
+    getPopup() {
+        return this.popup;
     }
 
     hideView() {

packages/fineui/typescript/case/combo/iconcombo/combo.icon.ts

@@ -1,13 +1,17 @@
+import { PopupView } from "../../../base/layer/layer.popup";
 import { Widget } from '../../../core/widget';
 
 export declare class IconCombo extends Widget {
     static xtype: string;
 
     static EVENT_CHANGE: string;
+    static EVENT_BEFORE_POPUPVIEW: string;
 
     showView(): void;
 
     hideView(): void;
 
     populate(items: any[]): void;
+
+    getPopup(): PopupView;
 }

packages/fineui/typescript/index.ts

@@ -103,6 +103,7 @@ export { CenterAdaptLayout } from "./core/wrapper/layout/adapt/adapt.center";
 export { VerticalAdaptLayout } from "./core/wrapper/layout/adapt/adapt.vertical";
 export { MultiSelectInsertCombo } from "./widget/multiselect/multiselect.insert.combo";
 export { MultiSelectCombo } from "./widget/multiselect/multiselect.combo";
+export { MultiSelectCheckSelectedSwitcher } from "./widget/multiselect/switcher.checkselected";
 export { SearchEditor } from "./widget/editor/editor.search";
 export { MultiLayerSingleLevelTree } from "./widget/multilayersingletree/multilayersingletree.leveltree";
 export { SimpleColorChooser } from "./case/colorchooser/colorchooser.simple";

packages/fineui/typescript/widget/downlist/combo.downlist.ts

@@ -1,3 +1,4 @@
+import { PopupView } from "../../base/layer/layer.popup";
 import { Widget } from "../../core/widget";
 
 export declare class DownListCombo extends Widget {
@@ -15,4 +16,6 @@ export declare class DownListCombo extends Widget {
     adjustWidth: (e?: MouseEvent) => void;
 
     adjustHeight: (e?: MouseEvent) => void;
+
+    getPopup(): PopupView;
 }

packages/fineui/typescript/widget/dynamicdate/dynamicdate.combo.ts

@@ -1,4 +1,5 @@
-import { Single } from '../../base/single/single';
+import { PopupView } from "../../base/layer/layer.popup";
+import { Single } from "../../base/single/single";
 
 export declare class DynamicDateCombo extends Single {
     static xtype: string;
@@ -26,6 +27,7 @@ export declare class DynamicDateCombo extends Single {
         };
         watermark?: string;
         simple?: boolean;
+        popup?: any;
     } & Single['props']
 
     setMinDate(minDate: string): void;
@@ -43,6 +45,8 @@ export declare class DynamicDateCombo extends Single {
     blur(): void;
 
     setWaterMark(v: string): void;
+
+    getPopup(): PopupView;
 }
 
 export interface DynamicDataComboValue {

packages/fineui/typescript/widget/dynamicdatetime/dynamicdatetime.combo.ts

@@ -1,3 +1,4 @@
+import { PopupView } from '../../base/layer/layer.popup';
 import { Single } from '../../base/single/single';
 
 export declare class DynamicDateTimeCombo extends Single {
@@ -23,6 +24,7 @@ export declare class DynamicDateTimeCombo extends Single {
             tabIndex?: number;
         };
         watermark?: string;
+        popup?: any;
     } & Single['props'];
 
     getValue(): DynamicDateTimeComboValue;
@@ -40,6 +42,8 @@ export declare class DynamicDateTimeCombo extends Single {
     blur(): void;
 
     setWaterMark(v: string): void
+
+    getPopup(): PopupView;
 }
 
 export interface DynamicDateTimeComboValue {

packages/fineui/typescript/widget/multiselect/multiselect.insert.combo.ts

@@ -1,9 +1,12 @@
+import { PopupView } from "../../base/layer/layer.popup";
 import { Single } from "../../base/single/single";
+import { MultiSelectCheckSelectedSwitcher } from "./switcher.checkselected";
 
 export declare class MultiSelectInsertCombo extends Single {
     static xtype: string;
     static EVENT_FOCUS: string;
     static EVENT_BLUR: string;
+    static EVENT_START: string;
     static EVENT_STOP: string;
     static EVENT_SEARCHING: string;
     static EVENT_CLICK_ITEM: string;
@@ -12,6 +15,9 @@ export declare class MultiSelectInsertCombo extends Single {
     static REQ_GET_DATA_LENGTH: 1;
     static REQ_GET_ALL_DATA: -1;
     static EVENT_AFTER_HIDEVIEW: string;
+    static EVENT_BEFORE_POPUPVIEW: string;
+    static EVENT_BEFORE_NUMBER_COUNTER_POPUPVIEW: string;
+    static EVENT_AFTER_NUMBER_COUNTER_POPUPVIEW: string;
 
     props: {
         itemsCreator?: Function;
@@ -21,6 +27,8 @@ export declare class MultiSelectInsertCombo extends Single {
         text?: string;
         watermark?: string;
         container?: any;
+        popup?: any;
+        masker?: any;
     } & Single["props"];
 
     _itemsCreator4Trigger(op: any, callback: Function): void;
@@ -67,5 +75,9 @@ export declare class MultiSelectInsertCombo extends Single {
         assist: string[];
     };
 
+    getPopup(): PopupView;
+
+    getNumberCounter(): MultiSelectCheckSelectedSwitcher;
+
     populate(...args: any[]): void;
 }

packages/fineui/typescript/widget/multiselect/switcher.checkselected.ts

@@ -0,0 +1,19 @@
+import { Widget } from '../../core/widget';
+
+export declare class MultiSelectCheckSelectedSwitcher extends Widget {
+    static xtype: string;
+    static EVENT_TRIGGER_CHANGE: string;
+    static EVENT_BEFORE_POPUPVIEW: string;
+    static EVENT_AFTER_HIDEVIEW: string;
+
+    props: {
+        itemsCreator?: Function;
+        valueFormatter?: Function;
+    };
+
+    adjustView(): void;
+
+    hideView(): void;
+
+    getView(): Widget;
+}

packages/fineui/typescript/widget/multitree/multi.tree.combo.ts

@@ -1,5 +1,7 @@
+import { PopupView } from "../../base/layer/layer.popup";
 import { Single } from "../../base/single/single";
 import { Widget } from "../../core/widget";
+import { MultiSelectCheckSelectedSwitcher } from "../multiselect/switcher.checkselected";
 
 export declare class MultiTreeCombo extends Single {
     static xtype: string;
@@ -10,6 +12,13 @@ export declare class MultiTreeCombo extends Single {
     static EVENT_CLICK_ITEM: string;
     static EVENT_CONFIRM: string;
     static EVENT_BEFORE_POPUPVIEW: string;
+    static EVENT_BEFORE_NUMBER_COUNTER_POPUPVIEW: string;
+    static EVENT_AFTER_NUMBER_COUNTER_POPUPVIEW: string;
+
+    props: {
+        popup?: any;
+        masker?: any;
+    } & Single["props"];
 
     showView(): void;
     hideView(): void;
@@ -21,4 +30,8 @@ export declare class MultiTreeCombo extends Single {
     blur(): void;
 
     setWaterMark(v: string): void;
+
+    getPopup(): PopupView;
+
+    getNumberCounter(): MultiSelectCheckSelectedSwitcher;
 }

packages/fineui/typescript/widget/multitree/multi.tree.popup.ts

@@ -1,3 +1,4 @@
+import { ButtonGroup } from "../../base/combination/group.button";
 import { Pane } from "../../base/pane";
 
 export declare class MultiTreePopup extends Pane {
@@ -12,4 +13,6 @@ export declare class MultiTreePopup extends Pane {
     resetHeight(h: number): void;
 
     resetWidth(w: number): void;
+
+    getView(): ButtonGroup;
 }

packages/fineui/typescript/widget/numberinterval/numberinterval.ts

@@ -1,3 +1,4 @@
+import { Combo } from '../../base/combination/combo';
 import { Single } from '../../base/single/single';
 
 export declare class NumberInterval extends Single {
@@ -6,6 +7,8 @@ export declare class NumberInterval extends Single {
     static EVENT_CONFIRM: string;
     static EVENT_VALID: string;
     static EVENT_ERROR: string;
+    static EVENT_BEFORE_LEFT_POPUPVIEW: string;
+    static EVENT_BEFORE_RIGHT_POPUPVIEW: string;
 
     props: {
         watermark?: string;
@@ -40,4 +43,8 @@ export declare class NumberInterval extends Single {
     focusMinEditor(): void;
 
     focusMaxEditor(): void;
+
+    getLeftCombo(): Combo;
+
+    getRightCombo(): Combo;
 }

packages/fineui/typescript/widget/singleselect/singleselect.insert.combo.ts

@@ -1,3 +1,4 @@
+import { PopupView } from "../../base/layer/layer.popup";
 import { Single } from "../../base/single/single";
 
 export declare class SingleSelectInsertCombo extends Single {
@@ -8,6 +9,7 @@ export declare class SingleSelectInsertCombo extends Single {
     static EVENT_SEARCHING: string;
     static EVENT_CLICK_ITEM: string;
     static EVENT_CONFIRM: string;
+    static EVENT_BEFORE_POPUPVIEW: string;
 
     props: {
         text?: string,
@@ -16,5 +18,8 @@ export declare class SingleSelectInsertCombo extends Single {
         valueFormatter?: Function,
         allowEdit?: boolean,
         watermark?: string,
+        popup?: any;
     } & Single['props']
+
+    getPopup(): PopupView;
 }

packages/fineui/typescript/widget/textvaluedownlistcombo/combo.textvaluedownlist.ts

@@ -1,8 +1,17 @@
+import { PopupView } from "../../base/layer/layer.popup";
 import { Widget } from "../../core/widget";
 
 export declare class TextValueDownListCombo extends Widget {
     static xtype: string;
     static EVENT_CHANGE: string;
+    static EVENT_BEFORE_POPUPVIEW: string;
+
+    props: {
+        container?: string;
+        popup?: any;
+    };
 
     getValue<T>(): [T];
+
+    getPopup(): PopupView;
 }

packages/fineui/typescript/widget/timeinterval/dateinterval.ts

@@ -1,5 +1,5 @@
 import { Single } from "../../base/single/single";
-import { DynamicDataComboValue } from "../dynamicdate/dynamicdate.combo";
+import { DynamicDataComboValue, DynamicDateCombo } from "../dynamicdate/dynamicdate.combo";
 
 export declare class DateInterval extends Single {
     static xtype: string;
@@ -7,13 +7,17 @@ export declare class DateInterval extends Single {
     static EVENT_VALID: string;
     static EVENT_ERROR: string;
     static EVENT_BEFORE_YEAR_MONTH_POPUPVIEW: string;
+    static EVENT_BEFORE_START_POPUPVIEW: string;
+    static EVENT_BEFORE_END_POPUPVIEW: string;
 
     props: {
         minDate?: string;
         maxDate?: string;
         supportDynamic?: boolean;
         watermark?: string;
-    } & Single['props']
+        container?: string;
+        popup?: any;
+    } & Single["props"];
 
     getValue(): {
         start: DynamicDataComboValue;
@@ -23,4 +27,9 @@ export declare class DateInterval extends Single {
     setMinDate(minDate: string): void;
 
     setMaxDate(minDate: string): void;
+
+    getPopup(): {
+        start: DynamicDateCombo;
+        end: DynamicDateCombo;
+    };
 }

packages/fineui/typescript/widget/timeinterval/timeinterval.ts

@@ -1,11 +1,13 @@
 import { Single } from "../../base/single/single";
-import { DynamicDateTimeComboValue } from "../dynamicdatetime/dynamicdatetime.combo";
+import { DynamicDateTimeCombo, DynamicDateTimeComboValue } from "../dynamicdatetime/dynamicdatetime.combo";
 
 export declare class TimeInterval extends Single {
     static xtype: string;
     static EVENT_CHANGE: string;
     static EVENT_VALID: string;
     static EVENT_ERROR: string;
+    static EVENT_BEFORE_START_POPUPVIEW: string;
+    static EVENT_BEFORE_END_POPUPVIEW: string;
 
     props: {
         minDate?: string;
@@ -13,6 +15,8 @@ export declare class TimeInterval extends Single {
         supportDynamic?: boolean;
         watermark?: string;
         simple?: boolean;
+        container?: string;
+        popup?: any;
     } & Single['props'];
 
     getValue(): {
@@ -23,4 +27,9 @@ export declare class TimeInterval extends Single {
     setMinDate(minDate: string): void;
 
     setMaxDate(minDate: string): void;
+
+    getPopup(): {
+        start: DynamicDateTimeCombo;
+        end: DynamicDateTimeCombo;
+    };
 }

packages/fineui/typescript/widget/year/combo.year.ts

@@ -1,3 +1,4 @@
+import { PopupView } from "../../base/layer/layer.popup";
 import { Widget } from "../../core/widget";
 
 export declare class DynamicYearCombo extends Widget {
@@ -7,11 +8,17 @@ export declare class DynamicYearCombo extends Widget {
     static EVENT_CONFIRM: string;
     static EVENT_BEFORE_POPUPVIEW: string;
 
+    props: {
+        popup?: any;
+    };
+
     getValue(): DynamicYearComboValue;
 
     setMinDate(minDate: string): void;
 
     setMaxDate(maxDate: string): void;
+
+    getPopup(): PopupView;
 }
 
 export interface DynamicYearComboValue {

packages/fineui/typescript/widget/yearmonth/combo.yearmonth.ts

@@ -1,3 +1,4 @@
+import { PopupView } from "../../base/layer/layer.popup";
 import { Single } from "../../base/single/single";
 
 export declare class DynamicYearMonthCombo extends Single {
@@ -8,6 +9,10 @@ export declare class DynamicYearMonthCombo extends Single {
     static EVENT_CONFIRM: string;
     static EVENT_BEFORE_POPUPVIEW: string;
 
+    props: {
+        popup?: any;
+    } & Single["props"];
+
     hideView(): void;
 
     getKey(): string;
@@ -17,6 +22,8 @@ export declare class DynamicYearMonthCombo extends Single {
     setMinDate(minDate: string): void;
 
     setMaxDate(maxDate: string): void;
+
+    getPopup(): PopupView;
 }
 
 export interface DynamicYearMonthComboValue {

packages/fineui/typescript/widget/yearmonthinterval/yearmonthinterval.ts

@@ -1,5 +1,5 @@
 import { Single } from '../../base/single/single';
-import { DynamicYearMonthComboValue } from '../yearmonth/combo.yearmonth';
+import { DynamicYearMonthCombo, DynamicYearMonthComboValue } from '../yearmonth/combo.yearmonth';
 
 export declare class YearMonthInterval extends Single {
     static xtype: string;
@@ -7,9 +7,13 @@ export declare class YearMonthInterval extends Single {
     static EVENT_ERROR: string;
     static EVENT_CHANGE: string;
     static EVENT_BEFORE_POPUPVIEW: string;
+    static EVENT_BEFORE_START_POPUPVIEW: string;
+    static EVENT_BEFORE_END_POPUPVIEW: string;
 
     props: {
         simple?: boolean;
+        container?: string;
+        popup?: any;
     } & Single['props'];
 
     getValue(): {
@@ -20,4 +24,9 @@ export declare class YearMonthInterval extends Single {
     setMinDate(minDate: string): void;
 
     setMaxDate(maxDate: string): void;
+
+    getPopup(): {
+        start: DynamicYearMonthCombo;
+        end: DynamicYearMonthCombo;
+    };
 }

packages/fineui/typescript/widget/yearquarter/combo.yearquarter.ts

@@ -1,3 +1,4 @@
+import { PopupView } from "../../base/layer/layer.popup";
 import { Widget } from "../../core/widget";
 
 export declare class DynamicYearQuarterCombo extends Widget {
@@ -5,11 +6,17 @@ export declare class DynamicYearQuarterCombo extends Widget {
     static EVENT_CONFIRM: string;
     static EVENT_BEFORE_POPUPVIEW: string;
 
+    props: {
+        popup?: any;
+    };
+
     getValue(): DynamicYearQuarterComboValue;
 
     setMinDate(minDate: string): void;
 
     setMaxDate(maxDate: string): void;
+
+    getPopup(): PopupView;
 }
 
 export interface DynamicYearQuarterComboValue {