From db118979572e69c700bb59dab976f5e7a351589b Mon Sep 17 00:00:00 2001 From: zsmj Date: Thu, 21 Jul 2022 14:42:36 +0800 Subject: [PATCH] =?UTF-8?q?REPORT-75687=20&=20KERNEL-11647=20fix:=20?= =?UTF-8?q?=E4=BE=9D=E7=84=B6=E6=8A=8AtriggerIcon=E6=94=BE=E5=88=B0trigger?= =?UTF-8?q?=E5=A4=96=E9=9D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../combo.searchtextvalue.js | 1 - .../trigger.searchtextvalue.js | 4 -- .../widget/multitree/multi.tree.combo.less | 7 ++- src/widget/multiselect/multiselect.combo.js | 22 +++++++- src/widget/multiselect/multiselect.loader.js | 3 +- src/widget/multiselect/multiselect.trigger.js | 22 ++------ .../search/multiselect.search.loader.js | 3 +- src/widget/multitree/multi.tree.combo.js | 51 +++++++++++++------ .../multitree/multi.tree.insert.combo.js | 49 +++++++++++++----- src/widget/multitree/multi.tree.list.combo.js | 49 +++++++++++++----- 10 files changed, 141 insertions(+), 70 deletions(-) diff --git a/src/case/combo/searchtextvaluecombo/combo.searchtextvalue.js b/src/case/combo/searchtextvaluecombo/combo.searchtextvalue.js index 8de574c76..09608dea9 100644 --- a/src/case/combo/searchtextvaluecombo/combo.searchtextvalue.js +++ b/src/case/combo/searchtextvaluecombo/combo.searchtextvalue.js @@ -33,7 +33,6 @@ BI.SearchTextValueCombo = BI.inherit(BI.Widget, { adjustLength: 2, height: height, width: width, - toggle: false, ref: function () { self.combo = this; }, diff --git a/src/case/combo/searchtextvaluecombo/trigger.searchtextvalue.js b/src/case/combo/searchtextvaluecombo/trigger.searchtextvalue.js index c61093b35..7f6f7925d 100644 --- a/src/case/combo/searchtextvaluecombo/trigger.searchtextvalue.js +++ b/src/case/combo/searchtextvaluecombo/trigger.searchtextvalue.js @@ -24,10 +24,6 @@ BI.SearchTextValueTrigger = BI.inherit(BI.Trigger, { }, width: o.height, height: o.height, - stopPropagation: true, - handler: function () { - self.fireEvent(BI.Controller.EVENT_CHANGE, BI.Events.TOGGLE); - } }; var stateText = this._digest(o.value, o.items) || o.text; diff --git a/src/less/widget/multitree/multi.tree.combo.less b/src/less/widget/multitree/multi.tree.combo.less index 7e193b7d3..62b29c2a3 100644 --- a/src/less/widget/multitree/multi.tree.combo.less +++ b/src/less/widget/multitree/multi.tree.combo.less @@ -1,9 +1,11 @@ @import "../../index.less"; + @val: transform .3s ease; -.bi-multi-tree-combo{ - & .multi-select-trigger-icon-button{ +.bi-multi-tree-combo, .bi-multi-tree-insert-combo, .bi-multi-tree-list-combo { + & .multi-select-trigger-icon-button { font-size: @font-size-16; } + // 此combo的trigger_button是absolute上去的，与bi-combo在同一层级，独立写一下 & .bi-combo.bi-combo-popup + .bi-trigger-icon-button { & .x-icon { @@ -11,6 +13,7 @@ .transition(@val); } } + & .bi-combo + .bi-trigger-icon-button { & .x-icon { .rotate(0deg); diff --git a/src/widget/multiselect/multiselect.combo.js b/src/widget/multiselect/multiselect.combo.js index 2e71071b8..23d5385b8 100644 --- a/src/widget/multiselect/multiselect.combo.js +++ b/src/widget/multiselect/multiselect.combo.js @@ -173,7 +173,7 @@ BI.MultiSelectCombo = BI.inherit(BI.Single, { }, value: o.value, hideChecker: function (e) { - return self.numberCounter.element.find(e.target).length === 0; + return triggerBtn.element.find(e.target).length === 0 && self.numberCounter.element.find(e.target).length === 0; }, }); @@ -198,6 +198,21 @@ BI.MultiSelectCombo = BI.inherit(BI.Single, { } }); + var triggerBtn = BI.createWidget({ + type: "bi.trigger_icon_button", + width: o.height, + height: o.height, + cls: "multi-select-trigger-icon-button", + }); + triggerBtn.on(BI.TriggerIconButton.EVENT_CHANGE, function () { + self.numberCounter.hideView(); + if (self.combo.isViewVisible()) { + self.combo.hideView(); + } else { + self.combo.showView(); + } + }); + this.numberCounter = BI.createWidget({ type: "bi.multi_select_check_selected_switcher", masker: { @@ -248,6 +263,11 @@ BI.MultiSelectCombo = BI.inherit(BI.Single, { right: 0, top: 0, bottom: 0, + }, { + el: triggerBtn, + right: 0, + top: 0, + bottom: 0, }, { el: { type: "bi.vertical_adapt", diff --git a/src/widget/multiselect/multiselect.loader.js b/src/widget/multiselect/multiselect.loader.js index 2f51ae181..3dc7229bb 100644 --- a/src/widget/multiselect/multiselect.loader.js +++ b/src/widget/multiselect/multiselect.loader.js @@ -110,12 +110,13 @@ BI.MultiSelectLoader = BI.inherit(BI.Widget, { }, _createItems: function (items) { + var allSelected = this.isAllSelected(); return BI.createItems(items, { type: "bi.multi_select_item", logic: this.options.logic, cls: "bi-list-item-active", height: this.options.itemHeight || BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, - selected: this.isAllSelected(), + selected: allSelected, iconWrapperWidth: 36 }); }, diff --git a/src/widget/multiselect/multiselect.trigger.js b/src/widget/multiselect/multiselect.trigger.js index 4f75b38cb..7140741ff 100644 --- a/src/widget/multiselect/multiselect.trigger.js +++ b/src/widget/multiselect/multiselect.trigger.js @@ -78,22 +78,10 @@ BI.MultiSelectTrigger = BI.inherit(BI.Trigger, { items: [ { el: this.searcher, - width: "fill" - }, { - el: this.wrapNumberCounter, - width: 0 - }, { - el: { - type: "bi.trigger_icon_button", - height: o.height, - stopPropagation: true, - cls: "multi-select-trigger-icon-button", - handler: function () { - self.fireEvent(BI.Controller.EVENT_CHANGE, BI.Events.TOGGLE); - } - }, - width: 24 - }] + width: "fill", + rgap: 24 + } + ] }); !o.allowEdit && BI.createWidget({ @@ -123,7 +111,7 @@ BI.MultiSelectTrigger = BI.inherit(BI.Trigger, { * 重新调整numberCounter的空白占位符 */ refreshPlaceHolderWidth: function (width) { - this.wrapper.attr("items")[1].width = width; + this.wrapper.attr("items")[0].rgap = 24 + width; this.wrapper.resize(); }, diff --git a/src/widget/multiselect/search/multiselect.search.loader.js b/src/widget/multiselect/search/multiselect.search.loader.js index 8f17eacfc..07d4cfbea 100644 --- a/src/widget/multiselect/search/multiselect.search.loader.js +++ b/src/widget/multiselect/search/multiselect.search.loader.js @@ -91,13 +91,14 @@ BI.MultiSelectSearchLoader = BI.inherit(BI.Widget, { }, _createItems: function (items) { + var allSelected = this.isAllSelected(); return BI.createItems(items, { type: "bi.multi_select_item", logic: { dynamic: false }, height: this.options.itemHeight || BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, - selected: this.isAllSelected(), + selected: allSelected, cls: "bi-list-item-active", iconWrapperWidth: 36 }); diff --git a/src/widget/multitree/multi.tree.combo.js b/src/widget/multitree/multi.tree.combo.js index ec94374d8..4e42df154 100644 --- a/src/widget/multitree/multi.tree.combo.js +++ b/src/widget/multitree/multi.tree.combo.js @@ -22,7 +22,7 @@ BI.MultiTreeCombo = BI.inherit(BI.Single, { var isInit = false; var want2showCounter = false; - this.storeValue = { value: o.value || {} }; + this.storeValue = {value: o.value || {}}; this.trigger = BI.createWidget({ type: "bi.multi_select_trigger", @@ -44,7 +44,7 @@ BI.MultiTreeCombo = BI.inherit(BI.Single, { type: "bi.multi_tree_searcher", itemsCreator: o.itemsCreator }, - value: { value: o.value || {} } + value: {value: o.value || {}} }); this.combo = BI.createWidget({ @@ -105,9 +105,10 @@ BI.MultiTreeCombo = BI.inherit(BI.Single, { maxWidth: o.isNeedAdjustWidth ? "auto" : 500, }, isNeedAdjustWidth: o.isNeedAdjustWidth, - value: { value: o.value || {} }, + value: {value: o.value || {}}, hideChecker: function (e) { - return self.numberCounter.element.find(e.target).length === 0; + return triggerBtn.element.find(e.target).length === 0 && + self.numberCounter.element.find(e.target).length === 0; } }); @@ -130,12 +131,12 @@ BI.MultiTreeCombo = BI.inherit(BI.Single, { }); this.trigger.on(BI.MultiSelectTrigger.EVENT_START, function () { - self.storeValue = { value: self.combo.getValue() }; + self.storeValue = {value: self.combo.getValue()}; this.setValue(self.storeValue); self.numberCounter.setValue(self.storeValue); }); this.trigger.on(BI.MultiSelectTrigger.EVENT_STOP, function () { - self.storeValue = { value: this.getValue() }; + self.storeValue = {value: this.getValue()}; self.combo.setValue(self.storeValue); self.numberCounter.setValue(self.storeValue); BI.nextTick(function () { @@ -150,11 +151,11 @@ BI.MultiTreeCombo = BI.inherit(BI.Single, { self.fireEvent(BI.MultiTreeCombo.EVENT_SEARCHING); }); - function showCounter() { + function showCounter () { if (isSearching()) { - self.storeValue = { value: self.trigger.getValue() }; + self.storeValue = {value: self.trigger.getValue()}; } else if (isPopupView()) { - self.storeValue = { value: self.combo.getValue() }; + self.storeValue = {value: self.combo.getValue()}; } self.trigger.setValue(self.storeValue); self.numberCounter.setValue(self.storeValue); @@ -173,7 +174,7 @@ BI.MultiTreeCombo = BI.inherit(BI.Single, { var checked = this.getSearcher().hasChecked(); var val = { type: BI.Selection.Multi, - value: checked ? { 1: 1 } : {} + value: checked ? {1: 1} : {} }; this.getSearcher().setState(checked ? BI.Selection.Multi : BI.Selection.None); self.numberCounter.setButtonChecked(val); @@ -185,7 +186,7 @@ BI.MultiTreeCombo = BI.inherit(BI.Single, { return; } if (change === true) { - self.storeValue = { value: self.combo.getValue() }; + self.storeValue = {value: self.combo.getValue()}; change = false; } self.combo.setValue(self.storeValue); @@ -200,9 +201,9 @@ BI.MultiTreeCombo = BI.inherit(BI.Single, { } else { if (isPopupView()) { self._stopEditing(); - self.storeValue = { value: self.combo.getValue() }; + self.storeValue = {value: self.combo.getValue()}; if (clear === true) { - self.storeValue = { value: {} }; + self.storeValue = {value: {}}; } self.fireEvent(BI.MultiTreeCombo.EVENT_CONFIRM); } @@ -211,6 +212,21 @@ BI.MultiTreeCombo = BI.inherit(BI.Single, { change = false; }); + var triggerBtn = BI.createWidget({ + type: "bi.trigger_icon_button", + width: o.height, + height: o.height, + cls: "multi-select-trigger-icon-button" + }); + triggerBtn.on(BI.TriggerIconButton.EVENT_CHANGE, function () { + self.numberCounter.hideView(); + if (self.combo.isViewVisible()) { + self.combo.hideView(); + } else { + self.combo.showView(); + } + }); + this.numberCounter = BI.createWidget({ type: "bi.multi_select_check_selected_switcher", el: { @@ -229,7 +245,7 @@ BI.MultiTreeCombo = BI.inherit(BI.Single, { }, itemsCreator: o.itemsCreator, valueFormatter: o.valueFormatter, - value: { value: o.value || {} } + value: {value: o.value || {}} }); this.numberCounter.on(BI.MultiSelectCheckSelectedSwitcher.EVENT_TRIGGER_CHANGE, function () { if (!self.combo.isViewVisible()) { @@ -273,6 +289,11 @@ BI.MultiTreeCombo = BI.inherit(BI.Single, { right: 0, top: 0, bottom: 0 + }, { + el: triggerBtn, + right: 0, + top: 0, + bottom: 0 }, { el: { type: "bi.vertical_adapt", @@ -285,7 +306,7 @@ BI.MultiTreeCombo = BI.inherit(BI.Single, { }); }, - _stopEditing: function () { + _stopEditing: function() { this.trigger.stopEditing(); this.numberCounter.hideView(); }, diff --git a/src/widget/multitree/multi.tree.insert.combo.js b/src/widget/multitree/multi.tree.insert.combo.js index 9823b37a7..9694b3556 100644 --- a/src/widget/multitree/multi.tree.insert.combo.js +++ b/src/widget/multitree/multi.tree.insert.combo.js @@ -23,7 +23,7 @@ BI.MultiTreeInsertCombo = BI.inherit(BI.Single, { var isInit = false; var want2showCounter = false; - this.storeValue = { value: o.value || {} }; + this.storeValue = {value: o.value || {}}; this.trigger = BI.createWidget({ type: "bi.multi_select_trigger", @@ -59,7 +59,7 @@ BI.MultiTreeInsertCombo = BI.inherit(BI.Single, { }] } }, - value: { value: o.value || {} } + value: {value: o.value || {}} }); @@ -121,9 +121,10 @@ BI.MultiTreeInsertCombo = BI.inherit(BI.Single, { maxWidth: o.isNeedAdjustWidth ? "auto" : 500, }, isNeedAdjustWidth: o.isNeedAdjustWidth, - value: { value: o.value || {} }, + value: {value: o.value || {}}, hideChecker: function (e) { - return self.numberCounter.element.find(e.target).length === 0; + return triggerBtn.element.find(e.target).length === 0 && + self.numberCounter.element.find(e.target).length === 0; } }); @@ -146,12 +147,12 @@ BI.MultiTreeInsertCombo = BI.inherit(BI.Single, { }); this.trigger.on(BI.MultiSelectTrigger.EVENT_START, function () { - self.storeValue = { value: self.combo.getValue() }; + self.storeValue = {value: self.combo.getValue()}; this.setValue(self.storeValue); self.numberCounter.setValue(self.storeValue); }); this.trigger.on(BI.MultiSelectTrigger.EVENT_STOP, function () { - self.storeValue = { value: this.getValue() }; + self.storeValue = {value: this.getValue()}; self.combo.setValue(self.storeValue); self.numberCounter.setValue(self.storeValue); BI.nextTick(function () { @@ -166,11 +167,11 @@ BI.MultiTreeInsertCombo = BI.inherit(BI.Single, { self.fireEvent(BI.MultiTreeInsertCombo.EVENT_SEARCHING); }); - function showCounter() { + function showCounter () { if (isSearching()) { - self.storeValue = { value: self.trigger.getValue() }; + self.storeValue = {value: self.trigger.getValue()}; } else if (isPopupView()) { - self.storeValue = { value: self.combo.getValue() }; + self.storeValue = {value: self.combo.getValue()}; } self.trigger.setValue(self.storeValue); self.numberCounter.setValue(self.storeValue); @@ -184,7 +185,7 @@ BI.MultiTreeInsertCombo = BI.inherit(BI.Single, { var checked = this.getSearcher().hasChecked(); var val = { type: BI.Selection.Multi, - value: checked ? { 1: 1 } : {} + value: checked ? {1: 1} : {} }; this.getSearcher().setState(checked ? BI.Selection.Multi : BI.Selection.None); self.numberCounter.setButtonChecked(val); @@ -196,7 +197,7 @@ BI.MultiTreeInsertCombo = BI.inherit(BI.Single, { return; } if (change === true) { - self.storeValue = { value: self.combo.getValue() }; + self.storeValue = {value: self.combo.getValue()}; change = false; } self.combo.setValue(self.storeValue); @@ -211,9 +212,9 @@ BI.MultiTreeInsertCombo = BI.inherit(BI.Single, { } else { if (isPopupView()) { self._stopEditing(); - self.storeValue = { value: self.combo.getValue() }; + self.storeValue = {value: self.combo.getValue()}; if (clear === true) { - self.storeValue = { value: {} }; + self.storeValue = {value: {}}; } self.fireEvent(BI.MultiTreeInsertCombo.EVENT_CONFIRM); } @@ -222,6 +223,21 @@ BI.MultiTreeInsertCombo = BI.inherit(BI.Single, { change = false; }); + var triggerBtn = BI.createWidget({ + type: "bi.trigger_icon_button", + width: o.height, + height: o.height, + cls: "multi-select-trigger-icon-button" + }); + triggerBtn.on(BI.TriggerIconButton.EVENT_CHANGE, function () { + self.numberCounter.hideView(); + if (self.combo.isViewVisible()) { + self.combo.hideView(); + } else { + self.combo.showView(); + } + }); + this.numberCounter = BI.createWidget({ type: "bi.multi_select_check_selected_switcher", el: { @@ -284,6 +300,11 @@ BI.MultiTreeInsertCombo = BI.inherit(BI.Single, { right: 0, top: 0, bottom: 0 + }, { + el: triggerBtn, + right: 0, + top: 0, + bottom: 0 }, { el: { type: "bi.vertical_adapt", @@ -301,7 +322,7 @@ BI.MultiTreeInsertCombo = BI.inherit(BI.Single, { this.numberCounter.setButtonChecked(this.storeValue); }, - _stopEditing: function () { + _stopEditing: function() { this.trigger.stopEditing(); this.numberCounter.hideView(); }, diff --git a/src/widget/multitree/multi.tree.list.combo.js b/src/widget/multitree/multi.tree.list.combo.js index 2a378b1ae..ff5a2864a 100644 --- a/src/widget/multitree/multi.tree.list.combo.js +++ b/src/widget/multitree/multi.tree.list.combo.js @@ -23,7 +23,7 @@ BI.MultiTreeListCombo = BI.inherit(BI.Single, { var isInit = false; var want2showCounter = false; - this.storeValue = { value: o.value || [] }; + this.storeValue = {value: o.value || []}; this.trigger = BI.createWidget({ type: "bi.multi_select_trigger", @@ -74,7 +74,7 @@ BI.MultiTreeListCombo = BI.inherit(BI.Single, { itemsCreator: o.itemsCreator } }, - value: { value: o.value || {} } + value: {value: o.value || {}} }); @@ -139,9 +139,10 @@ BI.MultiTreeListCombo = BI.inherit(BI.Single, { maxWidth: o.isNeedAdjustWidth ? "auto" : 500, }, isNeedAdjustWidth: o.isNeedAdjustWidth, - value: { value: o.value || {} }, + value: {value: o.value || {}}, hideChecker: function (e) { - return self.numberCounter.element.find(e.target).length === 0; + return triggerBtn.element.find(e.target).length === 0 && + self.numberCounter.element.find(e.target).length === 0; } }); @@ -164,12 +165,12 @@ BI.MultiTreeListCombo = BI.inherit(BI.Single, { }); this.trigger.on(BI.MultiSelectTrigger.EVENT_START, function () { - self.storeValue = { value: self.combo.getValue() }; + self.storeValue = {value: self.combo.getValue()}; this.setValue(self.storeValue); self.numberCounter.setValue(self.storeValue); }); this.trigger.on(BI.MultiSelectTrigger.EVENT_STOP, function () { - self.storeValue = { value: this.getValue() }; + self.storeValue = {value: this.getValue()}; self.combo.setValue(self.storeValue); self.numberCounter.setValue(self.storeValue); BI.nextTick(function () { @@ -184,11 +185,11 @@ BI.MultiTreeListCombo = BI.inherit(BI.Single, { self.fireEvent(BI.MultiTreeListCombo.EVENT_SEARCHING); }); - function showCounter() { + function showCounter () { if (isSearching()) { - self.storeValue = { value: self.trigger.getValue() }; + self.storeValue = {value: self.trigger.getValue()}; } else if (isPopupView()) { - self.storeValue = { value: self.combo.getValue() }; + self.storeValue = {value: self.combo.getValue()}; } self.trigger.setValue(self.storeValue); self.numberCounter.setValue(self.storeValue); @@ -202,7 +203,7 @@ BI.MultiTreeListCombo = BI.inherit(BI.Single, { var checked = this.getSearcher().hasChecked(); var val = { type: BI.Selection.Multi, - value: checked ? { 1: 1 } : {} + value: checked ? {1: 1} : {} }; this.getSearcher().setState(checked ? BI.Selection.Multi : BI.Selection.None); self.numberCounter.setButtonChecked(val); @@ -214,7 +215,7 @@ BI.MultiTreeListCombo = BI.inherit(BI.Single, { return; } if (change === true) { - self.storeValue = { value: self.combo.getValue() }; + self.storeValue = {value: self.combo.getValue()}; change = false; } self.combo.setValue(self.storeValue); @@ -229,9 +230,9 @@ BI.MultiTreeListCombo = BI.inherit(BI.Single, { } else { if (isPopupView()) { self._stopEditing(); - self.storeValue = { value: self.combo.getValue() }; + self.storeValue = {value: self.combo.getValue()}; if (clear === true) { - self.storeValue = { value: [] }; + self.storeValue = {value: []}; } self.fireEvent(BI.MultiTreeListCombo.EVENT_CONFIRM); } @@ -240,6 +241,21 @@ BI.MultiTreeListCombo = BI.inherit(BI.Single, { change = false; }); + var triggerBtn = BI.createWidget({ + type: "bi.trigger_icon_button", + width: o.height, + height: o.height, + cls: "multi-select-trigger-icon-button" + }); + triggerBtn.on(BI.TriggerIconButton.EVENT_CHANGE, function () { + self.numberCounter.hideView(); + if (self.combo.isViewVisible()) { + self.combo.hideView(); + } else { + self.combo.showView(); + } + }); + this.numberCounter = BI.createWidget({ type: "bi.multi_select_check_selected_switcher", el: { @@ -302,6 +318,11 @@ BI.MultiTreeListCombo = BI.inherit(BI.Single, { right: 0, top: 0, bottom: 0 + }, { + el: triggerBtn, + right: 0, + top: 0, + bottom: 0 }, { el: { type: "bi.vertical_adapt", @@ -319,7 +340,7 @@ BI.MultiTreeListCombo = BI.inherit(BI.Single, { this.numberCounter.setButtonChecked(this.storeValue); }, - _stopEditing: function () { + _stopEditing: function() { this.trigger.stopEditing(); this.numberCounter.hideView(); },