style: 修改AI BOT 相关样式

src/components/AIRobot/src/AIRobot.vue

@@ -14,7 +14,7 @@ const DeQuestions = ref([])
 const itemGroups = ref([])
 
 const AIRobotInit = () => {
-  $api.AIRobotInit({}).then((res:any) => {
+  $api.AIRobotInit({}).then((res: any) => {
     DeQuestions.value = res.data.fixed_question
     prepareGroups()
   })
@@ -230,7 +230,7 @@ defineExpose({
 }
 .AIRobot-top {
   position: absolute;
-  z-index: 2013;
+  z-index: 1999;
   right: 35px;
   bottom: 188px;
 }
@@ -272,7 +272,7 @@ defineExpose({
   background: var(--color-dialogue-icon-bg);
   position: absolute;
   box-shadow: -2px 2px 12px rgba(0, 0, 0, 15%);
-  z-index: 2013;
+  z-index: 1999;
   right: 10px;
   bottom: 130px;
   img {

src/components/ScoringGrade/src/ScoringGrade.vue

@@ -412,7 +412,7 @@ div.scoring {
   background-color: var(--management-bg-color);
   position: absolute;
   box-shadow: -2px 2px 12px rgba(0, 0, 0, 15%);
-  z-index: 2013;
+  z-index: 1999;
   right: 10px;
   bottom: 64px;
   display: flex;

src/styles/index.scss

@@ -56,12 +56,3 @@
 .icon_dark {
   fill: var(--color-neutral-1);
 }
-div.markdown-body {
-  background: transparent;
-  table {
-    th,
-    td {
-      white-space: nowrap;
-    }
-  }
-}

src/styles/reset.scss

@@ -134,6 +134,23 @@ div {
     margin: 0;
   }
 }
+div.markdown-body {
+  background: transparent;
+  table {
+    th,
+    td {
+      white-space: nowrap;
+    }
+  }
+}
+
+.query-style {
+  .markdown-body {
+    p {
+      color: #b5b9bf;
+    }
+  }
+}
 
 .markdown-body {
   display: inline-block;
@@ -153,6 +170,7 @@ div {
   font-weight: bold;
 }
 .markdown-body p {
+  font-size: 14px;
   margin: 1em 0;
 }
 

src/views/AIRobotChat/src/AIRobotChat.vue

@@ -98,6 +98,10 @@ const isShowTips = ref(false) // 是否展示提示信息
 
 const isShowLoadingDots = ref(false) // 是否展示加载点
 const parseHtmlString = (data) => {
+  if (!data) {
+    isShowLoadingDots.value = false // 停止显示加载点
+    return
+  }
   const lines = data.split('\n')
   isShowLoadingDots.value = true // 开始显示加载点
   function streamMarkdown() {
@@ -168,6 +172,9 @@ const aiChat = (question, isPresetQuestion) => {
       } else {
         loadingAnswer.value = false
         messages.value[messages.value.length - 1].isError = true
+        messages.value[messages.value.length - 1].content = progressStatus[120]
+        clearInterval(progressInterval.value)
+        queryTime.value = -1
       }
     })
 }
@@ -229,6 +236,7 @@ const handleSend = (question, isPresetQuestion = true, isExternal = false) => {
     }
   }, 1000)
 }
+
 const showScrollButton = ref(false) // 控制按钮显示
 const messagesRef = ref()
 const autoScroll = ref(true)
@@ -325,17 +333,23 @@ defineExpose({
       <div class="header">
         <span class="welcome">Hi! I'm your Freight Assistant</span>
         <div class="option-icon">
-          <span
-            v-if="modalSize === 'large'"
-            class="font_family icon-icon_sidebar__window_b"
-            @click="modalSize = 'small'"
-          ></span>
-          <span
-            v-else-if="modalSize !== 'large'"
-            class="font_family icon-icon_maximized__window_b"
-            @click="modalSize = 'large'"
-          ></span>
-          <span @click="handleClose" class="font_family icon-icon_collapsed__to_widget_b"></span>
+          <el-tooltip v-if="modalSize === 'large'" trigger="hover" content="Sidebar Window">
+            <span
+              class="font_family icon-icon_sidebar__window_b"
+              @click="modalSize = 'small'"
+            ></span>
+          </el-tooltip>
+
+          <el-tooltip v-else-if="modalSize !== 'large'" trigger="hover" content="Maximized Window"
+            ><span
+              class="font_family icon-icon_maximized__window_b"
+              @click="modalSize = 'large'"
+            ></span>
+          </el-tooltip>
+
+          <el-tooltip trigger="hover" content="Collapsed to Widget"
+            ><span @click="handleClose" class="font_family icon-icon_collapsed__to_widget_b"></span>
+          </el-tooltip>
         </div>
       </div>
       <AIQuestions :modalSize="modalSize" @question="handleSend"></AIQuestions>
@@ -386,7 +400,7 @@ defineExpose({
           "
         ></LoadingDots>
         <!-- 评价  -->
-        <div class="review" v-if="msg.isShowFeedback && msg.isAnswer">
+        <div class="review" v-if="msg.isShowFeedback && msg.isAnswer && msg.type === 'robot'">
           <el-button
             v-if="msg.feedback !== 'Cood'"
             class="el-button--text"
@@ -418,13 +432,15 @@ defineExpose({
         <img class="robot-bubble-img" v-if="msg.type === 'robot'" :src="robotBubbleImg" alt="" />
         <img class="user-bubble-img" v-else-if="msg.type === 'user'" :src="userBubbleImg" alt="" />
         <!-- 暂停回答 icon -->
-        <div
-          class="pause-btn"
+        <el-tooltip
           v-if="index === messages.length - 1 && queryTime > 29 && queryTime < 120"
-          @click="handlePause"
-        >
-          <div class="dot"></div>
-        </div>
+          content="Cancel Answer"
+          placement="bottom-start"
+          effect="dark"
+          ><div class="pause-btn" @click="handlePause">
+            <div class="dot"></div>
+          </div>
+        </el-tooltip>
       </div>
       <!-- 滚动到底部icon -->
       <div v-if="showScrollButton" class="scroll-to-bottom-btn" @click="scrollToBottom(true)">
@@ -462,7 +478,7 @@ defineExpose({
   top: 74px;
   right: 24px;
   height: calc(100% - 98px);
-  z-index: 4000;
+  z-index: 2000;
   display: flex;
   flex-direction: column;
   border-radius: 12px;
@@ -621,7 +637,7 @@ defineExpose({
         height: 16px;
         width: 16px;
         border-radius: 50%;
-        background-color: var(--color-customize-column-right-section-bg);
+        background-color: var(--color-pause-btn-bg);
         .dot {
           height: 5px;
           width: 5px;
@@ -630,11 +646,7 @@ defineExpose({
         }
       }
     }
-    .query-style {
-      span {
-        color: #b5b9bf;
-      }
-    }
+
     .robot-bubble {
       background: var(--scoring-bg-color);
       align-self: flex-start;