birdpaper-ui
Version:
一个通用的 vue3 UI组件库。A common vue3 UI component library.
92 lines (91 loc) • 3.5 kB
JavaScript
;
var __defProp = Object.defineProperty;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __publicField = (obj, key, value) => {
__defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
return value;
};
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
class PositionInfo {
constructor() {
__publicField(this, "top", 0);
__publicField(this, "left", 0);
__publicField(this, "width");
}
}
const getPositionData = (el, position, wrapperSize, popupTranslate = [0, 0], popupOffset, autoFitWidth) => {
const rect = el && (el == null ? void 0 : el.getBoundingClientRect());
if (!rect)
return new PositionInfo();
const { top, left, width, height } = rect;
const scrollTop = document.documentElement.scrollTop || 0;
const wrapperWidth = autoFitWidth ? width : wrapperSize.width;
let positionData = new PositionInfo();
switch (position) {
case "top":
positionData = {
top: top + scrollTop - popupOffset - wrapperSize.height + popupTranslate[1] || 0,
left: left + width / 2 - wrapperWidth / 2 + popupTranslate[0] || 0
};
break;
case "bottom":
positionData = {
top: top + height + scrollTop + popupOffset + popupTranslate[1] || 0,
left: left + width / 2 - wrapperWidth / 2 + popupTranslate[0] || 0
};
break;
case "left":
positionData = {
top: top + height / 2 + scrollTop - wrapperSize.height / 2 + popupTranslate[1] || 0,
left: left - popupOffset - wrapperWidth + popupTranslate[0] || 0
};
break;
case "right":
positionData = {
top: top + height / 2 + scrollTop - wrapperSize.height / 2 + popupTranslate[1] || 0,
left: left + width + popupOffset + popupTranslate[0] || 0
};
break;
case "left-top":
positionData = {
top: top + scrollTop - popupOffset - wrapperSize.height + popupTranslate[1] || 0,
left: left + popupTranslate[0] || 0
};
break;
case "left-bottom":
positionData = {
top: top + height + scrollTop + popupOffset + popupTranslate[1] || 0,
left: left + popupTranslate[0] || 0
};
break;
case "right-top":
positionData = {
top: top + scrollTop - popupOffset - wrapperSize.height + popupTranslate[1] || 0,
left: left - wrapperWidth + width + popupTranslate[0] || 0
};
break;
case "right-bottom":
positionData = {
top: top + scrollTop + popupOffset + height + popupTranslate[1] || 0,
left: left - wrapperWidth + width + popupTranslate[0] || 0
};
break;
}
positionData.width = width;
return positionData;
};
const getWrapperSize = (el) => {
el.setAttribute("style", `display:block;opacity:0;visibility: hidden;`);
const { width, height } = el && (el == null ? void 0 : el.getBoundingClientRect());
el.setAttribute("style", `display:none`);
return { width, height };
};
const getWrapperPositionStyle = (top, left, visible, width) => {
let innerStyleStr = `top:${top}px;left:${left}px;display:${visible ? "block" : "none"};`;
width && (innerStyleStr += `width:${width}px`);
return innerStyleStr;
};
exports.PositionInfo = PositionInfo;
exports.getPositionData = getPositionData;
exports.getWrapperPositionStyle = getWrapperPositionStyle;
exports.getWrapperSize = getWrapperSize;