修改样式细节，修改utils

src/api/axios.ts

@@ -1,7 +1,7 @@
 import axios, { AxiosResponse, AxiosRequestConfig } from 'axios'
 import { ResultEnum } from "@/enums/httpEnum"
 import { ErrorPageNameMap } from "@/enums/pageEnum"
-import { redirectErrorPage } from '@/utils'
+import { redirectErrorPage } from '@/utils/page'
 
 const axiosInstance = axios.create({
   baseURL: import.meta.env.DEV ? import.meta.env.VITE_DEV_PATH : import.meta.env.VITE_PRO_PATH,

src/styles/common/animation.scss

@@ -0,0 +1,23 @@
+.v-modal-enter {
+  animation: v-modal-in 0.2s ease;
+}
+
+.v-modal-leave {
+  animation: v-modal-out 0.2s ease forwards;
+}
+
+@keyframes v-modal-in {
+  0% {
+    opacity: 0;
+  }
+  100% {
+  }
+}
+
+@keyframes v-modal-out {
+  0% {
+  }
+  100% {
+    opacity: 0;
+  }
+}

src/styles/common/mixins/config.scss

@@ -1,4 +1,4 @@
 $namespace: 'go';
 $theme-light: 'light';
-$theme-dart: 'dart';
+$theme-dark: 'dark';
 $state-prefix: 'is-';

src/styles/common/mixins/mixins.scss

@@ -15,7 +15,7 @@
 }
 
 @mixin go-d($block) {
-  $B: $namespace + '-' + $theme-dart + '-' + $block !global;
+  $B: $namespace + '-' + $theme-dark + '-' + $block !global;
   .#{$B} {
     @content;
   }

src/styles/common/style.scss

@@ -1,13 +1,14 @@
 @import './var.scss';
+@import './animation.scss';
 
 // 毛玻璃
 .--background-filter {
-  backdrop-filter: $--filter-blur;
-  background-color: $--filter-color;
+  backdrop-filter: $--filter-blur-base;
+  background-color: $--filter-color-base;
 }
 
 // 边框圆角
 .--border-radius {
-  border-radius: $--border-radius;
+  border-radius: $--border-radius-base;
   overflow: hidden;
 }

src/styles/common/var.scss

@@ -1,6 +1,10 @@
 // 模糊
-$--filter-blur: blur(2px);
+$--filter-blur-base: blur(2px);
 // 毛玻璃
-$--filter-color: rgba(0, 0, 0, 0.07);
+$--filter-color-base: rgba(0, 0, 0, 0.07);
 // 边框
-$--border-radius: 5px;
+$--border-radius-base: 5px;
+/// 阴影
+$--box-shadow-base: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04) !default;
+$--box-shadow-dark: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.12) !default;
+$--box-shadow-light: 0 2px 12px 0 rgba(0, 0, 0, 0.1) !default;

src/utils/comp.ts

@@ -1,34 +0,0 @@
-import { Component, DefineComponent } from "vue";
-import { App, Plugin, getCurrentInstance } from "vue";
-
-interface Registed {
-  [key: string]: boolean;
-}
-let registed: Registed = {};
-
-interface Comp {
-  displayName?: string;
-  name?: string;
-}
-
-type RegisteComp = (comp: Comp & Plugin) => void;
-
-const registeComp: RegisteComp = comp => {
-  const name = comp.displayName || comp.name;
-
-  if (name && !registed[name]) {
-    const instance = getCurrentInstance();
-    const app = instance?.appContext.app;
-    if (app) {
-      app.use(comp);
-      registed[name] = true;
-    }
-  }
-};
-
-const regComp: (comp: any) => void = comp => {
-  const instance = getCurrentInstance();
-  const app = instance?.appContext.app;
-  app?.component(comp?.name, comp);
-};
-export { registeComp, regComp };

src/utils/index.ts

@@ -1,8 +1,5 @@
 import { h } from 'vue';
 import { NIcon } from 'naive-ui';
-import { ResultEnum } from "@/enums/httpEnum"
-import { ErrorPageNameMap } from "@/enums/pageEnum"
-import router from '@/router';
 
 /**
  * * 生成一个用不重复的ID
@@ -24,14 +21,4 @@ export const renderIcon = (icon: any) => {
   return () => h(NIcon, null, { default: () => h(icon) });
 }
 
-/**
- * * 错误页重定向
- * @param icon 
- * @returns 
- */
-export const redirectErrorPage = (code: ResultEnum) => {
-  router.push({
-    name: ErrorPageNameMap.get(code)
-  })
-}
 

src/utils/page.ts

@@ -0,0 +1,25 @@
+import { ResultEnum } from "@/enums/httpEnum"
+import { ErrorPageNameMap } from "@/enums/pageEnum"
+import router from '@/router';
+
+/**
+ * * 错误页重定向
+ * @param icon 
+ * @returns 
+ */
+export const redirectErrorPage = (code: ResultEnum) => {
+  if(!code) return false
+  const pageName = ErrorPageNameMap.get(code)
+  if(!pageName) return false
+  routerTurnByName(pageName)
+}
+
+/**
+ * * 根据名字跳转路由
+ * @param pageName 
+ */
+export const routerTurnByName = (pageName: string) => {
+  router.push({
+    name: pageName
+  })
+}

src/views/exception/403.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="flex flex-col justify-center page-container">
+  <div class="go-error">
     <div class="text-center">
       <img src="~@/assets/images/exception/403.svg" alt="" />
     </div>
@@ -11,30 +11,32 @@
 </template>
 
 <script lang="ts" setup>
-  import { useRouter } from 'vue-router';
-  const router = useRouter();
-  function goHome() {
-    router.push('/');
-  }
+import { useRouter } from 'vue-router'
+import { PageEnum } from '@/enums/pageEnum'
+import { routerTurnByName } from '@/utils/page'
+const router = useRouter()
+function goHome() {
+  routerTurnByName(PageEnum.BASE_HOME_NAME)
+}
 </script>
 
 <style lang="scss" scoped>
-  .page-container {
-    width: 100%;
-    border-radius: 4px;
-    padding: 50px 0;
-    height: 100vh;
-
-    .text-center {
-      h1 {
-        color: #666;
-        padding: 20px 0;
-      }
+@include go(error) {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  width: 100%;
+  padding: 100px 0;
+  .text-center {
+    h1 {
+      color: #666;
+      padding: 20px 0;
     }
+  }
 
-    img {
-      width: 350px;
-      margin: 0 auto;
-    }
+  img {
+    width: 350px;
+    margin: 0 auto;
   }
+}
 </style>

src/views/exception/404.vue

@@ -13,11 +13,10 @@
 <script lang="ts" setup>
 import { useRouter } from 'vue-router'
 import { PageEnum } from '@/enums/pageEnum'
+import { routerTurnByName } from '@/utils/page'
 const router = useRouter()
 function goHome() {
-  router.push({
-    name: PageEnum.BASE_HOME_NAME
-  })
+  routerTurnByName(PageEnum.BASE_HOME_NAME)
 }
 </script>
 

src/views/exception/500.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="flex flex-col justify-center page-container">
+  <div class="go-error">
     <div class="text-center">
       <img src="~@/assets/images/exception/500.svg" alt="" />
     </div>
@@ -12,19 +12,21 @@
 
 <script lang="ts" setup>
 import { useRouter } from 'vue-router'
+import { PageEnum } from '@/enums/pageEnum'
+import { routerTurnByName } from '@/utils/page'
 const router = useRouter()
-const goHome = () => {
-  router.push('/')
+function goHome() {
+  routerTurnByName(PageEnum.BASE_HOME_NAME)
 }
 </script>
 
 <style lang="scss" scoped>
-.page-container {
+@include go(error) {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
   width: 100%;
-  border-radius: 4px;
-  padding: 50px 0;
-  height: 100vh;
-
+  padding: 100px 0;
   .text-center {
     h1 {
       color: #666;