wujingjing
2024-12-30 94987be3aa966ebeb08896db96265405db4eb476
src/components/chat/Chat.vue
@@ -3,7 +3,6 @@
      :loading="chatListLoading"
      :more-is-loading="moreIsLoading"
      :is-share-page="isSharePage"
      :is-share-check="isShareCheck"
      :chat-width="chatWidth"
      ref="containerRef"
   >
@@ -37,7 +36,7 @@
                              <!-- <template v-if="item.content?.values"> -->
                              <!-- #region ====================== 报错信息 ======================-->
                              <div v-if="item.content?.errCode === ErrorCode.Message" class="flex-column w-full">
                                 <p class="text-red-500">
                                 <p class="text-danger">
                                    {{ item.content.errMsg }}
                                 </p>
                                 <div class="mt-3 flex" v-if="showFixQuestion(item)">
@@ -60,114 +59,122 @@
                              <!-- #region ====================== 回答组件 ======================-->
                              <template v-else>
                                 <template v-if="item.content.type === AnswerType.Report">
                                    <div v-for="(num, index) in item?.stepGroup?.length" :key="index">
                                       <!-- #region ====================== 意图分析 ======================-->
                                       <div class="flex flex-col" v-if="item?.stepGroup?.[index]?.value?.length > 0">
                                    <template v-if="item?.stepGroup?.length > 0">
                                       <div v-for="(num, index) in item?.stepGroup?.length" :key="index">
                                          <!-- #region ====================== 意图分析 ======================-->
                                          <div class="flex items-center">
                                             <span class="mr-2">意图分析:</span>
                                             <div
                                                @click="toggleStepList(item?.stepGroup?.[index])"
                                                class="cursor-pointer border border-gray-300 border-solid w-fit px-2 flex items-center space-x-2 rounded-lg hover:bg-gray-100 active:bg-gray-200"
                                             >
                                                <span>
                                                   {{ toggleStepLabel(item?.stepGroup?.[index]) }}
                                                </span>
                                                <span
                                                   class="ywifont"
                                                   :class="{
                                                      'ywicon-unfold': !item?.stepGroup?.[index].isShow,
                                                      'ywicon-fold': item?.stepGroup?.[index].isShow,
                                                   }"
                                                ></span>
                                             </div>
                                          </div>
                                          <!-- #endregion -->
                                          <!-- #region ====================== 过程输出 ======================-->
                                          <el-steps v-show="item?.stepGroup?.[index].isShow" class="mt-3" direction="vertical" :active="activeStep">
                                             <el-step
                                                :key="`template-${stepIndex}`"
                                                v-for="(subItem, stepIndex) in item?.stepGroup?.[index].value"
                                                :title="subItem.title"
                                                :status="stepEnumMap[subItem.status]"
                                             >
                                                <template
                                                   #icon
                                                   v-if="
                                                      stepIndex + 1 === item?.stepGroup?.[index].value.length &&
                                                      isTalking &&
                                                      msgIndex === computedMessageList.length - 1
                                                   "
                                          <div class="flex flex-col" v-if="item?.stepGroup?.[index]?.value?.length > 0">
                                             <!-- #region ====================== 意图分析 ======================-->
                                             <div class="flex items-center">
                                                <span class="mr-2">意图分析:</span>
                                                <div
                                                   @click="toggleStepList(item?.stepGroup?.[index])"
                                                   class="cursor-pointer border border-gray-300 border-solid w-fit px-2 flex items-center space-x-2 rounded-lg hover:bg-gray-100 active:bg-gray-200"
                                                >
                                                   <span class="ywifont ywicon-loading1 animate-spin !text-[24px]"></span>
                                                </template>
                                                <template #title>
                                                   <span class="">
                                                      {{ subItem.title }}
                                                   <span>
                                                      {{ toggleStepLabel(item?.stepGroup?.[index]) }}
                                                   </span>
                                                   <span
                                                      class="ywifont"
                                                      :class="{
                                                         'ywicon-unfold': !item?.stepGroup?.[index].isShow,
                                                         'ywicon-fold': item?.stepGroup?.[index].isShow,
                                                      }"
                                                   ></span>
                                                </div>
                                             </div>
                                             <!-- #endregion -->
                                                      <span v-if="subItem.ms" class="text-green-600">{{ `(${subItem.ms})` }}</span></span
                                             <!-- #region ====================== 过程输出 ======================-->
                                             <el-steps
                                                v-show="item?.stepGroup?.[index].isShow"
                                                class="mt-3"
                                                direction="vertical"
                                                :active="activeStep"
                                             >
                                                <el-step
                                                   :key="`template-${stepIndex}`"
                                                   v-for="(subItem, stepIndex) in item?.stepGroup?.[index].value"
                                                   :title="subItem.title"
                                                   :status="stepEnumMap[subItem.status]"
                                                >
                                                   <template
                                                      #icon
                                                      v-if="
                                                         stepIndex + 1 === item?.stepGroup?.[index].value.length &&
                                                         isTalking &&
                                                         msgIndex === computedMessageList.length - 1
                                                      "
                                                   >
                                                </template>
                                                      <span class="ywifont ywicon-loading1 animate-spin !text-[24px]"></span>
                                                   </template>
                                                   <template #title>
                                                      <span class="">
                                                         {{ subItem.title }}
                                                <template #description v-if="subItem?.subStep?.length > 0">
                                                   <div class="my-1 flex flex-col gap-1 text-[14px]">
                                                      <div
                                                         :key="`${item.historyId}-${stepIndex + 1}-${multiChatIndex + 1}`"
                                                         v-for="(multiChatItem, multiChatIndex) in subItem.subStep"
                                                         <span v-if="subItem.ms" class="text-green-600">{{ `(${subItem.ms})` }}</span></span
                                                      >
                                                         <component
                                                            v-if="multiChatItem.type === MultiChatType.Select"
                                                            :order="`${stepIndex + 1}-${multiChatIndex + 1}`"
                                                            :item="multiChatItem"
                                                            :is="multiChatTypeMapCom[multiChatItem.type]"
                                                            :disabled="
                                                               !(
                                                                  stepIndex + 1 === item?.stepGroup?.[index].value.length &&
                                                                  isTalking &&
                                                                  msgIndex === computedMessageList.length - 1
                                                               )
                                                            "
                                                         />
                                                         <component
                                                            v-else-if="multiChatItem.type === MultiChatType.Result"
                                                            :is="answerTypeMapCom['summary']"
                                                            :data="multiChatItem.data.content.values"
                                                            :originData="multiChatItem.data"
                                                         />
                                                         <div v-else-if="multiChatItem.type === MultiChatType.Summary" class="ml-4 mt-5 pb-10">
                                                            <div class="text-gray-600 mb-5">你可以继续问我:</div>
                                                            <div class="space-y-2 inline-flex flex-col">
                                                               <div
                                                                  v-for="item in multiChatItem.data.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 }}
                                                   </template>
                                                   <template #description v-if="subItem?.subStep?.length > 0">
                                                      <div class="my-1 flex flex-col gap-1 text-[14px]">
                                                         <div
                                                            :key="`${item.historyId}-${stepIndex + 1}-${multiChatIndex + 1}`"
                                                            v-for="(multiChatItem, multiChatIndex) in subItem.subStep"
                                                         >
                                                            <component
                                                               v-if="multiChatItem.type === MultiChatType.Select"
                                                               :order="`${stepIndex + 1}-${multiChatIndex + 1}`"
                                                               :item="multiChatItem"
                                                               :is="multiChatTypeMapCom[multiChatItem.type]"
                                                               :disabled="
                                                                  !(
                                                                     stepIndex + 1 === item?.stepGroup?.[index].value.length &&
                                                                     isTalking &&
                                                                     msgIndex === computedMessageList.length - 1
                                                                  )
                                                               "
                                                            />
                                                            <component
                                                               v-else-if="multiChatItem.type === MultiChatType.Result"
                                                               :is="answerTypeMapCom['summary']"
                                                               :data="multiChatItem.data.content.values"
                                                               :originData="multiChatItem.data"
                                                            />
                                                            <div v-else-if="multiChatItem.type === MultiChatType.Summary" class="ml-4 mt-5 pb-10">
                                                               <div class="text-gray-600 mb-5">你可以继续问我:</div>
                                                               <div class="space-y-2 inline-flex flex-col">
                                                                  <div
                                                                     v-for="item in multiChatItem.data.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>
                                                </template>
                                             </el-step>
                                          </el-steps>
                                                   </template>
                                                </el-step>
                                             </el-steps>
                                             <!-- #endregion -->
                                          </div>
                                          <!-- #endregion -->
                                       </div>
                                       <!-- #endregion -->
                                       <component
                                          v-if="item.content?.values?.[index]"
                                          :reportIndex="index"
                                          :conclusion="item.content.values[index].conclusion"
                                          :is="answerTypeMapCom[item.content.values[index].content.type]"
                                          :data="item.content.values[index].content.values"
                                          :originData="item.content.values[index]"
                                          :historyId="item.historyId"
                                          :isTalking="isTalking && msgIndex === computedMessageList.length - 1"
                                       />
                                    </div>
                                          <component
                                             v-if="item.content?.values?.[index]"
                                             :reportIndex="index"
                                             :conclusion="item.content.values[index].conclusion"
                                             :is="answerTypeMapCom[item.content.values[index].content.type]"
                                             :data="item.content.values[index].content.values"
                                             :originData="item.content.values[index]"
                                             :historyId="item.historyId"
                                             :isTalking="isTalking && msgIndex === computedMessageList.length - 1"
                                          />
                                       </div>
                                    </template>
                                    <p v-else class="text-info">暂无内容,请重试</p>
                                 </template>
                                 <component
                                    v-else
@@ -416,7 +423,9 @@
      type: AnswerType.Text,
      values: '解析失败!',
   };
   if (res.type) {
      res.answer_type = res.type;
   }
   const curExtraContent = parseExtraContent(res);
   switch (res.answer_type) {
@@ -430,6 +439,12 @@
         content = {
            type: AnswerType.Text,
            values: res.values ?? res.answer,
         };
         break;
      case AnswerType.Script:
         content = {
            type: AnswerType.Script,
            values: res,
         };
         break;
@@ -563,6 +578,19 @@
   const resultP = new Promise((resolve, reject) => {
      const currentSource = axios.CancelToken.source();
      lastAxiosSource = currentSource;
      const getResReport = () => {
         const resReport = {
            answer_type: AnswerType.Report,
            reports: [],
         };
         return resReport;
      };
      const checkReportEmpty = () => {
         const isEmpty = !questionRes?.reports || questionRes?.reports?.length === 0;
         return isEmpty;
      };
      questionStreamByPost(
         params,
         (chunkRes) => {
@@ -572,11 +600,9 @@
               lastIsResult = true;
               const res = chunkRes.value;
               if (!questionRes?.reports || questionRes?.reports?.length === 0) {
                  const resReport = {
                     answer_type: AnswerType.Report,
                     reports: [res],
                  };
               if (checkReportEmpty()) {
                  const resReport = getResReport();
                  resReport.reports.push(res);
                  questionRes = resReport;
                  resolve(resReport);
               } else {
@@ -596,6 +622,12 @@
            if (chunkRes.mode === 'summary') {
               const lastMsg = computedMessageList.value.at(-1);
               const extraContent = parseExtraContent(chunkRes.value);
               const isReportEmpty = checkReportEmpty();
               // 没有经过 result 报告还没初始化
               if (isReportEmpty) {
                  const resReport = getResReport();
                  questionRes = resReport;
               }
               // 此对话已经加入到对话列表
               if (lastMsg.content?.values && extraContent) {
                  for (const key in extraContent) {
@@ -624,6 +656,10 @@
                     ...chunkRes.value,
                  };
               }
               if (isReportEmpty) {
                  resolve(questionRes);
               }
               // computedMessageList.value[computedMessageList.value.length - 1] = finalMsg;
               scrollToBottom();
               // chunkRes.value = '你可以继续问我';
@@ -638,7 +674,7 @@
                  chunkRes.value = '分析结束';
               }
            }
            if (chunkRes.mode === 'question') {
               const lastGroup = computedMessageList.value.at(-1).stepGroup.at(-1);
               const stepList = lastGroup?.value ?? [];