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