Browse Source

KERNEL-11647 feat: 下拉框trigger按钮交互行为的统一

es6
zsmj 2 years ago
parent
commit
92a71257d3
  1. 3
      src/base/combination/combo.js
  2. 1
      src/case/combo/bubblecombo/combo.bubble.js
  3. 6
      src/core/constant/events.js
  4. 22
      src/widget/multiselect/multiselect.combo.js
  5. 23
      src/widget/multiselect/multiselect.combo.nobar.js
  6. 12
      src/widget/multiselect/multiselect.trigger.js
  7. 51
      src/widget/multitree/multi.tree.combo.js
  8. 49
      src/widget/multitree/multi.tree.insert.combo.js
  9. 49
      src/widget/multitree/multi.tree.list.combo.js

3
src/base/combination/combo.js

@ -55,6 +55,9 @@
});
this.combo.on(BI.Controller.EVENT_CHANGE, function (type, value, obj) {
if (self.isEnabled() && self.isValid()) {
if (type === BI.Events.TOGGLE) {
self._toggle();
}
if (type === BI.Events.EXPAND) {
self._popupView();
}

1
src/case/combo/bubblecombo/combo.bubble.js

@ -52,6 +52,7 @@ BI.BubbleCombo = BI.inherit(BI.Widget, {
hideChecker: o.hideChecker,
offsetStyle: o.offsetStyle,
showArrow: true,
comboClass: o.comboClass,
el: o.el,
popup: () => BI.extend({
type: "bi.bubble_popup_view",

6
src/core/constant/events.js

@ -143,6 +143,12 @@ _.extend(BI, {
*/
COLLAPSE: "_COLLAPSE",
/**
* @static
* @property 下拉菜单切换展开收起事件
*/
TOGGLE: "_TOGGLE",
/**
* @static
* @property 回调事件

22
src/widget/multiselect/multiselect.combo.js

@ -173,7 +173,7 @@ BI.MultiSelectCombo = BI.inherit(BI.Single, {
},
value: o.value,
hideChecker: function (e) {
return triggerBtn.element.find(e.target).length === 0 && self.numberCounter.element.find(e.target).length === 0;
return self.numberCounter.element.find(e.target).length === 0;
},
});
@ -198,21 +198,6 @@ 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: {
@ -263,11 +248,6 @@ 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",

23
src/widget/multiselect/multiselect.combo.nobar.js

@ -174,8 +174,7 @@ BI.MultiSelectNoBarCombo = BI.inherit(BI.Single, {
value: o.value
},
hideChecker: function (e) {
return triggerBtn.element.find(e.target).length === 0 &&
self.numberCounter.element.find(e.target).length === 0;
return self.numberCounter.element.find(e.target).length === 0;
}
});
@ -200,21 +199,6 @@ BI.MultiSelectNoBarCombo = 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: {
@ -268,11 +252,6 @@ BI.MultiSelectNoBarCombo = BI.inherit(BI.Single, {
right: 0,
top: 0,
bottom: 0
}, {
el: triggerBtn,
right: 0,
top: 0,
bottom: 0
}, {
el: {
type: "bi.vertical_adapt",

12
src/widget/multiselect/multiselect.trigger.js

@ -83,7 +83,15 @@ BI.MultiSelectTrigger = BI.inherit(BI.Trigger, {
el: this.wrapNumberCounter,
width: 0
}, {
el: BI.createWidget(),
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
}]
});
@ -114,7 +122,7 @@ BI.MultiSelectTrigger = BI.inherit(BI.Trigger, {
/**
* 重新调整numberCounter的空白占位符
*/
refreshPlaceHolderWidth: function(width) {
refreshPlaceHolderWidth: function (width) {
this.wrapper.attr("items")[1].width = width;
this.wrapper.resize();
},

51
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,10 +105,9 @@ 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 triggerBtn.element.find(e.target).length === 0 &&
self.numberCounter.element.find(e.target).length === 0;
return self.numberCounter.element.find(e.target).length === 0;
}
});
@ -131,12 +130,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 () {
@ -151,11 +150,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);
@ -174,7 +173,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);
@ -186,7 +185,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);
@ -201,9 +200,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);
}
@ -212,21 +211,6 @@ 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: {
@ -245,7 +229,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()) {
@ -289,11 +273,6 @@ 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",
@ -306,7 +285,7 @@ BI.MultiTreeCombo = BI.inherit(BI.Single, {
});
},
_stopEditing: function() {
_stopEditing: function () {
this.trigger.stopEditing();
this.numberCounter.hideView();
},

49
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,10 +121,9 @@ 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 triggerBtn.element.find(e.target).length === 0 &&
self.numberCounter.element.find(e.target).length === 0;
return self.numberCounter.element.find(e.target).length === 0;
}
});
@ -147,12 +146,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 () {
@ -167,11 +166,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);
@ -185,7 +184,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);
@ -197,7 +196,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);
@ -212,9 +211,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);
}
@ -223,21 +222,6 @@ 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: {
@ -300,11 +284,6 @@ 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",
@ -322,7 +301,7 @@ BI.MultiTreeInsertCombo = BI.inherit(BI.Single, {
this.numberCounter.setButtonChecked(this.storeValue);
},
_stopEditing: function() {
_stopEditing: function () {
this.trigger.stopEditing();
this.numberCounter.hideView();
},

49
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,10 +139,9 @@ 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 triggerBtn.element.find(e.target).length === 0 &&
self.numberCounter.element.find(e.target).length === 0;
return self.numberCounter.element.find(e.target).length === 0;
}
});
@ -165,12 +164,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 () {
@ -185,11 +184,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);
@ -203,7 +202,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);
@ -215,7 +214,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);
@ -230,9 +229,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);
}
@ -241,21 +240,6 @@ 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: {
@ -318,11 +302,6 @@ 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",
@ -340,7 +319,7 @@ BI.MultiTreeListCombo = BI.inherit(BI.Single, {
this.numberCounter.setButtonChecked(this.storeValue);
},
_stopEditing: function() {
_stopEditing: function () {
this.trigger.stopEditing();
this.numberCounter.hideView();
},

Loading…
Cancel
Save