fix: URL 404 (#3460)

Author: shaohuzhang1

apps/application/migrations/0001_initial.py

@@ -45,7 +45,7 @@ class Migration(migrations.Migration):
                 ('model_params_setting', models.JSONField(default=dict, verbose_name='模型参数相关设置')),
                 ('tts_model_params_setting', models.JSONField(default=dict, verbose_name='模型参数相关设置')),
                 ('problem_optimization', models.BooleanField(default=False, verbose_name='问题优化')),
-                ('icon', models.CharField(default='/ui/favicon.ico', max_length=256, verbose_name='应用icon')),
+                ('icon', models.CharField(default='./favicon.ico', max_length=256, verbose_name='应用icon')),
                 ('work_flow', models.JSONField(default=dict, verbose_name='工作流数据')),
                 ('type', models.CharField(choices=[('SIMPLE', '简易'), ('WORK_FLOW', '工作流')], default='SIMPLE', max_length=256, verbose_name='应用类型')),
                 ('problem_optimization_prompt', models.CharField(blank=True, default='()里面是用户问题,根据上下文回答揣测用户问题({question}) 要求: 输出一个补全问题,并且放在<data></data>标签中', max_length=102400, null=True, verbose_name='问题优化提示词')),

apps/application/serializers/application.py

@@ -539,7 +539,7 @@ def to_application(application, workspace_id, user_id):
                            model_params_setting=application.get('model_params_setting'),
                            tts_model_params_setting=application.get('tts_model_params_setting'),
                            problem_optimization=application.get('problem_optimization'),
-                           icon="/ui/favicon.ico",
+                           icon="./favicon.ico",
                            work_flow=work_flow,
                            type=application.get('type'),
                            problem_optimization_prompt=application.get('problem_optimization_prompt'),

ui/src/layout/components/breadcrumb/index.vue

@@ -3,13 +3,13 @@
     <back-button :to="toBackPath" class="mt-4"></back-button>
     <div class="flex align-center">
       <el-avatar
-        v-if="isApplication && isAppIcon(current?.icon)"
+        v-if="isApplication"
         shape="square"
         :size="24"
         style="background: none"
         class="mr-8"
       >
-        <img :src="current?.icon" alt="" />
+        <img :src="resetUrl(current?.icon, resetUrl('./favicon.ico'))" alt="" />
       </el-avatar>
       <LogoIcon
         v-else-if="isApplication"
@@ -27,7 +27,7 @@
 <script setup lang="ts">
 import { ref, onMounted, computed } from 'vue'
 import { onBeforeRouteLeave, useRouter, useRoute } from 'vue-router'
-import { isAppIcon } from '@/utils/common'
+import { isAppIcon, resetUrl } from '@/utils/common'
 import { loadSharedApi } from '@/utils/dynamics-api/shared-api'
 import useStore from '@/stores'
 const { common, application } = useStore()

ui/src/utils/common.ts

@@ -70,3 +70,10 @@ export function isAppIcon(url: string | undefined) {
 export function isFunction(fn: any) {
   return typeof fn === 'function'
 }
+
+export const resetUrl = (url: string, defaultUrl?: string) => {
+  if (url && url.startsWith('./')) {
+    return `${window.MaxKB.prefix}/${url.substring(2)}`
+  }
+  return url ? url : defaultUrl ? defaultUrl : ''
+}

ui/src/views/application-overview/index.vue

@@ -14,16 +14,10 @@
                 @mouseenter="showEditIcon = true"
                 @mouseleave="showEditIcon = false"
               >
-                <el-avatar
-                  v-if="isAppIcon(detail?.icon)"
-                  shape="square"
-                  :size="32"
-                  style="background: none"
-                >
-                  <img :src="detail?.icon" alt="" />
+                <el-avatar shape="square" :size="32" style="background: none">
+                  <img :src="resetUrl(detail?.icon, resetUrl('./favicon.ico'))" alt="" />
                 </el-avatar>
 
-                <LogoIcon v-else height="32px" />
                 <el-avatar
                   v-if="showEditIcon"
                   shape="square"
@@ -224,7 +218,7 @@ import applicationApi from '@/api/application/application'
 import { nowDate, beforeDay } from '@/utils/time'
 import { MsgSuccess, MsgConfirm } from '@/utils/message'
 import { copyClick } from '@/utils/clipboard'
-import { isAppIcon } from '@/utils/common'
+import { isAppIcon, resetUrl } from '@/utils/common'
 import { mapToUrlParams } from '@/utils/application'
 import useStore from '@/stores'
 import { t } from '@/locales'

ui/src/views/tool/component/ToolListContainer.vue

@@ -154,13 +154,13 @@
               >
                 <template #icon>
                   <el-avatar
-                    v-if="isAppIcon(item?.icon)"
+                    v-if="item?.icon"
                     shape="square"
                     :size="32"
                     style="background: none"
                     class="mr-8"
                   >
-                    <img :src="item?.icon" alt="" />
+                    <img :src="resetUrl(item?.icon)" alt="" />
                   </el-avatar>
                   <el-avatar v-else class="avatar-green" shape="square" :size="32">
                     <img src="@/assets/node/icon_tool.svg" style="width: 58%" alt="" />
@@ -310,7 +310,7 @@ import ToolFormDrawer from '@/views/tool/ToolFormDrawer.vue'
 import CreateFolderDialog from '@/components/folder-tree/CreateFolderDialog.vue'
 import AuthorizedWorkspace from '@/views/system-shared/AuthorizedWorkspaceDialog.vue'
 import MoveToDialog from '@/components/folder-tree/MoveToDialog.vue'
-import { isAppIcon } from '@/utils/common'
+import { isAppIcon, resetUrl } from '@/utils/common'
 import { MsgSuccess, MsgConfirm, MsgError } from '@/utils/message'
 import { SourceTypeEnum } from '@/enums/common'
 import ToolStoreDialog from '@/views/tool/toolStore/ToolStoreDialog.vue'
@@ -372,7 +372,7 @@ const MoveToDialogRef = ref()
 function openMoveToDialog(data: any) {
   const obj = {
     id: data.id,
-    folder_id: data.folder
+    folder_id: data.folder,
   }
   MoveToDialogRef.value?.open(obj)
 }
@@ -631,7 +631,7 @@ onMounted(() => {
   if (apiType.value !== 'workspace') {
     getList()
   }
-  loadSharedApi({type: 'workspace', isShared: isShared.value, systemType: apiType.value })
+  loadSharedApi({ type: 'workspace', isShared: isShared.value, systemType: apiType.value })
     .getAllMemberList(user.getWorkspaceId(), loading)
     .then((res: any) => {
       user_options.value = res.data