fix: 修复智能数据样式异常的问题

src/modules/conversation-chat/DialogItem.vue

@@ -5,6 +5,7 @@
     <DialogAnswer
       v-if="item_type === 'a'"
       :answer="answerInfo"
+      :width="width"
       @stop="handleStopChat"
       @retry="handleRetryChat"
       @select="handleSelectChat"
@@ -19,7 +20,8 @@ import DialogQuestion from '../conversation-item/DialogQuestion.vue';
 import DialogAnswer from '../conversation-item/DialogAnswer.vue';
 
 const props = defineProps({
-  dialog: Object
+  dialog: Object,
+  width: Number
 });
 
 const emit = defineEmits(['stop', 'retry', 'select']);

src/modules/conversation-chat/DialogList.vue

@@ -5,6 +5,7 @@
         v-for="(item, index) of list"
         :dialog="item"
         :index="index"
+        :width="width"
         :key="item.client_custom_unique_id"
         @select="handleSelectChat(item)"
       />
@@ -23,6 +24,7 @@ import useScrollBottom from './use-scroll-bottom';
 
 const props = defineProps({
   height: Number,
+  width: Number,
 
   /**
    * 智能体的ID

src/modules/conversation-content/DialogContent.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="dialog-chat-answer-content">
+  <div class="dialog-chat-answer-content" :style="custom_style">
     <div v-if="is_loading">
       <a-spin></a-spin>
     </div>
@@ -27,7 +27,20 @@ const props = defineProps({
   /**
    * 状态值
    */
-  is_loading: Boolean
+  is_loading: Boolean,
+
+  /**
+   * 内容区域最大宽度
+   */
+  max_width: Number
+});
+
+const custom_style = computed(() => {
+  if (props.max_width) {
+    return `max-width: ${props.max_width}px;`;
+  } else {
+    ('');
+  }
 });
 </script>
 
@@ -40,4 +53,8 @@ const props = defineProps({
   /* box-shadow: 0 0 5px #dedede; */
   box-shadow: 0 0 5px var(--color-text-4);
 }
+
+.dialog-chat-answer-content code {
+  overflow-x: auto;
+}
 </style>

src/modules/conversation-item/DialogAnswer.vue

@@ -9,7 +9,7 @@
 
       <div class="dialog-content answer-content">
         <div>
-          <DialogContent :content="answer_html" :is_loading="is_content_loading">
+          <DialogContent :content="answer_html" :is_loading="is_content_loading" :max_width="content_max_width">
             <DialogActions
               v-if="answer_status === 2"
               class="answer-actions-btns"
@@ -61,7 +61,9 @@ const props = defineProps({
   /**
    * 答案内容数据
    */
-  answer: Object
+  answer: Object,
+
+  width: Number
 });
 
 const emit = defineEmits(['stop', 'retry', 'select']);
@@ -89,6 +91,13 @@ const is_content_loading = computed(() => {
   return answer_status.value === 0;
 });
 
+/**
+ * 内容区域的最大宽度
+ */
+const content_max_width = computed(() => {
+  return props.width - 40 - 40 - 20;
+});
+
 /**
  * 智能体回答的内容的html字符串
  * 是markdown格式

src/router/route.js

@@ -12,8 +12,8 @@ export const systemRoutes = [
   { path: '/noPer', component: () => import('../views/NoPer.vue') },
 
   // 会话
-  // { path: '/chat', redirect: '/chat/qa' },
-  { path: '/chat', component: () => import('../views/Conversation.vue') },
+  { path: '/chat', redirect: '/chat/qa' },
+  // { path: '/chat', component: () => import('../views/Conversation.vue') },
   { path: '/chat/qa', component: () => import('../views/ConversationQA.vue') },
   { path: '/chat/history', component: () => import('../views/ConversationHistory.vue') },
   { path: '/chat/board', component: () => import('../views/ConversationBoard.vue') },

src/views/conversation/ConversationChatContainer.vue

@@ -18,6 +18,7 @@
           ref="list_scroller"
           class="conversation-chat-area"
           :height="list_height"
+          :width="chat_width"
           :agent_id="agent_id"
           :list="chat_display_list"
           :suggestion="chat_suggestion"