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
; + return
; }, 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
; + return
; }, }); }; @@ -328,7 +328,7 @@ export default function useChatHandler(options: UseChatHandlerOptions): UseChatH _targetTask.content.customRender = () => { return ( <> -
+
{_targetData && (
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; + } } } }