Browse Source

BI-79763 调整popup弹出时的位置显示 && 多层级downlist选中问题

es6
windy 4 years ago
parent
commit
59f57aec0f
  1. 3
      changelog.md
  2. 83
      src/core/platform/web/dom.js
  3. 8
      src/widget/downlist/item.downlistgroup.js

3
changelog.md

@ -1,4 +1,7 @@
# 更新日志 # 更新日志
2.0(2021-01)
- 调整了combo的popup显示位置计算逻辑
2.0(2020-12) 2.0(2020-12)
- multi_layer_down_list_combo支持无限层级 - multi_layer_down_list_combo支持无限层级
- 新增不带全选的同步复选下拉框 - 新增不带全选的同步复选下拉框

83
src/core/platform/web/dom.js

@ -380,18 +380,30 @@
return windowBounds.height - combo.element.offset().top - combo.element.bounds().height >= combo.element.offset().top; return windowBounds.height - combo.element.offset().top - combo.element.bounds().height >= combo.element.offset().top;
}, },
getLeftAlignPosition: function (combo, popup, extraWidth) { _getLeftAlignPosition: function (combo, popup, extraWidth) {
var viewBounds = popup.element.bounds(), var viewBounds = popup.element.bounds(),
windowBounds = BI.Widget._renderEngine.createElement("body").bounds(); windowBounds = BI.Widget._renderEngine.createElement("body").bounds();
var left = combo.element.offset().left + extraWidth; var left = combo.element.offset().left + extraWidth;
if (left + viewBounds.width > windowBounds.width) { if (left + viewBounds.width > windowBounds.width) {
left = windowBounds.width - viewBounds.width; left = windowBounds.width - viewBounds.width;
} }
return left;
},
getLeftAlignPosition: function (combo, popup, extraWidth) {
var left = this._getLeftAlignPosition(combo, popup, extraWidth);
var dir = "";
// 如果放不下,优先使用RightAlign, 如果RightAlign也放不下, 再使用left=0
if (left < 0) {
left = this._getRightAlignPosition(combo, popup, extraWidth);
dir = "left";
}
if (left < 0) { if (left < 0) {
left = 0; left = 0;
} }
return { return {
left: left left: left,
dir: dir || "right"
}; };
}, },
@ -404,14 +416,25 @@
}; };
}, },
getRightAlignPosition: function (combo, popup, extraWidth) { _getRightAlignPosition: function (combo, popup, extraWidth) {
var comboBounds = combo.element.bounds(), viewBounds = popup.element.bounds(); var comboBounds = combo.element.bounds(), viewBounds = popup.element.bounds();
var left = combo.element.offset().left + comboBounds.width - viewBounds.width - extraWidth; return combo.element.offset().left + comboBounds.width - viewBounds.width - extraWidth;
},
getRightAlignPosition: function (combo, popup, extraWidth) {
var left = this._getRightAlignPosition(combo, popup, extraWidth);
var dir = "";
// 如果放不下,优先使用LeftAlign, 如果LeftAlign也放不下, 再使用left=0
if (left < 0) {
left = this._getLeftAlignPosition(combo, popup, extraWidth);
dir = "right";
}
if (left < 0) { if (left < 0) {
left = 0; left = 0;
} }
return { return {
left: left left: left,
dir: dir || "left"
}; };
}, },
@ -428,12 +451,16 @@
var comboOffset = combo.element.offset(); var comboOffset = combo.element.offset();
var comboBounds = combo.element.bounds(), popupBounds = popup.element.bounds(), var comboBounds = combo.element.bounds(), popupBounds = popup.element.bounds(),
windowBounds = BI.Widget._renderEngine.createElement("body").bounds(); windowBounds = BI.Widget._renderEngine.createElement("body").bounds();
var top, adaptHeight; var top, adaptHeight, dir;
if (BI.DOM.isBottomSpaceEnough(combo, popup, -1 * comboBounds.height + extraHeight)) { if (BI.DOM.isBottomSpaceEnough(combo, popup, -1 * comboBounds.height + extraHeight)) {
top = comboOffset.top + extraHeight; top = comboOffset.top + extraHeight;
} else if (needAdaptHeight) { } else if (needAdaptHeight) {
top = comboOffset.top + extraHeight; top = comboOffset.top + extraHeight;
adaptHeight = windowBounds.height - top; adaptHeight = windowBounds.height - top;
} else if (BI.DOM.isTopSpaceEnough(combo, popup, -1 * comboBounds.height + extraHeight)) {
// 下方空间不足且不允许调整高度的情况下,优先使用上对齐
top = comboOffset.top + comboBounds.height - popupBounds.height - extraHeight;
dir = "top";
} else { } else {
top = windowBounds.height - popupBounds.height; top = windowBounds.height - popupBounds.height;
if (top < extraHeight) { if (top < extraHeight) {
@ -445,9 +472,11 @@
} }
return adaptHeight ? { return adaptHeight ? {
top: top, top: top,
adaptHeight: adaptHeight adaptHeight: adaptHeight,
dir: dir || "bottom"
} : { } : {
top: top top: top,
dir: dir || "bottom"
}; };
}, },
@ -478,12 +507,16 @@
var comboOffset = combo.element.offset(); var comboOffset = combo.element.offset();
var comboBounds = combo.element.bounds(), popupBounds = popup.element.bounds(), var comboBounds = combo.element.bounds(), popupBounds = popup.element.bounds(),
windowBounds = BI.Widget._renderEngine.createElement("body").bounds(); windowBounds = BI.Widget._renderEngine.createElement("body").bounds();
var top, adaptHeight; var top, adaptHeight, dir;
if (BI.DOM.isTopSpaceEnough(combo, popup, -1 * comboBounds.height + extraHeight)) { if (BI.DOM.isTopSpaceEnough(combo, popup, -1 * comboBounds.height + extraHeight)) {
top = comboOffset.top + comboBounds.height - popupBounds.height - extraHeight; top = comboOffset.top + comboBounds.height - popupBounds.height - extraHeight;
} else if (needAdaptHeight) { } else if (needAdaptHeight) {
top = 0; top = 0;
adaptHeight = comboOffset.top + comboBounds.height - extraHeight; adaptHeight = comboOffset.top + comboBounds.height - extraHeight;
} else if (BI.DOM.isBottomSpaceEnough(combo, popup, -1 * comboBounds.height + extraHeight)) {
// 上方空间不足且不允许调整高度的情况下,优先使用下对齐
top = comboOffset.top + extraHeight;
dir = "bottom";
} else { } else {
top = 0; top = 0;
if (popupBounds.height + extraHeight > windowBounds.height) { if (popupBounds.height + extraHeight > windowBounds.height) {
@ -495,9 +528,11 @@
} }
return adaptHeight ? { return adaptHeight ? {
top: top, top: top,
adaptHeight: adaptHeight adaptHeight: adaptHeight,
dir: dir || "top"
} : { } : {
top: top top: top,
dir: dir || "top"
}; };
}, },
@ -601,11 +636,10 @@
left = BI.DOM.getLeftPosition(combo, popup, tW).left; left = BI.DOM.getLeftPosition(combo, popup, tW).left;
if (topBottom[0] === "bottom") { if (topBottom[0] === "bottom") {
pos = BI.DOM.getTopAlignPosition(combo, popup, tH, needAdaptHeight); pos = BI.DOM.getTopAlignPosition(combo, popup, tH, needAdaptHeight);
pos.dir = "left,bottom";
} else { } else {
pos = BI.DOM.getBottomAlignPosition(combo, popup, tH, needAdaptHeight); pos = BI.DOM.getBottomAlignPosition(combo, popup, tH, needAdaptHeight);
pos.dir = "left,top";
} }
pos.dir = "left," + pos.dir;
if (tbFirst) { if (tbFirst) {
pos.change = "left"; pos.change = "left";
} }
@ -622,11 +656,10 @@
left = BI.DOM.getRightPosition(combo, popup, tW).left; left = BI.DOM.getRightPosition(combo, popup, tW).left;
if (topBottom[0] === "bottom") { if (topBottom[0] === "bottom") {
pos = BI.DOM.getTopAlignPosition(combo, popup, tH, needAdaptHeight); pos = BI.DOM.getTopAlignPosition(combo, popup, tH, needAdaptHeight);
pos.dir = "right,bottom";
} else { } else {
pos = BI.DOM.getBottomAlignPosition(combo, popup, tH, needAdaptHeight); pos = BI.DOM.getBottomAlignPosition(combo, popup, tH, needAdaptHeight);
pos.dir = "right,top";
} }
pos.dir = "right" + pos.dir;
if (tbFirst) { if (tbFirst) {
pos.change = "right"; pos.change = "right";
} }
@ -642,11 +675,10 @@
top = BI.DOM.getTopPosition(combo, popup, tH).top; top = BI.DOM.getTopPosition(combo, popup, tH).top;
if (leftRight[0] === "right") { if (leftRight[0] === "right") {
pos = BI.DOM.getLeftAlignPosition(combo, popup, tW, needAdaptHeight); pos = BI.DOM.getLeftAlignPosition(combo, popup, tW, needAdaptHeight);
pos.dir = "top,right";
} else { } else {
pos = BI.DOM.getRightAlignPosition(combo, popup, tW); pos = BI.DOM.getRightAlignPosition(combo, popup, tW);
pos.dir = "top,left";
} }
pos.dir = "bottom," + pos.dir;
if (lrFirst) { if (lrFirst) {
pos.change = "top"; pos.change = "top";
} }
@ -664,11 +696,10 @@
top = BI.DOM.getBottomPosition(combo, popup, tH).top; top = BI.DOM.getBottomPosition(combo, popup, tH).top;
if (leftRight[0] === "right") { if (leftRight[0] === "right") {
pos = BI.DOM.getLeftAlignPosition(combo, popup, tW, needAdaptHeight); pos = BI.DOM.getLeftAlignPosition(combo, popup, tW, needAdaptHeight);
pos.dir = "bottom,right";
} else { } else {
pos = BI.DOM.getRightAlignPosition(combo, popup, tW); pos = BI.DOM.getRightAlignPosition(combo, popup, tW);
pos.dir = "bottom,left";
} }
pos.dir = "bottom," + pos.dir;
if (lrFirst) { if (lrFirst) {
pos.change = "bottom"; pos.change = "bottom";
} }
@ -687,11 +718,10 @@
left = BI.DOM.getInnerLeftPosition(combo, popup, tW).left; left = BI.DOM.getInnerLeftPosition(combo, popup, tW).left;
if (topBottom[0] === "bottom") { if (topBottom[0] === "bottom") {
pos = BI.DOM.getTopAlignPosition(combo, popup, tH, needAdaptHeight); pos = BI.DOM.getTopAlignPosition(combo, popup, tH, needAdaptHeight);
pos.dir = "innerLeft,bottom";
} else { } else {
pos = BI.DOM.getBottomAlignPosition(combo, popup, tH, needAdaptHeight); pos = BI.DOM.getBottomAlignPosition(combo, popup, tH, needAdaptHeight);
pos.dir = "innerLeft,top";
} }
pos.dir = "innerLeft" + pos.dir;
if (tbFirst) { if (tbFirst) {
pos.change = "innerLeft"; pos.change = "innerLeft";
} }
@ -708,11 +738,10 @@
left = BI.DOM.getInnerRightPosition(combo, popup, tW).left; left = BI.DOM.getInnerRightPosition(combo, popup, tW).left;
if (topBottom[0] === "bottom") { if (topBottom[0] === "bottom") {
pos = BI.DOM.getTopAlignPosition(combo, popup, tH, needAdaptHeight); pos = BI.DOM.getTopAlignPosition(combo, popup, tH, needAdaptHeight);
pos.dir = "innerRight,bottom";
} else { } else {
pos = BI.DOM.getBottomAlignPosition(combo, popup, tH, needAdaptHeight); pos = BI.DOM.getBottomAlignPosition(combo, popup, tH, needAdaptHeight);
pos.dir = "innerRight,top";
} }
pos.dir = "innerLeft" + pos.dir;
if (tbFirst) { if (tbFirst) {
pos.change = "innerRight"; pos.change = "innerRight";
} }
@ -740,12 +769,12 @@
if (topBottom[0] === "bottom") { if (topBottom[0] === "bottom") {
pos = BI.DOM.getTopAlignPosition(combo, popup, extraHeight, needAdaptHeight); pos = BI.DOM.getTopAlignPosition(combo, popup, extraHeight, needAdaptHeight);
pos.left = left; pos.left = left;
pos.dir = firstDir + ",bottom"; pos.dir = firstDir + "," + pos.dir;
return pos; return pos;
} }
pos = BI.DOM.getBottomAlignPosition(combo, popup, extraHeight, needAdaptHeight); pos = BI.DOM.getBottomAlignPosition(combo, popup, extraHeight, needAdaptHeight);
pos.left = left; pos.left = left;
pos.dir = firstDir + ",top"; pos.dir = firstDir + "," + pos.dir;
return pos; return pos;
default : default :
if (BI.DOM.isBottomSpaceLarger(combo)) { if (BI.DOM.isBottomSpaceLarger(combo)) {
@ -758,12 +787,12 @@
if (leftRight[0] === "right") { if (leftRight[0] === "right") {
left = BI.DOM.getLeftAlignPosition(combo, popup, extraWidth, needAdaptHeight).left; left = BI.DOM.getLeftAlignPosition(combo, popup, extraWidth, needAdaptHeight).left;
pos.left = left; pos.left = left;
pos.dir = firstDir + ",right"; pos.dir = firstDir + "," + pos.dir;
return pos; return pos;
} }
left = BI.DOM.getRightAlignPosition(combo, popup, extraWidth).left; left = BI.DOM.getRightAlignPosition(combo, popup, extraWidth).left;
pos.left = left; pos.left = left;
pos.dir = firstDir + ",left"; pos.dir = firstDir + "," + pos.dir;
return pos; return pos;
} }
}, },

8
src/widget/downlist/item.downlistgroup.js

@ -71,11 +71,17 @@ BI.DownListGroupItem = BI.inherit(BI.BasicButton, {
}); });
}, },
_getLevel: function () {
var child = BI.first(this.options.childValues);
return BI.isNotNull(child) ? (child + "").split("_").length : 0;
},
_digest: function (v) { _digest: function (v) {
var self = this, o = this.options; var self = this, o = this.options;
v = BI.isArray(v) ? v : [v]; v = BI.isArray(v) ? v : [v];
var level = this._getLevel();
return BI.any(v, function (idx, value) { return BI.any(v, function (idx, value) {
return BI.contains(o.childValues, value); return BI.contains(o.childValues, (value + "").split("_").slice(0, level).join("_"));
}); });
}, },

Loading…
Cancel
Save