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

frontend/src/views/chat/RecommendQuestion.vue

@@ -63,7 +63,9 @@ async function getRecommendQuestions() {
     const controller: AbortController = new AbortController()
     const response = await chatApi.recommendQuestions(props.recordId, controller)
     const reader = response.body.getReader()
-    const decoder = new TextDecoder()
+    const decoder = new TextDecoder('utf-8')
+
+    let tempResult = ''
 
     while (true) {
       if (stopFlag.value) {
@@ -77,60 +79,56 @@ async function getRecommendQuestions() {
         break
       }
 
-      const chunk = decoder.decode(value)
-
-      let _list = [chunk]
-
-      const lines = chunk.trim().split('}\n\n{')
-      if (lines.length > 1) {
-        _list = []
-        for (let line of lines) {
-          if (!line.trim().startsWith('{')) {
-            line = '{' + line.trim()
-          }
-          if (!line.trim().endsWith('}')) {
-            line = line.trim() + '}'
-          }
-          _list.push(line)
-        }
+      let chunk = decoder.decode(value, { stream: true })
+      tempResult += chunk
+      const split = tempResult.match(/data:.*}\n\n/g)
+      if (split) {
+        chunk = split.join('')
+        tempResult = tempResult.replace(chunk, '')
+      } else {
+        continue
       }
 
-      for (const str of _list) {
-        let data
-        try {
-          data = JSON.parse(str)
-        } catch (err) {
-          console.error('JSON string:', str)
-          throw err
-        }
+      if (chunk && chunk.startsWith('data:{')) {
+        if (split) {
+          for (const str of split) {
+            let data
+            try {
+              data = JSON.parse(str.replace('data:{', '{'))
+            } catch (err) {
+              console.error('JSON string:', str)
+              throw err
+            }
 
-        if (data.code && data.code !== 200) {
-          ElMessage({
-            message: data.msg,
-            type: 'error',
-            showClose: true,
-          })
-          return
-        }
+            if (data.code && data.code !== 200) {
+              ElMessage({
+                message: data.msg,
+                type: 'error',
+                showClose: true,
+              })
+              return
+            }
 
-        switch (data.type) {
-          case 'recommended_question':
-            if (
-              data.content &&
-              data.content.length > 0 &&
-              startsWith(data.content.trim(), '[') &&
-              endsWith(data.content.trim(), ']')
-            ) {
-              if (_currentChat.value?.records) {
-                for (let record of _currentChat.value.records) {
-                  if (record.id === props.recordId) {
-                    record.recommended_question = data.content
+            switch (data.type) {
+              case 'recommended_question':
+                if (
+                  data.content &&
+                  data.content.length > 0 &&
+                  startsWith(data.content.trim(), '[') &&
+                  endsWith(data.content.trim(), ']')
+                ) {
+                  if (_currentChat.value?.records) {
+                    for (let record of _currentChat.value.records) {
+                      if (record.id === props.recordId) {
+                        record.recommended_question = data.content
 
-                    await nextTick()
+                        await nextTick()
+                      }
+                    }
                   }
                 }
-              }
             }
+          }
         }
       }
     }

frontend/src/views/chat/index.vue

@@ -105,7 +105,17 @@
             </template>
 
             <div v-else class="assistant-desc">
-              <img :src="logoAssistant" class="logo" width="30px" height="30px" alt="" />
+              <img
+                v-if="logoAssistant"
+                :src="logoAssistant"
+                class="logo"
+                width="30px"
+                height="30px"
+                alt=""
+              />
+              <el-icon v-else size="32">
+                <logo_fold />
+              </el-icon>
               <div class="i-am">{{ welcome }}</div>
               <div class="i-can">{{ welcomeDesc }}</div>
             </div>

frontend/src/views/embedded/assistant.vue

@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import { ref, computed } from 'vue'
-import icon_sidebar_outlined from '@/assets/embedded/icon_sidebar_outlined.svg'
-import icon_new_chat_outlined from '@/assets/embedded/icon_new-chat_outlined.svg'
+import icon_sidebar_outlined from '@/assets/embedded/icon_sidebar_outlined_nofill.svg'
+import icon_new_chat_outlined from '@/assets/svg/icon_new_chat_outlined.svg'
 import LOGO from '@/assets/embedded/LOGO.png'
 import disable_answer from '@/assets/embedded/disable.png'
 import icon_close_outlined from '@/assets/svg/icon_close_outlined.svg'
@@ -99,6 +99,7 @@ const pageLogo = computed(() => {
     display: flex;
     align-items: center;
     position: relative;
+    color: var(--ed-text-color-primary);
     .logo {
       margin: 0 8px 0 16px;
     }

frontend/src/views/embedded/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="sqlbot-assistant-container">
-    <div class="header">
+    <div class="header" :style="{ color: customSet.header_font_color }">
       <el-icon size="20" @click="openHistory">
         <icon_sidebar_outlined></icon_sidebar_outlined>
       </el-icon>
@@ -30,13 +30,14 @@ import { onBeforeMount, nextTick, onBeforeUnmount, ref, onMounted, reactive } fr
 import ChatComponent from '@/views/chat/index.vue'
 import { request } from '@/utils/request'
 import LOGO from '@/assets/embedded/LOGO.png'
-import icon_sidebar_outlined from '@/assets/embedded/icon_sidebar_outlined.svg'
+import icon_sidebar_outlined from '@/assets/embedded/icon_sidebar_outlined_nofill.svg'
 import icon_new_chat_outlined from '@/assets/svg/icon_new_chat_outlined.svg'
 import { useRoute } from 'vue-router'
 import { assistantApi } from '@/api/assistant'
 import { useAssistantStore } from '@/stores/assistant'
 import { setCurrentColor } from '@/utils/utils'
-
+import { useI18n } from 'vue-i18n'
+const { t } = useI18n()
 const assistantStore = useAssistantStore()
 const route = useRoute()
 const chatRef = ref()
@@ -101,8 +102,8 @@ onMounted(() => {
 })
 const customSet = reactive({
   name: '',
-  welcome: '',
-  welcome_desc: '',
+  welcome: t('embedded.i_am_sqlbot'),
+  welcome_desc: t('embedded.data_analysis_now'),
   theme: '#1CBA90',
   header_font_color: '#1F2329',
 }) as { [key: string]: any }
@@ -124,23 +125,7 @@ onBeforeMount(async () => {
     ElMessage.error('Miss assistant id, please check assistant url')
     return
   }
-  request.get(`/system/assistant/info/${assistantId}`).then((res) => {
-    if (res?.configuration) {
-      const rawData = JSON.parse(res?.configuration)
-      logo.value = baseUrl + rawData.logo
 
-      for (const key in customSet) {
-        if (Object.prototype.hasOwnProperty.call(customSet, key) && rawData[key]) {
-          customSet[key] = rawData[key]
-        }
-      }
-
-      nextTick(() => {
-        setPageCustomColor(customSet.theme)
-        setPageHeaderFontColor(customSet.header_font_color)
-      })
-    }
-  })
   const online = route.query.online
   setFormatOnline(online)
 
@@ -165,6 +150,26 @@ onBeforeMount(async () => {
     messageId: assistantId,
   }
   window.parent.postMessage(readyData, '*')
+
+  request.get(`/system/assistant/${assistantId}`).then((res) => {
+    if (res?.configuration) {
+      const rawData = JSON.parse(res?.configuration)
+      if (rawData.logo) {
+        logo.value = baseUrl + rawData.logo
+      }
+
+      for (const key in customSet) {
+        if (Object.prototype.hasOwnProperty.call(customSet, key) && rawData[key]) {
+          customSet[key] = rawData[key]
+        }
+      }
+
+      nextTick(() => {
+        setPageCustomColor(customSet.theme)
+        setPageHeaderFontColor(customSet.header_font_color)
+      })
+    }
+  })
 })
 
 onBeforeUnmount(() => {

frontend/src/views/system/embedded/SetUi.vue

@@ -66,8 +66,8 @@ const defaultSqlBotForm = reactive<SqlBotForm>({
   name: t('embedded.intelligent_customer_service'),
   x_type: 'right',
   y_type: 'bottom',
-  x_val: 0,
-  y_val: 33,
+  x_val: 30,
+  y_val: 30,
   float_icon_drag: false,
   welcome: t('embedded.i_am_sqlbot'),
   welcome_desc: t('embedded.data_analysis_now'),