init

src/App.vue

@@ -0,0 +1,81 @@
+<template>
+  <router-view></router-view>
+</template>
+
+<script setup>
+import { useConfigure } from "@/store/configure.js";
+import { useRoutes } from "@/store/routes.js";
+const storeConfigure = useConfigure();
+const storeRoutes = useRoutes();
+const route = useRoute();
+// 获取枚举值
+const { layoutModeEnum } = ENUMS;
+
+watch(
+  route,
+  (newValue) => {
+    const componentName = _hook.useComponentName(newValue);
+    if (newValue?.meta?.isKeepAlive && componentName) {
+      storeRoutes.setCachedRoute(componentName);
+    }
+    storeRoutes.setBreadcrumb(newValue.matched.slice(1));
+    document.title = route?.meta?.title || route.path;
+  },
+  { deep: true }
+);
+
+onMounted(() => {
+  // 初始化配置
+  const configure = _hook.useLocalStorage.get("configure");
+  if (configure) {
+    storeConfigure.initConfigure(configure);
+  }
+
+  // 初始化颜色
+  _hook.useCssVar("--el-color-primary", storeConfigure.configure.themeColor);
+  switch (storeConfigure.configure.menuMode) {
+    case layoutModeEnum.key[0]:
+      _hook.useCssVar("--el-menu-bg-color", storeConfigure.configure.menuBGColor);
+      break;
+    case layoutModeEnum.key[1]:
+      _hook.useCssVar("--el-menu-bg-color", "#ffffff");
+      break;
+    default:
+  }
+  _hook.useCssVar("--admin-column-bg-color", storeConfigure.configure.menuBGColor);
+  _hook.useCssVar("--el-menu-text-color", storeConfigure.configure.textColor);
+  _hook.useCssVar("--el-menu-active-color", storeConfigure.configure.activeTextColor);
+  [3, 5, 7, 8, 9].forEach((i) => {
+    _hook.useCssVar(`--el-color-primary-light-${i}`, _hook.useLightColor(storeConfigure.configure.themeColor, `0.${i}`));
+  });
+
+  // 面包屑导航
+  storeRoutes.setBreadcrumb(route.matched.slice(1));
+});
+</script>
+
+<style lang="scss">
+* {
+  box-sizing: border-box;
+}
+
+// 自定义进度条颜色
+#nprogress .bar {
+  height: 5px !important;
+  background: var(--el-color-primary-light-3) !important;
+}
+
+.mt15 {
+  margin-top: 15px;
+}
+
+.pb15 {
+  padding-bottom: 15px;
+}
+
+.card {
+  background-color: #fff;
+  padding: 15px;
+  border-radius: 4px;
+}
+</style>