流更改

wujingjing

2024-11-06 768a63bdae68f9440d4b7f5768c3ea7f9308f2ab

 src/components/chat/Chat.vue

@@ -10,7 +10,7 @@
               <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"
                  v-for="(item, msgIndex) of computedMessageList"
                  :key="`${item.historyId}_${item.role}`"
               >
                  <div class="absolute top-0 left-[72px] text-[#8d8e99]">{{ item?.createTime }}</div>
@@ -51,7 +51,7 @@
                                    >
                                       <template
                                          #icon
                                          v-if="index + 1 === item.stepList.length && isTalking && index === computedMessageList.length - 1"
                                          v-if="index + 1 === item.stepList.length && isTalking && msgIndex === computedMessageList.length - 1"
                                       >
                                          <span class="ywifont ywicon-loading1 animate-spin !text-[24px]"></span>
                                       </template>
@@ -84,7 +84,12 @@
                                    </div>
                                 </div>
                                 <template v-else>
                                    <component :is="answerTypeMapCom[item.content.type]" :data="item.content.values" :originData="item" />
                                    <component
                                       :conclusion="item.conclusion"
                                       :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"
@@ -109,12 +114,12 @@
                              v-if="item.role === RoleEnum.user && item.content?.values"
                              class="absolute flex items-center right-0 mr-4 space-x-2"
                           >
                              <!-- <div class="flex items-center justify-center size-[20px]">
                              <div class="flex items-center justify-center size-[20px]">
                                 <i
                                    class="p-2 ywifont ywicon-copy cursor-pointer hover:text-[#0284ff] font-medium !text-[15px] hover:!text-[18px]"
                                    @click="copyUserClick(item)"
                                 />
                              </div> -->
                              </div>
                              <div class="flex items-center justify-center size-[20px]">
                                 <i
                                    class="p-2 ywifont ywicon-cubelifangti cursor-pointer hover:text-[#0284ff] text-[#000] font-[590] !text-[15px] hover:!text-[18px]"
@@ -217,19 +222,18 @@
<script setup lang="ts">
import _ from 'lodash';
import moment from 'moment';
import { v4 as uuidv4 } from 'uuid';
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 { convertProcessItem, useScrollLoad } from './hooks/useScrollLoad';
import { useScrollToBottom } from './hooks/useScrollToBottom';
import type { ChatContent, StepItem } from './model/types';
import { AnswerState, AnswerType, RoleEnum, answerTypeMapCom, roleImageMap, type ChatMessage, stepEnumMap } from './model/types';
import { QuestionAi, extCallQuery, questionStreamByPost } from '/@/api/ai/chat';
import { AnswerState, AnswerType, RoleEnum, answerTypeMapCom, roleImageMap, stepEnumMap, type ChatMessage } from './model/types';
import { extCallQuery, 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 router from '/@/router';
import {
   activeChatRoom,
@@ -242,7 +246,8 @@
   roomConfig,
} from '/@/stores/chatRoom';
import { ErrorCode } from '/@/utils/request';
import { Logger } from '/@/model/logger/Logger';
import { ElMessage } from 'element-plus';
import useClipboard from 'vue-clipboard3';
const chatWidth = '75%';
const voicePageIsShow = ref(false);
let isTalking = ref(false);
@@ -412,20 +417,42 @@
   // queryProcess();
   resetStep();
   let res = null;
   await questionStreamByPost(params, (chunkRes) => {
      Logger.info('chunk response：\n\n' + JSON.stringify(chunkRes));
      if (chunkRes.mode === 'result') {
         res = chunkRes.value;
      } else {
	
   const resultP = new Promise(async (resolve, reject) => {
      await questionStreamByPost(params, (chunkRes) => {
         Logger.info('chunk response：\n\n' + JSON.stringify(chunkRes));
         if (chunkRes.mode === 'result') {
            res = chunkRes.value;
            resolve(res);
            chunkRes.value = '准备数据分析';
         }

         if (chunkRes.mode === 'conclusion') {
            computedMessageList.value.at(-1).conclusion = chunkRes.value;
            chunkRes.value = '分析结束';
         }

         if (chunkRes.mode === 'finish') {
            isTalking.value = false;
            return;
         }

         const stepItem = convertProcessItem(chunkRes);
         computedMessageList.value.at(-1).stepList.push(stepItem);
         scrollToBottom();
      }
   }).finally(() => {
      computedMessageList.value.at(-1).stepIsShow = false;
      resetStep();
      })
         .catch((err) => {
            throw err;
         })
         .finally(() => {
            isTalking.value = false;

            computedMessageList.value.at(-1).stepIsShow = false;
            resetStep();
         });
   });
   questionRes = res;

   questionRes = await resultP;
   const content = parseContent(res);
   return content;
};
@@ -502,8 +529,6 @@
      //    type: AnswerType.Text,
      //    values: '发生错误！',
      // });
   } finally {
      isTalking.value = false;
   }
};

@@ -581,8 +606,9 @@
//显示上一条消息
const showUpChatClick = () => {
   if (computedMessageList.value.length === 0) return;
   if (currentIndex.value === null) {
      currentIndex.value = history_data.value.length - 1;
   if (currentIndex.value == 0) {
      messageContent.value.values = history_data.value[currentIndex.value].content.values;
      return;
   } else {
      currentIndex.value = (currentIndex.value + history_data.value.length - 1) % history_data.value.length;
   }
@@ -591,6 +617,10 @@
//显示下一条消息
const showDownChatClick = () => {
   if (computedMessageList.value.length === 0) return;
   if (currentIndex.value == history_data.value.length - 1) {
      messageContent.value.values = history_data.value[currentIndex.value].content.values;
      return;
   }
   if (currentIndex.value === null) {
      currentIndex.value = 0;
   } else {
@@ -628,8 +658,14 @@
//#endregion
//#region ====================== 用户询问的问题设置为常用语 ======================
const setCommonQuestionInfo = ref({});
const { toClipboard } = useClipboard();

//用户复制问题
const copyUserClick = () => {};
const copyUserClick = (item) => {
   const text = item.content.values;
   ElMessage.success('复制成功');
   toClipboard(text);
};
//用户问题设置为常用语
const setCommonQuestionClick = (item) => {
   setCommonQuestionInfo.value = item;