From 9089a59a073fd252cec25b45c735dc726f3ac3cf Mon Sep 17 00:00:00 2001
From: wujingjing <gersonwu@qq.com>
Date: 星期四, 24 十月 2024 11:35:33 +0800
Subject: [PATCH] isDayTime
---
src/components/chat/Chat.vue | 604 ++++++++++++++++++++++++++++--------------------------
1 files changed, 308 insertions(+), 296 deletions(-)
diff --git a/src/components/chat/Chat.vue b/src/components/chat/Chat.vue
index 90d3c0f..d853f77 100644
--- a/src/components/chat/Chat.vue
+++ b/src/components/chat/Chat.vue
@@ -1,131 +1,185 @@
<template>
- <div class="flex flex-col h-full">
- <div class="h-full flex flex-col items-center overflow-y-auto">
- <div ref="chatListDom" class="h-full" :style="{ width: chatWidth }">
- <div
- class="group flex px-4 py-6 hover:bg-slate-100 rounded-lg relative"
- :class="{ 'flex-row-reverse': item.role === RoleEnum.user }"
- v-for="(item, index) of computedMessageList"
- :key="index"
- >
- <img
- class="rounded-full size-12 flex-0"
- :class="{ 'mr-4': item.role === RoleEnum.assistant, 'ml-4': item.role === RoleEnum.user }"
- :src="roleImageMap[item.role]"
- alt=""
- srcset=""
- />
- <div class="flex-auto flex" :class="{ 'justify-end': item.role === RoleEnum.user }">
- <div class="inline-flex flex-col" :class="{ 'w-full': item.role === RoleEnum.assistant }">
- <div class="w-full" v-if="item.content?.values">
- <div
- class="text-sm rounded-[6px] p-4 leading-relaxed"
- :style="{ backgroundColor: item.role === RoleEnum.user ? 'rgb(197 224 255)' : 'white' }"
- >
- <div v-if="item.content.errCode === ErrorCode.Message" class="text-red-500 w-full">{{ item.content.msg }}</div>
- <component v-else :is="answerTypeMapCom[item.content.type]" :data="item.content.values" :originData="item" />
- </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 h-full">
+ <div class="flex flex-col h-full flex-auto">
+ <div ref="chatListDom" class="relative h-full flex flex-col items-center overflow-y-auto">
+ <span
+ class="more-loading absolute text-blue-400 left-[50%] translate-x-[-50%] cursor-pointer w-10"
+ v-loading="moreIsLoading"
+ ></span>
+ <div class="h-full" v-loading="chatListLoading" :style="{ width: chatWidth }">
+ <div
+ class="group flex px-4 py-6 hover:bg-slate-100 rounded-lg relative"
+ :class="{ 'flex-row-reverse': item.role === RoleEnum.user }"
+ v-for="(item, index) of computedMessageList"
+ :key="`${item.historyId}_${item.role}`"
+ >
+ <img
+ class="rounded-full size-12 flex-0"
+ :class="{ 'mr-4': item.role === RoleEnum.assistant, 'ml-4': item.role === RoleEnum.user }"
+ :src="roleImageMap[item.role]"
+ alt=""
+ srcset=""
+ />
+ <div class="flex-auto flex" :class="{ 'justify-end': item.role === RoleEnum.user }">
+ <div class="inline-flex flex-col" :class="{ 'w-full': item.role === RoleEnum.assistant }">
+ <div class="w-full" v-if="item.content?.values">
<div
- class="flex items-center justify-center size-[15px]"
- v-if="item.content?.type === AnswerType.Text || item.content?.type === AnswerType.Knowledge"
+ class="text-sm rounded-[6px] p-4 leading-relaxed"
+ :style="{ backgroundColor: item.role === RoleEnum.user ? 'rgb(197 224 255)' : 'white' }"
>
- <i class="p-2 ywicon icon-copy cursor-pointer hover:text-[#0284ff] hover:!text-[18px]" @click="copyClick(item)" />
- </div>
- <template v-if="item.content.errCode !== ErrorCode.Message">
- <div class="flex items-center justify-center size-[15px]">
- <i
- :class="{ 'text-[#0284ff]': item.state === AnswerState.Like }"
- class="p-2 ywicon icon-dianzan cursor-pointer hover:text-[#0284ff] font-medium hover:!text-[18px]"
- @click="likeClick(item)"
- />
+ <div v-if="item.content.errCode === ErrorCode.Message" class="flex-column w-full">
+ <p class="text-red-500">
+ {{ item.content.errMsg }}
+ </p>
+ <div class="mt-5 flex items-center" v-if="showFixQuestion(item)">
+ <div class="text-gray-600 flex-0">
+ {{ item.content.origin.err_json.fix_question.title + '锛�' }}
+ </div>
+ <div class="ml-1 space-x-2 inline-flex flex-wrap">
+ <div
+ 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(fixItem, item.content.origin)"
+ >
+ {{ fixItem.title }}
+ </div>
+ </div>
+ </div>
</div>
- <div class="flex items-center justify-center size-[15px]">
- <i
- :class="{ 'text-[#0284ff]': item.state === AnswerState.Unlike }"
- class="p-2 ywicon icon-buzan cursor-pointer hover:text-[#0284ff] !text-[13px] hover:!text-[15px]"
- @click="unLikeClick(item)"
- />
- </div>
- </template>
+ <template v-else>
+ <component :is="answerTypeMapCom[item.content.type]" :data="item.content.values" :originData="item" />
- <div class="flex items-center justify-center size-[15px] relative">
- <i
- class="p-2 ywicon icon-wentifankui cursor-pointer hover:text-[#0284ff] !text-[13px] hover:!text-[15px]"
- @click="
- ($event) =>
- feedbackClick(
- $event,
- item,
- computedMessageList
- .filter((v) => v.role === RoleEnum.assistant)
- .findIndex((v) => v.historyId === item.historyId)
- )
- "
- />
- <FeedbackPanel
- v-show="feedbackIsShow && currentFeedbackMapItem === item"
- ref="feedbackPanelRef"
- v-model:isShow="feedbackIsShow"
- v-model:content="feedbackContent"
- :chatItem="currentFeedbackMapItem"
- :position="feedbackPosition"
- />
+ <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]"
+ v-if="item.content?.type === AnswerType.Text || item.content?.type === AnswerType.Knowledge"
+ >
+ <i
+ class="p-2 ywifont ywicon-copy cursor-pointer hover:text-[#0284ff] hover:!text-[18px]"
+ @click="copyClick(item)"
+ />
+ </div>
+ <template v-if="item.content.errCode !== ErrorCode.Message">
+ <div class="flex items-center justify-center size-[15px]">
+ <i
+ :class="{ 'text-[#0284ff]': item.state === AnswerState.Like }"
+ class="p-2 ywifont ywicon-dianzan cursor-pointer hover:text-[#0284ff] font-medium hover:!text-[18px]"
+ @click="likeClick(item)"
+ />
+ </div>
+ <div class="flex items-center justify-center size-[15px]">
+ <i
+ :class="{ 'text-[#0284ff]': item.state === AnswerState.Unlike }"
+ class="p-2 ywifont ywicon-buzan cursor-pointer hover:text-[#0284ff] !text-[13px] hover:!text-[15px]"
+ @click="unLikeClick(item)"
+ />
+ </div>
+ </template>
+
+ <div class="flex items-center justify-center size-[15px] relative">
+ <i
+ class="p-2 ywifont ywicon-wentifankui cursor-pointer hover:text-[#0284ff] !text-[13px] hover:!text-[15px]"
+ @click="
+ ($event) =>
+ feedbackClick(
+ $event,
+ item,
+ computedMessageList
+ .filter((v) => v.role === RoleEnum.assistant)
+ .findIndex((v) => v.historyId === item.historyId)
+ )
+ "
+ />
+ <FeedbackPanel
+ v-show="feedbackIsShow && currentFeedbackMapItem === item"
+ ref="feedbackPanelRef"
+ v-model:isShow="feedbackIsShow"
+ v-model:content="feedbackContent"
+ :chatItem="currentFeedbackMapItem"
+ :position="feedbackPosition"
+ />
+ </div>
</div>
</div>
- </div>
- <Loding v-else class="w-fit" :process="process" />
+ <Loding v-if="isTalking && index === computedMessageList.length - 1" class="w-fit" :process="process" />
+ </div>
</div>
</div>
- </div>
- <div v-if="showAskMore" class="ml-4 mt-5 text-sm">
- <div class="text-gray-600 mb-5">浣犲彲浠ョ户缁棶鎴戯細</div>
- <div class="space-y-2 inline-flex flex-col">
- <div
- v-for="item in computedMessageList.at(-1).content.askMoreList"
- :key="item.history_id"
- class="bg-white p-3 hover:bg-[#c5e0ff] hover:text-[#1c86ff] cursor-pointer rounded-lg"
- @click="askMoreClick(item)"
- >
- {{ item.question }}
+ <div v-if="showAskMore" class="ml-4 mt-5 text-sm">
+ <div class="text-gray-600 mb-5">浣犲彲浠ョ户缁棶鎴戯細</div>
+ <div class="space-y-2 inline-flex flex-col">
+ <div
+ v-for="item in computedMessageList.at(-1).content.askMoreList"
+ :key="item.history_id"
+ class="bg-white p-3 hover:bg-[#c5e0ff] hover:text-[#1c86ff] cursor-pointer rounded-lg"
+ @click="askMoreClick(item)"
+ >
+ {{ item.question }}
+ </div>
</div>
</div>
</div>
</div>
+
+ <div class="sticky bottom-0 w-full p-6 pb-8 bg-[rgb(247,248,250)] flex justify-center">
+ <PlayBar
+ v-model:voicePageIsShow="voicePageIsShow"
+ :isTalking="isTalking"
+ :isHome="false"
+ v-model="messageContent.values"
+ @sendClick="sendClick"
+ :style="{ width: chatWidth }"
+ ></PlayBar>
+ </div>
</div>
- <div class="sticky bottom-0 w-full p-6 pb-8 bg-[rgb(247,248,250)] flex justify-center">
- <PlayBar
- :isTalking="isTalking"
- v-model="messageContent.values"
- @sendClick="sendChatMessage"
- :style="{ width: chatWidth }"
- ></PlayBar>
- </div>
+ <CustomDrawer v-model:isShow="drawerIsShow" @updateChatInput="updateChatInput" />
</div>
</template>
<script setup lang="ts">
-import { ElMessage } from 'element-plus';
-import { computed, nextTick, onActivated, onMounted, ref, watch } from 'vue';
-import useClipboard from 'vue-clipboard3';
-import Loding from './components/Loding.vue';
-import type { ChatContent } from './model/types';
-import { AnswerType, RoleEnum, answerTypeMapCom, roleImageMap, type ChatMessage, AnswerState } from './model/types';
-import { GetHistoryAnswer, QueryHistoryDetail, QuestionAi, SetHistoryAnswerState, getQuestionProcess } from '/@/api/ai/chat';
-import PlayBar from '/@/components/chat/components/playBar/PlayBar.vue';
-import router from '/@/router';
-import { activeChatRoom, activeLLMId, activeRoomId, activeSampleId, activeSectionAId, roomConfig } from '/@/stores/chatRoom';
-import { v4 as uuidv4 } from 'uuid';
import _ from 'lodash';
-import { ErrorCode } from '/@/utils/request';
+import { v4 as uuidv4 } from 'uuid';
+import { computed, onMounted, ref } from 'vue';
import FeedbackPanel from './components/FeedbackPanel.vue';
-import { useClickOther } from '/@/hooks/useClickOther';
+import Loding from './components/Loding.vue';
+import { useAssistantContentOpt } from './hooks/useAssistantContentOpt';
+import { useQueryProcess } from './hooks/useQueryProcess';
+import { useScrollLoad } from './hooks/useScrollLoad';
+import { useScrollToBottom } from './hooks/useScrollToBottom';
+import type { ChatContent } from './model/types';
+import { AnswerState, AnswerType, RoleEnum, answerTypeMapCom, roleImageMap, type ChatMessage } from './model/types';
+import { GetHistoryAnswer, QuestionAi, extCallQuery } from '/@/api/ai/chat';
+import PlayBar from '/@/components/chat/components/playBar/PlayBar.vue';
+import CustomDrawer from '/@/components/drawer/CustomDrawer.vue';
+import router from '/@/router';
+import { activeChatRoom, activeLLMId, activeSampleId, activeSectionAId, getRoomConfig, roomConfig } from '/@/stores/chatRoom';
+import { ErrorCode } from '/@/utils/request';
const chatWidth = '75%';
-
+const voicePageIsShow = ref(false);
let isTalking = ref(false);
let messageContent = ref<ChatContent>({
type: AnswerType.Text,
@@ -136,14 +190,7 @@
const chatListDom = ref<HTMLDivElement>();
const messageList = ref<ChatMessage[]>([]);
const computedMessageList = computed(() => {
- return messageList.value.filter((v) => v && v.role !== RoleEnum.system);
-});
-
-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;
+ return messageList.value.filter((v) => !!v);
});
const parseContent = (res) => {
@@ -201,65 +248,66 @@
}
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;
- });
-
- 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
+const { clearQueryProcess, process, processId, queryProcess } = useQueryProcess();
+const DEFAULT_SECTION_A_ID = 'knowledge_base';
let questionRes = null;
+
+let finalCalcSectionAId = null;
const questionAi = async (text) => {
- if (!currentSectionId) {
- ElMessage.warning('鍙戦�佸け璐ワ紝鏈‘瀹氬簲鐢ㄥ満鏅紒');
+ processId.value = uuidv4();
+ let judgeParams = null;
+ if (!preQuestion.value) {
+ // const aiContent = computedMessageList.value.filter((item) => item.role === RoleEnum.assistant);
+ // const lastQuestion = aiContent[aiContent.length - 2]?.content?.origin?.question;
+ // judgeParams = lastQuestion
+ // ? {
+ // prev_question: lastQuestion,
+ // }
+ // : {};
+ // 姝ｅ父鍥炵瓟鏆傛椂涓嶉噰鐢�
+ judgeParams = {};
+ } else {
+ judgeParams = {
+ prev_question: preQuestion.value,
+ };
}
- processId = uuidv4();
+ let currentSectionAId = '';
+ if (activeSectionAId.value) {
+ currentSectionAId = activeSectionAId.value;
+ activeSectionAId.value = '';
+ } else {
+ const lastSectionAItem = _.findLast(
+ computedMessageList.value as any,
+ (item) => item.role === RoleEnum.assistant && !!item.sectionAId
+ );
+ currentSectionAId = lastSectionAItem?.sectionAId ?? DEFAULT_SECTION_A_ID;
+ }
+ finalCalcSectionAId = currentSectionAId;
+
const params = {
- process_id: processId,
+ process_id: processId.value,
question: text,
// FIXME: 鏆傛椂杩欐牱
- section_a_id: currentSectionId,
+ section_a_id: currentSectionAId,
history_group_id: currentRouteId,
raw_mode: roomConfig.value?.[currentRouteId]?.isAnswerByLLM ?? false,
+ ...judgeParams,
} as any;
if (currentSampleId) {
params.sample_id = currentSampleId;
+ currentSampleId = '';
}
- if (currentLLMId) {
- params.llm_id = currentLLMId;
- }
+ // if (currentLLMId) {
+ // params.llm_id = currentLLMId;
+ // }
clearQueryProcess();
queryProcess();
const res = await QuestionAi(params).finally(() => {
@@ -276,24 +324,15 @@
values: '',
});
-const scrollToBottom = () => {
- if (!chatListDom.value) return;
- chatListDom.value.lastElementChild?.scrollIntoView();
-};
-let currentSectionId = null;
-let currentSampleId = null;
+let currentSampleId = '';
let currentLLMId = null;
-const getAnswerById = async (historyId: string) => {
- return await GetHistoryAnswer({
- history_id: historyId,
- });
-};
-const sendChatMessage = async (content: ChatContent = messageContent.value) => {
- if (!content?.values) return;
- if (messageList.value.length === 0) {
+const sendChatMessage = async (content: ChatContent = messageContent.value, cb?: any, isCallExtParams?: any) => {
+ if (!content?.values || isTalking.value || chatListLoading.value) return;
+ const isNewChat = messageList.value.length === 0;
+ if (isNewChat) {
if (activeSampleId.value) {
currentSampleId = activeSampleId.value;
}
@@ -301,11 +340,8 @@
if (activeLLMId.value) {
currentLLMId = activeLLMId.value;
}
-
- if (activeSectionAId.value) {
- currentSectionId = activeSectionAId.value;
- }
}
+ let resMsgContent: ChatContent = null;
try {
isTalking.value = true;
@@ -318,12 +354,32 @@
// 鍑虹幇鍥炲锛岀疆绌哄嚭鐜扮瓑寰呭姩鐢�
messageList.value.push(assistantItem);
+ // 婊氬姩鑷冲綋鍓嶅彂閫佹秷鎭�
+ scrollToBottom();
- let resMsgContent: ChatContent = null;
- resMsgContent = await questionAi(content.values);
+ if (isCallExtParams) {
+ const extRes = await extCallQuery(isCallExtParams);
+ questionRes = extRes;
+ resMsgContent = parseContent(extRes);
+ } else {
+ resMsgContent = await questionAi(content.values);
+ }
+ nextUserMsgEndIndex.value++;
+ if (isNewChat) {
+ const firstResCb = getRoomConfig(currentRouteId, 'firstResCb');
+ firstResCb?.(resMsgContent);
+ } else {
+ cb?.(resMsgContent);
+ }
userItem.historyId = questionRes.history_id;
+ userItem.content.values = questionRes?.question ?? userItem.content.values;
assistantItem.historyId = questionRes.history_id;
+ assistantItem.sectionAId = finalCalcSectionAId;
appendLastMessageContent(resMsgContent);
+ setTimeout(() => {
+ // 鏀跺埌鍥炲锛岀户缁粴
+ scrollToBottom();
+ }, 300);
} catch (error: any) {
// appendLastMessageContent({
// type: AnswerType.Text,
@@ -333,54 +389,36 @@
isTalking.value = false;
}
};
+
+const sendClick = (cb) => {
+ sendChatMessage(messageContent.value, cb);
+};
const appendLastMessageContent = (content: ChatContent) => {
if (messageList.value.at(-1)) {
messageList.value.at(-1).content = content;
}
};
+const { loadRangeData, onChatListScroll, moreIsLoading, nextUserMsgEndIndex } = useScrollLoad({
+ container: chatListDom,
+ historyGroupId: currentRouteId,
+ messageList,
+ parseAnswerContent: parseContent,
+});
-const askMoreClick = (item) => {
- if (!item.question) return;
- sendChatMessage({ type: AnswerType.Text, values: item.question });
-};
+const chatListLoading = ref(false);
+
+const { scrollToBottom } = useScrollToBottom({
+ chatListDom: chatListDom,
+});
onMounted(async () => {
- const res = await QueryHistoryDetail({
- history_group_id: currentRouteId,
- });
+ messageList.value = [];
+ // 鍔犺浇鍒濆鏁版嵁
+ chatListLoading.value = true;
- messageList.value = (res.details ?? []).map((item) => {
- return {
- historyId: item.history_id,
- role: RoleEnum.user,
- content: {
- type: AnswerType.Text,
- values: item.question,
- },
- } as ChatMessage;
+ await loadRangeData().finally(() => {
+ chatListLoading.value = false;
});
- currentSectionId = res?.details?.[0]?.section_a_id;
- currentSampleId = res?.details?.[0]?.sample_id;
- const resList = await Promise.all((res.details ?? []).map((item) => getAnswerById(item.history_id)));
- let i = 0;
-
- resList.map((item, index) => {
- const insertIndex = index + 1 + i;
- messageList.value.splice(
- insertIndex,
- 0,
- item.answer === null
- ? null
- : {
- historyId: item.answer?.history_id,
- role: RoleEnum.assistant,
- content: parseContent(item.answer),
- state: item.answer_state,
- }
- );
- i++;
- });
-
if (messageList.value.length === 0) {
messageContent.value = {
type: AnswerType.Text,
@@ -388,105 +426,79 @@
};
sendChatMessage();
- }
-});
-let forbidScroll = false;
-watch(
- messageList,
- () => {
- if (forbidScroll) return;
- nextTick(() => scrollToBottom());
- },
- {
- deep: true,
- }
-);
-
-onActivated(() => {
- if (forbidScroll) return;
- nextTick(() => scrollToBottom());
-});
-
-//#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;
+ setTimeout(() => {
+ // 鍒濆鐘舵�佹粴涓�涓�
+ scrollToBottom();
+
+ setTimeout(() => {
+ chatListDom.value.addEventListener('scroll', onChatListScroll);
+ }, 300);
+ }, 300);
}
- 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,
+ }
+ );
};
+//#endregion
-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 {
+ copyClick,
+ likeClick,
+ unLikeClick,
+ feedbackPosition,
+ feedbackIsShow,
+ feedbackContent,
+ feedbackPanelRef,
+ currentFeedbackMapItem,
+ feedbackClick,
+ askMoreClick,
+ fixQuestionClick,
+ preQuestion,
+ showFixQuestion,
+ showAskMore,
+} = useAssistantContentOpt({
+ sendChatMessage,
+ displayMessageList: computedMessageList,
});
-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,
- };
- });
+//#region ====================== 渚ц竟鏍廳rawer ======================
+const drawerIsShow = ref(false);
+
+const updateChatInput = (content) => {
+ messageContent.value.values = content;
};
-useClickOther(
- computed(() => feedbackPanelRef.value[curFeedbackIndex.value]),
- feedbackIsShow,
- () => {
- feedbackIsShow.value = false;
- feedbackContent.value = '';
- }
-);
//#endregion
</script>
-<style scoped>
+<style scoped lang="scss">
pre {
font-family: -apple-system, 'Noto Sans', 'Helvetica Neue', Helvetica, 'Nimbus Sans L', Arial, 'Liberation Sans', 'PingFang SC',
'Hiragino Sans GB', 'Noto Sans CJK SC', 'Source Han Sans SC', 'Source Han Sans CN', 'Microsoft YaHei', 'Wenquanyi Micro Hei',
'WenQuanYi Zen Hei', 'ST Heiti', SimHei, 'WenQuanYi Zen Hei Sharp', sans-serif;
}
+
+.more-loading {
+ :deep(.el-loading-spinner) {
+ --loading-size: 35px;
+ margin-top: 0;
+ .circular {
+ width: var(--loading-size);
+ height: var(--loading-size);
+ }
+ }
+}
</style>
--
Gitblit v1.9.3