feat: 基本实现文档出卷的逻辑

1. 智能体的回答新增一个系统消息的字段
2. 实现文档出卷的功能

src/modules/conversation-chat/DialogInputTop.vue

@@ -2,7 +2,7 @@
   <div class="dialog-input-area-top-container">
     <!-- 文档出卷 -->
     <template v-if="menu_id === 7">
-      <!-- <BtnIframeChujuan /> -->
+      <BtnIframeChujuan />
 
       <BtnConfigChujuan @confirm="handleChujuanConfirm" />
     </template>

src/modules/conversation-chat/DialogItem.vue

@@ -91,6 +91,9 @@ const answerInfo = computed(() => {
 
   obj.client_custom_attached_html_before_render = chat_info.client_custom_attached_html_before_render;
 
+  // 系统消息
+  obj.client_custom_running_msg = chat_info.client_custom_running_msg || '';
+
   return obj;
 });
 

src/modules/conversation-chujuan/ConversationChujuan.vue

@@ -152,12 +152,12 @@ const getFormFiledValues = () => {
     // key_words: form.count_keywords
   };
 
-  if (form.difficulty === 0 || form.difficulty === 1) {
-    obj.difficulty = form.difficulty;
+  if (form.difficulty === 1 || form.difficulty === 2) {
+    obj.difficulty = form.difficulty === 1 ? '简单' : '困难';
   }
 
   if (form.gen_paper === 0 || form.gen_paper === 1) {
-    obj.is_paper = form.gen_paper;
+    obj.is_paper = form.gen_paper === 1 ? '是' : '否';
   }
 
   // 单选数量

src/modules/conversation-dialog/format-dialog-answer-from-history.js

@@ -46,7 +46,12 @@ export default function formatDialogAnswerFromHistory(item, agentInfo) {
     client_custom_icon: icon_src,
 
     client_custom_unique_id: generateClientUniqueId(item.answer),
-    answer: item.answer
+    answer: item.answer,
+
+    // 在对话进行时，此字段用来承载系统消息
+    // 在历史记录中，此字段无意义，保持为空即可
+    // 在回答进行展示时，会展示此数据
+    client_custom_running_msg: ''
   };
 
   const resType = item.type;

src/modules/conversation-dialog/format-dialog-answer-from-websocket_receive_message.js

@@ -90,11 +90,14 @@ export default function formatDialogAnswerFromWebsocketReceiveMessage(message_st
     // 图标
     client_custom_icon: icon_src,
 
-    question: res_content.question // 用户的提问内容
+    question: res_content.question, // 用户的提问内容
 
     // answer: '', // 消息正文，markdown格式，需要进行解析
     // system: '', // 系统消息
 
+    // 进行中的消息: 系统消息
+    client_custom_running_msg: ''
+
     // file: '',
     // image_url: '',
     // code: '',
@@ -276,7 +279,8 @@ export default function formatDialogAnswerFromWebsocketReceiveMessage(message_st
     // 系统消息
     chat_status = 1;
 
-    currentMsg.answer = resMessage;
+    // currentMsg.answer = resMessage;
+    currentMsg.client_custom_running_msg = resMessage;
   }
 
   if (resType === 'close') {
@@ -284,6 +288,7 @@ export default function formatDialogAnswerFromWebsocketReceiveMessage(message_st
     chat_status = 2;
     currentMsg.client_custom_chat_status = 2; // 次轮会话已结束
     currentMsg.client_custom_chat_type = 1; // 修改消息类型
+    currentMsg.client_custom_running_msg = ''; // 已结束：系统消息不再展示
 
     // TODO: 合并原先的内容，形成最终结果
 

src/modules/conversation-item/DialogAnswer.vue

@@ -126,6 +126,12 @@ const content_max_width = computed(() => {
   return props.width - 40 - 40 - 20;
 });
 
+const system_message = computed(() => {
+  const answer = props.answer;
+
+  return answer.client_custom_running_msg || '';
+});
+
 /**
  * 智能体回答的内容的html字符串
  * 是markdown格式
@@ -177,12 +183,23 @@ const answer_html = computed(() => {
   //   answer_string = answer_string + download_file_str;
   // }
 
+  /**
+   * 系统消息展示
+   * 如果有系统消息，则展示系统消息
+   * 如果没有系统消息，则不用展示
+   */
+  const loader_str = `<div class="answer-system-message-content-container">${system_message.value} <span class="answer-system-message-content-loader"></span></div>`;
+
   /**
    * 所有步骤已经走完
    * 返回最终的html字符串
    * 此字符串就是要渲染到界面上的html字符串
    */
-  return answer_string;
+  if (system_message.value) {
+    return `${answer_string}${loader_str}`;
+  } else {
+    return answer_string;
+  }
 });
 
 /**
@@ -319,3 +336,39 @@ onMounted(() => {
   padding-right: 45px;
 }
 </style>
+
+<style>
+.answer-system-message-content-container {
+  display: flex;
+  align-items: center;
+}
+
+.answer-system-message-content-loader {
+  display: inline-block;
+
+  margin-left: 14px;
+
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+  background-color: #165dff;
+  box-shadow: 10px 0 #165dff, -10px 0 #165dff;
+  position: relative;
+  animation: flash 0.8s ease-out infinite alternate;
+}
+
+@keyframes flash {
+  0% {
+    background-color: #fff2;
+    box-shadow: 10px 0 #fff2, -10px 0 #165dff;
+  }
+  50% {
+    background-color: #165dff;
+    box-shadow: 10px 0 #fff2, -10px 0 #fff2;
+  }
+  100% {
+    background-color: #fff2;
+    box-shadow: 10px 0 #165dff, -10px 0 #fff2;
+  }
+}
+</style>