From b9d28bd6af15026741099c25a6e72fe947ad3772 Mon Sep 17 00:00:00 2001 From: wujingjing <gersonwu@qq.com> Date: 星期四, 10 四月 2025 17:31:50 +0800 Subject: [PATCH] 修改数字人对话 --- src/components/chat/Chat.vue | 347 ++++++++++++++++++++++++++++++++++++++++++++++++--------- 1 files changed, 292 insertions(+), 55 deletions(-) diff --git a/src/components/chat/Chat.vue b/src/components/chat/Chat.vue index 011c915..8c7e10d 100644 --- a/src/components/chat/Chat.vue +++ b/src/components/chat/Chat.vue @@ -1,5 +1,11 @@ <template> - <ChatContainer :loading="chatListLoading" :more-is-loading="moreIsLoading" :is-share-page="isSharePage" ref="containerRef"> + <ChatContainer + :loading="chatListLoading" + :more-is-loading="moreIsLoading" + :is-share-page="isSharePage" + ref="containerRef" + @autoSendMessage="autoSendMessage" + > <!-- 娑堟伅鍒楄〃 --> <template #message-list> <MessageList @@ -48,23 +54,27 @@ <script setup lang="ts"> import type { CancelTokenSource } from 'axios'; import axios from 'axios'; -import { orderBy } from 'lodash-es'; +import { ElMessage } from 'element-plus'; import moment from 'moment'; +import { v4 as uuidv4 } from 'uuid'; import { computed, nextTick, onActivated, onMounted, ref } from 'vue'; import { loadAmisSource } from '../amis/load'; +import ChatContainer from './components/ChatContainer.vue'; +import { getKnowledgePlainText } from './components/playBar/hook/useDigitalHuman'; +import ShareLinkDlg from './components/shareLink/index.vue'; +import type { SendMsg } from './hooks/types'; +import { useLoadData } from './hooks/useLoadData'; import { useScrollLoad } from './hooks/useScrollLoad'; +import { useSyncMsg } from './hooks/useSyncMsg'; +import MessageList from './messageList/index.vue'; import type { ChatContent } from './model/types'; import { AnswerState, AnswerType, RoleEnum, type ChatMessage } from './model/types'; +import type { QuestionLifecycle } from './types'; import { getShareChatJsonByPost, questionStreamByPost } from '/@/api/ai/chat'; import PlayBar from '/@/components/chat/components/playBar/PlayBar.vue'; import CustomDrawer from '/@/components/drawer/CustomDrawer.vue'; import { Logger } from '/@/model/logger/Logger'; -import { triggerRef } from 'vue'; -import { ElMessage } from 'element-plus'; -import ChatContainer from './components/ChatContainer.vue'; -import ShareLinkDlg from './components/shareLink/index.vue'; import router from '/@/router'; -import MessageList from './messageList/index.vue'; import { activeChatRoom, activeGroupType, @@ -74,18 +84,28 @@ isSharePage, roomConfig, } from '/@/stores/chatRoom'; +import { ParentRegister } from '/@/stores/global'; import emitter from '/@/utils/mitt'; +import { deepClone } from '/@/utils/other'; import { useCompRef } from '/@/utils/types'; -import { toMyFixed } from '/@/utils/util'; -import { useLoadData } from './hooks/useLoadData'; -import { useSyncMsg } from './hooks/useSyncMsg'; -import { getCurrentPosition } from '/@/utils/brower'; +import { toFormData, toMyFixed } from '/@/utils/util'; + const containerRef = useCompRef(ChatContainer); const chatListDom = computed(() => containerRef.value?.chatListDom); + const scrollToBottom = () => { containerRef.value?.scrollToBottom(); }; -const { loadReplyData, parseContent, parseExtraContent, convertProcessItem, convertProcessToStep, formatShowTimeYear } = useLoadData(); +const { + loadReplyData, + parseContent, + parseExtraContent, + convertProcessItem, + convertProcessToStep, + convertAttach, + formatShowTimeYear, + getStepGroupList, +} = useLoadData(); const voicePageIsShow = ref(false); let isTalking = ref(false); const chatWidth = computed(() => containerRef.value?.chatWidth); @@ -115,7 +135,12 @@ }); }; -const questionAi = async (text) => { +const enableCallback = ref(false); + +let streamOutputIsStart = false; +let position: Position = null; + +const questionAi = async (text: string, lifecycleCall?: QuestionLifecycle) => { let judgeParams = null; if (!preQuestion.value) { judgeParams = {}; @@ -131,7 +156,25 @@ raw_mode: roomConfig.value?.[currentRouteId]?.isAnswerByLLM ?? false, ...judgeParams, } as any; - // const position = await getCurrentPosition(); + const tableList = attachList.value.filter((item) => item.type === 'table').map((item) => item.model); + if (tableList?.length > 0) { + params.tables = JSON.stringify(tableList); + } + + const metricList = attachList.value.filter((item) => item.type === 'metric').map((item) => item.model); + if (metricList?.length > 0) { + params.metrics = JSON.stringify(metricList); + } + // if (!position) { + // const loadingInstance = ElLoadingService({ + // text: '鑾峰彇浣嶇疆涓�...', + // target: '.layout-parent', + // fullscreen:false, + // }); + // position = await getCurrentPosition().finally(() => { + // loadingInstance.close(); + // }); + // } // if (position) { // const { latitude, longitude } = position; @@ -146,7 +189,12 @@ params.sample_id = currentSampleId; currentSampleId = ''; } - + const formDataParams = toFormData(params); + const fileList = attachList.value.filter((item) => item.type === 'file').map((item) => item.model); + for (const item of fileList) { + formDataParams.append('files', item.file); + } + // clearAttach(); let lastTimestamp = new Date().getTime(); questionRes = {}; let lastIsResult = false; @@ -166,13 +214,15 @@ return isEmpty; }; questionStreamByPost( - params, + formDataParams, (chunkRes) => { Logger.info('chunk response锛歕n\n' + JSON.stringify(chunkRes)); - if (chunkRes.mode === 'result') { lastIsResult = true; const res = chunkRes.value; + if (chunkRes.value?.answer_type === 'knowledge') { + lifecycleCall?.receiveText?.(getKnowledgePlainText(chunkRes.value)); + } if (checkReportEmpty()) { const resReport = getResReport(); resReport.reports.push(res); @@ -196,6 +246,26 @@ triggerRefresh(); return; // chunkRes.value = '鍑嗗鏁版嵁鍒嗘瀽'; + } + + if (chunkRes.mode === 'main_frame') { + const jsonObj = JSON.parse(chunkRes.value); + if (!enableCallback.value) { + return; + } + + ParentRegister.notify?.({ + type: 'main_frame', + value: jsonObj, + }); + return; + } + + if (chunkRes.mode === 'create_work_order') { + const lastMsg = computedMessageList.value.at(-1); + lastMsg.modeContent = chunkRes; + triggerRefresh(); + return; } if (chunkRes.mode === 'summary') { @@ -247,10 +317,11 @@ if (chunkRes.mode === 'conclusion') { const lastReport = computedMessageList.value.at(-1)?.content?.values?.at(-1); + if (lastReport) { lastReport.conclusion = chunkRes.value; - chunkRes.value = '鍒嗘瀽缁撴潫'; } + chunkRes.value = '鍒嗘瀽缁撴潫'; } const getLastGroup = () => { const lastGroup = computedMessageList.value.at(-1).stepGroup[0]; @@ -297,29 +368,45 @@ }); lastIsResult = false; } - const lastGroup = computedMessageList.value.at(-1).stepGroup[0]; + const lastGroup = getLastGroup(); const stepList = lastGroup?.value ?? []; const currentTimeStamp = new Date().getTime(); - const ms = toMyFixed(currentTimeStamp - lastTimestamp, 2) + ' ms'; if (chunkRes.mode === 'finish') { + const ms = toMyFixed(currentTimeStamp - lastTimestamp, 2) + ' ms'; stepList.at(-1).ms = ms; isTalking.value = false; + streamOutputIsStart = false; + lifecycleCall?.finish?.(); return; } - if (stepList?.length >= 1) { + if (stepList?.length >= 1 && !streamOutputIsStart) { + const ms = toMyFixed(currentTimeStamp - lastTimestamp, 2) + ' ms'; + stepList.at(-1).ms = ms; + } + + if (!streamOutputIsStart) { + lastTimestamp = currentTimeStamp; + } + if (!streamOutputIsStart) { + const stepItem = convertProcessItem(chunkRes); + stepList.push(stepItem); } else { - const stepGroup = computedMessageList.value.at(-1).stepGroup; - if (stepGroup.length > 1) { - const lastStepList = stepGroup.at(-2).value; - lastStepList.at(-1).ms = ms; + const lastItem = stepList.at(-1); + if (lastItem) { + lastItem.title += chunkRes.value ?? ''; } } - lastTimestamp = currentTimeStamp; - const stepItem = convertProcessItem(chunkRes); - stepList.push(stepItem); + if (chunkRes.mode === 'begin_stream') { + streamOutputIsStart = true; + lastTimestamp = currentTimeStamp; + } + if (chunkRes.mode === 'end_stream') { + streamOutputIsStart = false; + } + // 寮哄埗瑙﹀彂鏇存柊 scrollToBottom(); @@ -344,23 +431,40 @@ const content = parseContent(questionRes, true); return content; }; - -const clearMessageContent = () => - (messageContent.value = { +const playBarRef = useCompRef(PlayBar); +const attachList = computed(() => playBarRef.value?.attachList ?? []); +const clearMessageContent = () => { + messageContent.value = { type: AnswerType.Text, values: '', - }); + }; +}; let currentSampleId = ''; let currentLLMId = null; -const stopGenClick = () => { +const resetTalking = () => { lastAxiosSource?.cancel(); isTalking.value = false; chatListLoading.value = false; + streamOutputIsStart = false; +}; + +const stopGenClick = () => { + resetTalking(); + if (isFrontQuestion) { + ParentRegister.notify?.({ + type: 'msg_stop', + }); + } computedMessageList.value.at(-1).isStopMsg = true; +}; + +const finishFrontQuestion = () => { + resetTalking(); + ParentRegister.updateChildCallObj('sendMsg', null); }; const checkCanSend = (content: ChatContent = messageContent.value) => { @@ -376,11 +480,12 @@ const addChatItem = (content: ChatContent) => { isTalking.value = true; - const userItem: ChatMessage = { role: RoleEnum.user, content, isChecked: false } as any; + const userItem: ChatMessage = { role: RoleEnum.user, content, isChecked: false, attachList: deepClone(attachList.value) } as any; const assistantItem: ChatMessage = { role: RoleEnum.assistant, content: { type: AnswerType.Report, + values: [], }, state: AnswerState.Null, stepGroup: [ @@ -389,6 +494,7 @@ isShow: true, }, ], + isStopMsg: false, isChecked: false, } as any; @@ -400,10 +506,64 @@ return [userItem, assistantItem]; }; -const sendChatMessage = async (content: ChatContent = messageContent.value) => { +/** + * 娓呴櫎闄勪欢 + */ +const clearAttach = () => { + playBarRef.value?.clearAttach(); +}; + +const updateUserInfo = (userItem: ChatMessage, other: { historyId: string; question: string }) => { + userItem.historyId = other.historyId; + const current = moment().format('YYYY-MM-DD HH:mm:ss'); + userItem.createTime = current; + userItem.content.values = other.question ?? userItem.content.values; +}; + +const updateAssistantInfo = ( + assistantItem: ChatMessage, + resMsgContent: ChatContent, + other: { historyId: string; question: string } +) => { + const current = moment().format('YYYY-MM-DD HH:mm:ss'); + + assistantItem.historyId = other.historyId; + const currentTime = formatShowTimeYear(current); + assistantItem.createTime = currentTime; + assistantItem.content = resMsgContent; +}; + +const updateInfo = ( + userItem: ChatMessage, + assistantItem: ChatMessage, + resMsgContent: ChatContent, + other: { + historyId: string; + question: string; + } +) => { + updateUserInfo(userItem, other); + updateAssistantInfo(assistantItem, resMsgContent, other); +}; + +const handleAfterQuestion = ( + userItem: ChatMessage, + assistantItem: ChatMessage, + resMsgContent: ChatContent, + other: { historyId: string; question: string } +) => { + updateLoadIndex(); + updateInfo(userItem, assistantItem, resMsgContent, other); + setTimeout(() => { + // 鏀跺埌鍥炲锛岀户缁粴 + scrollToBottom(); + }, 300); +}; +const sendChatMessage = async (content: ChatContent = messageContent.value, lifecycleCall?: QuestionLifecycle) => { if (!checkCanSend(content)) { return; } + isFrontQuestion = false; const isNewChat = messageList.value.length === 0; if (isNewChat) { if (activeSampleId.value) { @@ -418,26 +578,105 @@ try { const [userItem, assistantItem] = addChatItem(content); - resMsgContent = await questionAi(content.values); - updateLoadIndex(); - - userItem.historyId = questionRes?.history_id; - const current = moment().format('YYYY-MM-DD HH:mm:ss'); - userItem.createTime = current; - userItem.content.values = questionRes?.question ?? userItem.content.values; - assistantItem.historyId = questionRes?.history_id; - const currentTime = formatShowTimeYear(current); - assistantItem.createTime = currentTime; - assistantItem.content = resMsgContent; - setTimeout(() => { - // 鏀跺埌鍥炲锛岀户缁粴 - scrollToBottom(); - }, 300); + resMsgContent = await questionAi(content.values, lifecycleCall); + handleAfterQuestion(userItem, assistantItem, resMsgContent, { + historyId: questionRes?.history_id, + question: questionRes?.question, + }); } catch (error: any) {} }; +let isFrontQuestion = false; +const sendFrontChatMessage = async (content: ChatContent = messageContent.value): Promise<any> => { + isFrontQuestion = true; + const [userItem, assistantItem] = addChatItem(content); + const promise = new Promise((resolve, reject) => { + const receiveMsg = (msg: SendMsg) => { + console.log('receiveMsg', msg); + if (!assistantItem.content?.values) { + assistantItem.content.values = []; + } + switch (msg.type) { + case 'text': + // 寮�濮嬪鍔犳柊鐨� stepGroup锛屽悗缁殑 stepGroup 骞舵病鏈夊疄闄呬綔鐢紝鍙槸涓轰簡鍋氳凯浠g敤锛岃凯浠e嚭缁勪欢锛屽睅灞变唬鐮佸疄鍦ㄥお闅炬敼浜嗭紒锛侊紒 + assistantItem.stepGroup.push({ + value: [], + isShow: true, + }); + + assistantItem.content.values.push({ + content: { + type: 'knowledge', + values: [ + { + answer: msg.value, + }, + ], + }, + }); + break; + + case 'select': + case 'confirm': + case 'input': + // 寮�濮嬪鍔犳柊鐨� stepGroup锛屽悗缁殑 stepGroup 骞舵病鏈夊疄闄呬綔鐢紝鍙槸涓轰簡鍋氳凯浠g敤锛岃凯浠e嚭缁勪欢锛屽睅灞变唬鐮佸疄鍦ㄥお闅炬敼浜嗭紒锛侊紒 + assistantItem.stepGroup.push({ + value: [], + isShow: true, + }); + assistantItem.content.values.push({ + content: { + type: 'content_cb', + values: msg, + }, + }); + break; + case 'info': + if (msg.value === 'finish') { + finishFrontQuestion(); + return resolve({ userItem, assistantItem, resMsgContent: assistantItem.content }); + } + break; + default: + break; + } + scrollToBottom(); + + triggerRefresh(); + }; + ParentRegister.updateChildCallObj('sendMsg', receiveMsg); + }); + return promise; +}; + +const questionSelf = (content: string) => { + const myContent = { type: AnswerType.Text, values: content }; + + if (!checkCanSend(myContent)) { + return false; + } + sendFrontChatMessage(myContent).then(({ userItem, assistantItem, resMsgContent }) => { + handleAfterQuestion(userItem, assistantItem, resMsgContent, { + historyId: uuidv4(), + question: content, + }); + }); + return true; +}; + +const backQuestion = (content: { question: string; data: any }) => { + sendChatMessage({ type: AnswerType.Text, values: content.question }); +}; + +ParentRegister.updateChildCallObj('frontQuestion', questionSelf); +ParentRegister.updateChildCallObj('backQuestion', backQuestion); const sendClick = () => { sendChatMessage(messageContent.value); +}; + +const autoSendMessage = (question: string, lifecycleCall?: QuestionLifecycle) => { + messageContent.value.values = question; + sendChatMessage(messageContent.value, lifecycleCall); }; const { loadRangeData, onChatListScroll, moreIsLoading, updateLoadIndex } = useScrollLoad({ @@ -502,6 +741,7 @@ type: AnswerType.Text, values: msgValue.question, }, + attachList: convertAttach(msgValue), isChecked: false, }; @@ -509,10 +749,8 @@ historyId: msgValue.history_id, role: RoleEnum.assistant, content: parseContent(msgValue), - stepGroup: (msgValue?.reports ?? []).map((item) => ({ - value: convertProcessToStep(item?.exec_process), - isShow: false, - })), + stepGroup: getStepGroupList(msgValue?.reports ?? []), + isStopMsg: false, conclusion: msgValue.conclusion ?? [], @@ -561,7 +799,6 @@ messageContent.value.values = content; }; //#endregion -const playBarRef = useCompRef(PlayBar); //鐢ㄦ埛闂璁剧疆涓哄父鐢ㄨ const setCommonPhraseClick = (item) => { playBarRef.value.addPhrase(item); -- Gitblit v1.9.3