任务中心-任务列表

src/views/home/index.vue

@@ -89,7 +89,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted, computed } from "vue";
+import { ref, onMounted, computed, watch } from "vue";
 import { useRouter } from "vue-router";
 import { VueSpinner } from "vue3-spinners";
 import NoData from "@/components/NoData/index.vue";
@@ -101,6 +101,8 @@ const router = useRouter();
 
 const banners = ref<BannerInfo[]>([]);
 const taskList = ref<TaskInfo[]>([]);
+const recommendTasks = ref<TaskInfo[]>([]);
+const normalTasks = ref<TaskInfo[]>([]);
 const activeTab = ref<'recommend' | 'list'>('recommend');
 const loading = ref(false);
 
@@ -122,7 +124,9 @@ const getHomeData = async () => {
     const res = await requestHomeIndex();
     if (res.code === 200) {
       banners.value = res.data.banners || [];
-      taskList.value = res.data.recommendTasks || [];
+      recommendTasks.value = res.data.recommendTasks || [];
+      normalTasks.value = res.data.normalTasks || [];
+      taskList.value = activeTab.value === 'recommend' ? recommendTasks.value : normalTasks.value;
     }
   } catch (e) {
     // 使用模拟数据
@@ -185,6 +189,20 @@ const goInvite = () => router.push('/invite');
 const goTeamIncome = () => router.push('/team-income');
 const goTaskDetail = (id: number) => router.push(`/task/detail/${id}`);
 
+// 切换tab时切换数据源
+watch(activeTab, (val) => {
+  if (val === 'recommend') {
+    taskList.value = recommendTasks.value;
+  } else {
+    // 如果normalTasks已有数据直接用，否则调接口
+    if (normalTasks.value.length > 0) {
+      taskList.value = normalTasks.value;
+    } else {
+      getTaskList();
+    }
+  }
+});
+
 onMounted(() => {
   getHomeData();
 });