refactor: update icon usage to use mdi imports for consistency

src/components/layouts/SKAdminLayout.vue

@@ -8,7 +8,7 @@ v-model="drawer" class="sk-admin-drawer" color="surface" :rail="isRail"
         <!-- Sidebar Title -->
         <v-card class="sidebar-header d-flex align-center pa-0 pl-3 py-2" flat>
           <v-btn
-:aria-label="sidebarToggleLabel" color="grey" :icon="isRail ? 'mdi-menu-open' : 'mdi-menu'" size="32"
+:aria-label="sidebarToggleLabel" color="grey" :icon="isRail ? mdiMenuOpen : mdiMenu" size="32"
             variant="text" @click="toggleSidebar" />
           <v-card-text v-if="!isRail" class="sidebar-title flex-grow-1 py-0">
             <slot name="title">
@@ -120,12 +120,12 @@ v-else :mobile-current-items="mobileCurrentItems"
       <v-card v-if="helpWidgetVisible" class="help-widget" rounded="lg">
         <v-card-item class="py-2">
           <template #prepend>
-            <v-icon color="primary">mdi-help-circle-outline</v-icon>
+            <v-icon color="primary" :icon="mdiHelpCircleOutline" />
           </template>
           <v-card-title class="text-subtitle-2">操作說明</v-card-title>
           <template #append>
             <v-btn
-aria-label="關閉說明" icon="mdi-close" size="small" variant="text"
+aria-label="關閉說明" :icon="mdiClose" size="small" variant="text"
               @click="helpWidgetVisible = false" />
           </template>
         </v-card-item>
@@ -141,11 +141,12 @@ aria-label="關閉說明" icon="mdi-close" size="small" variant="text"
       </v-card>
     </v-slide-y-reverse-transition>
 
-    <!-- <v-btn v-if="isMobile" class="mobile-menu-btn" color="primary" icon="mdi-menu" @click="drawer = true" /> -->
+    <!-- <v-btn v-if="isMobile" class="mobile-menu-btn" color="primary" :icon="mdiMenu" @click="drawer = true" /> -->
   </v-app>
 </template>
 
 <script setup>
+import { mdiClose, mdiHelpCircleOutline, mdiHome, mdiMenu, mdiMenuOpen } from '@mdi/js'
 import { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue'
 import { useDisplay, useTheme } from 'vuetify'
 import { getNextThemeName } from '@/utils/theme'
@@ -182,7 +183,7 @@ const defaultFeatures = {
 const defaultBreadcrumbConfig = {
   homeLabel: '首頁',
   homeDisabled: true,
-  homeIcon: 'mdi-home',
+  homeIcon: mdiHome,
 }
 
 const props = defineProps({
@@ -246,7 +247,7 @@ const props = defineProps({
     default: () => ({
       homeLabel: '首頁',
       homeDisabled: true,
-      homeIcon: 'mdi-home',
+      homeIcon: mdiHome,
     }),
   },
   breadcrumbItems: {