feat(appearance): appearance set

Author: dataeaseShu

frontend/src/components/about/index.vue

@@ -202,7 +202,7 @@ defineExpose({
   .color-overlay {
     border-top-left-radius: 6px;
     border-top-right-radius: 6px;
-    background: #1cba901a;
+    background: var(--ed-color-primary-1a, #1cba901a);
     border: 1px solid #dee0e3;
     border-bottom: 0;
     height: 180px;

frontend/src/components/layout/Menu.vue

@@ -4,6 +4,7 @@ import { ElMenu } from 'element-plus-secondary'
 import { useRoute, useRouter } from 'vue-router'
 import MenuItem from './MenuItem.vue'
 import { useUserStore } from '@/stores/user'
+import { routes } from '@/router'
 const userStore = useUserStore()
 const router = useRouter()
 defineProps({
@@ -21,9 +22,25 @@ const showSysmenu = computed(() => {
   return route.path.includes('/system')
 })
 
+const formatRoute = (arr: any, parentPath = '') => {
+  return arr.map((element: any) => {
+    let children: any = []
+    const path = `${parentPath ? parentPath + '/' : ''}${element.path}`
+    if (element.children?.length) {
+      children = formatRoute(element.children, path)
+    }
+    return {
+      ...element,
+      path,
+      children,
+    }
+  })
+}
+
 const routerList = computed(() => {
   if (showSysmenu.value) {
-    return router.getRoutes().filter((route) => route.path.includes('/system') && !route.redirect)
+    const [sysRouter] = formatRoute(routes.filter((route) => route.path.includes('/system')))
+    return sysRouter.children
   }
   const list = router.getRoutes().filter((route) => {
     return (
@@ -71,7 +88,7 @@ const routerList = computed(() => {
 
   .ed-sub-menu.is-active {
     .ed-sub-menu__title {
-      color: #1cba90 !important;
+      color: var(--ed-color-primary) !important;
     }
   }
 

frontend/src/components/layout/Person.vue

@@ -118,7 +118,7 @@ const logout = () => {
                 <icon_translate_outlined></icon_translate_outlined>
               </el-icon>
               <div class="datasource-name">{{ $t('common.language') }}</div>
-              <el-icon style="transform: scale(1.33)" class="right" size="16">
+              <el-icon class="right" size="16">
                 <icon_right_outlined></icon_right_outlined>
               </el-icon>
             </div>

frontend/src/i18n/en.json

@@ -567,5 +567,36 @@
   "license": {
     "error_tips": "Do you want to refresh the page?",
     "offline_tips": "The service has been offline, please contact the administrator to restart the service!"
+  },
+  "system": {
+    "system_settings": "System Settings",
+    "appearance_settings": "Appearance Settings",
+    "platform_display_theme": "Platform Display Theme",
+    "default_turquoise": "Default (Turquoise)",
+    "tech_blue": "Tech Blue",
+    "custom": "Custom",
+    "platform_login_settings": "Platform Login Settings",
+    "page_preview": "Page Preview",
+    "restore_default": "Restore Default",
+    "website_logo": "Website Logo",
+    "tab": "Tab",
+    "replace_image": "Replace Image",
+    "larger_than_200kb": "Logo displayed at the top of the website: Recommended size: 48 x 48 pixels, supports JPG, PNG, and SVG, and no larger than 200KB",
+    "login_logo": "Login Logo",
+    "larger_than_200kb_de": "Logo on the right side of the login page: Recommended size: 204 x 52 pixels, supports JPG, PNG, and SVG, and no larger than 200KB",
+    "login_background_image": "Login Background Image",
+    "larger_than_5mb": "Background image on the left: Recommended size: 576 x 900 for vector images, 1152 x 1800 for bitmap images, supports JPG, PNG, and SVG, and no larger than 5MB",
+    "website_name": "Website Name",
+    "on_webpage_tabs": "Platform name displayed on webpage tabs",
+    "welcome_message": "Welcome Message",
+    "the_product_logo": "Welcome Message below the product logo",
+    "screen_customization_supported": "Defaults to the SQLBot login screen; customization supported",
+    "platform_settings": "Platform Settings",
+    "help_documentation": "Help Documentation",
+    "show_about": "Show About",
+    "abort_update": "Abort Update",
+    "save_and_apply": "Save and Apply",
+    "setting_successfully": "Setting Successfully",
+    "customize_theme_color": "Customize theme color"
   }
-}
+}

frontend/src/i18n/zh-CN.json

@@ -567,5 +567,36 @@
   "license": {
     "error_tips": "是否刷新页面？",
     "offline_tips": "服务已经下线，请联系管理员重启服务！"
+  },  
+  "system": {
+    "system_settings": "系统设置",
+    "appearance_settings": "外观设置",
+    "platform_display_theme": "平台显示主题",
+    "default_turquoise": "默认 (松石绿)",
+    "tech_blue": "科技蓝",
+    "custom": "自定义",
+    "platform_login_settings": "平台登录设置",
+    "page_preview": "页面预览",
+    "restore_default": "恢复默认",
+    "website_logo": "网站 Logo",
+    "tab": "页签",
+    "replace_image": "替换图片",
+    "larger_than_200kb": "顶部网站显示的 Logo，建议尺寸 48 x 48，支持 JPG、PNG、SVG，大小不超过 200KB",
+    "login_logo": "登录 Logo",
+    "larger_than_200kb_de": "登录页面右侧 Logo，建议尺寸 204*52，支持 JPG、PNG、SVG，大小不超过 200KB",
+    "login_background_image": "登录背景图",
+    "larger_than_5mb": "左侧背景图，矢量图建议尺寸 576*900，位图建议尺寸 1152*1800；支持 JPG、PNG、SVG，大小不超过 5M",
+    "website_name": "网站名称",
+    "on_webpage_tabs": "显示在网页 Tab 的平台名称",
+    "welcome_message": "欢迎语",
+    "the_product_logo": "产品 Logo 下的 欢迎语",
+    "screen_customization_supported": "默认为 SQLBot 登录界面，支持自定义设置",
+    "platform_settings": "平台设置",
+    "help_documentation": "帮助文档",
+    "show_about": "显示关于",
+    "abort_update": "放弃更新",
+    "save_and_apply": "保存并应用",
+    "setting_successfully": "设置成功",
+    "customize_theme_color": "自定义主题色"
   }
 }