From df2f158018a97d77bc5b0554fd8c2f5e3a2b7ea3 Mon Sep 17 00:00:00 2001
From: DEV_DSW <562304744@qq.com>
Date: Wed, 27 May 2026 11:06:30 +0800
Subject: [PATCH] feat: add new components and update UI and type declarations

- add AiTabSwitch component with its image assets and styles
- add Welcome component for welcome text, weather display and notice messages
- update ChatMainList to use new components and add background header layout
- replace custom swiper in NoticeMessage with Vant VanSwipe component
- add Vant Swipe type definitions to components.d.ts
---
 components.d.ts                               |   6 +++
 .../components/AiTabSwitch/images/L_01.png    | Bin
 .../components/AiTabSwitch/images/L_02.png    | Bin
 .../components/AiTabSwitch/images/R_01.png    | Bin
 .../components/AiTabSwitch/images/R_02.png    | Bin
 .../home}/components/AiTabSwitch/index.vue    |   0
 .../components/AiTabSwitch/styles/index.scss  |   0
 .../home/components/ChatMainList/index.vue    |  16 +++++-
 .../home/components/NoticeMessage/index.vue   |  47 ++++++------------
 .../{HomeWelcome => Welcome}/index.vue        |   9 ++--
 10 files changed, 39 insertions(+), 39 deletions(-)
 rename src/{ => pages/home}/components/AiTabSwitch/images/L_01.png (100%)
 rename src/{ => pages/home}/components/AiTabSwitch/images/L_02.png (100%)
 rename src/{ => pages/home}/components/AiTabSwitch/images/R_01.png (100%)
 rename src/{ => pages/home}/components/AiTabSwitch/images/R_02.png (100%)
 rename src/{ => pages/home}/components/AiTabSwitch/index.vue (100%)
 rename src/{ => pages/home}/components/AiTabSwitch/styles/index.scss (100%)
 rename src/pages/home/components/{HomeWelcome => Welcome}/index.vue (93%)

diff --git a/components.d.ts b/components.d.ts
index ed43cf8..3071355 100644
--- a/components.d.ts
+++ b/components.d.ts
@@ -50,6 +50,9 @@ declare module 'vue' {
     VanIcon: typeof import('vant/es')['Icon']
     VanIcons: typeof import('vant/es')['Icons']
     VanPopup: typeof import('vant/es')['Popup']
+    VanSwipe: typeof import('vant/es')['Swipe']
+    VanSwipeItem: typeof import('vant/es')['SwipeItem']
+    VanSwiperItem: typeof import('vant/es')['SwiperItem']
     ZnIcon: typeof import('./src/components/ZnIcon/index.vue')['default']
   }
 }
@@ -94,5 +97,8 @@ declare global {
   const VanIcon: typeof import('vant/es')['Icon']
   const VanIcons: typeof import('vant/es')['Icons']
   const VanPopup: typeof import('vant/es')['Popup']
+  const VanSwipe: typeof import('vant/es')['Swipe']
+  const VanSwipeItem: typeof import('vant/es')['SwipeItem']
+  const VanSwiperItem: typeof import('vant/es')['SwiperItem']
   const ZnIcon: typeof import('./src/components/ZnIcon/index.vue')['default']
 }
\ No newline at end of file
diff --git a/src/components/AiTabSwitch/images/L_01.png b/src/pages/home/components/AiTabSwitch/images/L_01.png
similarity index 100%
rename from src/components/AiTabSwitch/images/L_01.png
rename to src/pages/home/components/AiTabSwitch/images/L_01.png
diff --git a/src/components/AiTabSwitch/images/L_02.png b/src/pages/home/components/AiTabSwitch/images/L_02.png
similarity index 100%
rename from src/components/AiTabSwitch/images/L_02.png
rename to src/pages/home/components/AiTabSwitch/images/L_02.png
diff --git a/src/components/AiTabSwitch/images/R_01.png b/src/pages/home/components/AiTabSwitch/images/R_01.png
similarity index 100%
rename from src/components/AiTabSwitch/images/R_01.png
rename to src/pages/home/components/AiTabSwitch/images/R_01.png
diff --git a/src/components/AiTabSwitch/images/R_02.png b/src/pages/home/components/AiTabSwitch/images/R_02.png
similarity index 100%
rename from src/components/AiTabSwitch/images/R_02.png
rename to src/pages/home/components/AiTabSwitch/images/R_02.png
diff --git a/src/components/AiTabSwitch/index.vue b/src/pages/home/components/AiTabSwitch/index.vue
similarity index 100%
rename from src/components/AiTabSwitch/index.vue
rename to src/pages/home/components/AiTabSwitch/index.vue
diff --git a/src/components/AiTabSwitch/styles/index.scss b/src/pages/home/components/AiTabSwitch/styles/index.scss
similarity index 100%
rename from src/components/AiTabSwitch/styles/index.scss
rename to src/pages/home/components/AiTabSwitch/styles/index.scss
diff --git a/src/pages/home/components/ChatMainList/index.vue b/src/pages/home/components/ChatMainList/index.vue
index 038d56e..8a42f6b 100644
--- a/src/pages/home/components/ChatMainList/index.vue
+++ b/src/pages/home/components/ChatMainList/index.vue
@@ -4,6 +4,18 @@
     <div class="absolute top-0 left-0 w-full z-10">
       <ChatTopNavBar ref="topNavBarRef" :mainPageDataModel="mainPageDataModel" @showDrawer="handleShowDrawer" />
     </div>
+
+    <div class="relative">
+      <img class="w-full block" :src="mainPageDataModel?.initPageImages?.backgroundImageUrl" style="height: 252px;" />
+      <div class="absolute bottom-0 left-0 right-0 flex-1">
+        <div class="px-12 pt-12">
+          <Welcome :mainPageDataModel="mainPageDataModel" />
+        </div>
+        <div style="margin-bottom: -1px;">
+          <AiTabSwitch v-model="tabIndex" :list="tabList" @change="handleChange" />
+        </div>
+      </div>
+    </div>
   </div>
 </template>
 
@@ -11,8 +23,8 @@
 import { onMounted, nextTick, onUnmounted, ref } from "vue";
 import { MessageRole, MessageType, CompName, Command } from "@/constants/ChatModel";
 
-import HomeWelcome from "../HomeWelcome/index.vue";
-import AiTabSwitch from "@/components/AiTabSwitch/index.vue";
+import Welcome from "../Welcome/index.vue";
+import AiTabSwitch from "../AiTabSwitch/index.vue";
 import Discovery from "../Discovery/index.vue";
 import ChatGuide from "../ChatGuide/index.vue";
 
diff --git a/src/pages/home/components/NoticeMessage/index.vue b/src/pages/home/components/NoticeMessage/index.vue
index c1f2e30..d561dbb 100644
--- a/src/pages/home/components/NoticeMessage/index.vue
+++ b/src/pages/home/components/NoticeMessage/index.vue
@@ -1,34 +1,28 @@
 <template>
   <div v-if="hasBannerList">
-    <swiper @change="onSwiperChange" class="swiper" circular :autoplay="autoplay" :interval="interval"
-      :duration="duration" :indicator-dots="false">
-      <swiper-item v-for="item in bannerList" :key="item.entityName">
-        <div class="swiper-item flex flex-col flex-items-start flex-justify-between px-10" @click="clickItem(item)">
-          <span class="text-color font-size-12 font-600">
+    <van-swipe class="h-[50px] mt-[8px]" loop vertical :autoplay="autoplay" @change="onSwiperChange">
+      <van-swipe-item v-for="item in bannerList" :key="item.entityName">
+        <div class="swiper-item bg-white flex flex-col items-start justify-between px-10" @click="clickItem(item)">
+          <span class="text-[#0CCD58] text-[12px] text-[600]">
             {{ item.entityName }}
           </span>
-          <div class="flex flex-row flex-justify-between">
-            <span class="text-color font-size-10 font-500">
+          <div class="flex flex-row justify-between">
+            <span class="text-[#0CCD58] text-[10px] text-[500]">
               发布时间：{{ item.effectiveStartTime }}
             </span>
-            <text class="text-color font-size-10 font-500 underline-text">
+            <span class="text-[#0CCD58] text-[10px] text-[500] underline-text">
               详情
-            </text>
+            </span>
           </div>
         </div>
-      </swiper-item>
-    </swiper>
-
-    <yo-indicator-dot :current-index="currentIndex" :length="bannerList.length" duration="0.5" default-width="4px"
-      active-width="16px" dot-height="4px" shape="circle" default-color="rgba(255,255,255,0.5)"
-      active-color="rgba(255,255,255,1)" />
-
+      </van-swipe-item>
+    </van-swipe>
   </div>
 
-  <div v-else-if="props.tipsMessage">
+  <div v-else-if="tipsMessage">
     <div class="noMessage">
-      <span class="noMessage-text text-color font-size-12 font-600">
-        {{ props.tipsMessage }}
+      <span class="noMessage-text text-[#0CCD58] text-[12px] text-[600]">
+        {{ tipsMessage }}
       </span>
     </div>
   </div>
@@ -48,9 +42,7 @@ const props = defineProps({
   },
 });
 
-const autoplay = ref(true);
-const interval = ref(7000);
-const duration = ref(500);
+const autoplay = ref(3000);
 
 const currentIndex = ref(0);
 const bannerList = ref([]);
@@ -87,24 +79,13 @@ const clickItem = (item) => {
 </script>
 
 <style lang="scss" scoped>
-.swiper {
-  height: 50px;
-  margin-top: 8px;
-}
-
 .swiper-item {
   display: block;
-  height: 46px;
-  background: #EBEFFF;
   box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
   border-radius: 12px;
   border: 1px solid #C7D2FE;
 }
 
-.text-color {
-  color: #0CCD58;
-}
-
 .underline-text {
   text-decoration: underline;
   text-decoration-color: #0CCD58;
diff --git a/src/pages/home/components/HomeWelcome/index.vue b/src/pages/home/components/Welcome/index.vue
similarity index 93%
rename from src/pages/home/components/HomeWelcome/index.vue
rename to src/pages/home/components/Welcome/index.vue
index 3a6ca88..5a1e0d4 100644
--- a/src/pages/home/components/HomeWelcome/index.vue
+++ b/src/pages/home/components/Welcome/index.vue
@@ -1,10 +1,11 @@
 <template>
-  <div class="flex border-box w-full">
+  <div class="flex w-full">
     <div class="flex flex-col flex-full min-width-0 mr-12">
       <div class="flex flex-row flex-items-center flex-justify-between min-width-0">
-        <span class="flex-full min-width-0 font-size-20 font-600 color-white ellipsis-1">{{
-          mainPageDataModel.welcomeContent }}</span>
-        <span class="flex-shrink-0 font-size-20 font-600 color-white mt-4"> {{ weatherText }} </span>
+        <span class="flex-full min-width-0 text-[20px] text-[600] color-white ellipsis-1">
+          {{ mainPageDataModel.welcomeContent }}
+        </span>
+        <span class="shrink-0 text-[20px] text-[600] color-white mt-4"> {{ weatherText }} </span>
       </div>
 
       <NoticeMessage :tipsMessage="props.mainPageDataModel.tipsMessage" />