perf: Homepage style optimization

Author: wangdan-fit2cloud

ui/src/components/app-icon/KnowledgeIcon.vue

@@ -13,7 +13,7 @@
   </el-avatar>
   <el-avatar
     v-else-if="type == 4"
-    class="avatar-orange"
+    class="avatar-purple"
     shape="square"
     :size="size"
   >

ui/src/layout/layout-header/top-menu/MenuItem.vue

@@ -10,13 +10,14 @@
         style="font-size: 16px"
         class="mr-4"
       />
-      <span> {{ $t(menu.meta?.title as string) }}</span>
+      <span class="title-text"> {{ $t(menu.meta?.title as string) }}</span>
     </div>
   </div>
 </template>
 <script setup lang="ts">
 import { useRouter, useRoute, type RouteRecordRaw } from 'vue-router'
 import { computed } from 'vue'
+
 const router = useRouter()
 const route = useRoute()
 
@@ -54,5 +55,10 @@ const isActive = computed(() => {
       color: var(--el-color-primary) !important;
     }
   }
+  .title-text {
+    @media (max-width: 1200px) {
+      display: none;
+    }
+  }
 }
 </style>

ui/src/layout/layout-template/SimpleLayout.vue

@@ -16,7 +16,6 @@ const {
 } = route as any
 
 const isShared = computed(() => {
-  console.log(route)
   return (
     (folderId === 'shared' ||
       from === 'systemShare' ||

ui/src/views/application/ApplicationSetting.vue

@@ -354,6 +354,7 @@
                               :type="relatedObject(knowledgeList, item, 'id')?.type"
                               class="mr-8"
                               :size="20"
+                              style="--el-avatar-border-radius: 6px"
                             />
 
                             <span
@@ -439,7 +440,13 @@
                                 alt=""
                               />
                             </el-avatar>
-                            <ToolIcon v-else type="MCP" class="mr-8" :size="20" />
+                            <ToolIcon
+                              v-else
+                              type="MCP"
+                              class="mr-8"
+                              :size="20"
+                              style="--el-avatar-border-radius: 6px"
+                            />
 
                             <div
                               class="ellipsis-1"
@@ -471,7 +478,12 @@
                         style="padding: 5px 8px"
                       >
                         <div class="flex align-center" style="line-height: 20px">
-                          <ToolIcon type="MCP" class="mr-8" :size="20" />
+                          <ToolIcon
+                            type="MCP"
+                            class="mr-8"
+                            :size="20"
+                            style="--el-avatar-border-radius: 6px"
+                          />
                           <div class="ellipsis">
                             {{ $t('common.custom') + ' MCP' }}
                           </div>
@@ -624,7 +636,13 @@
                                 alt=""
                               />
                             </el-avatar>
-                            <ToolIcon v-else class="mr-8" :size="20" type="SKILL" />
+                            <ToolIcon
+                              v-else
+                              class="mr-8"
+                              :size="20"
+                              type="SKILL"
+                              style="--el-avatar-border-radius: 6px"
+                            />
 
                             <div
                               class="ellipsis-1"

ui/src/views/application/component/McpServersDialog.vue

@@ -55,11 +55,22 @@
               >
                 <img :src="resetUrl(mcpTool?.icon)" alt="" />
               </el-avatar>
-              <el-avatar v-else shape="square" :size="20" class="mr-8">
+              <el-avatar
+                v-else
+                shape="square"
+                :size="20"
+                class="mr-8"
+                style="--el-avatar-border-radius: 6px"
+              >
                 <img src="@/assets/tool/icon_mcp.svg" style="width: 75%" alt="" />
               </el-avatar>
               <span>{{ mcpTool.name }}</span>
-              <el-tag v-if="mcpTool.scope === 'SHARED'" size="small" type="info" class="info-tag ml-8 mt-4">
+              <el-tag
+                v-if="mcpTool.scope === 'SHARED'"
+                size="small"
+                type="info"
+                class="info-tag ml-8 mt-4"
+              >
                 {{ $t('views.shared.title') }}
               </el-tag>
             </div>

ui/src/views/application/index.vue

@@ -115,7 +115,7 @@
                   </el-dropdown-item>
                   <el-dropdown-item @click="openCreateDialog('WORK_FLOW')">
                     <div class="flex">
-                      <el-avatar shape="square" class="avatar-purple mt-4" :size="32">
+                      <el-avatar shape="square" class="avatar-orange mt-4" :size="32">
                         <img
                           src="@/assets/application/icon_workflow_application.svg"
                           style="width: 65%"
@@ -143,7 +143,7 @@
                   >
                     <el-dropdown-item>
                       <div class="flex align-center w-full">
-                        <el-avatar shape="square" class="mt-4" :size="32" style="background: none">
+                        <el-avatar shape="square" :size="32" style="background: none">
                           <img src="@/assets/icon_import.svg" alt="" />
                         </el-avatar>
                         <div class="pre-wrap ml-8">

ui/src/views/chat/pc/index.vue

@@ -263,7 +263,6 @@ import { getFileUrl } from '@/utils/common'
 import PdfExport from '@/components/pdf-export/index.vue'
 import JSEncrypt from 'jsencrypt'
 
-const { user } = useStore()
 useResize()
 
 provide('scrollData', loadInfiniteScroll)

ui/src/views/home/component/QuickCreate.vue

@@ -55,7 +55,7 @@
             </el-dropdown-item>
             <el-dropdown-item @click="openCreateApplicationDialog('WORK_FLOW')">
               <div class="flex">
-                <el-avatar shape="square" class="avatar-purple mt-4" :size="32">
+                <el-avatar shape="square" class="avatar-orange mt-4" :size="32">
                   <img
                     src="@/assets/application/icon_workflow_application.svg"
                     style="width: 65%"
@@ -83,7 +83,7 @@
             >
               <el-dropdown-item>
                 <div class="flex align-center w-full">
-                  <el-avatar shape="square" class="mt-4" :size="32" style="background: none">
+                  <el-avatar shape="square" :size="32" style="background: none">
                     <img src="@/assets/icon_import.svg" alt="" />
                   </el-avatar>
                   <div class="pre-wrap ml-8">
@@ -185,7 +185,7 @@
             </el-dropdown-item>
             <el-dropdown-item @click="openCreateKnowledgeDialog(CreateWorkflowKnowledgeDialog)">
               <div class="flex">
-                <el-avatar class="avatar-orange mt-4" shape="square" :size="32">
+                <el-avatar class="avatar-purple mt-4" shape="square" :size="32">
                   <img src="@/assets/workflow/logo_workflow.svg" style="width: 60%" alt="" />
                 </el-avatar>
                 <div class="pre-wrap ml-8">