From 4bb81cc9f52eedf94a17a6318f57b785b0e02005 Mon Sep 17 00:00:00 2001
From: wujingjing <gersonwu@qq.com>
Date: 星期一, 19 八月 2024 09:53:03 +0800
Subject: [PATCH] prev_question test
---
src/components/chat/Chat.vue | 280 +++++++++++++++++++++-----------------------------------
1 files changed, 105 insertions(+), 175 deletions(-)
diff --git a/src/components/chat/Chat.vue b/src/components/chat/Chat.vue
index 6eb98d6..afa902f 100644
--- a/src/components/chat/Chat.vue
+++ b/src/components/chat/Chat.vue
@@ -25,30 +25,47 @@
>
<div v-if="item.content.errCode === ErrorCode.Message" class="flex-column w-full">
<p class="text-red-500">
- {{ item.content.msg }}
+ {{ item.content.errMsg }}
</p>
- <div
- class="mt-5 flex items-center"
- v-if="showFixQuestion"
- >
+ <div class="mt-5 flex items-center" v-if="showFixQuestion(item)">
<div class="text-gray-600 flex-0">
- {{ computedMessageList.at(-1).content.origin.err_json.fix_question.title + '锛�' }}
+ {{ item.content.origin.err_json.fix_question.title + '锛�' }}
</div>
<div class="ml-1 space-x-2 inline-flex flex-wrap">
<div
- v-for="item in computedMessageList.at(-1).content.origin.err_json.fix_question?.values"
- :key="item"
+ v-for="fixItem in item.content.origin.err_json.fix_question?.values"
+ :key="fixItem"
class="bg-gray-200 p-3 hover:bg-[#c5e0ff] hover:text-[#1c86ff] cursor-pointer rounded-lg"
- @click="fixQuestionClick(item)"
+ @click="fixQuestionClick(fixItem, item.content.origin)"
>
- {{ item.title }}
+ {{ fixItem.title }}
</div>
</div>
</div>
</div>
- <component v-else :is="answerTypeMapCom[item.content.type]" :data="item.content.values" :originData="item" />
+ <template v-else>
+ <component :is="answerTypeMapCom[item.content.type]" :data="item.content.values" :originData="item" />
+
+ <div
+ v-if="item.role === RoleEnum.assistant && item.content.origin?.ext_call_list"
+ class="flex font-bold items-center mt-6"
+ >
+ <div class="flex-0 mb-auto -mr-4">鍏宠仈鍔熻兘锛�</div>
+ <div class="space-x-5 flex flex-wrap">
+ <div
+ v-for="callItem in item.content.origin?.ext_call_list"
+ :key="callItem.call_ext_id"
+ @click="relativeQueryClick(callItem)"
+ class="cursor-pointer hover:underline first-of-type:ml-5"
+ >
+ {{ callItem.question }}
+ </div>
+ </div>
+ </div>
+ </template>
</div>
+ <!-- 鎿嶄綔 -->
<div v-if="item.role === RoleEnum.assistant" class="absolute flex items-center right-0 mr-4 mt-2 space-x-2">
<div
class="flex items-center justify-center size-[15px]"
@@ -142,16 +159,17 @@
import { ElMessage } from 'element-plus';
import _ from 'lodash';
import { v4 as uuidv4 } from 'uuid';
-import { computed, nextTick, onActivated, onMounted, ref, watch } from 'vue';
-import useClipboard from 'vue-clipboard3';
+import { computed, onMounted, ref } from 'vue';
import FeedbackPanel from './components/FeedbackPanel.vue';
import Loding from './components/Loding.vue';
+import { useAssistantContentOpt } from './hooks/useAssistantContentOpt';
+import { useQueryProcess } from './hooks/useQueryProcess';
+import { useScrollToBottom } from './hooks/useScrollToBottom';
import type { ChatContent } from './model/types';
import { AnswerState, AnswerType, RoleEnum, answerTypeMapCom, roleImageMap, type ChatMessage } from './model/types';
-import { GetHistoryAnswer, QueryHistoryDetail, QuestionAi, SetHistoryAnswerState, getQuestionProcess } from '/@/api/ai/chat';
+import { GetHistoryAnswer, QueryHistoryDetail, QuestionAi, extCallQuery } from '/@/api/ai/chat';
import PlayBar from '/@/components/chat/components/playBar/PlayBar.vue';
import CustomDrawer from '/@/components/drawer/CustomDrawer.vue';
-import { useClickOther } from '/@/hooks/useClickOther';
import router from '/@/router';
import { activeChatRoom, activeLLMId, activeSampleId, activeSectionAId, getRoomConfig, roomConfig } from '/@/stores/chatRoom';
import { ErrorCode } from '/@/utils/request';
@@ -168,22 +186,9 @@
const chatListDom = ref<HTMLDivElement>();
const messageList = ref<ChatMessage[]>([]);
const computedMessageList = computed(() => {
- return messageList.value.filter((v) => v && v.role !== RoleEnum.system);
+ return messageList.value.filter((v) => !!v);
});
-const showAskMore = computed(() => {
- if (!computedMessageList.value || computedMessageList.value.length === 0) return false;
- const last = computedMessageList.value.at(-1);
- const isShow = last?.role === RoleEnum.assistant && last?.content?.values && last.content?.askMoreList?.length > 0;
- return isShow;
-});
-
-const showFixQuestion = computed(() => {
- if (!computedMessageList.value || computedMessageList.value.length === 0) return false;
- const last = computedMessageList.value.at(-1);
- const isShow = last?.role === RoleEnum.assistant && last?.content?.values && last.content?.origin?.err_json?.fix_question;
- return isShow;
-});
const parseContent = (res) => {
if (!res) return null;
let content: ChatContent = {
@@ -239,58 +244,46 @@
}
content.askMoreList = _.orderBy(res.context_history, [(item) => Number(item.radio)], ['desc']);
content.errCode = res?.err_code;
- content.msg = res?.json_msg;
+ content.errMsg = res?.json_msg;
content.origin = res;
return content;
};
-//#region ====================== 鏌ヨ杩涘害 ======================
-let processId = '';
-const QUERY_PROCESS_INTERVAL = 1000;
-const process = ref('');
-let processTimer = null;
-let finishProcess = true;
-const queryProcessApi = async () => {
- const res = await getQuestionProcess({
- process_id: processId,
- }).catch((err) => {
- process.value = err;
- });
+const { clearQueryProcess, process, processId, queryProcess } = useQueryProcess();
- process.value = res.process;
- finishProcess = true;
-};
-
-const queryProcess = () => {
- processTimer = setInterval(() => {
- if (!finishProcess) return;
- finishProcess = false;
- queryProcessApi();
- }, QUERY_PROCESS_INTERVAL);
-};
-
-const clearQueryProcess = () => {
- process.value = '';
- clearInterval(processTimer);
-};
-
-//#endregion
-
-let isNextChat = false;
let questionRes = null;
const questionAi = async (text) => {
if (!currentSectionId) {
ElMessage.warning('鍙戦�佸け璐ワ紝鏈‘瀹氬簲鐢ㄥ満鏅紒');
}
- processId = uuidv4();
+ processId.value = uuidv4();
+ let judgeParams = null;
+ if (!preQuestion.value) {
+ const userContent = computedMessageList.value.filter((item) => item.role === RoleEnum.user);
+ const lastQuestion = userContent[userContent.length - 2]?.content?.values;
+ judgeParams = lastQuestion
+ ? {
+ prev_question: lastQuestion,
+ }
+ : {};
+ } else {
+ judgeParams = {
+ prev_question: preQuestion.value,
+ };
+ }
+ // const judgeParams = !preQuestion.value
+ // ? {}
+ // : {
+ // prev_question: preQuestion.value,
+ // };
const params = {
- process_id: processId,
+ process_id: processId.value,
question: text,
// FIXME: 鏆傛椂杩欐牱
section_a_id: currentSectionId,
history_group_id: currentRouteId,
raw_mode: roomConfig.value?.[currentRouteId]?.isAnswerByLLM ?? false,
- next_chat: isNextChat,
+ ...judgeParams,
} as any;
if (currentSampleId) {
@@ -316,10 +309,6 @@
values: '',
});
-const scrollToBottom = () => {
- if (!chatListDom.value) return;
- chatListDom.value.lastElementChild?.scrollIntoView();
-};
let currentSectionId = null;
let currentSampleId = null;
@@ -331,7 +320,7 @@
});
};
-const sendChatMessage = async (content: ChatContent = messageContent.value, cb?: any) => {
+const sendChatMessage = async (content: ChatContent = messageContent.value, cb?: any, isCallExtParams?: any) => {
if (!content?.values) return;
const isNewChat = messageList.value.length === 0;
if (isNewChat) {
@@ -360,8 +349,14 @@
// 鍑虹幇鍥炲锛岀疆绌哄嚭鐜扮瓑寰呭姩鐢�
messageList.value.push(assistantItem);
+ if (isCallExtParams) {
+ const extRes = await extCallQuery(isCallExtParams);
+ questionRes = extRes;
+ resMsgContent = parseContent(extRes);
+ } else {
+ resMsgContent = await questionAi(content.values);
+ }
- resMsgContent = await questionAi(content.values);
if (isNewChat) {
const firstResCb = getRoomConfig(currentRouteId, 'firstResCb');
firstResCb?.(resMsgContent);
@@ -387,24 +382,6 @@
const appendLastMessageContent = (content: ChatContent) => {
if (messageList.value.at(-1)) {
messageList.value.at(-1).content = content;
- }
-};
-
-const askMoreClick = (item) => {
- if (!item.question) return;
- sendChatMessage({ type: AnswerType.Text, values: item.question });
-};
-
-const fixQuestionClick = (item) => {
- if (!item.question) return;
- isNextChat = true;
- try {
- sendChatMessage({
- type: AnswerType.Text,
- values: item.question,
- });
- } finally {
- isNextChat = false;
}
};
@@ -454,98 +431,51 @@
sendChatMessage();
}
});
-let forbidScroll = false;
-watch(
- messageList,
- () => {
- if (forbidScroll) return;
- nextTick(() => scrollToBottom());
- },
- {
- deep: true,
- }
-);
-onActivated(() => {
- if (forbidScroll) return;
- nextTick(() => scrollToBottom());
+const { forbidScroll } = useScrollToBottom({
+ chatListDom: chatListDom,
+ displayMessageList: computedMessageList,
});
-//#region ====================== 鑱婂ぉ鍐呭鎿嶄綔 ======================
-
-const { toClipboard } = useClipboard();
-
-const copyClick = (item) => {
- const type = item.content.type;
- let text = '';
- if (type === AnswerType.Knowledge) {
- text = item.content.values?.map((item) => item.answer).join('\n\n') ?? '';
- } else {
- text = item.content.values;
- }
- ElMessage.success('澶嶅埗鎴愬姛');
- toClipboard(text);
+//#region ====================== 鍏宠仈鏌ヨ ======================
+const relativeQueryClick = async (val) => {
+ sendChatMessage(
+ {
+ type: AnswerType.Text,
+ values: val.question,
+ },
+ undefined,
+ {
+ history_group_id: currentRouteId,
+ question: val.question,
+ call_ext_id: val.call_ext_id,
+ call_ext_args: val.agrs ? JSON.stringify(val.agrs) : null,
+ }
+ );
};
-
-const likeClick = async (item) => {
- const toSetState = item.state === AnswerState.Like ? AnswerState.Null : AnswerState.Like;
- const res = await SetHistoryAnswerState({
- history_id: item.historyId,
- answer_state: toSetState,
- });
- item.state = toSetState;
- forbidScroll = true;
- nextTick(() => {
- forbidScroll = false;
- });
-};
-
-const unLikeClick = async (item) => {
- const toSetState = item.state === AnswerState.Unlike ? AnswerState.Null : AnswerState.Unlike;
- const res = await SetHistoryAnswerState({
- history_id: item.historyId,
- answer_state: toSetState,
- });
- item.state = toSetState;
-
- forbidScroll = true;
- nextTick(() => {
- forbidScroll = false;
- });
-};
-const feedbackPosition = ref({
- x: 0,
- y: 0,
-});
-
-const feedbackIsShow = ref(false);
-const feedbackContent = ref('');
-const feedbackPanelRef = ref<HTMLDivElement>(null);
-const currentFeedbackMapItem = ref(null);
-const curFeedbackIndex = ref(0);
-const feedbackClick = async (e, item, index) => {
- currentFeedbackMapItem.value = item;
- curFeedbackIndex.value = index;
- const offsetX = -4;
- const offsetY = -8;
- feedbackIsShow.value = true;
- nextTick(() => {
- feedbackPosition.value = {
- x: -feedbackPanelRef.value[index].$el.clientWidth + offsetX,
- y: -feedbackPanelRef.value[index].$el.clientHeight + offsetY,
- };
- });
-};
-useClickOther(
- computed(() => feedbackPanelRef.value[curFeedbackIndex.value]),
- feedbackIsShow,
- () => {
- feedbackIsShow.value = false;
- feedbackContent.value = '';
- }
-);
//#endregion
+const {
+ copyClick,
+ likeClick,
+ unLikeClick,
+ feedbackPosition,
+ feedbackIsShow,
+ feedbackContent,
+ feedbackPanelRef,
+ currentFeedbackMapItem,
+ feedbackClick,
+ askMoreClick,
+ fixQuestionClick,
+ preQuestion,
+ showFixQuestion,
+ showAskMore,
+} = useAssistantContentOpt({
+ forbidScroll,
+ sendChatMessage,
+ displayMessageList: computedMessageList,
+});
+
//#region ====================== 渚ц竟鏍廳rawer ======================
const drawerIsShow = ref(false);
--
Gitblit v1.9.3