升级依赖，优化部分ts类型

admin/src/layout/default/components/sidebar/menu.vue

@@ -34,7 +34,7 @@ defineOptions({
 })
 const props = defineProps({
     routes: {
-        type: Object as PropType<RouteRecordRaw[]>
+        type: Array as PropType<RouteRecordRaw[]>
     },
     config: {
         type: Object
@@ -69,13 +69,14 @@ const themeClass = computed(() => `theme-${props.theme}`)
         .el-menu {
             :deep(.el-menu-item) {
                 &.is-active {
-                    @apply bg-primary border-primary;
+                    background-color: var(--el-color-primary);
+                    border-color: var(--el-color-primary);
                 }
             }
         }
         :deep(.el-menu--collapse) {
             .el-sub-menu.is-active .el-sub-menu__title {
-                @apply bg-primary #{!important};
+                background-color: var(--el-color-primary) !important;
             }
         }
     }
@@ -84,7 +85,9 @@ const themeClass = computed(() => `theme-${props.theme}`)
             .el-menu-item {
                 border-color: transparent;
                 &.is-active {
-                    @apply bg-primary-light-9 border-r-2 border-primary;
+                    background-color: var(--el-color-primary-light-9);
+                    border-right-width: 2px;
+                    border-color: var(--el-color-primary);
                 }
             }
             .el-menu-item:hover,

admin/src/layout/default/components/sidebar/side.vue

@@ -14,6 +14,7 @@
 </template>
 
 <script setup lang="ts">
+import type { RouteRecordRaw } from 'vue-router'
 import useAppStore from '@/stores/modules/app'
 import useSettingStore from '@/stores/modules/setting'
 import useUserStore from '@/stores/modules/user'
@@ -35,7 +36,7 @@ const settingStore = useSettingStore()
 const sideTheme = computed(() => settingStore.sideTheme)
 const userStore = useUserStore()
 
-const routes = computed(() => userStore.routes)
+const routes = computed(() => userStore.routes as RouteRecordRaw[])
 
 const sideStyle = computed(() => {
     return sideTheme.value == 'dark'
@@ -62,7 +63,12 @@ const handleSelect = () => {
 .side {
     position: relative;
     z-index: 999;
-    @apply border-r border-br-light h-full flex flex-col;
+    border-right-width: 1px;
+    border-color: var(--el-border-color-light);
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+
     background-color: var(--side-dark-color, var(--el-bg-color));
 }
 </style>