feat: TeamRunCompleted状态处理

2025-08-27 17:41:10 +08:00
parent 1360717647
commit 0406dea56f
4 changed files with 52 additions and 99 deletions
--- a/src/components/xt-chat/chat-view/constants.ts
+++ b/src/components/xt-chat/chat-view/constants.ts
@ -23,15 +23,15 @@ export const ANSWER_STYLE = {
 };

 export interface UseChatHandlerReturn {
-  roles: BubbleListProps['roles'];
-  currentTaskId: Ref<string | null>;
-  handleMessage: (parsedData: { event: string; data: MESSAGE.Answer }) => void;
-  handleOpen: (data: Response) => void;
-  generateLoading: Ref<boolean>;
-  conversationList: Ref<any[]>;
-  showRightView: Ref<boolean>;
-  rightViewInfo: Ref<any>;
-  senderRef: Ref<null>
+  roles?: BubbleListProps['roles'];
+  currentTaskId?: Ref<string | null>;
+  handleMessage?: (parsedData: { event: string; data: MESSAGE.Answer }) => void;
+  handleOpen?: (data: Response) => void;
+  generateLoading?: Ref<boolean>;
+  conversationList?: Ref<any[]>;
+  showRightView?: Ref<boolean>;
+  rightViewInfo?: Ref<any>;
+  senderRef?: Ref<null>
 }
 export enum EnumTeamRunStatus {
  TeamRunStarted = 'TeamRunStarted', // 对话开始
--- a/src/components/xt-chat/chat-view/index.vue
+++ b/src/components/xt-chat/chat-view/index.vue
@ -2,7 +2,6 @@
 import { message as antdMessage, Tooltip } from 'ant-design-vue';
 import { BubbleList } from '@/components/xt-chat/xt-bubble';
 import SenderInput from './components/sender-input/index.vue';
-import { Typography } from 'ant-design-vue';
 import RightView from './components/right-view/index.vue';

 import { useRoute } from 'vue-router';
@ -27,7 +26,6 @@ export default {
    const rightViewRef = ref(null);
    const bubbleListRef = ref<any>(null);
    const sseController = ref<any>(null);
-    const searchValue = ref('');

    const conversationId = computed(() => {
      return route.params.conversationId;
@ -76,7 +74,6 @@ export default {
        sseController.value = querySSE({
          method: 'POST',
          handleMessage,
-          handleOpen,
          body: JSON.stringify({
            content: message,
            session_id: conversationId.value,
@ -96,7 +93,6 @@ export default {
      rightViewInfo,
      currentTaskId,
      handleMessage,
-      handleOpen,
      conversationList,
      generateLoading,
      senderRef,
--- a/src/components/xt-chat/chat-view/useChatHandler.tsx
+++ b/src/components/xt-chat/chat-view/useChatHandler.tsx
@ -2,7 +2,7 @@ import { ref } from 'vue';

 import type { BubbleListProps } from '@/components/xt-chat/xt-bubble/types';
 import markdownit from 'markdown-it';
-import { message as antdMessage, Timeline } from 'ant-design-vue';
+import { message as antdMessage } from 'ant-design-vue';
 import {
  IconFile,
  IconCaretUp,
@ -14,7 +14,7 @@ import {

 import { Tooltip } from 'ant-design-vue';
 import TextOverTips from '@/components/text-over-tips/index.vue';
-import { genRandomId } from '@/utils/tools';
+import { genRandomId, exactFormatTime } from '@/utils/tools';

 import icon1 from '@/assets/img/agent/icon-end.png';
 import icon2 from '@/assets/img/agent/icon-loading.png';
@ -29,6 +29,7 @@ import {
  THOUGHT_ROLE,
  ROLE_STYLE,
  EnumTeamRunStatus,
+  FILE_TYPE_MAP,
 } from './constants';
 import type { UseChatHandlerReturn } from './constants';

@ -78,26 +79,6 @@ export default function useChatHandler({ initSse }): UseChatHandlerReturn {
      },
      style: ROLE_STYLE,
    },
-    [FILE_ROLE]: {
-      placement: 'start',
-      variant: 'borderless',
-      typing: { step: 2, interval: 100 },
-      messageRender: (items) => {
-        return items.map((item) => (
-          <div class="file-card">
-            <IconFile class="w-24px h-24px mr-20px color-#6D4CFE" />
-            <div>
-              <TextOverTips
-                context={item.name}
-                class="font-family-medium color-#211F24 text-14px font-400 lh-22px mb-4px"
-              />
-              <span class="color-#939499 font-family-regular text-12px font-400 lh-22px">创建时间：08-04 12:40</span>
-            </div>
-          </div>
-        ));
-      },
-      style: ROLE_STYLE,
-    },
    [THOUGHT_ROLE]: {
      placement: 'start',
      variant: 'borderless',
@ -120,54 +101,11 @@ export default function useChatHandler({ initSse }): UseChatHandlerReturn {
    antdMessage.success('复制成功！');
  };

-  // 开始处理
-  const handleOpen = (data: any): void => {
-    // const { run_id } = data;
-    // currentTaskId.value = run_id;
-    // conversationList.value.push({
-    //   key: run_id,
-    //   run_id,
-    //   role: INTELLECTUAL_THINKING_ROLE,
-    //   content: (
-    //     <div class="flex items-center">
-    //       <span class="font-family-medium color-#211F24 text-14px font-400 lh-22px mr-4px">智能思考</span>
-    //       <IconCaretUp size={16} class="color-#211F24" />
-    //     </div>
-    //   ),
-    // });
-  };
-
-  // 最终结果处理
-  const handleFileReview = (extra_data: { type: string; data: any }) => {
-    console.log('handleFileReview', extra_data);
-    const { type, data } = extra_data;
-
-    showRightView.value = true;
-    rightViewInfo.value = data?.[0] ?? {};
-
-    // conversationList.value.push({
-    //   run_id,
-    //   role: FILE_ROLE,
-    //   content: _files,
-    //   style: ANSWER_STYLE,
-    //   footer: ({ item }: { item: any }) => {
-    //     const nonQuestionElements = conversationList.value.filter((item) => item.role !== QUESTION_ROLE);
-    //     const isLastRunTask = nonQuestionElements[nonQuestionElements.length - 1]?.id === item.id;
-    //   },
-    // });
-  };
-
  // 重置生成状态
  const resetGenerateStatus = () => {
    generateLoading.value = false;
  };

-  // // 错误处理
-  // const handleError = () => {
-  //   resetGenerateStatus();
-  //   antdMessage.error('连接服务器失败');
-  // };
-
  const onRefresh = (run_id: string) => {
    generateLoading.value = true;
    conversationList.value = conversationList.value.filter((item) => item.run_id !== run_id);
@ -205,13 +143,11 @@ export default function useChatHandler({ initSse }): UseChatHandlerReturn {
  const getTeamRunTask = (teamRunTaskId: string) => {
    return conversationList.value.find((item) => item.teamRunTaskId === teamRunTaskId);
  };
-  const isLastRunTask = (data: MESSAGE.Answer, teamRunTaskId: string): boolean => {
-    const { run_id } = data;
-    return getLastRunTask(teamRunTaskId).run_id === run_id;
+  const isLastRunTask = (run_id: string): boolean => {
+    return getLastRunTask(lastTeamRunTaskId.value).run_id === run_id;
  };
-  const isFirstRunTask = (data: MESSAGE.Answer, teamRunTaskId: string): boolean => {
-    const { run_id } = data;
-    return getFirstRunTask(teamRunTaskId).run_id === run_id;
+  const isFirstRunTask = (run_id: string): boolean => {
+    return getFirstRunTask(lastTeamRunTaskId.value).run_id === run_id;
  };
  const isLastTeamRunTask = (data: MESSAGE.Answer) => {
    const { run_id } = data;
@ -231,16 +167,15 @@ export default function useChatHandler({ initSse }): UseChatHandlerReturn {
      output: data.output,
      role: ANSWER_ROLE,
      messageRender: (data: MESSAGE.Answer) => {
-        const { node, output, runStatus, isCollapse = true } = data;
+        const { node, output, runStatus, isCollapse = true, customRender } = data;
        const isRulCompleted = runStatus === EnumTeamRunStatus.RunCompleted;

-        // console.log('messageRender', isCollapse);
        let outputEleClass: string = `thought-chain-output border-l-#E6E6E8 border-l-1px  pl-12px relative left-6px mb-4px`;
-        !isLastRunTask(data, lastTeamRunTaskId.value) && (outputEleClass += ' hasLine pb-12px pt-4px');
+        !isLastRunTask(run_id) && (outputEleClass += ' hasLine pb-12px pt-4px');

        return (
          <>
-            {isFirstRunTask(data, lastTeamRunTaskId.value) && (
+            {isFirstRunTask(run_id) && (
              <div class="flex items-center">
                <span class="font-family-medium color-#211F24 text-14px font-400 lh-22px mr-4px">智能思考</span>
                {isCollapse ? (
@ -258,7 +193,7 @@ export default function useChatHandler({ initSse }): UseChatHandlerReturn {
                )}
              </div>
            )}
-            {isCollapse && (
+            {isCollapse ? (
              <div class="relative thought-chain-item">
                <div class="flex items-center mb-4px">
                  <img src={isRulCompleted ? icon1 : icon2} width={13} height={13} class="mr-4px" />
@ -266,6 +201,8 @@ export default function useChatHandler({ initSse }): UseChatHandlerReturn {
                </div>
                <div v-html={md.render(output)} class={outputEleClass} />
              </div>
+            ) : (
+              customRender?.()
            )}
          </>
        );
@ -325,7 +262,7 @@ export default function useChatHandler({ initSse }): UseChatHandlerReturn {
  const handleTeamRunTaskEnd = (data: MESSAGE.Answer) => {
    resetGenerateStatus();

-    const { run_id, extra_data } = data;
+    const { run_id, extra_data, output } = data;
    const _hasRunTask = hasRunTask(lastTeamRunTaskId.value);
    const _targetTask = _hasRunTask ? getLastRunTask(run_id) : getTeamRunTask(lastTeamRunTaskId.value);

@ -339,19 +276,38 @@ export default function useChatHandler({ initSse }): UseChatHandlerReturn {
      _targetTask.content.teamRunStatus = EnumTeamRunStatus.TeamRunCompleted;
    }

+    // 含有文档，右侧展示预览区域
    if (extra_data) {
-      handleFileReview(extra_data);
+      showRightView.value = true;
+      rightViewInfo.value = extra_data.data?.[0] ?? {};
+      _targetTask.content.customRender = () => (
+        <>
+          <div v-html={md.render(output)} />
+          <div class="file-card mt-10px">
+            <IconFile class="w-24px h-24px mr-16px color-#6D4CFE" />
+            <div>
+              <TextOverTips
+                context={FILE_TYPE_MAP?.[extra_data.data?.file_type] ?? '-'}
+                class="font-family-medium color-#211F24 text-14px font-400 lh-22px mb-4px"
+              />
+              <span class="color-#939499 font-family-regular text-12px font-400 lh-22px">
+                创建时间：{exactFormatTime(dayjs().unix())}
+              </span>
+            </div>
+          </div>
+        </>
+      );
    }
+    
    _targetTask.footer = () => {
      return (
        <div class="flex items-center">
-          {!extra_data 
-          // ? (
-          //   <Tooltip title="下载" onClick={onDownload}>
-          //     <IconDownload size={16} class="color-#737478 cursor-pointer mr-12px" />
-          //   </Tooltip>
-          // ) : 
-          && (
+          {!extra_data && (
+            // ? (
+            //   <Tooltip title="下载" onClick={onDownload}>
+            //     <IconDownload size={16} class="color-#737478 cursor-pointer mr-12px" />
+            //   </Tooltip>
+            // ) :
            <Tooltip title="复制" onClick={() => onCopy(_targetTask.content.output)}>
              <IconCopy size={16} class="color-#737478 cursor-pointer mr-12px" />
            </Tooltip>
@ -399,7 +355,6 @@ export default function useChatHandler({ initSse }): UseChatHandlerReturn {
    senderRef,
    currentTaskId,
    handleMessage,
-    handleOpen,
    generateLoading,
    conversationList,
    showRightView,