修改后台管理界面

Zhibo/admin/src/layout/component/columnsAside.vue

@@ -15,11 +15,7 @@
           <div :class="setColumnsAsidelayout">
             <i :class="'el-icon-' + v.icon"></i>
             <div class="font13">
-              {{
-                v.title && v.title.length >= 4
-                  ? v.title.substr(0, setColumnsAsidelayout === 'columns-vertical' ? 4 : 3)
-                  : v.title
-              }}
+              {{ v.title }}
             </div>
           </div>
         </li>
@@ -194,7 +190,7 @@ export default {
 
 <style scoped lang="scss">
 .layout-columns-aside {
-  width: 80px;
+  width: 140px;
   height: 100%;
   background: var(--prev-bg-columnsMenuBar);
   box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
@@ -259,7 +255,7 @@ export default {
       left: 50%;
       top: 2px;
       height: 50px;
-      width: 65px;
+      width: 125px;
       transform: translateX(-50%);
       z-index: 0;
       transition: 0.3s ease-in-out;

Zhibo/admin/src/layout/component/transverseAside.vue

@@ -13,11 +13,7 @@
         >
           <div :class="setColumnsAsidelayout">
             <div class="font12">
-              {{
-                v.title && v.title.length >= 4
-                  ? v.title.substr(0, setColumnsAsidelayout === 'columns-vertical' ? 4 : 3)
-                  : v.title
-              }}
+              {{ v.title }}
             </div>
           </div>
         </li>

Zhibo/admin/src/store/modules/user.js

@@ -207,6 +207,8 @@ const actions = {
     return new Promise(async (resolve, reject) => {
       let accessRoutes = await roleApi.menuListApi();
       accessRoutes = replaceChildListWithChildren(accessRoutes);
+      // 去除重复菜单（根据path去重）
+      accessRoutes = removeDuplicateMenus(accessRoutes);
       //处理移动端路由
       !Auth.isPhone()
         ? (accessRoutes = accessRoutes.filter((item) => item.path !== '/javaMobile'))
@@ -226,6 +228,22 @@ const actions = {
   },
 };
 
+// 去除重复菜单（根据path去重）
+function removeDuplicateMenus(menus) {
+  const seen = new Set();
+  return menus.filter((menu) => {
+    if (seen.has(menu.path)) {
+      return false;
+    }
+    seen.add(menu.path);
+    // 递归处理子菜单
+    if (menu.children && menu.children.length > 0) {
+      menu.children = removeDuplicateMenus(menu.children);
+    }
+    return true;
+  });
+}
+
 // 递归函数，用于替换 childList 为 children
 function replaceChildListWithChildren(data) {
   return data.map((item) => {

Zhibo/admin/src/theme/app.scss

@@ -70,10 +70,28 @@ body,
     display: flex;
     flex-direction: column;
     overflow-x: hidden !important;
+    width: 240px !important;
+    min-width: 240px !important;
+    flex: 0 0 240px !important;
 
     .el-scrollbar__view {
       overflow: hidden;
     }
+    
+    .el-menu {
+      width: 240px !important;
+    }
+    
+    .el-menu-item,
+    .el-submenu__title {
+      width: 240px !important;
+      
+      span {
+        display: inline-block !important;
+        width: auto !important;
+        white-space: nowrap !important;
+      }
+    }
   }
 
   .layout-header {
@@ -105,7 +123,7 @@ body,
   }
 
   .layout-aside-width-default {
-    width: 206px !important;
+    width: 240px !important;
     transition: width 0.2s ease;
     box-shadow: 1px 1px 4px rgba(0, 21, 41, 0.08);
   }

Zhibo/admin/src/theme/element.scss

@@ -115,6 +115,7 @@
 // 默认样式修改
 .el-menu {
   border-right: none !important;
+  width: 100% !important;
 }
 
 .el-menu-item,
@@ -123,6 +124,16 @@
   line-height: 50px !important;
   color: var(--prev-bg-menuBarColor) !important;
   transition: none !important;
+  white-space: nowrap !important;
+  overflow: visible !important;
+  text-overflow: clip !important;
+  padding-right: 20px !important;
+  
+  span {
+    display: inline !important;
+    white-space: nowrap !important;
+    overflow: visible !important;
+  }
 }
 
 // horizontal 水平方向时