Browse Source

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

es6
zsmj 2 years ago
parent
commit
b6541eb922
  1. 15
      src/less/widget/multilayerselecttree/multilayerselecttree.combo.less
  2. 86
      src/widget/multilayerselecttree/multilayerselecttree.combo.js
  3. 11
      src/widget/multilayerselecttree/multilayerselecttree.trigger.js

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

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

86
src/widget/multilayerselecttree/multilayerselecttree.combo.js

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

11
src/widget/multilayerselecttree/multilayerselecttree.trigger.js

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

Loading…
Cancel
Save