fix: 🐛 修复菜单选中时，同级非叶子菜单样式展示不对的问题

修复菜单选中时，同级非叶子菜单样式展示不对的问题

src/layouts/components/Menu/BasicMenu.vue

@@ -121,6 +121,7 @@ function resolveFullPath(routePath: string) {
  */
 const onMenuOpen = (index: string) => {
   expandedMenuIndexes.value.push(index);
+  updateParentMenuStyles();
 };
 
 /**
@@ -130,6 +131,7 @@ const onMenuOpen = (index: string) => {
  */
 const onMenuClose = (index: string) => {
   expandedMenuIndexes.value = expandedMenuIndexes.value.filter((item) => item !== index);
+  updateParentMenuStyles();
 };
 
 /**
@@ -164,9 +166,9 @@ watch(
 watch(
   () => currentRoute.path,
   () => {
-    nextTick(() => {
-      updateParentMenuStyles();
-    });
+    // nextTick(() => {
+    //   updateParentMenuStyles();
+    // });
   }
 );
 
@@ -189,12 +191,13 @@ function updateParentMenuStyles() {
 
       // 查找当前激活的菜单项
       const activeMenuItem = menuEl.querySelector(".el-menu-item.is-active");
-
+      console.log("activeMenuItem", activeMenuItem);
       if (activeMenuItem) {
         // 向上查找父级 el-sub-menu 元素
         let parent = activeMenuItem.parentElement;
         while (parent && parent !== menuEl) {
-          if (parent.classList.contains("el-sub-menu")) {
+          if (parent.classList.contains("el-sub-menu") && parent.classList.contains("is-active")) {
+            console.log("parent", parent);
             parent.classList.add("has-active-child");
           }
           parent = parent.parentElement;

src/layouts/components/Menu/components/MenuItem.vue

@@ -194,7 +194,7 @@ html.sidebar-color-blue {
 // 父菜单激活状态样式 - 当子菜单激活时，父菜单显示激活状态
 .el-sub-menu {
   // 当父菜单包含激活子菜单时的样式
-  &.has-active-child .el-sub-menu__title {
+  &.has-active-child > .el-sub-menu__title {
     color: var(--el-color-primary) !important;
     background-color: var(--el-color-primary-light-9) !important;
 
@@ -205,7 +205,7 @@ html.sidebar-color-blue {
 
   // 深色主题下的父菜单激活状态
   html.dark & {
-    &.has-active-child .el-sub-menu__title {
+    &.has-active-child > .el-sub-menu__title {
       color: var(--el-color-primary-light-3) !important;
       background-color: rgba(64, 128, 255, 0.15) !important;
 
@@ -217,7 +217,7 @@ html.sidebar-color-blue {
 
   // 深蓝色侧边栏配色下的父菜单激活状态
   html.sidebar-color-blue & {
-    &.has-active-child .el-sub-menu__title {
+    &.has-active-child > .el-sub-menu__title {
       color: var(--el-color-primary-light-3) !important;
       background-color: rgba(64, 128, 255, 0.2) !important;