refactor(ui): 调整左右布局v1

- 将所有API接口中的String类型统一改为string类型
- 修改EchartsRander组件中option变量声明为const
- 调整FormItem组件中validator变量声明为const
- 更新侧边栏样式为固定宽度240px并重新设计布局结构
- 移除主布局中的头部组件和相关主题配置逻辑
- 调整布局容器最小宽度从240调整为260

ui/src/api/application/chat-log.ts

@@ -43,7 +43,7 @@ const postChatLogAddKnowledge: (
  }
  */
 const getChatLog: (
-  application_id: String,
+  application_id: string,
   page: pageRequest,
   param: any,
   loading?: Ref<boolean>,
@@ -61,8 +61,8 @@ const getChatLog: (
  * application_id, chart_id,order_asc
  */
 const getChatRecordLog: (
-  application_id: String,
-  chart_id: String,
+  application_id: string,
+  chart_id: string,
   page: pageRequest,
   loading?: Ref<boolean>,
   order_asc?: boolean,
@@ -108,11 +108,11 @@ const getMarkChatRecord: (
  }
  */
 const putChatRecordLog: (
-  application_id: String,
-  chart_id: String,
-  chart_record_id: String,
-  knowledge_id: String,
-  document_id: String,
+  application_id: string,
+  chart_id: string,
+  chart_record_id: string,
+  knowledge_id: string,
+  document_id: string,
   data: any,
   loading?: Ref<boolean>,
 ) => Promise<Result<any>> = (
@@ -138,12 +138,12 @@ const putChatRecordLog: (
  * application_id, chart_id,  chart_record_id, knowledge_id, document_id,paragraph_id
  */
 const delMarkChatRecord: (
-  application_id: String,
-  chart_id: String,
-  chart_record_id: String,
-  knowledge_id: String,
-  document_id: String,
-  paragraph_id: String,
+  application_id: string,
+  chart_id: string,
+  chart_record_id: string,
+  knowledge_id: string,
+  document_id: string,
+  paragraph_id: string,
   loading?: Ref<boolean>,
 ) => Promise<Result<any>> = (
   application_id,

ui/src/api/knowledge/knowledge.ts

@@ -80,7 +80,7 @@ const putKnowledge: (
  * 删除知识库
  * @param 参数 knowledge_id
  */
-const delKnowledge: (knowledge_id: String, loading?: Ref<boolean>) => Promise<Result<boolean>> = (
+const delKnowledge: (knowledge_id: string, loading?: Ref<boolean>) => Promise<Result<boolean>> = (
   knowledge_id,
   loading,
 ) => {

ui/src/api/system-resource-management/chat-log.ts

@@ -30,7 +30,7 @@ const postChatLogAddKnowledge: (
  }
  */
 const getChatLog: (
-  application_id: String,
+  application_id: string,
   page: pageRequest,
   param: any,
   loading?: Ref<boolean>,
@@ -48,8 +48,8 @@ const getChatLog: (
  * application_id, chart_id,order_asc
  */
 const getChatRecordLog: (
-  application_id: String,
-  chart_id: String,
+  application_id: string,
+  chart_id: string,
   page: pageRequest,
   loading?: Ref<boolean>,
   order_asc?: boolean,
@@ -90,11 +90,11 @@ const getMarkChatRecord: (
  }
  */
 const putChatRecordLog: (
-  application_id: String,
-  chart_id: String,
-  chart_record_id: String,
-  knowledge_id: String,
-  document_id: String,
+  application_id: string,
+  chart_id: string,
+  chart_record_id: string,
+  knowledge_id: string,
+  document_id: string,
   data: any,
   loading?: Ref<boolean>,
 ) => Promise<Result<any>> = (
@@ -120,12 +120,12 @@ const putChatRecordLog: (
  * application_id, chart_id,  chart_record_id, knowledge_id, document_id,paragraph_id
  */
 const delMarkChatRecord: (
-  application_id: String,
-  chart_id: String,
-  chart_record_id: String,
-  knowledge_id: String,
-  document_id: String,
-  paragraph_id: String,
+  application_id: string,
+  chart_id: string,
+  chart_record_id: string,
+  knowledge_id: string,
+  document_id: string,
+  paragraph_id: string,
   loading?: Ref<boolean>,
 ) => Promise<Result<any>> = (
   application_id,

ui/src/api/system-resource-management/knowledge.ts

@@ -72,7 +72,7 @@ const putKnowledge: (
  * 删除知识库
  * @param 参数 knowledge_id
  */
-const delKnowledge: (knowledge_id: String, loading?: Ref<boolean>) => Promise<Result<boolean>> = (
+const delKnowledge: (knowledge_id: string, loading?: Ref<boolean>) => Promise<Result<boolean>> = (
   knowledge_id,
   loading,
 ) => {

ui/src/api/system-shared/knowledge.ts

@@ -73,7 +73,7 @@ const putKnowledge: (
  * 删除知识库
  * @param 参数 knowledge_id
  */
-const delKnowledge: (knowledge_id: String, loading?: Ref<boolean>) => Promise<Result<boolean>> = (
+const delKnowledge: (knowledge_id: string, loading?: Ref<boolean>) => Promise<Result<boolean>> = (
   knowledge_id,
   loading,
 ) => {

ui/src/api/system-shared/tool.ts

@@ -96,7 +96,7 @@ const getToolById: (tool_id: string, loading?: Ref<boolean>) => Promise<Result<a
  * 删除工具
  * @param 参数 tool_id
  */
-const delTool: (tool_id: String, loading?: Ref<boolean>) => Promise<Result<boolean>> = (
+const delTool: (tool_id: string, loading?: Ref<boolean>) => Promise<Result<boolean>> = (
   tool_id,
   loading,
 ) => {

ui/src/components/dynamics-form/FormItem.vue

@@ -133,7 +133,7 @@ const errMsg = computed(() => {
  */
 const to_rule = (rule: any) => {
   if (rule.validator) {
-    let validator = (rule: any, value: string, callback: any) => {}
+    const validator = (rule: any, value: string, callback: any) => {}
     eval(rule.validator)
     return { ...rule, validator }
   }

ui/src/components/layout-container/index.vue

@@ -42,7 +42,7 @@ const props = defineProps({
   resizable: Boolean,
   minLeftWidth: {
     type: Number,
-    default: 240,
+    default: 260,
   },
   maxLeftWidth: {
     type: Number,

ui/src/components/markdown/EchartsRander.vue

@@ -44,7 +44,7 @@ function evalParseOption(option_json: any) {
   if (option_json.style) {
     style.value = option_json.style
   }
-  let option = {}
+  const option = {}
   tmp.value = echarts
   eval(option_json.option)
   return option

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

@@ -1,55 +1,55 @@
 <template>
-  <div class="sidebar p-8">
-    <div v-if="showBreadcrumb">
-      <AppBreadcrumb />
+  <div class="sidebar" style="display: flex; flex-direction: column; height: 100vh; background-color: #F9FAFB; width: 240px;">
+    <!-- 顶部 Logo 区 -->
+    <div style="padding: 16px;">
+      <h1 style="font-size: 18px; font-weight: 600; margin: 0;">AI-RAG</h1>
+    </div>
+    
+    <!-- 一级业务菜单 -->
+    <div style="padding: 0 16px;">
+      <div style="display: flex; flex-direction: column; gap: 8px;">
+        <router-link to="/application" style="display: block; padding: 10px 16px; border-radius: 8px; text-decoration: none; color: #333; font-size: 14px;" :style="activeMainMenu === '/application' ? { backgroundColor: '#e6f0ff', color: '#1890ff' } : {}">
+          应用
+        </router-link>
+        <router-link to="/knowledge" style="display: block; padding: 10px 16px; border-radius: 8px; text-decoration: none; color: #333; font-size: 14px;" :style="activeMainMenu === '/knowledge' ? { backgroundColor: '#e6f0ff', color: '#1890ff' } : {}">
+          知识库
+        </router-link>
+        <router-link to="/tool" style="display: block; padding: 10px 16px; border-radius: 8px; text-decoration: none; color: #333; font-size: 14px;" :style="activeMainMenu === '/tool' ? { backgroundColor: '#e6f0ff', color: '#1890ff' } : {}">
+          工具
+        </router-link>
+        <router-link to="/model" style="display: block; padding: 10px 16px; border-radius: 8px; text-decoration: none; color: #333; font-size: 14px;" :style="activeMainMenu === '/model' ? { backgroundColor: '#e6f0ff', color: '#1890ff' } : {}">
+          模型
+        </router-link>
+      </div>
+    </div>
+    
+    <!-- 底部用户信息区 -->
+    <div style="margin-top: auto; padding: 16px; border-top: 1px solid #e5e7eb;">
+      <UserAvatar />
     </div>
-    <el-scrollbar wrap-class="scrollbar-wrapper">
-      <el-menu :default-active="activeMenu" router>
-        <sidebar-item
-          v-hasPermission="menu.meta?.permission"
-          v-for="(menu, index) in subMenuList"
-          :key="index"
-          :menu="menu"
-          :activeMenu="activeMenu"
-        >
-        </sidebar-item>
-      </el-menu>
-    </el-scrollbar>
   </div>
 </template>
 
 <script setup lang="ts">
 import { computed } from 'vue'
-import { useRouter, useRoute } from 'vue-router'
-import { getChildRouteListByPathAndName } from '@/router/index'
-import SidebarItem from './SidebarItem.vue'
-import AppBreadcrumb from './../breadcrumb/index.vue'
+import { useRoute } from 'vue-router'
+import UserAvatar from '@/layout/layout-header/avatar/index.vue'
 
 const route = useRoute()
 
-const showBreadcrumb = computed(() => {
-  const { meta } = route as any
-  return meta?.breadcrumb
+const activeMainMenu = computed(() => {
+  const path = route.path
+  if (path.startsWith('/application')) return '/application'
+  if (path.startsWith('/knowledge')) return '/knowledge'
+  if (path.startsWith('/tool')) return '/tool'
+  if (path.startsWith('/model')) return '/model'
+  return '/application'
 })
 
-const subMenuList = computed(() => {
-  const { meta } = route
-  return getChildRouteListByPathAndName(meta.parentPath, meta.parentName)
-})
-
-const activeMenu = computed(() => {
-  const { path, meta } = route
-  return meta.active || path
+const activeSubMenu = computed(() => {
+  const path = route.path
+  return path
 })
 </script>
 
-<style lang="scss">
-.sidebar {
-  .el-menu {
-    height: 100%;
-    border: none;
-    background: none;
-    max-height: calc(100vh - 100px);
-  }
-}
-</style>
+

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

@@ -1,17 +1,5 @@
 <template>
   <div class="app-layout">
-    <div class="app-header" :class="!isDefaultTheme ? 'custom-header' : ''">
-      <el-alert
-        v-if="user.isExpire()"
-        :title="$t('layout.isExpire')"
-        type="warning"
-        class="border-b"
-        show-icon
-        :closable="false"
-      />
-      <SystemHeader v-if="isShared"></SystemHeader>
-      <UserHeader v-else />
-    </div>
     <div class="app-main" :class="user.isExpire() ? 'isExpire' : ''">
       <layout-container>
         <template #left>
@@ -24,8 +12,6 @@
 </template>
 <script setup lang="ts">
 import { computed } from 'vue'
-import UserHeader from '@/layout/layout-header/UserHeader.vue'
-import SystemHeader from '@/layout/layout-header/SystemHeader.vue'
 import Sidebar from '@/layout/components/sidebar/index.vue'
 import AppMain from '@/layout/app-main/index.vue'
 import useStore from '@/stores'
@@ -43,10 +29,7 @@ const isShared = computed(() => {
     route.path.includes('resource-management')
   )
 })
-const { theme, user } = useStore()
-const isDefaultTheme = computed(() => {
-  return theme.isDefaultTheme()
-})
+const { user } = useStore()
 </script>
 <style lang="scss" scoped>
 @use './index.scss';