From 28f38d8b8041db5f892b7f377a9403464307e1f3 Mon Sep 17 00:00:00 2001
From: jxxghp <jxxghp@gmail.com>
Date: Sat, 5 Jul 2025 16:41:24 +0800
Subject: [PATCH] Fix tab selection on discovery page (#353)

* Fix: Ensure first tab is selected when no valid tab is active

Co-authored-by: jxxghp <jxxghp@163.com>

* Fix discover page tab selection logic when no tab is active

Co-authored-by: jxxghp <jxxghp@163.com>

* Fix tab selection logic in discover page lifecycle hooks

Co-authored-by: jxxghp <jxxghp@163.com>

* Remove unnecessary onMounted hook in discover page

Co-authored-by: jxxghp <jxxghp@163.com>

* Move dynamic header tab registration after tabs initialization

Co-authored-by: jxxghp <jxxghp@163.com>

* Refactor dynamic header tab registration in discover page

Co-authored-by: jxxghp <jxxghp@163.com>

* Fix tab selection logic in discover page to ensure first tab is selected

Co-authored-by: jxxghp <jxxghp@163.com>

* Update useDynamicHeaderTab to sync modelValue in tab configuration

Co-authored-by: jxxghp <jxxghp@163.com>

* Remove auto-tab selection logic from discover page

Co-authored-by: jxxghp <jxxghp@163.com>

---------

Co-authored-by: Cursor Agent <cursoragent@cursor.com>
---
 src/composables/useDynamicHeaderTab.ts |  2 ++
 src/pages/discover.vue                 | 17 ++++++++++++-----
 2 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/src/composables/useDynamicHeaderTab.ts b/src/composables/useDynamicHeaderTab.ts
index 708c68ea..3ebc79ec 100644
--- a/src/composables/useDynamicHeaderTab.ts
+++ b/src/composables/useDynamicHeaderTab.ts
@@ -91,6 +91,8 @@ export function useDynamicHeaderTab() {
       tabConfig.routePath = route.path
       // 确保items是最新的
       tabConfig.items = Array.isArray(config.items) ? config.items : config.items.value
+      // 确保modelValue是最新的
+      tabConfig.modelValue = config.modelValue.value
 
       if (registerDynamicHeaderTab) {
         registerDynamicHeaderTab(tabConfig)
diff --git a/src/pages/discover.vue b/src/pages/discover.vue
index 1be59c47..8849bd1b 100644
--- a/src/pages/discover.vue
+++ b/src/pages/discover.vue
@@ -123,9 +123,9 @@ async function saveTabOrder() {
 // 使用动态标签页
 const { registerHeaderTab } = useDynamicHeaderTab()
 
-// 注册动态标签页
+// 注册动态标签页（在setup阶段，但使用computed保证响应性）
 registerHeaderTab({
-  items: discoverTabItems, // 传递computed值，而不是.value
+  items: discoverTabItems, // 传递computed值，会自动响应变化
   modelValue: activeTab,
   appendButtons: [
     {
@@ -145,18 +145,25 @@ onBeforeMount(async () => {
   await loadOrderConfig()
   await loadExtraDiscoverSources()
   sortSubscribeOrder()
-})
-
-onMounted(() => {
   // 选中第一个标签页
   if (discoverTabs.value.length > 0) {
     activeTab.value = discoverTabs.value[0].mediaid_prefix
   }
 })
 
+
+
+
+
 onActivated(async () => {
   await loadExtraDiscoverSources()
   sortSubscribeOrder()
+  // 如果当前没有选中任何标签页，或者当前选中的标签页不存在，则选中第一个标签页
+  if (!activeTab.value || !discoverTabs.value.find(tab => tab.mediaid_prefix === activeTab.value)) {
+    if (discoverTabs.value.length > 0) {
+      activeTab.value = discoverTabs.value[0].mediaid_prefix
+    }
+  }
 })
 </script>