From 933a27222870bc5f3523207c3e56832ff65e14cd Mon Sep 17 00:00:00 2001
From: DEV_DSW <562304744@qq.com>
Date: Mon, 1 Jun 2026 15:26:36 +0800
Subject: [PATCH] feat: add new card components and fix chat list code issues

- add three new Vue card components: AddCarCard, DetailCardComponent, SurveyQuestionnaire
- remove unused RecordingWaveBtn component
- fix component naming and import paths in ChatMainList
- correct `notitceConent` variable typo to `noticeContent`
- reorganize imports for better code maintainability
---
 src/components/Speech/RecordingWaveBtn.vue    | 124 ------------------
 .../home/components/AddCarCard}/index.vue     |   0
 .../home/components/ChatMainList/index.vue    |  30 ++---
 .../index.vue                                 |   0
 .../components/SurveyQuestionnaire/index.vue  |   0
 5 files changed, 15 insertions(+), 139 deletions(-)
 delete mode 100644 src/components/Speech/RecordingWaveBtn.vue
 rename src/{components/AddCarCrad => pages/home/components/AddCarCard}/index.vue (100%)
 rename src/pages/home/components/{DetailCardCompontent => DetailCardComponent}/index.vue (100%)
 rename src/{ => pages/home}/components/SurveyQuestionnaire/index.vue (100%)

diff --git a/src/components/Speech/RecordingWaveBtn.vue b/src/components/Speech/RecordingWaveBtn.vue
deleted file mode 100644
index 7a85d2a..0000000
--- a/src/components/Speech/RecordingWaveBtn.vue
+++ /dev/null
@@ -1,124 +0,0 @@
-<template>
-  <div class="recording-wave-btn">
-    <div class="audio-visualizer">
-      <div v-for="(bar, index) in audioBars" :key="index" class="audio-bar" :style="{
-        height: bar.height + 'px',
-        transition: 'height 0.1s ease-out',
-      }"></div>
-    </div>
-  </div>
-</template>
-
-<script setup>
-import { ref, onMounted, onUnmounted } from "vue";
-
-const animationTimer = ref(null);
-const isAnimating = ref(false);
-
-// 音频条数据
-const audioBars = ref([]);
-const BAR_COUNT = 30;
-
-// 初始化音频条
-const initAudioBars = () => {
-  audioBars.value = [];
-  for (let i = 0; i < BAR_COUNT; i++) {
-    audioBars.value.push({
-      height: 4 + Math.random() * 8,
-    });
-  }
-};
-
-// 更新音频条动画
-const updateAudioBars = () => {
-  if (!isAnimating.value) return;
-
-  // 使用 for 循环随机修改每个音频条的高度
-  for (let i = 0; i < audioBars.value.length; i++) {
-    const bar = audioBars.value[i];
-
-    // 生成随机高度值
-    const minHeight = 4;
-    const maxHeight = 20;
-    const randomHeight = minHeight + Math.random() * (maxHeight - minHeight);
-
-    // 添加一些变化幅度，让高度变化更自然
-    const variation = (Math.random() - 0.5) * 10;
-    bar.height = Math.max(
-      minHeight,
-      Math.min(maxHeight, randomHeight + variation),
-    );
-  }
-};
-
-// 开始动画
-const startAnimation = () => {
-  if (!isAnimating.value) {
-    isAnimating.value = true;
-
-    const animate = () => {
-      if (isAnimating.value) {
-        updateAudioBars();
-        animationTimer.value = setTimeout(animate, 200); // 每200ms更新一次，模仿人类说话语速
-      }
-    };
-
-    animate();
-  }
-};
-
-// 停止动画
-const stopAnimation = () => {
-  isAnimating.value = false;
-  if (animationTimer.value) {
-    clearTimeout(animationTimer.value);
-    animationTimer.value = null;
-  }
-};
-
-// 组件挂载时初始化并自动开始动画
-onMounted(() => {
-  initAudioBars();
-  startAnimation();
-});
-
-// 组件卸载时停止动画
-onUnmounted(() => {
-  stopAnimation();
-});
-
-// 暴露方法给父组件
-defineExpose({
-  startAnimation,
-  stopAnimation,
-});
-</script>
-
-<style scoped lang="scss">
-.recording-wave-btn {
-  box-shadow: 0px 0px 20px 0px rgba(52, 25, 204, 0.05);
-  margin: 0 12px;
-  margin-bottom: 8px;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  background-color: #0CCD58;
-  height: 44px;
-  border-radius: 50px;
-}
-
-.audio-visualizer {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  height: 20px;
-  gap: 2px;
-}
-
-.audio-bar {
-  width: 2px;
-  height: 4px;
-  border-radius: 2px;
-  background-color: #fff;
-}
-</style>
diff --git a/src/components/AddCarCrad/index.vue b/src/pages/home/components/AddCarCard/index.vue
similarity index 100%
rename from src/components/AddCarCrad/index.vue
rename to src/pages/home/components/AddCarCard/index.vue
diff --git a/src/pages/home/components/ChatMainList/index.vue b/src/pages/home/components/ChatMainList/index.vue
index b60992e..df65a0f 100644
--- a/src/pages/home/components/ChatMainList/index.vue
+++ b/src/pages/home/components/ChatMainList/index.vue
@@ -77,12 +77,12 @@
                   item.toolCall &&
                   item.toolCall.componentName === CompName.feedbackCard
                 " :toolCall="item.toolCall" />
-                <DetailCardCompontent v-else-if="
+                <DetailCardComponent v-else-if="
                   item.toolCall &&
                   item.toolCall.componentName ===
                   CompName.pictureAndCommodityCard
                 " :toolCall="item.toolCall" />
-                <AddCarCrad v-else-if="
+                <AddCarCard v-else-if="
                   item.toolCall &&
                   item.toolCall.componentName === CompName.enterLicensePlateCard
                 " :toolCall="item.toolCall" />
@@ -138,6 +138,7 @@
 import { onMounted, nextTick, onUnmounted, ref } from "vue";
 import { emitter } from '@/utils/events'
 import { MessageRole, MessageType, CompName, Command } from "@/constants/ChatModel";
+import WebSocketManager from "@/utils/WebSocketManager";
 import {
   SWITCH_TO_COMPANION_TAB,
   SWITCH_TO_DISCOVERY_TAB,
@@ -147,6 +148,13 @@ import {
   NOTICE_EVENT_LOGOUT,
   NOTICE_EVENT_LOGIN_SUCCESS,
 } from "@/constants/constant";
+import { mainPageData, conversationMsgList, recentConversation } from "@/api/home";
+import { IdUtils } from "@/utils/IdUtils";
+import { resolveChatSocketUrl } from "@/utils/socketUrl";
+import { appendLongTextChunk, createLongTextData } from "@/constants/longTextCard";
+import { checkToken } from "@/hooks/useGoLogin";
+import { useAppStore } from "@/store";
+import { getAccessToken } from "@/constants/token";
 import Welcome from "../Welcome/index.vue";
 import AiTabSwitch from "../AiTabSwitch/index.vue";
 import Discovery from "../Discovery/index.vue";
@@ -163,23 +171,15 @@ import DiscoveryCardComponent from "../DiscoveryCardComponent/index.vue";
 import ActivityListComponent from "../ActivityListComponent/index.vue";
 import RecommendPostsComponent from "../RecommendPostsComponent/index.vue";
 import AttachListComponent from "../AttachListComponent/index.vue";
-import DetailCardCompontent from "../DetailCardCompontent/index.vue";
+import DetailCardComponent from "../DetailCardComponent/index.vue";
 import OpenMapComponent from "../OpenMapComponent/index.vue";
 import AnswerComponent from "../AnswerComponent/index.vue";
 import GeneratorPhotoComponent from "../GeneratorPhotoComponent/index.vue";
 import LongTextGuideCardPreview from "../LongTextGuideCardPreview/index.vue";
 import CreateServiceOrder from "../CreateServiceOrder/index.vue";
 import Feedback from "../Feedback/index.vue";
-import AddCarCrad from "@/components/AddCarCrad/index.vue";
-import SurveyQuestionnaire from "@/components/SurveyQuestionnaire/index.vue";
-import { mainPageData, conversationMsgList, recentConversation } from "@/api/home";
-import WebSocketManager from "@/utils/WebSocketManager";
-import { IdUtils } from "@/utils/IdUtils";
-import { resolveChatSocketUrl } from "@/utils/socketUrl";
-import { appendLongTextChunk, createLongTextData } from "@/constants/longTextCard";
-import { checkToken } from "@/hooks/useGoLogin";
-import { useAppStore } from "@/store";
-import { getAccessToken } from "@/constants/token";
+import AddCarCard from "../AddCarCard/index.vue";
+import SurveyQuestionnaire from "../SurveyQuestionnaire/index.vue";
 
 const emit = defineEmits(["showDrawer"]);
 const appStore = useAppStore();
@@ -188,7 +188,7 @@ const appStore = useAppStore();
 const inputAreaRef = ref(null);
 const mainScrollRef = ref(null);
 const topNavBarRef = ref();
-const notitceConent = ref(null);
+const noticeContent = ref(null);
 
 const holdKeyboardTimer = ref(null);
 /// focus时，点击页面的时候不收起键盘
@@ -633,7 +633,7 @@ const handleWebSocketMessage = (data) => {
   if (data.messageType && data.messageType === "broadcast") {
     console.log("收到 welcome 类型消息:", data);
     if (data.content) {
-      notitceConent.value = data.content;
+      noticeContent.value = data.content;
     }
     return;
   }
diff --git a/src/pages/home/components/DetailCardCompontent/index.vue b/src/pages/home/components/DetailCardComponent/index.vue
similarity index 100%
rename from src/pages/home/components/DetailCardCompontent/index.vue
rename to src/pages/home/components/DetailCardComponent/index.vue
diff --git a/src/components/SurveyQuestionnaire/index.vue b/src/pages/home/components/SurveyQuestionnaire/index.vue
similarity index 100%
rename from src/components/SurveyQuestionnaire/index.vue
rename to src/pages/home/components/SurveyQuestionnaire/index.vue