Merge branch 'main' of https://github.com/dataease/SQLBot

frontend/src/i18n/en.json

@@ -391,8 +391,8 @@
     "add_rule_group": "Add rule group",
     "permission_rule": "Permission rules",
     "restricted_user": "Restricted user",
-    "set_rule": "Setup rule",
-    "set_user": "Setup user",
+    "set_rule": "Set rule",
+    "set_user": "Set user",
     "2": "{msg}",
     "238_people": "{msg} people",
     "no_permission_rule": "No permission rule",
@@ -525,7 +525,10 @@
     "inference_process": "Thought Process",
     "thinking": "Thinking",
     "data_analysis": "Data Analysis",
-    "data_predict": "Data Prediction"
+    "data_predict": "Data Prediction",
+    "ds_is_invalid": "Datasource is invalid",
+    "error": "Error",
+    "show_error_detail": "Show error info"
   },
   "about": {
     "title": "About",
@@ -548,4 +551,4 @@
     "back_community": "Restore to Community Edition",
     "confirm_tips": "Are you sure to restore to Community Edition?"
   }
-}
+}

frontend/src/i18n/zh-CN.json

@@ -525,7 +525,10 @@
     "inference_process": "思考过程",
     "thinking": "思考中",
     "data_analysis": "数据分析",
-    "data_predict": "数据预测"
+    "data_predict": "数据预测",
+    "ds_is_invalid": "数据源无效",
+    "error": "错误",
+    "show_error_detail": "查看具体信息"
   },
   "about": {
     "title": "关于",
@@ -548,4 +551,4 @@
     "back_community": "还原至社区版",
     "confirm_tips": "确定还原至社区版？"
   }
-}
+}

frontend/src/views/chat/ErrorInfo.vue

@@ -0,0 +1,92 @@
+<script setup lang="ts">
+import { ref, computed } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { useAssistantStore } from '@/stores/assistant.ts'
+
+const props = defineProps<{
+  error?: string
+}>()
+
+const { t } = useI18n()
+
+const assistantStore = useAssistantStore()
+const isAssistant = computed(() => assistantStore.getAssistant)
+
+const showBlock = computed(() => {
+  return props.error && props.error?.trim().length > 0
+})
+
+const errorMessage = computed(() => {
+  const obj = { message: props.error, showMore: false, traceback: '' }
+  if (showBlock.value && props.error?.trim().startsWith('{') && props.error?.trim().endsWith('}')) {
+    try {
+      const json = JSON.parse(props.error?.trim())
+      obj.message = json['message']
+      obj.traceback = json['traceback']
+      if (obj.traceback?.trim().length > 0) {
+        obj.showMore = true
+      }
+    } catch (e) {
+      console.error(e)
+    }
+  }
+  return obj
+})
+
+const show = ref(false)
+
+function showTraceBack() {
+  show.value = true
+}
+</script>
+
+<template>
+  <div v-if="showBlock">
+    <div
+      v-if="!errorMessage.showMore"
+      v-dompurify-html="errorMessage.message"
+      class="error-container"
+    ></div>
+    <div v-else class="error-container row">
+      {{ t('chat.error') }}
+      <el-button text @click="showTraceBack">{{ t('chat.show_error_detail') }}</el-button>
+    </div>
+
+    <el-drawer
+      v-model="show"
+      :size="isAssistant ? '100%' : '600px'"
+      :title="t('chat.error')"
+      direction="rtl"
+      body-class="chart-sql-error-body"
+    >
+      <el-main>
+        <div v-dompurify-html="errorMessage.traceback" class="error-container open"></div>
+      </el-main>
+    </el-drawer>
+  </div>
+</template>
+
+<style lang="less">
+.chart-sql-error-body {
+  padding: 0;
+}
+</style>
+<style scoped lang="less">
+.error-container {
+  font-weight: 400;
+  font-size: 16px;
+  line-height: 24px;
+  color: rgba(31, 35, 41, 1);
+  white-space: pre-wrap;
+
+  &.row {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
+  &.open {
+    font-size: 14px;
+    line-height: 20px;
+  }
+}
+</style>

frontend/src/views/chat/index.vue

@@ -161,13 +161,7 @@
                     @stop="onChatStop"
                   >
                     <ChartBlock style="margin-top: 12px" :message="message" />
-                    <div
-                      v-if="message.record?.error && message.record?.error?.trim().length > 0"
-                      class="error-container"
-                    >
-                      {{ message.record?.error }}
-                    </div>
-
+                    <ErrorInfo :error="message.record?.error" class="error-container" />
                     <template #tool>
                       <ChatToolBar v-if="!message.isTyping" :message="message">
                         <div class="tool-btns">
@@ -251,12 +245,7 @@
                     @error="onAnalysisAnswerError"
                     @stop="onChatStop"
                   >
-                    <div
-                      v-if="message.record?.error && message.record?.error?.trim().length > 0"
-                      class="error-container"
-                    >
-                      {{ message.record?.error }}
-                    </div>
+                    <ErrorInfo :error="message.record?.error" class="error-container" />
                     <template #tool>
                       <ChatToolBar v-if="!message.isTyping" :message="message" />
                     </template>
@@ -277,12 +266,7 @@
                     @stop="onChatStop"
                   >
                     <ChartBlock style="margin-top: 12px" :message="message" is-predict />
-                    <div
-                      v-if="message.record?.error && message.record?.error?.trim().length > 0"
-                      class="error-container"
-                    >
-                      {{ message.record?.error }}
-                    </div>
+                    <ErrorInfo :error="message.record?.error" class="error-container" />
                     <template #tool>
                       <ChatToolBar v-if="!message.isTyping" :message="message" />
                     </template>
@@ -357,6 +341,7 @@ import ChartBlock from './chat-block/ChartBlock.vue'
 import RecommendQuestion from './RecommendQuestion.vue'
 import ChatListContainer from './ChatListContainer.vue'
 import ChatCreator from '@/views/chat/ChatCreator.vue'
+import ErrorInfo from './ErrorInfo.vue'
 import ChatToolBar from './ChatToolBar.vue'
 import { dsTypeWithImg } from '@/views/ds/js/ds-type'
 import { useI18n } from 'vue-i18n'
@@ -1020,10 +1005,6 @@ onMounted(() => {
 
 .error-container {
   margin-top: 12px;
-  font-weight: 400;
-  font-size: 16px;
-  line-height: 24px;
-  color: rgba(31, 35, 41, 1);
 }
 
 .tool-btns {