| | |
| | | <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 |
| | |
| | | <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 { ElLoadingService, 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, |
| | |
| | | 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 { toFormData, toMyFixed } from '/@/utils/util'; |
| | | import { useLoadData } from './hooks/useLoadData'; |
| | | import { useSyncMsg } from './hooks/useSyncMsg'; |
| | | import { getCurrentPosition } from '/@/utils/brower'; |
| | | |
| | | const containerRef = useCompRef(ChatContainer); |
| | | const chatListDom = computed(() => containerRef.value?.chatListDom); |
| | | const attachFileList = computed(() => playBarRef.value?.attachFileList ?? []); |
| | | |
| | | const scrollToBottom = () => { |
| | | containerRef.value?.scrollToBottom(); |
| | | }; |
| | |
| | | parseExtraContent, |
| | | convertProcessItem, |
| | | convertProcessToStep, |
| | | convertAttach, |
| | | formatShowTimeYear, |
| | | getStepGroupList, |
| | | } = useLoadData(); |
| | |
| | | }); |
| | | }; |
| | | |
| | | const enableCallback = ref(false); |
| | | |
| | | let streamOutputIsStart = false; |
| | | let position: Position = null; |
| | | const questionAi = async (text) => { |
| | | |
| | | const questionAi = async (text: string, lifecycleCall?: QuestionLifecycle) => { |
| | | let judgeParams = null; |
| | | if (!preQuestion.value) { |
| | | judgeParams = {}; |
| | |
| | | raw_mode: roomConfig.value?.[currentRouteId]?.isAnswerByLLM ?? false, |
| | | ...judgeParams, |
| | | } as any; |
| | | if(businessTableData.value?.length > 0) { |
| | | params.tables = JSON.stringify(businessTableData.value); |
| | | 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: '获取位置中...', |
| | |
| | | currentSampleId = ''; |
| | | } |
| | | const formDataParams = toFormData(params); |
| | | for (const item of attachFileList.value) { |
| | | 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; |
| | |
| | | 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); |
| | |
| | | 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') { |
| | |
| | | |
| | | 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]; |
| | |
| | | stepList.at(-1).ms = ms; |
| | | isTalking.value = false; |
| | | streamOutputIsStart = false; |
| | | lifecycleCall?.finish?.(); |
| | | return; |
| | | } |
| | | |
| | |
| | | stepList.push(stepItem); |
| | | } else { |
| | | const lastItem = stepList.at(-1); |
| | | lastItem.title += chunkRes.value ?? ''; |
| | | if (lastItem) { |
| | | lastItem.title += chunkRes.value ?? ''; |
| | | } |
| | | } |
| | | |
| | | if (chunkRes.mode === 'begin_stream') { |
| | |
| | | return content; |
| | | }; |
| | | const playBarRef = useCompRef(PlayBar); |
| | | const businessTableData = computed(() => playBarRef.value?.businessTableData ?? []); |
| | | const clearMessageContent = () => |
| | | (messageContent.value = { |
| | | const attachList = computed(() => playBarRef.value?.attachList ?? []); |
| | | const clearMessageContent = () => { |
| | | messageContent.value = { |
| | | type: AnswerType.Text, |
| | | values: '', |
| | | }); |
| | | playBarRef.value?.clearFileList(); |
| | | playBarRef.value?.clearBusinessTable(); |
| | | }; |
| | | }; |
| | | |
| | | 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) => { |
| | |
| | | |
| | | 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: [ |
| | |
| | | isShow: true, |
| | | }, |
| | | ], |
| | | |
| | | isStopMsg: false, |
| | | isChecked: false, |
| | | } as any; |
| | |
| | | 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) { |
| | |
| | | |
| | | 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 并没有实际作用,只是为了做迭代用,迭代出组件,屎山代码实在太难改了!!! |
| | | 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 并没有实际作用,只是为了做迭代用,迭代出组件,屎山代码实在太难改了!!! |
| | | 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({ |
| | |
| | | type: AnswerType.Text, |
| | | values: msgValue.question, |
| | | }, |
| | | attachList: convertAttach(msgValue), |
| | | isChecked: false, |
| | | }; |
| | | |