From d7ebbda3d321efe8e9b69ea5e6abf98c44968403 Mon Sep 17 00:00:00 2001
From: skytek_xinliang <carl@skytek.com.tw>
Date: Mon, 30 Mar 2026 15:14:12 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E9=87=8D=E6=A7=8B=E4=B8=BB=E4=BD=88?=
 =?UTF-8?q?=E5=B1=80=E5=8F=8A=E7=9B=B8=E9=97=9C=E5=85=83=E4=BB=B6=EF=BC=8C?=
 =?UTF-8?q?=E6=9B=B4=E6=96=B0=E5=91=BD=E5=90=8D=E8=A6=8F=E5=89=87=E4=B8=A6?=
 =?UTF-8?q?=E6=96=B0=E5=A2=9E=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 docs/frontend-layering.md                     | 18 +++++-----
 src/components/layouts/MainLayout.vue         | 34 +++++++++----------
 .../AppBarBreadcrumbCol.vue}                  |  0
 .../AppBarFavoritesCol.vue}                   |  0
 .../AppBarTopCol.vue}                         |  0
 .../DrawerDesktopMenu.vue}                    |  0
 .../DrawerMobileFavoritesPanel.vue}           |  0
 .../DrawerMobileMenuPanel.vue}                |  0
 .../{sk-admin-layout => main-layout}/types.ts |  0
 src/composables/layout/useAdminLayoutState.ts |  2 +-
 10 files changed, 27 insertions(+), 27 deletions(-)
 rename src/components/layouts/{sk-admin-layout/SkAdminAppBarBreadcrumbCol.vue => main-layout/AppBarBreadcrumbCol.vue} (100%)
 rename src/components/layouts/{sk-admin-layout/SkAdminAppBarFavoritesCol.vue => main-layout/AppBarFavoritesCol.vue} (100%)
 rename src/components/layouts/{sk-admin-layout/SkAdminAppBarTopCol.vue => main-layout/AppBarTopCol.vue} (100%)
 rename src/components/layouts/{sk-admin-layout/SkAdminDrawerDesktopMenu.vue => main-layout/DrawerDesktopMenu.vue} (100%)
 rename src/components/layouts/{sk-admin-layout/SkAdminDrawerMobileFavoritesPanel.vue => main-layout/DrawerMobileFavoritesPanel.vue} (100%)
 rename src/components/layouts/{sk-admin-layout/SkAdminDrawerMobileMenuPanel.vue => main-layout/DrawerMobileMenuPanel.vue} (100%)
 rename src/components/layouts/{sk-admin-layout => main-layout}/types.ts (100%)

diff --git a/docs/frontend-layering.md b/docs/frontend-layering.md
index 96853be..91d3a77 100644
--- a/docs/frontend-layering.md
+++ b/docs/frontend-layering.md
@@ -146,16 +146,16 @@
 
 - [MainLayout.vue](/home/carl/git/skt-vuetify-templates/src/components/layouts/MainLayout.vue)
 - [PlainLayout.vue](/home/carl/git/skt-vuetify-templates/src/components/layouts/PlainLayout.vue)
-- `src/components/layouts/sk-admin-layout/*`
+- `src/components/layouts/main-layout/*`
 
-其中 `sk-admin-layout/*` 是 `MainLayout` 底下拆出的骨架子元件：
+其中 `main-layout/*` 是 `MainLayout` 底下拆出的骨架子元件：
 
-- [SkAdminAppBarBreadcrumbCol.vue](/home/carl/git/skt-vuetify-templates/src/components/layouts/sk-admin-layout/SkAdminAppBarBreadcrumbCol.vue)
-- [SkAdminAppBarFavoritesCol.vue](/home/carl/git/skt-vuetify-templates/src/components/layouts/sk-admin-layout/SkAdminAppBarFavoritesCol.vue)
-- [SkAdminAppBarTopCol.vue](/home/carl/git/skt-vuetify-templates/src/components/layouts/sk-admin-layout/SkAdminAppBarTopCol.vue)
-- [SkAdminDrawerDesktopMenu.vue](/home/carl/git/skt-vuetify-templates/src/components/layouts/sk-admin-layout/SkAdminDrawerDesktopMenu.vue)
-- [SkAdminDrawerMobileFavoritesPanel.vue](/home/carl/git/skt-vuetify-templates/src/components/layouts/sk-admin-layout/SkAdminDrawerMobileFavoritesPanel.vue)
-- [SkAdminDrawerMobileMenuPanel.vue](/home/carl/git/skt-vuetify-templates/src/components/layouts/sk-admin-layout/SkAdminDrawerMobileMenuPanel.vue)
+- [AppBarBreadcrumbCol.vue](/home/carl/git/skt-vuetify-templates/src/components/layouts/main-layout/AppBarBreadcrumbCol.vue)
+- [AppBarFavoritesCol.vue](/home/carl/git/skt-vuetify-templates/src/components/layouts/main-layout/AppBarFavoritesCol.vue)
+- [AppBarTopCol.vue](/home/carl/git/skt-vuetify-templates/src/components/layouts/main-layout/AppBarTopCol.vue)
+- [DrawerDesktopMenu.vue](/home/carl/git/skt-vuetify-templates/src/components/layouts/main-layout/DrawerDesktopMenu.vue)
+- [DrawerMobileFavoritesPanel.vue](/home/carl/git/skt-vuetify-templates/src/components/layouts/main-layout/DrawerMobileFavoritesPanel.vue)
+- [DrawerMobileMenuPanel.vue](/home/carl/git/skt-vuetify-templates/src/components/layouts/main-layout/DrawerMobileMenuPanel.vue)
 
 layout 應只承擔：
 
@@ -333,7 +333,7 @@ layout 不應承擔：
 
 目前例子：
 
-- `sk-admin-layout`
+- `main-layout`
 - `master-detail`
 
 ### domain component 命名
diff --git a/src/components/layouts/MainLayout.vue b/src/components/layouts/MainLayout.vue
index 49f4abc..ddd0177 100644
--- a/src/components/layouts/MainLayout.vue
+++ b/src/components/layouts/MainLayout.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-app v-bind="$attrs" class="sk-admin-layout">
+  <v-app v-bind="$attrs" class="main-layout">
     <v-navigation-drawer
       v-model="drawer"
       class="sk-admin-drawer"
@@ -88,7 +88,7 @@
 
       <!-- 桌面板選單 -->
       <template v-if="!isMobile">
-        <SkAdminDrawerDesktopMenu
+        <DrawerDesktopMenu
           v-model:opened="opened"
           :is-shrink="isRail"
           :menu-items="menuItems"
@@ -99,12 +99,12 @@
 
       <!-- 行動版選單 -->
       <template v-if="isMobile">
-        <SkAdminDrawerMobileFavoritesPanel
+        <DrawerMobileFavoritesPanel
           v-if="features.showFavorites && mobileFavoritesPanel"
           :favorite-items="favoriteItems"
           @select="onSelectFavorite"
         />
-        <SkAdminDrawerMobileMenuPanel
+        <DrawerMobileMenuPanel
           v-else
           :mobile-current-items="mobileCurrentItems"
           @item-click="onMobileMenuClick"
@@ -114,7 +114,7 @@
 
     <v-app-bar ref="appBarRef" class="" height="auto">
       <v-row class="flex-column" no-gutters>
-        <SkAdminAppBarTopCol
+        <AppBarTopCol
           :features="features"
           :is-mobile="isMobile"
           :logout-label="logoutLabel"
@@ -134,9 +134,9 @@
           <template v-if="$slots.actions" #actions>
             <slot name="actions"></slot>
           </template>
-        </SkAdminAppBarTopCol>
+        </AppBarTopCol>
 
-        <SkAdminAppBarFavoritesCol
+        <AppBarFavoritesCol
           :favorite-items="favoriteItems"
           :favorites-config="favoritesConfig"
           :features="features"
@@ -148,7 +148,7 @@
           @toggle-favorites-bar="toggleFavoritesBar"
         />
 
-        <SkAdminAppBarBreadcrumbCol
+        <AppBarBreadcrumbCol
           :breadcrumb-items="breadcrumbItems"
           :features="features"
           :is-mobile="isMobile"
@@ -159,7 +159,7 @@
           <template v-if="$slots['breadcrumb-actions']" #breadcrumb-actions>
             <slot name="breadcrumb-actions"></slot>
           </template>
-        </SkAdminAppBarBreadcrumbCol>
+        </AppBarBreadcrumbCol>
       </v-row>
     </v-app-bar>
 
@@ -219,18 +219,18 @@ import type {
   AdminLayoutToolbarActions,
   AdminLayoutToolbarCounts,
   AdminLayoutUserProfile,
-} from './sk-admin-layout/types'
+} from './main-layout/types'
 import { mdiClose, mdiHelpCircleOutline, mdiHome, mdiMenu, mdiMenuOpen } from '@mdi/js'
 import { computed, ref, toRef } from 'vue'
 import { useDisplay } from 'vuetify'
 import { useAdminLayoutState } from '@/composables/layout/useAdminLayoutState'
 import { useThemeToggle } from '@/composables/layout/useThemeToggle'
-import SkAdminAppBarBreadcrumbCol from './sk-admin-layout/SkAdminAppBarBreadcrumbCol.vue'
-import SkAdminAppBarFavoritesCol from './sk-admin-layout/SkAdminAppBarFavoritesCol.vue'
-import SkAdminAppBarTopCol from './sk-admin-layout/SkAdminAppBarTopCol.vue'
-import SkAdminDrawerDesktopMenu from './sk-admin-layout/SkAdminDrawerDesktopMenu.vue'
-import SkAdminDrawerMobileFavoritesPanel from './sk-admin-layout/SkAdminDrawerMobileFavoritesPanel.vue'
-import SkAdminDrawerMobileMenuPanel from './sk-admin-layout/SkAdminDrawerMobileMenuPanel.vue'
+import AppBarBreadcrumbCol from './main-layout/AppBarBreadcrumbCol.vue'
+import AppBarFavoritesCol from './main-layout/AppBarFavoritesCol.vue'
+import AppBarTopCol from './main-layout/AppBarTopCol.vue'
+import DrawerDesktopMenu from './main-layout/DrawerDesktopMenu.vue'
+import DrawerMobileFavoritesPanel from './main-layout/DrawerMobileFavoritesPanel.vue'
+import DrawerMobileMenuPanel from './main-layout/DrawerMobileMenuPanel.vue'
 
 const emit = defineEmits<{
   logout: []
@@ -457,7 +457,7 @@ function getMobileMenuBtnColor(level: number) {
 </script>
 
 <style scoped>
-.sk-admin-layout {
+.main-layout {
   background: rgb(var(--v-theme-background));
 }
 
diff --git a/src/components/layouts/sk-admin-layout/SkAdminAppBarBreadcrumbCol.vue b/src/components/layouts/main-layout/AppBarBreadcrumbCol.vue
similarity index 100%
rename from src/components/layouts/sk-admin-layout/SkAdminAppBarBreadcrumbCol.vue
rename to src/components/layouts/main-layout/AppBarBreadcrumbCol.vue
diff --git a/src/components/layouts/sk-admin-layout/SkAdminAppBarFavoritesCol.vue b/src/components/layouts/main-layout/AppBarFavoritesCol.vue
similarity index 100%
rename from src/components/layouts/sk-admin-layout/SkAdminAppBarFavoritesCol.vue
rename to src/components/layouts/main-layout/AppBarFavoritesCol.vue
diff --git a/src/components/layouts/sk-admin-layout/SkAdminAppBarTopCol.vue b/src/components/layouts/main-layout/AppBarTopCol.vue
similarity index 100%
rename from src/components/layouts/sk-admin-layout/SkAdminAppBarTopCol.vue
rename to src/components/layouts/main-layout/AppBarTopCol.vue
diff --git a/src/components/layouts/sk-admin-layout/SkAdminDrawerDesktopMenu.vue b/src/components/layouts/main-layout/DrawerDesktopMenu.vue
similarity index 100%
rename from src/components/layouts/sk-admin-layout/SkAdminDrawerDesktopMenu.vue
rename to src/components/layouts/main-layout/DrawerDesktopMenu.vue
diff --git a/src/components/layouts/sk-admin-layout/SkAdminDrawerMobileFavoritesPanel.vue b/src/components/layouts/main-layout/DrawerMobileFavoritesPanel.vue
similarity index 100%
rename from src/components/layouts/sk-admin-layout/SkAdminDrawerMobileFavoritesPanel.vue
rename to src/components/layouts/main-layout/DrawerMobileFavoritesPanel.vue
diff --git a/src/components/layouts/sk-admin-layout/SkAdminDrawerMobileMenuPanel.vue b/src/components/layouts/main-layout/DrawerMobileMenuPanel.vue
similarity index 100%
rename from src/components/layouts/sk-admin-layout/SkAdminDrawerMobileMenuPanel.vue
rename to src/components/layouts/main-layout/DrawerMobileMenuPanel.vue
diff --git a/src/components/layouts/sk-admin-layout/types.ts b/src/components/layouts/main-layout/types.ts
similarity index 100%
rename from src/components/layouts/sk-admin-layout/types.ts
rename to src/components/layouts/main-layout/types.ts
diff --git a/src/composables/layout/useAdminLayoutState.ts b/src/composables/layout/useAdminLayoutState.ts
index 1567575..4c0bc48 100644
--- a/src/composables/layout/useAdminLayoutState.ts
+++ b/src/composables/layout/useAdminLayoutState.ts
@@ -1,4 +1,4 @@
-import type { AdminLayoutMenuItem } from '@/components/layouts/sk-admin-layout/types'
+import type { AdminLayoutMenuItem } from '@/components/layouts/main-layout/types'
 import { computed, onBeforeUnmount, onMounted, ref, type Ref, watch } from 'vue'
 
 type ToggleSidebarPayload = {