feat: 组件样式调整

src/pages/ChatModule/AnswerComponent/index.vue

@@ -1,18 +1,17 @@
 <template>
-  <view class="w-full bg-white border-box border-ff overflow-hidden rounded-20 flex flex-col">
+  <view v-if="longTextData?.values" 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 px-16 pt-16 pb-12 border-box">
       <view v-if="tag" class="long-answer-tag" :style="longAnswerTagStyle">{{ tag }}</view>
       <view v-if="title" class="flex flex-row flex-items-start flex-justify-start mb-4">
-        <uni-icons class="icon-active color-FF3D60" type="fire-filled" size="18" color="opacity" />
+        <text class="font-size-16 font-500 text-color-900"> {{ title }}</text>
-        <text class="font-size-16 font-500 text-color-900 ml-6"> {{ title }}</text>
       </view>
-      <!-- 文字内容，最多显示3行 -->
+      <!-- 文字内容，最多显示2行 -->
       <view v-if="processedContent" class="answer-content font-size-12 font-color-600">
         <ChatMarkdown :text="processedContent" />
       </view>
-      <!-- 超过3行时显示...提示 -->
+      <!-- 超过2行时显示...提示 -->
       <view v-if="!finish" class="flex flex-row flex-items-center mt-8">
         <text class="font-size-12 font-400 font-color-600">正在生成</text>
         <ChatLoading />
@@ -40,7 +39,7 @@ import {
 } from "@/utils/longTextCard";
 import { buildTagToneStyle, pickRandomTagToneColor } from "@/utils/tagTone";
 
-// 直接根据文字长度判断，超过约100个字符认为会溢出（约3行）
+// 直接根据文字长度判断，超过约66个字符认为会溢出（约2行）
 const props = defineProps({
   content: {
     type: String,
@@ -64,10 +63,10 @@ const previewContent = computed(() => {
   return getLongTextPreviewText(props.longTextData, ["content_summary"]);
 });
 
-// 处理文本内容：按行截断以保证预览最多显示三行（更贴近视觉行数）
+// 处理文本内容：按行截断以保证预览最多显示两行（更贴近视觉行数）
 // 点击“查看详情”会跳转到完整页面（不受预览截断影响）。
-const PREVIEW_LINES = 3;
+const PREVIEW_LINES = 2;
-const PREVIEW_CHAR_LIMIT = 100; // 作为备用，当没有换行但过长时也会截断
+const PREVIEW_CHAR_LIMIT = 40; // 作为备用，当没有换行但过长时也会截断
 const processedContent = computed(() => {
   const content = previewContent.value ? String(previewContent.value) : "";
   if (!content) return "";
@@ -172,17 +171,14 @@ const lookDetailAction = () => {
 </script>
 
 <style scoped lang="scss">
-.icon-active {
-  margin-top: 1px;
-}
 .answer-content {
   display: -webkit-box;
-  -webkit-line-clamp: 3;
+  -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
   overflow: hidden;
   text-overflow: ellipsis;
   line-height: 16px;
-  max-height: 80px;
+  max-height: 52px;
 }
 .long-answer-tag {
   display: inline-flex;