From 91bfcf61f44f353dfebc54a57b5b774721de3e9a Mon Sep 17 00:00:00 2001
From: 云 <2163098428@qq.com>
Date: 星期一, 19 十月 2026 09:39:22 +0800
Subject: [PATCH] feat(auth): 更新门户认证页面布局和样式
---
src/packages/@core/ui-kit/menu-ui/src/components/menu.vue | 22 +++++++++++++++-------
1 files changed, 15 insertions(+), 7 deletions(-)
diff --git a/src/packages/@core/ui-kit/menu-ui/src/components/menu.vue b/src/packages/@core/ui-kit/menu-ui/src/components/menu.vue
index fe4c91d..7c8d768 100644
--- a/src/packages/@core/ui-kit/menu-ui/src/components/menu.vue
+++ b/src/packages/@core/ui-kit/menu-ui/src/components/menu.vue
@@ -21,8 +21,8 @@
watchEffect,
} from 'vue';
-import { useNamespace } from '..\..\..\..\composables\src';
-import { Ellipsis } from '..\..\..\..\base\icons\src';
+import { useNamespace } from '../../../../composables/src';
+import { Ellipsis } from '../../../../base/icons/src';
import { useResizeObserver } from '@vueuse/core';
@@ -149,7 +149,7 @@
const computedStyle = getComputedStyle(menuItem);
const marginLeft = Number.parseInt(computedStyle.marginLeft, 10);
const marginRight = Number.parseInt(computedStyle.marginRight, 10);
- return menuItem.offsetWidth + marginLeft + marginRight || 0;
+ return menuItem.getBoundingClientRect().width + marginLeft + marginRight || 0;
}
function calcSliceIndex() {
@@ -163,17 +163,24 @@
(item.nodeName !== '#text' || item.nodeValue),
) as HTMLElement[];
- const moreItemWidth = 46;
const computedMenuStyle = getComputedStyle(menu?.value);
+ const moreItemWidth = Number.parseFloat(computedMenuStyle.getPropertyValue('--menu-overflow-width')) || 46;
const paddingLeft = Number.parseInt(computedMenuStyle.paddingLeft, 10);
const paddingRight = Number.parseInt(computedMenuStyle.paddingRight, 10);
const menuWidth = menu.value?.clientWidth - paddingLeft - paddingRight;
+ // Flexible portal items may fill the entire row. Reserve 鈥渕ore鈥� only when
+ // the complete menu actually overflows, otherwise the final item is hidden.
+ const itemWidths = items.map(calcMenuItemWidth);
+ if (itemWidths.reduce((total, width) => total + width, 0) <= menuWidth + 1) {
+ return -1;
+ }
+
let calcWidth = 0;
let sliceIndex = 0;
- items.forEach((item, index) => {
- calcWidth += calcMenuItemWidth(item);
+ itemWidths.forEach((width, index) => {
+ calcWidth += width;
if (calcWidth <= menuWidth - moreItemWidth) {
sliceIndex = index + 1;
}
@@ -356,7 +363,8 @@
</template>
<SubMenu is-sub-menu-more path="sub-menu-more">
<template #title>
- <Ellipsis class="size-4" />
+ <Ellipsis class="size-4" aria-hidden="true" />
+ <span v-if="overflowLabel" class="menu-overflow-label">{{ overflowLabel }}</span>
</template>
<template v-for="(item, index) in getSlot.slotMore" :key="index">
<component :is="item" />
--
Gitblit v1.9.3