优化布局组件，新增首页导航功能，改进路由管理，增强用户交互体验

src/components/layout/Header.vue

@@ -1,8 +1,10 @@
 <script setup lang="ts">
 import { computed } from "vue";
+import { useRouter } from "vue-router";
 import { useUserStore } from "@/store/user";
 
 const userStore = useUserStore();
+const router = useRouter();
 const isLoggedIn = computed(() => !!userStore.token);
 
 defineProps<{
@@ -10,6 +12,10 @@ defineProps<{
 }>();
 
 const emit = defineEmits(["show-login", "switch-tab"]);
+
+const goToHome = () => {
+  router.push("/");
+};
 </script>
 
 <template>
@@ -20,7 +26,10 @@ const emit = defineEmits(["show-login", "switch-tab"]);
       class="max-w-screen-sm mx-auto w-full px-4 pt-[env(safe-area-inset-top)]"
     >
       <div class="flex items-center justify-between py-2">
-        <h1 class="text-base font-semibold tracking-tight text-white/90">
+        <h1
+          class="text-base font-semibold tracking-tight text-white/90 cursor-pointer hover:text-white transition"
+          @click="goToHome"
+        >
           {{ title || "探索" }}
         </h1>
         <div class="flex items-center gap-4 text-sm">

src/components/layout/MainLayout.vue

@@ -38,7 +38,7 @@
 
 <script setup lang="ts">
 import { ref, onMounted, onBeforeUnmount, computed, watch } from "vue";
-import { useRoute } from "vue-router";
+import { useRoute, useRouter } from "vue-router";
 import Header from "@/components/layout/Header.vue";
 import Footer from "@/components/layout/Footer.vue";
 import LoginDialog from "@/components/LoginDialog.vue";
@@ -47,6 +47,7 @@ import { useUserStore } from "@/store/user";
 type TabKey = "home" | "purchased" | "account" | "favorite";
 
 const route = useRoute();
+const router = useRouter();
 const active = ref<TabKey>("home");
 const showScrollTop = ref(false);
 const showLoginDialog = ref(false);
@@ -82,7 +83,19 @@ function switchTab(key: TabKey) {
     showLoginDialog.value = true;
     return;
   }
-  // 这里不再需要手动设置active，因为路由变化会自动更新
+
+  // 根据tab跳转到对应路由
+  const routeMap: Record<TabKey, string> = {
+    home: "/",
+    purchased: "/purchased",
+    account: "/account",
+    favorite: "/favorite",
+  };
+
+  const targetRoute = routeMap[key];
+  if (targetRoute && route.path !== targetRoute) {
+    router.push(targetRoute);
+  }
 }
 
 function handleLoginSuccess() {