feat: add page components

src/layout/components/AppMain.vue

@@ -1,10 +1,6 @@
 <template>
-  <router-view v-slot="{ Component, route }">
-    <transition name="fade-slide" mode="out-in" appear>
-      <keep-alive :include="keepAliveRouteNames">
-        <component :is="Component" v-if="appStore.reloadFlag" :key="route.path" />
-      </keep-alive>
-    </transition>
+  <router-view v-slot="{ Component }">
+    <component :is="Component" v-if="appStore.reloadFlag" />
   </router-view>
 </template>
 
@@ -12,9 +8,4 @@
 import { useAppStore } from '@/store/modules/app'
 
 const appStore = useAppStore()
-const router = useRouter()
-const allRoutes = router.getRoutes()
-const keepAliveRouteNames = computed(() => {
-  return allRoutes.filter((route) => route.meta?.keepAlive).map((route) => route.name)
-})
 </script>

src/layout/components/header/index.vue

@@ -1,15 +1,13 @@
 <template>
-  <header px-15 h-full flex items-center>
-    <div flex items-center>
-      <MenuCollapse />
-      <BreadCrumb ml-15 />
-    </div>
-    <div ml-auto flex items-center>
-      <GithubSite />
-      <FullScreen />
-      <UserAvatar />
-    </div>
-  </header>
+  <div flex items-center>
+    <MenuCollapse />
+    <BreadCrumb ml-15 />
+  </div>
+  <div ml-auto flex items-center>
+    <GithubSite />
+    <FullScreen />
+    <UserAvatar />
+  </div>
 </template>
 
 <script setup>

src/layout/components/sidebar/components/SideMenu.vue

@@ -106,7 +106,7 @@ function handleMenuSelect(key, item) {
     &.n-menu-item-content--selected,
     &:hover {
       &::before {
-        border-left: 4px solid var(--primaryColor);
+        border-left: 4px solid var(--primary-color);
       }
     }
   }