From 8dbae6c61441144cc4c5b7e48326138c7617f3de Mon Sep 17 00:00:00 2001
From: skytek_xinliang <carl@skytek.com.tw>
Date: Tue, 31 Mar 2026 11:13:13 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=A2=9E=E5=8A=A0=E7=84=A1=E9=9A=9C?=
 =?UTF-8?q?=E7=A4=99=E6=A8=99=E7=B1=A4=E5=8F=8AARIA=E5=B1=AC=E6=80=A7?=
 =?UTF-8?q?=E4=BB=A5=E6=94=B9=E5=96=84=E5=8F=AF=E8=A8=AA=E5=95=8F=E6=80=A7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue                                   |  3 ++-
 .../main-layout/AppBarBreadcrumbCol.vue       |  4 +--
 .../main-layout/AppBarFavoritesCol.vue        |  8 +++++-
 .../layouts/main-layout/AppBarTopCol.vue      | 27 +++++++++++++++----
 .../layouts/main-layout/DrawerDesktopMenu.vue | 10 ++++---
 5 files changed, 40 insertions(+), 12 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index df566a5..64a0ea3 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -42,6 +42,7 @@
           <v-tab v-for="tab in tabs" :key="tab.path" border="sm" :to="tab.path" :value="tab.path">
             {{ tab.title }}
             <v-btn
+              aria-label="關閉頁籤"
               class="pl-2"
               color="grey"
               density="compact"
@@ -56,7 +57,7 @@
           </v-tab>
         </v-tabs>
 
-        <div class="flex-grow-1 overflow-auto" style="min-height: 0">
+        <div class="flex-grow-1 overflow-auto" style="min-height: 0" tabindex="0">
           <router-view v-slot="{ Component }">
             <keep-alive>
               <component :is="Component" :key="route.fullPath" />
diff --git a/src/components/layouts/main-layout/AppBarBreadcrumbCol.vue b/src/components/layouts/main-layout/AppBarBreadcrumbCol.vue
index aac983c..c6982fc 100644
--- a/src/components/layouts/main-layout/AppBarBreadcrumbCol.vue
+++ b/src/components/layouts/main-layout/AppBarBreadcrumbCol.vue
@@ -17,7 +17,7 @@
         </v-btn>
       </template>
       <template #item="{ item }">
-        <div class="d-flex align-center ga-1">
+        <li class="d-flex align-center ga-1">
           <v-icon
             v-if="getBreadcrumbIcon(item)"
             class="mr-1"
@@ -25,7 +25,7 @@
             :icon="getBreadcrumbIcon(item)"
           />
           <span class="text-caption text-no-wrap">{{ getBreadcrumbTitle(item) }}</span>
-        </div>
+        </li>
       </template>
       <template #divider>
         <v-icon color="primary-variant" size="12" :icon="mdiChevronRight" />
diff --git a/src/components/layouts/main-layout/AppBarFavoritesCol.vue b/src/components/layouts/main-layout/AppBarFavoritesCol.vue
index 0acae1d..c85665f 100644
--- a/src/components/layouts/main-layout/AppBarFavoritesCol.vue
+++ b/src/components/layouts/main-layout/AppBarFavoritesCol.vue
@@ -35,7 +35,13 @@
         <span class="text-caption">{{ favoritesConfig.addLabel }}</span>
       </v-btn>
     </div>
-    <v-btn color="grey" size="small" variant="text" @click="emit('toggle-favorites-bar', false)">
+    <v-btn
+      aria-label="隱藏常用功能列"
+      color="grey"
+      size="small"
+      variant="text"
+      @click="emit('toggle-favorites-bar', false)"
+    >
       <v-icon :icon="mdiEyeOff" />
     </v-btn>
   </v-col>
diff --git a/src/components/layouts/main-layout/AppBarTopCol.vue b/src/components/layouts/main-layout/AppBarTopCol.vue
index 79b07f0..651176d 100644
--- a/src/components/layouts/main-layout/AppBarTopCol.vue
+++ b/src/components/layouts/main-layout/AppBarTopCol.vue
@@ -42,7 +42,11 @@
     <div v-if="features.showToolbarActions" class="top-actions">
       <slot name="actions">
         <!-- 通知 -->
-        <v-tooltip location="bottom" :text="toolbarActions.notificationsLabel">
+        <v-tooltip
+          location="bottom"
+          :text="toolbarActions.notificationsLabel"
+          :aria-label="toolbarActions.notificationsLabel"
+        >
           <template #activator="{ props: activatorProps }">
             <v-btn
               v-bind="activatorProps"
@@ -67,7 +71,11 @@
         </v-tooltip>
 
         <!-- 訊息 -->
-        <v-tooltip location="bottom" :text="toolbarActions.messagesLabel">
+        <v-tooltip
+          location="bottom"
+          :text="toolbarActions.messagesLabel"
+          :aria-label="toolbarActions.messagesLabel"
+        >
           <template #activator="{ props: activatorProps }">
             <v-btn
               v-bind="activatorProps"
@@ -110,7 +118,11 @@
         <!-- 設定 -->
         <v-menu :close-on-content-click="false" location="bottom end">
           <template #activator="{ props: menuProps }">
-            <v-tooltip location="bottom" :text="toolbarActions.settingsLabel">
+            <v-tooltip
+              location="bottom"
+              :text="toolbarActions.settingsLabel"
+              :aria-label="toolbarActions.settingsLabel"
+            >
               <template #activator="{ props: tooltipProps }">
                 <v-btn
                   v-bind="{ ...menuProps, ...tooltipProps }"
@@ -154,7 +166,7 @@
         </v-menu>
 
         <!-- 登出 -->
-        <v-tooltip location="bottom" :text="logoutLabel">
+        <v-tooltip location="bottom" :text="logoutLabel" :aria-label="logoutLabel">
           <template #activator="{ props: activatorProps }">
             <v-btn
               v-bind="activatorProps"
@@ -169,7 +181,12 @@
           </template>
         </v-tooltip>
 
-        <v-tooltip v-if="features.showThemeToggle" location="bottom" :text="themeToggleLabel">
+        <v-tooltip
+          v-if="features.showThemeToggle"
+          location="bottom"
+          :text="themeToggleLabel"
+          :aria-label="themeToggleLabel"
+        >
           <template #activator="{ props: activatorProps }">
             <v-btn
               v-bind="activatorProps"
diff --git a/src/components/layouts/main-layout/DrawerDesktopMenu.vue b/src/components/layouts/main-layout/DrawerDesktopMenu.vue
index ca20e66..d1a4ca5 100644
--- a/src/components/layouts/main-layout/DrawerDesktopMenu.vue
+++ b/src/components/layouts/main-layout/DrawerDesktopMenu.vue
@@ -9,6 +9,8 @@
         <template #activator="{ props: activatorProps }">
           <v-list-item
             v-bind="isShrink ? undefined : activatorProps"
+            role="listitem"
+            :aria-selected="undefined"
             :class="{ 'px-0': isShrink }"
             :link="isNavigable(item) && !!item.path"
             :to="isNavigable(item) ? item.path : undefined"
@@ -52,6 +54,8 @@
             <template #activator="{ props: subProps }">
               <v-list-item
                 v-bind="subProps"
+                role="listitem"
+                :aria-selected="undefined"
                 :link="isNavigable(subItem)"
                 :prepend-icon="subItem.icon || mdiMenuRight"
                 :to="isNavigable(subItem) ? subItem.path : undefined"
@@ -83,7 +87,7 @@
               @click="emitSelect(subSubItem)"
             >
               <template #title>
-                <v-tooltip location="end" :text="subSubItem.title">
+                <v-tooltip location="end" :text="subSubItem.title" :aria-label="subSubItem.title">
                   <template #activator="{ props: tooltipProps }">
                     <span v-bind="tooltipProps" class="text-body-2 nav-text-overflow">{{
                       subSubItem.title
@@ -102,7 +106,7 @@
             @click="emitSelect(subItem)"
           >
             <template #title>
-              <v-tooltip location="end" :text="subItem.title">
+              <v-tooltip location="end" :text="subItem.title" :aria-label="subItem.title">
                 <template #activator="{ props: tooltipProps }">
                   <span v-bind="tooltipProps" class="text-body-2 nav-text-overflow">{{
                     subItem.title
@@ -134,7 +138,7 @@
           >
         </template>
         <template #title>
-          <v-tooltip v-if="!isShrink" location="end" :text="item.title">
+          <v-tooltip v-if="!isShrink" location="end" :text="item.title" :aria-label="item.title">
             <template #activator="{ props: tooltipProps }">
               <span v-bind="tooltipProps" class="text-body-2 nav-text-overflow">{{
                 item.title