refactor: 重构图标使用方式，集成自定应图标

src/layout/components/sidebar/components/SideLogo.vue

@@ -1,8 +1,6 @@
 <template>
   <router-link h-60 f-c-c to="/">
-    <n-icon size="36" color="#316c72">
-      <IconLogo />
-    </n-icon>
+    <icon-custom-logo text-36></icon-custom-logo>
     <h2 v-show="!appStore.collapsed" ml-10 color-primary text-16 font-bold max-w-140 flex-shrink-0>
       {{ title }}
     </h2>
@@ -10,7 +8,6 @@
 </template>
 
 <script setup>
-import { IconLogo } from '@/components/AppIcons'
 import { useAppStore } from '@/store/modules/app'
 const title = import.meta.env.VITE_APP_TITLE
 

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

@@ -16,8 +16,6 @@ import { useRouter } from 'vue-router'
 import { computed } from 'vue'
 import { usePermissionStore } from '@/store/modules/permission'
 
-import { IconCircle } from '@/components/AppIcons'
-
 import { isExternal } from '@/utils/is'
 import { useAppStore } from '@/store/modules/app'
 import { renderIcon } from '@/utils/icon'
@@ -47,7 +45,7 @@ function getMenuItem(route, basePath = '') {
     label: (route.meta && route.meta.title) || route.name,
     key: route.name,
     path: resolvePath(basePath, route.path),
-    icon: route.meta?.icon ? renderIcon(route.meta?.icon, { size: 16 }) : renderIcon(IconCircle, { size: 8 }),
+    icon: route.meta?.icon ? renderIcon(route.meta?.icon, { size: 16 }) : renderIcon('mdi:circle-outline', { size: 8 }),
     index: route.meta?.index || 0,
   }
 
@@ -64,7 +62,7 @@ function getMenuItem(route, basePath = '') {
       path: resolvePath(menuItem.path, singleRoute.path),
       icon: singleRoute.meta?.icon
         ? renderIcon(singleRoute.meta?.icon, { size: 16 })
-        : renderIcon(IconCircle, { size: 8 }),
+        : renderIcon('mdi:circle-outline', { size: 8 }),
       index: menuItem.index,
     }
     const visibleItems = singleRoute.children ? singleRoute.children.filter((item) => item.name && !item.isHidden) : []