This commit is contained in:
西瓜°
2026-02-17 17:56:15 +08:00
parent f81d25cc4d
commit 4d6f54e9eb
6 changed files with 23 additions and 25 deletions
@@ -55,11 +55,10 @@ export default defineComponent({
function onResize() {
if (triggerRef.value) {
const { width, height, left, top } = triggerRef.value.getBoundingClientRect()
const zoom = parseFloat(getComputedStyle(document.body).zoom) || 1
dropdownPosition.value = {
w: width / zoom,
x: left / zoom,
y: top / zoom + height / zoom + 2,
w: width,
x: left,
y: top + height + 2,
}
}
}
@@ -56,18 +56,17 @@ export default defineComponent({
const dropdownPosition = ref({ x: 0, y: 0, w: 0, z: 0 })
// 下拉框位置
const dropdownStyle = computed<CSSProperties>(() => {
const zoom = parseFloat(getComputedStyle(document.body).zoom) || 1
if (dropdownPosition.value.z == 0) {
return {
left: `${dropdownPosition.value.x / zoom}px`,
top: `${dropdownPosition.value.y / zoom}px`,
width: `${dropdownPosition.value.w / zoom}px`,
left: `${dropdownPosition.value.x}px`,
top: `${dropdownPosition.value.y}px`,
width: `${dropdownPosition.value.w}px`,
}
} else {
return {
left: `${dropdownPosition.value.x / zoom}px`,
bottom: `${dropdownPosition.value.z / zoom}px`,
width: `${dropdownPosition.value.w / zoom}px`,
left: `${dropdownPosition.value.x}px`,
bottom: `${dropdownPosition.value.z}px`,
width: `${dropdownPosition.value.w}px`,
}
}
})
@@ -82,11 +82,10 @@ export default defineComponent({
function onResize() {
if (triggerRef.value) {
const { width, height, left, top } = triggerRef.value.getBoundingClientRect()
const zoom = parseFloat(getComputedStyle(document.body).zoom) || 1
dropdownPosition.value = {
w: width / zoom,
x: left / zoom - 2,
y: (top + height + 2) / zoom,
w: width,
x: left - 2,
y: (top + height + 2),
}
}
}
@@ -80,18 +80,17 @@ export default defineComponent({
const dropdownPosition = ref({ x: 0, y: 0, w: 0, z: 0 })
// 下拉框位置
const dropdownStyle = computed<CSSProperties>(() => {
const zoom = parseFloat(getComputedStyle(document.body).zoom) || 1
if (dropdownPosition.value.z == 0) {
return {
left: `${dropdownPosition.value.x / zoom}px`,
top: `${dropdownPosition.value.y / zoom}px`,
width: `${dropdownPosition.value.w / zoom}px`,
left: `${dropdownPosition.value.x}px`,
top: `${dropdownPosition.value.y}px`,
width: `${dropdownPosition.value.w}px`,
}
} else {
return {
left: `${dropdownPosition.value.x / zoom}px`,
bottom: `${dropdownPosition.value.z / zoom}px`,
width: `${dropdownPosition.value.w / zoom}px`,
left: `${dropdownPosition.value.x}px`,
bottom: `${dropdownPosition.value.z}px`,
width: `${dropdownPosition.value.w}px`,
}
}
})