From c59342c22c5c12784060cb3e9f8de901fd434ad6 Mon Sep 17 00:00:00 2001 From: zoujing Date: Fri, 5 Jun 2026 15:19:32 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E5=8D=A1=E7=89=87=E8=B0=83=E6=95=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ChatModule/AnswerComponent/index.vue | 46 +++++++++++++------ 1 file changed, 32 insertions(+), 14 deletions(-) diff --git a/src/pages/ChatModule/AnswerComponent/index.vue b/src/pages/ChatModule/AnswerComponent/index.vue index 0642c8b..85b6638 100644 --- a/src/pages/ChatModule/AnswerComponent/index.vue +++ b/src/pages/ChatModule/AnswerComponent/index.vue @@ -7,8 +7,12 @@ {{ title }} - - + + @@ -76,10 +80,26 @@ const shouldRenderCard = computed(() => { return hasStructuredLongTextData.value || !!previewContent.value || !props.finish; }); -// 处理文本内容:按行截断以保证预览最多显示两行(更贴近视觉行数) +// 处理文本内容:按行截断以保证预览最多显示指定行数(更贴近视觉行数) // 点击“查看详情”会跳转到完整页面(不受预览截断影响)。 -const PREVIEW_LINES = 2; -const PREVIEW_CHAR_LIMIT = 40; // 作为备用,当没有换行但过长时也会截断 +const STRUCTURED_PREVIEW_LINES = 2; +const STRUCTURED_PREVIEW_CHAR_LIMIT = 40; +const STRUCTURED_PREVIEW_MAX_HEIGHT = "62px"; +const PLAIN_PREVIEW_LINES = 4; +const PLAIN_PREVIEW_CHAR_LIMIT = 100; +const PLAIN_PREVIEW_MAX_HEIGHT = "100px"; +const previewLines = computed(() => { + return hasStructuredLongTextData.value ? STRUCTURED_PREVIEW_LINES : PLAIN_PREVIEW_LINES; +}); +const previewCharLimit = computed(() => { + return hasStructuredLongTextData.value ? STRUCTURED_PREVIEW_CHAR_LIMIT : PLAIN_PREVIEW_CHAR_LIMIT; +}); +const answerContentStyle = computed(() => { + const maxHeight = hasStructuredLongTextData.value + ? STRUCTURED_PREVIEW_MAX_HEIGHT + : PLAIN_PREVIEW_MAX_HEIGHT; + return `-webkit-line-clamp: ${previewLines.value}; max-height: ${maxHeight};`; +}); const processedContent = computed(() => { const content = previewContent.value ? String(previewContent.value) : ""; if (!content) return ""; @@ -87,14 +107,14 @@ const processedContent = computed(() => { // 按行分割(保留空行) const lines = content.split(/\r?\n/); - // 如果行数超过限制,截取前 PREVIEW_LINES 行并添加省略号 - if (lines.length > PREVIEW_LINES) { - return lines.slice(0, PREVIEW_LINES).join("\n") + "..."; + // 如果行数超过限制,截取前指定行数并添加省略号 + if (lines.length > previewLines.value) { + return lines.slice(0, previewLines.value).join("\n") + "..."; } // 若虽然行数不超过,但总长度仍然很长,做字符级截断作为兜底 - if (content.length > PREVIEW_CHAR_LIMIT) { - return content.slice(0, PREVIEW_CHAR_LIMIT) + "..."; + if (content.length > previewCharLimit.value) { + return content.slice(0, previewCharLimit.value) + "..."; } return content; @@ -105,8 +125,8 @@ const isOverflow = computed(() => { const lines = contentStr.split(/\r?\n/); return ( (hasStructuredLongTextData.value && hasLongTextExtraSections(props.longTextData)) || - lines.length > PREVIEW_LINES || - contentStr.length > PREVIEW_CHAR_LIMIT + lines.length > previewLines.value || + contentStr.length > previewCharLimit.value ); }); @@ -186,12 +206,10 @@ const lookDetailAction = () => {