feat: Some changes & fixes

GUI-for-Cores · Jul 14, 2024 · 1b46672 · 1b46672
1 parent 691f2fd
commit 1b46672
Show file tree

Hide file tree

Showing 21 changed files with 191 additions and 48 deletions.
diff --git a/frontend/src/components/Button/index.vue b/frontend/src/components/Button/index.vue
@@ -29,6 +29,7 @@ withDefaults(defineProps<Props>(), {
         :icon="icon"
         :size="iconSize"
         :fill="iconColor || `var(--btn-${type}-color)`"
+        :class="$slots.default ? 'mr-4' : ''"
       />
     </template>
     <slot />

diff --git a/frontend/src/components/Icon/OverviewIcon.vue b/frontend/src/components/Icon/OverviewIcon.vue
@@ -0,0 +1,8 @@
+<template>
+  <svg viewBox="0 0 1024 1024">
+    <path
+      d="M128 469.33h341.33V128H128v341.33z m85.33-256H384V384H213.33V213.33zM938.16 300.03L724.4 86.27 509.54 301.12 723.3 514.88l214.86-214.85zM724.4 206.95l93.08 93.08-94.18 94.17-93.08-93.08 94.18-94.17zM128 896h341.33V554.67H128V896z m85.33-256H384v170.67H213.33V640zM554.67 896H896V554.67H554.67V896zM640 640h170.67v170.67H640V640z"
+      v-bind="$attrs"
+    ></path>
+  </svg>
+</template>
diff --git a/frontend/src/components/Icon/PluginsIcon.vue b/frontend/src/components/Icon/PluginsIcon.vue
@@ -0,0 +1,8 @@
+<template>
+  <svg viewBox="0 0 1024 1024">
+    <path
+      d="M36.8 324.448l440.288 208.384V992L36.8 782.912V324.448z m78.016 405.76l284.256 135.008V585.6l-284.256-134.592v279.168zM512.768 46.4l477.792 209.088-477.344 225.344L36.48 253.888 512.768 46.4z m-287.36 210.272l287.68 133.344 285.152-132.288-285.632-123.84-287.2 122.784zM992 324.48v458.464l-439.488 207.872V532.832L992 324.448zM630.464 864.256l283.584-134.144v-279.008l-283.584 134.4v278.72z"
+      v-bind="$attrs"
+    ></path>
+  </svg>
+</template>
diff --git a/frontend/src/components/Icon/ProfilesIcon.vue b/frontend/src/components/Icon/ProfilesIcon.vue
@@ -0,0 +1,24 @@
+<template>
+  <svg viewBox="0 0 1024 1024">
+    <path
+      d="M26.1 345.1c8.4 20.1 31.5 29.7 51.6 21.3l441.1-183.3c20.1-8.4 29.7-31.5 21.3-51.6-8.4-20.1-31.5-29.7-51.6-21.3L47.4 293.4c-20.2 8.4-29.7 31.5-21.3 51.7z"
+      v-bind="$attrs"
+    ></path>
+    <path
+      d="M998.8 351.9c-8.4 20.1-31.5 29.7-51.6 21.3L489.5 183.1c-20.1-8.4-29.7-31.5-21.3-51.6 8.4-20.1 31.5-29.7 51.6-21.3l457.6 190.2c20.2 8.3 29.7 31.4 21.4 51.5zM556.4 888.1c-8.4 20.1-31.5 29.7-51.6 21.3L47.1 719.3c-20.1-8.4-29.7-31.5-21.3-51.6 8.4-20.1 31.5-29.7 51.6-21.3L535 836.6c20.2 8.2 29.8 31.4 21.4 51.5z"
+      v-bind="$attrs"
+    ></path>
+    <path
+      d="M483.9 887.9c8.4 20.1 31.5 29.7 51.6 21.3l442-183.7c20.1-8.4 29.7-31.5 21.3-51.6-8.4-20.1-31.5-29.7-51.6-21.3l-442 183.7c-20.1 8.4-29.7 31.5-21.3 51.6zM556.4 718.1c-8.4 20.1-31.5 29.7-51.6 21.3L47.1 549.3c-20.1-8.4-29.7-31.5-21.3-51.6 8.4-20.1 31.5-29.7 51.6-21.3L535 666.6c20.2 8.2 29.8 31.4 21.4 51.5z"
+      v-bind="$attrs"
+    ></path>
+    <path
+      d="M483.9 717.9c8.4 20.1 31.5 29.7 51.6 21.3l442-183.7c20.1-8.4 29.7-31.5 21.3-51.6-8.4-20.1-31.5-29.7-51.6-21.3l-442 183.7c-20.1 8.4-29.7 31.5-21.3 51.6zM556.4 536.1c-8.4 20.1-31.5 29.7-51.6 21.3L47.1 367.3c-20.1-8.4-29.7-31.5-21.3-51.6 8.4-20.1 31.5-29.7 51.6-21.3L535 484.6c20.2 8.2 29.8 31.4 21.4 51.5z"
+      v-bind="$attrs"
+    ></path>
+    <path
+      d="M483.9 535.9c8.4 20.1 31.5 29.7 51.6 21.3l442-183.7c20.1-8.4 29.7-31.5 21.3-51.6-8.4-20.1-31.5-29.7-51.6-21.3l-442 183.7c-20.1 8.4-29.7 31.5-21.3 51.6z"
+      v-bind="$attrs"
+    ></path>
+  </svg>
+</template>
diff --git a/frontend/src/components/Icon/RulesetsIcon.vue b/frontend/src/components/Icon/RulesetsIcon.vue
@@ -0,0 +1,8 @@
+<template>
+  <svg viewBox="0 0 1024 1024">
+    <path
+      d="M102.4 34.133333a102.4 102.4 0 0 0-102.4 102.4v34.133334a68.266667 68.266667 0 0 0 68.266667 68.266666h102.4v546.133334H34.133333a34.133333 34.133333 0 0 0-34.133333 34.133333v68.266667a102.4 102.4 0 0 0 102.4 102.4h819.2a102.4 102.4 0 0 0 102.4-102.4v-68.266667a34.133333 34.133333 0 0 0-34.133333-34.133333h-136.533334V238.933333h102.4a68.266667 68.266667 0 0 0 68.266667-68.266666V136.533333a102.4 102.4 0 0 0-102.4-102.4H102.4z m0 68.266667h68.266667v68.266667H68.266667V136.533333a34.133333 34.133333 0 0 1 34.133333-34.133333z m136.533333 682.666667V102.4h546.133334v682.666667H238.933333zM955.733333 170.666667h-102.4V102.4h68.266667a34.133333 34.133333 0 0 1 34.133333 34.133333v34.133334zM68.266667 853.333333h887.466666v34.133334a34.133333 34.133333 0 0 1-34.133333 34.133333H102.4a34.133333 34.133333 0 0 1-34.133333-34.133333v-34.133334z m307.2-580.266666a34.133333 34.133333 0 1 0 0 68.266666h273.066666a34.133333 34.133333 0 1 0 0-68.266666h-273.066666z m0 136.533333a34.133333 34.133333 0 1 0 0 68.266667h273.066666a34.133333 34.133333 0 1 0 0-68.266667h-273.066666z m0 136.533333a34.133333 34.133333 0 1 0 0 68.266667h136.533333a34.133333 34.133333 0 1 0 0-68.266667h-136.533333z"
+      v-bind="$attrs"
+    ></path>
+  </svg>
+</template>
diff --git a/frontend/src/components/Icon/ScheduledTasksIcon.vue b/frontend/src/components/Icon/ScheduledTasksIcon.vue
@@ -0,0 +1,20 @@
+<template>
+  <svg viewBox="0 0 1024 1024">
+    <path
+      d="M255.744 0c21.0944 0 38.1952 17.152 38.1952 38.2976v131.7888a38.2464 38.2464 0 1 1-76.4416 0V38.2976c0-21.1456 17.1008-38.2976 38.2464-38.2976zM177.8688 476.672c0-21.1456 17.1008-38.2976 38.1952-38.2976h73.8304a38.2464 38.2464 0 0 1 0 76.5952H216.064a38.2464 38.2464 0 0 1-38.1952-38.2976zM714.3424 0c21.0944 0 38.1952 17.152 38.1952 38.2976v131.7888a38.2464 38.2464 0 1 1-76.4416 0V38.2976c0-21.1456 17.152-38.2976 38.2464-38.2976zM370.3808 707.8912c0-169.2672 136.8576-306.5344 305.664-306.5344 168.96 0 305.8176 137.216 305.8176 306.5344 0 169.2672-136.9088 306.4832-305.7664 306.4832-168.8064 0-305.7152-137.216-305.7152-306.4832z m535.04 0c0-126.976-102.656-229.888-229.3248-229.888a229.5808 229.5808 0 0 0-229.2736 229.888c0 126.976 102.656 229.888 229.2736 229.888a229.5808 229.5808 0 0 0 229.3248-229.888zM177.8688 324.7104c0-21.1456 17.1008-38.2976 38.1952-38.2976h230.8096a38.2464 38.2464 0 0 1 0 76.6464H216.064a38.2464 38.2464 0 0 1-38.1952-38.3488z"
+      v-bind="$attrs"
+    ></path>
+    <path
+      d="M644.608 560.7424m36.5056 0l-0.0512 0q36.5056 0 36.5056 36.5056l0 122.0608q0 36.5056-36.5056 36.5056l0.0512 0q-36.5056 0-36.5056-36.5056l0-122.0608q0-36.5056 36.5056-36.5056Z"
+      v-bind="$attrs"
+    ></path>
+    <path
+      d="M839.68 719.3088c0 20.1728-16.384 36.5568-36.5568 36.5568h-121.3952a36.5568 36.5568 0 1 1 0-73.1648h121.3952c20.224 0 36.5568 16.384 36.5568 36.608z"
+      v-bind="$attrs"
+    ></path>
+    <path
+      d="M893.7472 497.7664l-76.6976-3.4304 2.2016-48.128V256.2048a76.8 76.8 0 0 0-76.8-76.8L179.2 179.2a76.8 76.8 0 0 0-76.8 76.8v563.2a76.8 76.8 0 0 0 76.8 76.8h351.0272V972.8H179.2512a153.6 153.6 0 0 1-153.6-153.6V256a153.6 153.6 0 0 1 153.6-153.6l563.2 0.2048a153.6 153.6 0 0 1 153.6 153.6v189.952l-2.304 51.6096z m0 0l-76.6976-3.4304 2.2016-48.128V256.2048a76.8 76.8 0 0 0-76.8-76.8L179.2 179.2a76.8 76.8 0 0 0-76.8 76.8v563.2a76.8 76.8 0 0 0 76.8 76.8h351.0272V972.8H179.2512a153.6 153.6 0 0 1-153.6-153.6V256a153.6 153.6 0 0 1 153.6-153.6l563.2 0.2048a153.6 153.6 0 0 1 153.6 153.6v189.952l-2.304 51.6096z"
+      v-bind="$attrs"
+    ></path>
+  </svg>
+</template>
diff --git a/frontend/src/components/Icon/Settings2Icon.vue b/frontend/src/components/Icon/Settings2Icon.vue
@@ -0,0 +1,12 @@
+<template>
+  <svg viewBox="0 0 1024 1024">
+    <path
+      d="M693.78048 186.91072c3.64544 0 7.04 1.96096 8.86272 5.11488L884.42368 506.88a10.26048 10.26048 0 0 1 0 10.23488l-181.77536 314.84928c-1.82272 3.15904-5.2224 5.12-8.86784 5.12H330.21952a10.2656 10.2656 0 0 1-8.86272-5.11488l-181.78048-314.8544a10.26048 10.26048 0 0 1 0-10.23488l181.77536-314.84928c1.82272-3.15904 5.2224-5.12 8.86784-5.12h363.56096m0-71.64416H330.21952a81.87904 81.87904 0 0 0-70.912 40.93952L77.53216 471.06048a81.8688 81.8688 0 0 0 0 81.87904l181.78048 314.8544a81.87904 81.87904 0 0 0 70.912 40.93952h363.56096a81.87904 81.87904 0 0 0 70.912-40.93952l181.78048-314.8544a81.8688 81.8688 0 0 0 0-81.87904l-181.78048-314.8544a81.8944 81.8944 0 0 0-70.91712-40.93952z"
+      v-bind="$attrs"
+    ></path>
+    <path
+      d="M512 419.88608c50.7904 0 92.11392 41.32352 92.11392 92.11392S562.7904 604.11392 512 604.11392 419.88608 562.7904 419.88608 512 461.2096 419.88608 512 419.88608m0-71.64416c-90.4448 0-163.75808 73.3184-163.75808 163.75808s73.3184 163.75808 163.75808 163.75808 163.75808-73.3184 163.75808-163.75808S602.4448 348.24192 512 348.24192z"
+      v-bind="$attrs"
+    ></path>
+  </svg>
+</template>
diff --git a/frontend/src/components/Icon/SubscriptionsIcon.vue b/frontend/src/components/Icon/SubscriptionsIcon.vue
@@ -0,0 +1,16 @@
+<template>
+  <svg viewBox="0 0 1024 1024">
+    <path
+      d="M228.9 960.4c-24.9 0-49.7-7.4-70.8-21.9-34.1-23.4-54.5-62.1-54.5-103.5V191.4C103.6 122.3 159.8 66 229 66h566.7c69.1 0 125.4 56.2 125.4 125.4V835c0 41.4-20.4 80.1-54.5 103.4-34.1 23.4-77.6 28.4-116.2 13.4l-225-87.4c-8.4-3.3-17.6-3.3-26 0l-225 87.4c-14.8 5.8-30.2 8.6-45.5 8.6z m553.7-91.9c11.2 4.4 23.4 3 33.3-3.8 9.9-6.8 15.6-17.6 15.6-29.6V191.4c0-19.8-16.1-35.9-35.9-35.9H228.9c-19.8 0-35.9 16.1-35.9 35.9V835c0 12 5.7 22.9 15.6 29.6 10 6.8 22.1 8.2 33.3 3.9l225-87.4c29.2-11.4 61.5-11.4 90.7 0l225 87.4z"
+      v-bind="$attrs"
+    ></path>
+    <path
+      d="M658.6 498.7H374.5c-24.7 0-44.7-20-44.7-44.7 0-24.7 20-44.7 44.7-44.7h284.1c24.7 0 44.7 20 44.7 44.7 0 24.7-20 44.7-44.7 44.7z"
+      v-bind="$attrs"
+    ></path>
+    <path
+      d="M516.5 640.8c-24.7 0-44.7-20-44.7-44.7V311.9c0-24.7 20-44.7 44.7-44.7 24.7 0 44.7 20 44.7 44.7V596c0 24.7-20 44.8-44.7 44.8z"
+      v-bind="$attrs"
+    ></path>
+  </svg>
+</template>
diff --git a/frontend/src/components/Icon/icons.ts b/frontend/src/components/Icon/icons.ts
@@ -42,7 +42,14 @@ const icons = [
   'edit',
   'delete',
   'file',
-  'code'
+  'code',
+  'overview',
+  'profiles',
+  'subscriptions',
+  'rulesets',
+  'plugins',
+  'scheduledTasks',
+  'settings2'
 ] as const
 
 export default icons
diff --git a/frontend/src/components/NavigationBar.vue b/frontend/src/components/NavigationBar.vue
@@ -1,18 +1,27 @@
 <script setup lang="ts">
+import { computed } from 'vue'
 import { useI18n } from 'vue-i18n'
 
 import rawRoutes from '@/router/routes'
+import { useAppSettingsStore } from '@/stores'
 
 const { t } = useI18n()
+const appSettings = useAppSettingsStore()
 
-const routes = rawRoutes.filter((r) => !r.meta?.hidden)
+const routes = computed(() =>
+  rawRoutes.filter(
+    (r) =>
+      r.meta?.hidden === false ||
+      (!r.meta?.hidden && appSettings.app.pages.includes(r.name! as string))
+  )
+)
 </script>
 
 <template>
   <div class="nav">
     <div v-for="r in routes" :key="r.path">
       <RouterLink :to="r.path" custom #default="{ navigate, isActive }">
-        <Button @click="navigate" :type="isActive ? 'link' : 'text'">
+        <Button @click="navigate" :type="isActive ? 'link' : 'text'" :icon="r.meta && r.meta.icon">
           {{ (r.meta && t(r.meta.name)) || r.name }}
         </Button>
       </RouterLink>

diff --git a/frontend/src/lang/locale/en.ts b/frontend/src/lang/locale/en.ts
@@ -222,7 +222,6 @@ export default {
         'RULE-SET-IPCIDR-MATCH-SOURCE': 'RULE-SET-IPCIDR-MATCH-SOURCE'
       }
     },
-    name: 'sing-box',
     standard: 'Standard',
     memconservative: 'Memconservative',
     chrome: 'Chrome',
@@ -255,7 +254,7 @@ export default {
     about: 'About',
     profiles: 'Profiles',
     kernel: 'Kernel',
-    scheduledtasks: 'ScheduledTasks'
+    scheduledtasks: 'Tasks'
   },
   home: {
     mode: 'Proxy Mode',
@@ -460,7 +459,7 @@ export default {
   },
   plugins: {
     updating: 'Updating',
-    empty: 'The plugin list is empty. Please {action} or {import} a plugin first.',
+    empty: 'The plugin list is empty. Please {action} or import from the {import} first.',
     source: 'Source',
     reload: 'Reload',
     configuration: 'Configure',
@@ -532,6 +531,9 @@ export default {
       zh: '简体中文',
       en: 'English'
     },
+    pages: {
+      name: 'Page visibility'
+    },
     windowState: {
       normal: 'Normal window',
       maximised: 'Maximised',
@@ -553,9 +555,10 @@ export default {
       delay: 'Delay(s)'
     },
     kernel: {
-      branch: 'Branch',
-      main: 'Main branch',
-      latest: 'Latest branch'
+      name: 'sing-box',
+      version: 'Switch version',
+      stable: 'Stable version',
+      alpha: 'Alpha version'
     },
     userAgent: {
       name: 'User-Agent',

diff --git a/frontend/src/lang/locale/zh.ts b/frontend/src/lang/locale/zh.ts
@@ -222,7 +222,6 @@ export default {
         'RULE-SET-IPCIDR-MATCH-SOURCE': '规则集中的ipcidr匹配源IP (RULE-SET-IPCIDR-MATCH-SOURCE)'
       }
     },
-    name: 'sing-box',
     standard: '标准',
     memconservative: '适用小内存设备',
     chrome: 'Chrome',
@@ -460,7 +459,7 @@ export default {
   },
   plugins: {
     updating: '更新中',
-    empty: '插件列表为空，请先{action}或{import}插件。',
+    empty: '插件列表为空，请先{action}或从{import}导入。',
     source: '源码',
     reload: '重载插件',
     configuration: '配置插件',
@@ -532,6 +531,9 @@ export default {
       zh: '简体中文',
       en: 'English'
     },
+    pages: {
+      name: '页面可见性'
+    },
     windowState: {
       normal: '以普通窗口启动',
       maximised: '最大化',
@@ -553,9 +555,9 @@ export default {
       delay: '延迟(秒)'
     },
     kernel: {
-      branch: '分支',
-      main: '主分支',
-      latest: '最新分支'
+      version: '切换版本',
+      stable: '稳定版',
+      alpha: '内测版'
     },
     userAgent: {
       name: '用户代理(User-Agent)',

diff --git a/frontend/src/router/router.d.ts b/frontend/src/router/router.d.ts
@@ -1,8 +1,11 @@
 import 'vue-router'
 
+import { type IconType } from '@/components/Icon/index.vue'
+
 declare module 'vue-router' {
   interface RouteMeta {
     name: string
+    icon?: IconType
     hidden?: boolean
   }
 }
diff --git a/frontend/src/router/routes.ts b/frontend/src/router/routes.ts
@@ -11,58 +11,66 @@ import ScheduledTasksView from '@/views/ScheduledTasksView/index.vue'
 const routes: RouteRecordRaw[] = [
   {
     path: '/',
-    name: 'Home',
+    name: 'Overview',
     component: HomeView,
     meta: {
-      name: 'router.overview'
+      name: 'router.overview',
+      icon: 'overview'
     }
   },
   {
     path: '/profiles',
     name: 'Profiles',
     component: ProfilesView,
     meta: {
-      name: 'router.profiles'
+      name: 'router.profiles',
+      icon: 'profiles'
     }
   },
   {
     path: '/subscriptions',
     name: 'Subscriptions',
     component: SubscribesView,
     meta: {
-      name: 'router.subscriptions'
+      name: 'router.subscriptions',
+      icon: 'subscriptions'
     }
   },
   {
     path: '/rulesets',
     name: 'Rulesets',
     component: RulesetsView,
     meta: {
-      name: 'router.rulesets'
+      name: 'router.rulesets',
+      icon: 'rulesets'
     }
   },
   {
     path: '/plugins',
-    name: 'PluginsView',
+    name: 'Plugins',
     component: PluginsView,
     meta: {
-      name: 'router.plugins'
+      name: 'router.plugins',
+      icon: 'plugins'
     }
   },
   {
     path: '/scheduledtasks',
-    name: 'ScheduledTasksView',
+    name: 'ScheduledTasks',
     component: ScheduledTasksView,
     meta: {
-      name: 'router.scheduledtasks'
+      name: 'router.scheduledtasks',
+      icon: 'scheduledTasks'
     }
   },
   {
     path: '/settings',
     name: 'Settings',
     component: SettingsView,
     meta: {
-      name: 'router.settings'
+      name: 'router.settings',
+      icon: 'settings2',
+      hidden: false
     }
   }
 ]

diff --git a/frontend/src/stores/appSettings.ts b/frontend/src/stores/appSettings.ts
@@ -46,6 +46,7 @@ type AppSettings = {
   multipleInstance: boolean
   addPluginToMenu: boolean
   rollingRelease: boolean
+  pages: string[]
 }
 
 export const useAppSettingsStore = defineStore('app-settings', () => {
@@ -122,7 +123,8 @@ export const useAppSettingsStore = defineStore('app-settings', () => {
     githubApiToken: '',
     multipleInstance: false,
     addPluginToMenu: false,
-    rollingRelease: false
+    rollingRelease: false,
+    pages: ['Overview', 'Profiles', 'Subscriptions', 'Plugins']
   })
 
   const saveAppSettings = debounce((config: string) => {
@@ -134,6 +136,9 @@ export const useAppSettingsStore = defineStore('app-settings', () => {
     const data = await ignoredError(Readfile, 'data/user.yaml')
     data && (app.value = Object.assign(app.value, parse(data)))
 
+    // compatibility code
+    app.value.pages = app.value.pages ?? ['Overview', 'Profiles', 'Subscriptions', 'Plugins']
+
     firstOpen = !!data
 
     updateAppSettings(app.value)