From 89323ef5405d9e1721b85afcba55984feb9d1942 Mon Sep 17 00:00:00 2001 From: wujingjing <gersonwu@qq.com> Date: 星期四, 04 七月 2024 17:59:51 +0800 Subject: [PATCH] 增加日期筛选;点踩接口对接;权限优化 --- src/components/chat/Chat.vue | 76 +++++++++++++++++++++++++++++++++----- 1 files changed, 66 insertions(+), 10 deletions(-) diff --git a/src/components/chat/Chat.vue b/src/components/chat/Chat.vue index 45bc70b..d09d425 100644 --- a/src/components/chat/Chat.vue +++ b/src/components/chat/Chat.vue @@ -11,11 +11,28 @@ <component class="max-w-[100ch]" :is="answerTypeMapCom[item.content.type]" :data="item.content.values" /> </div> - <!-- <div v-if="item.role === RoleEnum.assistant" class="absolute flex items-center right-0 space-x-2 mr-2 mt-2"> - <SvgIcon class="cursor-pointer" name="ele-CopyDocument" @click="copyClick(item.content)" /> - <SvgIcon class="cursor-pointer" name="ywicon icon-dianzan" /> - <SvgIcon class="cursor-pointer" :size="12" name="ywicon icon-buzan" /> - </div> --> + <div v-if="item.role === RoleEnum.assistant" class="absolute flex items-center right-0 mr-2 mt-2 space-x-2"> + <div class="flex items-center justify-center size-[15px]" v-if="item.content?.type === AnswerType.Text"> + <i + class="p-2 ywicon icon-copy cursor-pointer hover:text-[#0284ff] hover:!text-[18px]" + @click="copyClick(item.content.values)" + /> + </div> + <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> + <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> + </div> </div> <Loding v-else /> @@ -36,8 +53,8 @@ import useClipboard from 'vue-clipboard3'; import Loding from './components/Loding.vue'; import type { ChatContent } from './model/types'; -import { AnswerType, RoleEnum, answerTypeMapCom, roleImageMap, type ChatMessage } from './model/types'; -import { GetHistoryAnswer, QueryHistoryDetail, QuestionAi } from '/@/api/ai/chat'; +import { AnswerType, RoleEnum, answerTypeMapCom, roleImageMap, type ChatMessage, AnswerState } from './model/types'; +import { GetHistoryAnswer, QueryHistoryDetail, QuestionAi, SetHistoryAnswerState } from '/@/api/ai/chat'; import PlayBar from '/@/components/chat/components/playBar/PlayBar.vue'; import router from '/@/router'; import { activeChatRoom, activeLLMId, activeRoomId, activeSampleId, activeSectionAId } from '/@/stores/chatRoom'; @@ -95,6 +112,7 @@ return content; }; +let questionRes = null; const questionAi = async (text) => { if (!currentSectionId) { ElMessage.warning('鍙戦�佸け璐ワ紝鏈‘瀹氬簲鐢ㄥ満鏅紒'); @@ -116,6 +134,7 @@ } const res = await QuestionAi(params); + questionRes = res; // const res = { // json_ok: true, // question: '鏄ㄦ棩浜斾竴骞垮満鍘嬪姏', @@ -143,7 +162,7 @@ const scrollToBottom = () => { if (!chatListDom.value) return; - chatListDom.value.lasElementChild?.scrollIntoView(); + chatListDom.value.lastElementChild?.scrollIntoView(); }; let currentSectionId = null; let currentSampleId = null; @@ -173,15 +192,20 @@ } try { isTalking.value = true; + const userItem: ChatMessage = { role: RoleEnum.user, content } as any; + const assistantItem: ChatMessage = { role: RoleEnum.assistant, content: null, state: AnswerState.Null } as any; // 鍙戦�佸綋鍓� - messageList.value.push({ role: RoleEnum.user, content }); + messageList.value.push(userItem); // 娓呯┖杈撳叆妗� clearMessageContent(); + // 鍑虹幇鍥炲锛岀疆绌哄嚭鐜扮瓑寰呭姩鐢� - messageList.value.push({ role: RoleEnum.assistant, content: null }); + messageList.value.push(assistantItem); let resMsgContent: ChatContent = null; resMsgContent = await questionAi(content.values); + userItem.historyId = questionRes.history_id; + assistantItem.historyId = questionRes.history_id; appendLastMessageContent(resMsgContent); } catch (error: any) { appendLastMessageContent({ @@ -219,6 +243,7 @@ }); messageList.value = (res.details ?? []).map((item) => { return { + historyId: item.history_id, role: RoleEnum.user, content: { type: AnswerType.Text, @@ -234,8 +259,10 @@ resList.map((item, index) => { const insertIndex = index + 1 + i; messageList.value.splice(insertIndex, 0, { + historyId: item.answer.history_id, role: RoleEnum.assistant, content: parseContent(item.answer), + state: item.answer_state, }); i++; }); @@ -246,9 +273,11 @@ } ); +let forbidScroll = false; watch( messageList, () => { + if (forbidScroll) return; nextTick(() => scrollToBottom()); }, { @@ -264,6 +293,33 @@ ElMessage.success('澶嶅埗鎴愬姛'); toClipboard(content); }; + +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; + }); +}; //#endregion </script> -- Gitblit v1.9.3