| | |
| | | <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 /> |
| | |
| | | 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'; |
| | |
| | | return content; |
| | | }; |
| | | |
| | | let questionRes = null; |
| | | const questionAi = async (text) => { |
| | | if (!currentSectionId) { |
| | | ElMessage.warning('发送失败,未确定应用场景!'); |
| | |
| | | } |
| | | |
| | | const res = await QuestionAi(params); |
| | | questionRes = res; |
| | | // const res = { |
| | | // json_ok: true, |
| | | // question: '昨日五一广场压力', |
| | |
| | | |
| | | const scrollToBottom = () => { |
| | | if (!chatListDom.value) return; |
| | | chatListDom.value.lasElementChild?.scrollIntoView(); |
| | | chatListDom.value.lastElementChild?.scrollIntoView(); |
| | | }; |
| | | let currentSectionId = null; |
| | | let currentSampleId = null; |
| | |
| | | } |
| | | 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({ |
| | |
| | | }); |
| | | messageList.value = (res.details ?? []).map((item) => { |
| | | return { |
| | | historyId: item.history_id, |
| | | role: RoleEnum.user, |
| | | content: { |
| | | type: AnswerType.Text, |
| | |
| | | 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++; |
| | | }); |
| | |
| | | } |
| | | ); |
| | | |
| | | let forbidScroll = false; |
| | | watch( |
| | | messageList, |
| | | () => { |
| | | if (forbidScroll) return; |
| | | nextTick(() => scrollToBottom()); |
| | | }, |
| | | { |
| | |
| | | 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> |
| | | |