feat: 数据接口的字段对接 与交互对接

src/pages/Discovery/index.vue

@@ -10,9 +10,9 @@
     </view>
 
     <scroll-view class="flex-full border-box min-height-0" scroll-y show-scrollbar="false">
-      <CardSwiper v-if="discoveryCards.length > 0" :list="discoveryCards" @card-click="cardClick" />
+      <CardSwiper v-if="discoveryCards.length > 0" :list="discoveryCards" @didSelectItem="handleCardClick" />
 
-      <QuickQuestions />
+      <QuickQuestions v-if="discoveryQuickQuestions.length > 0" :list="discoveryQuickQuestions" @didSelectItem="handleQuickQuestionClick" />
 
     </scroll-view>
   </view>
@@ -33,37 +33,8 @@ const sceneId = appStore.sceneId || "";
 
 const activeIndex = ref(0);
 const discoveryTabs = ref([]);
-
-const discoveryCards = ref([
-  {
-    title: "卧龙潭漂流",
-    tag: "夏日必玩",
-    desc: "15米极速落差，极致清凉体验。",
-    image: discoveryCover,
-    tabLabel: "卧龙潭",
-  },
-  {
-    title: "峡谷徒步",
-    tag: "清凉徒步",
-    desc: "穿行山谷栈道，沿路都是瀑布与云雾。",
-    image: discoveryCover,
-    tabLabel: "峡谷探秘",
-  },
-  {
-    title: "竹筏观景",
-    tag: "轻松观光",
-    desc: "低头可见鱼群，抬眼就是山水画卷。",
-    image: discoveryCover,
-    tabLabel: "竹筏观景",
-  },
-  {
-    title: "秘境潜游",
-    tag: "人气推荐",
-    desc: "近距离观察水下生态，沉浸感很强。",
-    image: discoveryCover,
-    tabLabel: "秘境潜游",
-  },
-]);
+const discoveryCards = ref([]);
+const discoveryQuickQuestions = ref([]);
 
 /// tabs 切换事件
 const handleTabChange = ({ tab, idx }) => {
@@ -71,11 +42,6 @@ const handleTabChange = ({ tab, idx }) => {
   queryDiscoveryData(tab.id);
 }
 
-/// 卡片点击事件
-const cardClick = (item) => {
-  console.log(JSON.stringify(item));
-};
-
 /// 请求发现页tab数据
 const queryTabsList = async () => {
   const res = await homeTabsData();
@@ -112,7 +78,7 @@ const queryDiscoveryData = async (tabId) => {
 const queryDiscoveryCards = async (tabId) => {
   const res = await homeTabContentData({ tagId: tabId });
   if (res.code === 0) {
-
+    discoveryCards.value = configDataList(res.data);
   }
 }
 
@@ -120,10 +86,35 @@ const queryDiscoveryCards = async (tabId) => {
 const queryQuickQuestionData = async (tabId) => {
   const res = await homeQuickQuestionData({ tagId: tabId });
   if (res.code === 0) {
-    console.log("快速问题列表:", res.data);
+    discoveryQuickQuestions.value = configDataList(res.data);
   }
 }
 
+/// 统一处理接口返回数据结构
+const configDataList = (data) => { 
+  return data.map((item) => ({
+    id: item.id,
+    title: item.tabContent.mainTitle,
+    subTitle: item.tabContent.subTitle,
+    tag: item.tabContent.tag,
+    coverImage: item.tabContent.coverImage,
+    tabContentId: item.tabContent.id,
+    jumpContent: item.tabContent.jumpContent,
+    jumpDesc: item.tabContent.jumpDesc,
+    jumpType: item.tabContent.jumpType,
+  }));
+}
+
+/// 卡片点击事件
+const handleCardClick = (item) => {
+  console.log(JSON.stringify(item));
+};
+
+/// 快速问题点击事件
+const handleQuickQuestionClick = (item) => {
+  console.log(JSON.stringify(item));
+};
+
 /// 组件挂载后请求数据
 onMounted(() => {
   queryTabsList();