From c756fbddfca4b941c75774793199e3cc3d9ac570 Mon Sep 17 00:00:00 2001
From: zlwu <zlwu@192.168.2.82>
Date: Sat, 25 Jul 2026 18:15:53 +0800
Subject: [PATCH] =?UTF-8?q?fix(web-admin):=20=E5=AF=B9=E9=BD=90=E9=97=A8?=
 =?UTF-8?q?=E6=88=B7=E9=A1=B6=E6=A0=8F=20brand=20=E4=B8=8E=E4=BE=A7?=
 =?UTF-8?q?=E6=A0=8F=E5=8F=B3=E8=BE=B9=E6=A1=86=EF=BC=8C=E5=B9=B6=E4=BF=AE?=
 =?UTF-8?q?=E5=A4=8D=E4=BE=A7=E6=A0=8F=E7=AB=96=E7=BA=BF=E8=A2=AB=E9=81=AE?=
 =?UTF-8?q?=E6=8C=A1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

将侧栏右边框改画在 #app-sidebar 上，内部菜单改为宽度 100%，避免等宽子项盖住边框；顶栏 brand 宽度与侧栏展开宽度对齐。

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 web-admin/src/assets/styles/core/app.scss     |  7 ++++++-
 .../art-menus/art-sidebar-menu/index.vue      | 19 ++++++++++---------
 .../core/layouts/art-portal-header/index.vue  | 16 +++++++++++++---
 web-admin/src/views/index/index.vue           |  4 ++--
 web-admin/src/views/index/style.portal.scss   |  1 +
 5 files changed, 32 insertions(+), 15 deletions(-)

diff --git a/web-admin/src/assets/styles/core/app.scss b/web-admin/src/assets/styles/core/app.scss
index 9522a77b5..15c2924a8 100755
--- a/web-admin/src/assets/styles/core/app.scss
+++ b/web-admin/src/assets/styles/core/app.scss
@@ -1515,9 +1515,14 @@ body {
   background: var(--mint-surface);
 }
 
+.app-layout-portal #app-sidebar {
+  border-right: 1px solid var(--mint-border, #d9e8e2) !important;
+}
+
 .app-layout-portal #app-sidebar .layout-sidebar {
   height: 100%;
-  border-right: 1px solid var(--mint-border) !important;
+  /* 避免与 #app-sidebar 双边框；竖线由 aside 绘制，不会被 .menu-left 盖住 */
+  border-right: none !important;
   background: var(--mint-surface);
 }
 
diff --git a/web-admin/src/components/core/layouts/art-menus/art-sidebar-menu/index.vue b/web-admin/src/components/core/layouts/art-menus/art-sidebar-menu/index.vue
index ad25cf9b5..8152470cc 100644
--- a/web-admin/src/components/core/layouts/art-menus/art-sidebar-menu/index.vue
+++ b/web-admin/src/components/core/layouts/art-menus/art-sidebar-menu/index.vue
@@ -196,7 +196,8 @@
       maxWidth: width,
       flexShrink: '0',
       boxSizing: 'border-box',
-      borderRight: '1px solid var(--mint-border, #d9e8e2)'
+      // 门户：竖线由 #app-sidebar 绘制，避免被内部等宽 .menu-left 盖住
+      borderRight: isPortalMenu.value ? 'none' : '1px solid var(--mint-border, #d9e8e2)'
     } as Record<string, string>
   })
 
@@ -469,18 +470,18 @@
   @use './theme';
 
   .layout-sidebar {
-    // 侧栏容器宽度固定，内部菜单在容器内完整展示
+    // 侧栏容器宽度固定，内部菜单在容器内完整展示（用 100% 避免等宽子项盖住容器右边框）
     .menu-left-open {
-      width: v-bind(menuopenwidth);
-      min-width: v-bind(menuopenwidth);
-      max-width: v-bind(menuopenwidth);
+      width: 100%;
+      min-width: 0;
+      max-width: 100%;
       flex-shrink: 0;
     }
 
     .menu-left-close {
-      width: v-bind(menuclosewidth);
-      min-width: v-bind(menuclosewidth);
-      max-width: v-bind(menuclosewidth);
+      width: 100%;
+      min-width: 0;
+      max-width: 100%;
       flex-shrink: 0;
     }
 
@@ -494,7 +495,7 @@
 
     // 折叠后宽度
     .el-menu--collapse {
-      width: v-bind(menuclosewidth);
+      width: 100%;
     }
   }
 </style>
diff --git a/web-admin/src/components/core/layouts/art-portal-header/index.vue b/web-admin/src/components/core/layouts/art-portal-header/index.vue
index 510ff5d8e..68ecd86ac 100644
--- a/web-admin/src/components/core/layouts/art-portal-header/index.vue
+++ b/web-admin/src/components/core/layouts/art-portal-header/index.vue
@@ -90,7 +90,8 @@
     justify-content: space-between;
     width: 100%;
     height: 56px;
-    padding: 0 var(--mint-content-padding, 24px);
+    /* 左侧无 padding：brand 区与侧栏同宽，右边框才能纵向对齐 */
+    padding: 0 var(--mint-content-padding, 24px) 0 0;
     user-select: none;
     background: var(--mint-primary, #1ca851);
     border-bottom: 1px solid rgba(255, 255, 255, 0.12);
@@ -106,12 +107,18 @@
   }
 
   .portal-header-brand {
+    box-sizing: border-box;
     display: flex;
     flex-shrink: 0;
     gap: 12px;
     align-items: center;
-    margin-right: 4px;
+    /* +1px：与侧栏 #app-sidebar 外边框（内容宽 + 1px border）纵向对齐 */
+    width: calc(var(--app-sidebar-open-width, 270px) + 1px);
+    min-width: calc(var(--app-sidebar-open-width, 270px) + 1px);
+    max-width: calc(var(--app-sidebar-open-width, 270px) + 1px);
+    padding-left: var(--mint-content-padding, 24px);
     padding-right: 16px;
+    overflow: hidden;
     cursor: pointer;
     border-right: 1px solid rgba(255, 255, 255, 0.22);
   }
@@ -121,8 +128,11 @@
   }
 
   .portal-header-title {
-    max-width: 290px;
+    flex: 1;
+    min-width: 0;
     margin: 0;
+    overflow: hidden;
+    text-overflow: ellipsis;
     font-size: 16px;
     font-weight: 700;
     line-height: 1.35;
diff --git a/web-admin/src/views/index/index.vue b/web-admin/src/views/index/index.vue
index f8b78189e..c855148a3 100755
--- a/web-admin/src/views/index/index.vue
+++ b/web-admin/src/views/index/index.vue
@@ -1,11 +1,11 @@
 <!-- 布局容器 -->
 <template>
-  <div v-if="isPortalLayout" class="app-layout app-layout-portal">
+  <div v-if="isPortalLayout" class="app-layout app-layout-portal" :style="appLayoutStyle">
     <div id="app-portal-header">
       <ArtPortalHeader />
     </div>
 
-    <div id="app-portal-body" :style="appLayoutStyle">
+    <div id="app-portal-body">
       <aside id="app-sidebar">
         <ArtSidebarMenu />
       </aside>
diff --git a/web-admin/src/views/index/style.portal.scss b/web-admin/src/views/index/style.portal.scss
index ec574d78f..0fb90c7e6 100644
--- a/web-admin/src/views/index/style.portal.scss
+++ b/web-admin/src/views/index/style.portal.scss
@@ -23,6 +23,7 @@
   #app-sidebar {
     flex-shrink: 0;
     height: 100%;
+    /* 边框画在 aside 上：内部 .menu-left 与侧栏同宽时会盖住 .layout-sidebar 的 border */
     border-right: 1px solid var(--mint-border, #d9e8e2);
     background: var(--mint-surface, #fff);
     box-sizing: border-box;