退出登录按钮与侧边栏优化

src/layout/Layout.vue

@@ -15,7 +15,7 @@
         class="sidebar-menu"
         background-color="transparent"
         router
-        :default-active="currentRoutePath"
+        :default-active="lastActivePath"
         :unique-opened="true"
       >
         <el-sub-menu 
@@ -44,6 +44,11 @@
           </el-menu-item>
         </el-sub-menu>
       </el-menu>
+
+      <div class="sidebar-logout" @click="handleLogout">
+        <el-icon style="bottom: -3px; "><SwitchButton /></el-icon>
+        退出登录
+      </div>
     </el-aside>
 
     <!-- 主页面 -->
@@ -54,8 +59,9 @@
 </template>
 
 <script setup>
-import { computed } from 'vue'
+import { computed, ref, watch } from 'vue'
 import { useRouter, useRoute } from 'vue-router'
+import { ElMessage } from 'element-plus';
 
 const router = useRouter()
 const route = useRoute()
@@ -85,8 +91,45 @@ const filteredSidebarRoutes = computed(() => {
   }).filter(parentRoute => parentRoute.filteredChildren.length > 0);
 });
 
-// 计算当前路由的绝对路径
-const currentRoutePath = computed(() => route.path);
+// 计算所有侧边栏有效菜单集合
+const validMenuIndexes = computed(() => {
+  const indexes = [];
+  filteredSidebarRoutes.value.forEach(parentRoute => {
+    // 收集父菜单
+    indexes.push(`/${parentRoute.path}`);
+    // 收集子菜单
+    parentRoute.filteredChildren.forEach(childRoute => {
+      indexes.push(`/${parentRoute.path}/${childRoute.path}`);
+    });
+  });
+  return indexes;
+});
+
+// 存储最后一次选中的「有效侧边栏路径」
+const lastActivePath = ref('');
+
+// 初始化+监听路由变化，更新最后有效路径
+watch(
+  () => route.path, // 监听当前路由路径变化
+  (newPath) => {
+    // 如果新路由是侧边栏有效路径，更新，否则不跟新
+    if (validMenuIndexes.value.includes(newPath)) {
+      lastActivePath.value = newPath;
+    }
+  },
+  { immediate: true } // 初始化时立即执行一次
+);
+
+// 退出登录
+const handleLogout = () => {
+  try {
+    localStorage.removeItem('token');
+    router.push('/login');
+    ElMessage.success('退出登录成功');
+  } catch (error) {
+    ElMessage.error('退出登录失败，请重试');
+  }
+};
 </script>
 
 <style scoped>
@@ -229,4 +272,27 @@ const currentRoutePath = computed(() => route.path);
 .el-menu--vertical .el-menu-item {
   width: 300px !important;
 }
+
+/* 退出登录 */
+.sidebar-logout {
+  position: absolute;
+  bottom: 30px; 
+  left: 30%;
+  
+  color: #1f0303;
+  font-family: "PingFang SC", sans-serif;
+  font-size: 21.06px;
+  font-style: normal;
+  font-weight: 700;
+  line-height: 33.1px;
+  
+  cursor: pointer; 
+  user-select: none;
+  transition: color 0.2s ease; 
+}
+
+/* 退出登录hover效果 */
+.sidebar-logout:hover {
+  color: #FF0000;
+}
 </style>

src/router/index.js

@@ -81,11 +81,6 @@ const router = createRouter({
 
 // 全局前置守卫
 router.beforeEach((to, from, next) => {
-  // 设置页面标题
-  if (to.meta.title) {
-    document.title = to.meta.title
-  }
-
   // 登录状态判断
   const token = localStorage.getItem('token')