refactor: clean up styles, configs and home page

- Migrate inline styles for ChatMainList, AigcPhotoCard and SpriteAnimator, delete unused SCSS files
- Update development proxy target in vite.config.ts and env variables including client ID and token
- Fix prop references and styling in ChatInputArea and Welcome components
- Enable and refactor Calender component integration with proper event handling
- Add tabbed layout to ChatMainList with Discovery and chat message sections
- Update Vue 3 component patterns for better maintainability
- Temporarily comment out ChatInputArea in ChatMainList

src/pages/home/components/ChatMainList/index.vue

@@ -8,7 +8,7 @@
     <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">
+        <div class="px-[12px] pt-[12px]">
           <Welcome :mainPageDataModel="mainPageDataModel" />
         </div>
         <div style="margin-bottom: -1px;">
@@ -16,6 +16,116 @@
         </div>
       </div>
     </div>
+
+    <div v-show="tabIndex === 0" class="flex-full overflow-hidden min-h-0"
+      @touchstart.capture="handleScrollAreaTouchStart" @touchstart="handleScrollAreaTouchStart"
+      @touchmove="handleScrollAreaTouchMove">
+
+      <Discovery @scroll-touch-start="handleScrollAreaTouchStart" @scroll-touch="handleScrollAreaTouchMove" />
+    </div>
+
+    <!-- 消息列表（可滚动区域） -->
+    <div v-show="tabIndex === 1" class="flex-full overflow-hidden min-h-0" scroll-y :scroll-top="scrollTop"
+      :scroll-with-animation="true" @scroll="handleScroll" @scrolltolower="handleScrollToLower"
+      @touchstart.capture="handleScrollAreaTouchStart" @touchstart="handleScrollAreaTouchStart"
+      @touchmove="handleScrollAreaTouchMove">
+
+      <div class="area-msg-list-content" v-for="item in chatMsgList" :key="item.msgId" :id="item.msgId">
+        <template v-if="item.msgType === MessageRole.AI">
+          <ChatCardAI class="flex justify-start" :key="`ai-${item.msgId}-${item.msg ? item.msg.length : 0}`" :text="item.componentName && isLongTextCard(item.componentName)
+            ? ''
+            : item.msg || ''
+            " :isLoading="item.isLoading">
+            <template #content v-if="
+              item.toolCall ||
+              (item.componentName && isLongTextCard(item.componentName))
+            ">
+
+              <LongTextGuideCardPreview v-if="item.componentName && isLongTextCard(item.componentName)"
+                :componentName="item.componentName" />
+
+              <QuickBookingComponent v-if="
+                item.toolCall &&
+                item.toolCall.componentName === CompName.quickBookingCard
+              " />
+              <DiscoveryCardComponent v-else-if="
+                item.toolCall &&
+                item.toolCall.componentName === CompName.discoveryCard
+              " />
+              <CreateServiceOrder v-else-if="
+                item.toolCall &&
+                item.toolCall.componentName === CompName.callServiceCard
+              " :toolCall="item.toolCall" />
+              <OpenMapComponent v-else-if="
+                item.toolCall &&
+                item.toolCall.componentName === CompName.mapCard
+              " />
+              <GeneratorPhotoComponent v-else-if="
+                item.toolCall &&
+                item.toolCall.componentName === CompName.aigcPhotoGeneratorCard
+              " :toolCall="item.toolCall" />
+              <AigcPhotoCard v-else-if="
+                item.toolCall &&
+                item.toolCall.componentName === CompName.videoCard
+              " :toolCall="item.toolCall" />
+
+              <Feedback v-else-if="
+                item.toolCall &&
+                item.toolCall.componentName === CompName.feedbackCard
+              " :toolCall="item.toolCall" />
+              <DetailCardCompontent v-else-if="
+                item.toolCall &&
+                item.toolCall.componentName ===
+                CompName.pictureAndCommodityCard
+              " :toolCall="item.toolCall" />
+              <AddCarCrad v-else-if="
+                item.toolCall &&
+                item.toolCall.componentName === CompName.enterLicensePlateCard
+              " :toolCall="item.toolCall" />
+              <SurveyQuestionnaire v-else-if="
+                item.toolCall &&
+                item.toolCall.componentName ===
+                CompName.callSurveyQuestionnaire
+              " :toolCall="item.toolCall" />
+            </template>
+
+            <template #footer>
+              <!-- 这个是底部 -->
+              <AttachListComponent v-if="item.question" :question="item.question" />
+            </template>
+          </ChatCardAI>
+        </template>
+
+        <template v-else-if="item.msgType === MessageRole.ME">
+          <ChatCardMine class="flex flex-justify-end" :text="item.msg" />
+        </template>
+
+        <template v-else>
+          <ChatCardOther class="flex flex-justify-center" :text="item.msg">
+            <ChatGuide v-if="chatMsgList.length < 2" />
+            <ActivityListComponent v-if="
+              mainPageDataModel.activityList &&
+              mainPageDataModel.activityList.length
+            " :activityList="mainPageDataModel.activityList" />
+
+            <!-- 先不展示了，等后续有需求再加回来 false -->
+            <RecommendPostsComponent v-if="
+              false &&
+              mainPageDataModel.recommendTheme &&
+              mainPageDataModel.recommendTheme.length
+            " :recommendThemeList="mainPageDataModel.recommendTheme" />
+          </ChatCardOther>
+        </template>
+      </div>
+    </div>
+
+    <!-- 输入框区域 -->
+    <!-- <div>
+      <ChatQuickAccess />
+      <ChatInputArea ref="inputAreaRef" v-model="inputMessage" :holdKeyboard="holdKeyboard"
+        :is-session-active="isSessionActive" :stop-request="stopRequest" @send="sendMessageAction"
+        @noHideKeyboard="handleNoHideKeyboard" @keyboardShow="handleKeyboardShow" @keyboardHide="handleKeyboardHide" />
+    </div> -->
   </div>
 </template>
 
@@ -27,7 +137,7 @@ import Welcome from "../Welcome/index.vue";
 import AiTabSwitch from "../AiTabSwitch/index.vue";
 import Discovery from "../Discovery/index.vue";
 import ChatGuide from "../ChatGuide/index.vue";
-
+import AigcPhotoCard from '../AigcPhotoCard/index.vue';
 import ChatTopNavBar from "../ChatTopNavBar/index.vue";
 import ChatCardAI from "../ChatCardAi/index.vue";
 import ChatCardMine from "../ChatCardMine/index.vue";
@@ -373,14 +483,11 @@ const initHandler = () => {
 };
 
 onMounted(() => {
-  try {
-    getMainPageData();
-    addNoticeListener();
-    // 有token时，加载最近会话、最近消息、初始化socket
-    initHandler();
-  } catch (error) {
-    console.error("页面初始化错误:", error);
-  }
+  console.log("onMounted");
+  getMainPageData();
+  addNoticeListener();
+  // 有token时，加载最近会话、最近消息、初始化socket
+  initHandler();
 });
 
 /// =============页面配置↓================
@@ -416,6 +523,7 @@ const getMainPageData = async () => {
     mainPageDataModel.value = res.data;
     agentId.value = res.data.agentId;
   }
+
   appStore.setSceneId(""); // 清空sceneId,分身二次进入展示默认的
 };
 
@@ -1138,7 +1246,3 @@ const resetConfig = () => {
   }
 };
 </script>
-
-<style lang="scss" scoped>
-@import "./styles/index.scss";
-</style>

src/pages/home/components/ChatMainList/styles/index.scss

@@ -1,6 +0,0 @@
-.main-scroll-area {
-  flex-basis: 0;
-  height: 0;
-  min-height: 0;
-  overscroll-behavior-y: contain;
-}