perf: delete settings.ts use serverConfig.json

.vscode/settings.json

@@ -43,5 +43,7 @@
   "cSpell.userWords": ["sourcemap", "vite"],
   "editor.codeActionsOnSave": {
     "source.fixAll.eslint": true
-  }
+  },
+  "volar.tsPlugin": true,
+  "typescript.tsdk": "node_modules/typescript/lib"
 }

public/serverConfig.json

@@ -1,5 +1,8 @@
 {
   "Version": "2.0.0",
+  "Title": "PureAdmin",
+  "FixedHeader": false,
+  "HiddenSideBar": false,
   "KeepAlive": true,
   "Locale": "zh",
   "Layout": "vertical-dark",

src/config/index.ts

@@ -6,7 +6,7 @@ const setConfig = (cfg?: unknown) => {
   config = Object.assign(config, cfg);
 };
 
-const getConfig = (key?: string) => {
+const getConfig = (key?: string): ServerConfigs => {
   if (typeof key === "string") {
     const arr = key.split(".");
     if (arr && arr.length) {

src/layout/components/sidebar/horizontal.vue

@@ -8,7 +8,6 @@ import {
   getCurrentInstance
 } from "vue";
 import { useI18n } from "vue-i18n";
-import settings from "/@/settings";
 import { emitter } from "/@/utils/mitt";
 import { templateRef } from "@vueuse/core";
 import SidebarItem from "./sidebarItem.vue";
@@ -22,6 +21,10 @@ import { usePermissionStoreHook } from "/@/store/modules/permission";
 
 const instance =
   getCurrentInstance().appContext.config.globalProperties.$storage;
+
+const title =
+  getCurrentInstance().appContext.config.globalProperties.$config?.Title;
+
 const menuRef = templateRef<ElRef | null>("menu", null);
 const routeStore = usePermissionStoreHook();
 const route = useRoute();
@@ -114,7 +117,7 @@ onMounted(() => {
   <div class="horizontal-header">
     <div class="horizontal-header-left" @click="backHome">
       <i class="fa fa-optin-monster"></i>
-      <h4>{{ settings.title }}</h4>
+      <h4>{{ title }}</h4>
     </div>
     <el-menu
       ref="menu"

src/layout/components/sidebar/logo.vue

@@ -1,9 +1,11 @@
 <script setup lang="ts">
-import settings from "/@/settings";
+import { getCurrentInstance } from "vue";
-
 const props = defineProps({
   collapse: Boolean
 });
+
+const title =
+  getCurrentInstance().appContext.config.globalProperties.$config?.Title;
 </script>
 
 <template>
@@ -12,22 +14,22 @@ const props = defineProps({
       <router-link
         v-if="props.collapse"
         key="props.collapse"
-        :title="settings.title"
+        :title="title"
         class="sidebar-logo-link"
         to="/"
       >
         <i class="fa fa-optin-monster"></i>
-        <h1 class="sidebar-title">{{ settings.title }}</h1>
+        <h1 class="sidebar-title">{{ title }}</h1>
       </router-link>
       <router-link
         v-else
         key="expand"
-        :title="settings.title"
+        :title="title"
         class="sidebar-logo-link"
         to="/"
       >
         <i class="fa fa-optin-monster"></i>
-        <h1 class="sidebar-title">{{ settings.title }}</h1>
+        <h1 class="sidebar-title">{{ title }}</h1>
       </router-link>
     </transition>
   </div>

src/layout/index.vue

@@ -38,7 +38,6 @@ import {
   getCurrentInstance
 } from "vue";
 import { setType } from "./types";
-import options from "/@/settings";
 import { useI18n } from "vue-i18n";
 import { emitter } from "/@/utils/mitt";
 import { toggleClass } from "/@/utils/operate";
@@ -62,7 +61,9 @@ const { hiddenMainContainer } = useCssModule();
 const instance =
   getCurrentInstance().appContext.app.config.globalProperties.$storage;
 
-let containerHiddenSideBar = ref(options.hiddenSideBar);
+const hiddenSideBar = ref(
+  getCurrentInstance().appContext.config.globalProperties.$config?.HiddenSideBar
+);
 
 const set: setType = reactive({
   sidebar: computed(() => {
@@ -127,15 +128,15 @@ const $_resizeHandler = () => {
 };
 
 function onFullScreen() {
-  if (unref(containerHiddenSideBar)) {
+  if (unref(hiddenSideBar)) {
-    containerHiddenSideBar.value = false;
+    hiddenSideBar.value = false;
     toggleClass(
       false,
       hiddenMainContainer,
       document.querySelector(".main-container")
     );
   } else {
-    containerHiddenSideBar.value = true;
+    hiddenSideBar.value = true;
     toggleClass(
       true,
       hiddenMainContainer,
@@ -151,7 +152,7 @@ onMounted(() => {
     handleClickOutside(true);
   }
   toggleClass(
-    unref(containerHiddenSideBar),
+    unref(hiddenSideBar),
     hiddenMainContainer,
     document.querySelector(".main-container")
   );
@@ -173,20 +174,16 @@ onBeforeMount(() => {
       class="drawer-bg"
       @click="handleClickOutside(false)"
     />
-    <Vertical v-show="!containerHiddenSideBar && layout.includes('vertical')" />
+    <Vertical v-show="!hiddenSideBar && layout.includes('vertical')" />
     <div class="main-container">
       <div :class="{ 'fixed-header': set.fixedHeader }">
         <!-- 顶部导航栏 -->
-        <navbar
+        <navbar v-show="!hiddenSideBar && layout.includes('vertical')" />
-          v-show="!containerHiddenSideBar && layout.includes('vertical')"
-        />
         <!-- tabs标签页 -->
-        <Horizontal
+        <Horizontal v-show="!hiddenSideBar && layout.includes('horizontal')" />
-          v-show="!containerHiddenSideBar && layout.includes('horizontal')"
-        />
         <tag>
           <span @click="onFullScreen">
-            <fullScreen v-if="!containerHiddenSideBar" />
+            <fullScreen v-if="!hiddenSideBar" />
             <exitScreen v-else />
           </span>
         </tag>

src/settings.ts

@@ -1,7 +0,0 @@
-export default {
-  title: "PureAdmin",
-
-  fixedHeader: false,
-
-  hiddenSideBar: false
-};

src/store/modules/settings.ts

@@ -1,6 +1,6 @@
-import defaultSettings from "../../settings";
 import { defineStore } from "pinia";
 import { store } from "/@/store";
+import { getConfig } from "/@/config";
 
 interface SettingState {
   title: string;
@@ -10,8 +10,8 @@ interface SettingState {
 export const useSettingStore = defineStore({
   id: "pure-setting",
   state: (): SettingState => ({
-    title: defaultSettings.title,
+    title: getConfig().Title,
-    fixedHeader: defaultSettings.fixedHeader
+    fixedHeader: getConfig().FixedHeader
   }),
   getters: {
     getTitle() {

types/global.d.ts

@@ -84,10 +84,21 @@ declare global {
 
   declare interface ServerConfigs {
     Version?: string;
+    Title?: string;
+    FixedHeader?: boolean;
+    HiddenSideBar?: boolean;
     KeepAlive?: boolean;
     Locale?: string;
     Layout?: string;
-    MapConfigure?: any;
+    MapConfigure?: {
+      amapKey?: string;
+      baiduKey?: string;
+      options: {
+        resizeEnable?: boolean;
+        center?: number[];
+        zoom?: number;
+      };
+    };
   }
 
   function parseInt(s: string | number, radix?: number): number;