feat(layout): page building

jumpserver · Jul 11, 2024 · 55f8492 · 55f8492
1 parent 033d546
commit 55f8492
Show file tree

Hide file tree

Showing 15 changed files with 489 additions and 129 deletions.
diff --git a/components.d.ts b/components.d.ts
@@ -19,16 +19,20 @@ declare module 'vue' {
     NH2: typeof import('naive-ui')['NH2']
     NIcon: typeof import('naive-ui')['NIcon']
     NImage: typeof import('naive-ui')['NImage']
+    NInput: typeof import('naive-ui')['NInput']
     NLayout: typeof import('naive-ui')['NLayout']
     NLayoutContent: typeof import('naive-ui')['NLayoutContent']
     NLayoutFooter: typeof import('naive-ui')['NLayoutFooter']
     NLayoutHeader: typeof import('naive-ui')['NLayoutHeader']
     NLayoutSider: typeof import('naive-ui')['NLayoutSider']
     NMessageProvider: typeof import('naive-ui')['NMessageProvider']
     NPopover: typeof import('naive-ui')['NPopover']
+    NSelect: typeof import('naive-ui')['NSelect']
     NSpace: typeof import('naive-ui')['NSpace']
     NSpin: typeof import('naive-ui')['NSpin']
     NSwitch: typeof import('naive-ui')['NSwitch']
+    NTabPane: typeof import('naive-ui')['NTabPane']
+    NTabs: typeof import('naive-ui')['NTabs']
     NText: typeof import('naive-ui')['NText']
     NTooltip: typeof import('naive-ui')['NTooltip']
     NTree: typeof import('naive-ui')['NTree']

diff --git a/package.json b/package.json
@@ -18,11 +18,14 @@
     "@vicons/ionicons5": "^0.12.0",
     "axios": "^1.7.2",
     "mitt": "^3.0.1",
+    "naive-ui": "^2.38.2",
     "normalize.css": "^8.0.1",
     "pinia": "^2.1.7",
     "pinia-plugin-persistedstate": "^3.2.1",
+    "sortablejs": "^1.15.2",
     "vite-project": "link:",
     "vue": "^3.4.31",
+    "vue-draggable-plus": "^0.5.2",
     "vue-i18n": "^9.13.1",
     "vue-router": "^4.4.0"
   },
@@ -43,7 +46,6 @@
     "globals": "^15.8.0",
     "husky": "^9.0.11",
     "lint-staged": "^15.2.7",
-    "naive-ui": "^2.38.2",
     "postcss": "^8.4.39",
     "postcss-scss": "^4.0.9",
     "prettier": "^3.3.2",

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/src/App.vue b/src/App.vue
@@ -1,5 +1,10 @@
 <template>
-  <n-config-provider :locale="zhCN" :date-locale="dateZhCN" :theme="isDark ? darkTheme : null">
+  <n-config-provider
+    :locale="zhCN"
+    :date-locale="dateZhCN"
+    :theme="isDark ? darkTheme : null"
+    :theme-overrides="isDark ? darkThemeOverrides : lightThemeOverrides"
+  >
     <n-message-provider>
       <loading>
         <router-view />
@@ -16,6 +21,7 @@ import { onBeforeMount } from 'vue';
 import { useTheme } from '@/hooks/useTheme.ts';
 import { useTranslations } from '@/hooks/useTranslate.ts';
 import { useGlobalStore } from '@/stores/modules/global.ts';
+import { lightThemeOverrides, darkThemeOverrides } from '@/ThemeOverrides.ts';
 
 import { setFavicon } from '@/utils';
 import { storeToRefs } from 'pinia';

diff --git a/src/ThemeOverrides.ts b/src/ThemeOverrides.ts
@@ -0,0 +1,26 @@
+import { GlobalThemeOverrides } from 'naive-ui';
+
+export const lightThemeOverrides: GlobalThemeOverrides = {
+  common: {
+    primaryColor: '#1ab394'
+  },
+  Spin: {
+    color: '#1ab394',
+    textColor: '#292827 '
+  }
+
+  // ...
+};
+
+export const darkThemeOverrides: GlobalThemeOverrides = {
+  common: {
+    primaryColor: '#1ab394'
+  },
+  Spin: {
+    color: '#48c2a9',
+    textColor: '#ffffff'
+  },
+  Dropdown: {
+    optionColorHover: '#48c2a9'
+  }
+};
diff --git a/src/languages/modules/en.ts b/src/languages/modules/en.ts
@@ -8,9 +8,17 @@ export default {
   notParenthesis: 'Parentheses are not allowed.',
   InvalidJson: 'Invalid JSON format.',
   requiredHasUserNameMapped: 'Username attr is required.',
+  General: 'General',
+  GUI: 'GUI',
+  CLI: 'CLI',
   'Web Terminal': 'Web Terminal',
   'Theme reset': 'The theme color has been reset to',
   'Custom Setting': 'Custom Setting',
   'Dark Mode': '黑暗模式',
+  'Theme Settings': 'Theme Settings',
+  'Language Settings': 'Language Settings',
+  'Page configuration': 'Page configuration',
+  'Please select': 'Please select',
+  'Language Selection': 'Language Selection',
   'Primary Color': 'Primary Color'
 };
diff --git a/src/languages/modules/zh.ts b/src/languages/modules/zh.ts
@@ -8,9 +8,17 @@ export default {
   notParenthesis: '不能包含括号。',
   InvalidJson: 'JSON 格式错误.',
   requiredHasUserNameMapped: '用户名属性是必需的。',
+  General: '通用配置',
+  GUI: '图形化配置',
+  CLI: '命令行配置',
   'Web Terminal': 'Web 终端',
   'Theme reset': '主题颜色已重置为',
   'Custom Setting': '自定义设置',
   'Dark Mode': '黑暗模式',
+  'Theme Settings': '主题设置',
+  'Language Settings': '语言设置',
+  'Page configuration': '页面配置',
+  'Please select': '请选择',
+  'Language Selection': '语言选择',
   'Primary Color': '主题颜色'
 };