From ef8c10c0561d21f484bf188e6bc9c1b890a29898 Mon Sep 17 00:00:00 2001
From: rd <1344903914@qq.com>
Date: Tue, 2 Sep 2025 10:10:03 +0800
Subject: [PATCH] =?UTF-8?q?style:=20markdown=E8=BF=94=E5=9B=9Epre=E6=A0=87?=
 =?UTF-8?q?=E7=AD=BE=E6=8D=A2=E8=A1=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../xt-chat/chat-view/useChatHandler.tsx      |  8 +-
 src/components/xt-chat/xt-bubble/style.scss   | 83 ++++++++++---------
 2 files changed, 47 insertions(+), 44 deletions(-)

diff --git a/src/components/xt-chat/chat-view/useChatHandler.tsx b/src/components/xt-chat/chat-view/useChatHandler.tsx
index fb3a192..4dca3cb 100644
--- a/src/components/xt-chat/chat-view/useChatHandler.tsx
+++ b/src/components/xt-chat/chat-view/useChatHandler.tsx
@@ -106,7 +106,7 @@ export default function useChatHandler(options: UseChatHandlerOptions): UseChatH
       variant: 'borderless',
       style: ROLE_STYLE,
       messageRender: (message: string) => {
-        return <div class="max-w-400px" v-html={md.render(message)} />;
+        return <div class="max-w-400px markdown-wrap" v-html={md.render(message)} />;
       },
       footer: (params) => {
         const { content, item } = params as { content: string; item: MESSAGE.Answer };
@@ -223,7 +223,7 @@ export default function useChatHandler(options: UseChatHandlerOptions): UseChatH
         const { node, output, runStatus, isCollapse = true, customRender, teamRunTaskId } = data;
         const isRulCompleted = runStatus === EnumTeamRunStatus.RunCompleted;
 
-        let outputEleClass: string = `thought-chain-output border-l-#E6E6E8 border-l-1px  pl-12px relative left-8px mb-4px`;
+        let outputEleClass: string = `thought-chain-output border-l-#E6E6E8 border-l-1px  pl-12px relative left-8px mb-4px markdown-wrap`;
         !isLastRunTask(data) && (outputEleClass += ' hasLine pb-12px pt-4px');
 
         return (
@@ -289,7 +289,7 @@ export default function useChatHandler(options: UseChatHandlerOptions): UseChatH
       output: data.output,
       role: ANSWER_ROLE,
       messageRender: (data: MESSAGE.Answer) => {
-        return <div v-html={md.render(data.output ?? '')} />;
+        return <div v-html={md.render(data.output ?? '')} class="markdown-wrap" />;
       },
     });
   };
@@ -328,7 +328,7 @@ export default function useChatHandler(options: UseChatHandlerOptions): UseChatH
       _targetTask.content.customRender = () => {
         return (
           <>
-            <div v-html={md.render(output)} />
+            <div v-html={md.render(output)} class="markdown-wrap" />
             {_targetData && (
               <div class="file-card mt-10px">
                 <IconFile class="w-24px h-24px mr-16px color-#6D4CFE" />
diff --git a/src/components/xt-chat/xt-bubble/style.scss b/src/components/xt-chat/xt-bubble/style.scss
index 495ac1a..bf2cf31 100644
--- a/src/components/xt-chat/xt-bubble/style.scss
+++ b/src/components/xt-chat/xt-bubble/style.scss
@@ -29,30 +29,6 @@
     flex-direction: row-reverse;
   }
 
-  .thought-chain-item {
-    position: relative;
-    margin: 0;
-    font-size: 12px;
-    list-style: none;
-    .thought-chain-output {
-      position: relative;
-      &.hasLine {
-        &::before {
-          content: '';
-          position: absolute;
-          top: 0;
-          left: 0;
-          width: 100%;
-          height: 100%;
-          border-left: 1px solid #e6e6e8;
-        }
-      }
-    }
-  }
-
-  .xt-bubble-avatar {
-  }
-
   .xt-bubble-content {
     display: flex;
     flex-direction: column;
@@ -104,25 +80,52 @@
       border-radius: 4px;
     }
 
-    :deep(table) {
-      border-collapse: collapse;
-      thead {
-        tr {
-          th {
-            @include cts;
-            padding: 6px 8px;
-            border: 1px solid #e6e6e8;
-            text-align: left;
+    .thought-chain-item {
+      position: relative;
+      margin: 0;
+      font-size: 12px;
+      list-style: none;
+      .thought-chain-output {
+        position: relative;
+        &.hasLine {
+          &::before {
+            content: '';
+            position: absolute;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            border-left: 1px solid #e6e6e8;
           }
         }
       }
-      tbody {
-        tr {
-          td {
-            @include cts;
-            border: 1px solid #e6e6e8;
-            padding: 16px 8px;
-            text-align: left;
+    }
+
+    // 设置markdown返回的标签样式
+    :deep(.markdown-wrap) {
+      pre {
+        white-space: normal;
+      }
+      table {
+        border-collapse: collapse;
+        thead {
+          tr {
+            th {
+              @include cts;
+              padding: 6px 8px;
+              border: 1px solid #e6e6e8;
+              text-align: left;
+            }
+          }
+        }
+        tbody {
+          tr {
+            td {
+              @include cts;
+              border: 1px solid #e6e6e8;
+              padding: 16px 8px;
+              text-align: left;
+            }
           }
         }
       }