feat: 消息问答的调整

src/pages/index/components/module/AnswerComponent/index.vue

@@ -2,20 +2,25 @@
   <view class="w-full bg-white border-box border-ff overflow-hidden rounded-20 flex flex-col">
     <!-- 占位撑开 -->
     <view class="w-vw"></view>
-    <view class="flex flex-col p-16 border-box">
-      <view class="flex flex-row flex-items-start flex-justify-start">
+    <view class="flex flex-col p-16 border-box border-left-4">
+      <view v-if="title" class="flex flex-row flex-items-start flex-justify-start mb-8">
         <uni-icons class="icon-active" type="fire-filled" size="18" color="opacity" />
-        <text class="font-size-16 font-500 text-color-900 ml-6">游玩划重点</text>
+        <text class="font-size-16 font-500 text-color-900 ml-6"> {{ title }}</text>
       </view>
       <!-- 文字内容，最多显示3行 -->
-      <view class="answer-content font-size-12 font-color-600 mt-8">
+      <view class="answer-content font-size-12 font-color-600">
         <ChatMarkdown :key="textKey" :text="processedText" />
       </view>
       <!-- 超过3行时显示...提示 -->
-      <view class="flex flex-row flex-items-center mt-8" v-if="isOverflow" @click="lookDetailAction">
+      <view v-if="!finish" class="flex flex-row flex-items-center mt-8">
+        <text class="font-size-12 font-400 font-color-600">正在生成</text>
+        <DotLoading />
+      </view>
+      <view v-if="isOverflow && finish" class="flex flex-row flex-items-center mt-8" @click="lookDetailAction">
         <text class="font-size-12 font-400 theme-color-500 mr-4">查看详情</text>
         <uni-icons class="icon-active" type="right" size="14" color="opacity"></uni-icons>
       </view>
+
     </view>
   </view>
 
@@ -25,6 +30,7 @@
 import { defineProps, computed, ref, watch } from "vue";
 
 import ChatMarkdown from "../../chat/ChatMarkdown/index.vue";
+import DotLoading from "../../loading/DotLoading.vue";
 
 const isOverflow = ref(false)
 
@@ -37,7 +43,11 @@ const props = defineProps({
   text: {
     type: String,
     default: "",
-  }
+  },
+  finish: {
+    type: Boolean,
+    default: false,
+  },
 });
 
 // 用于强制重新渲染的key
@@ -102,5 +112,9 @@ const lookDetailAction = () => {
   overflow: hidden;
   text-overflow: ellipsis;
   line-height: 16px;
+  max-height: 80px;
+}
+.border-left-4 {
+  border-left: 4px solid $theme-color-500;
 }
 </style>