From 337d9ad75518dbc81f4273528ede3d436ba0cf0f Mon Sep 17 00:00:00 2001
From: IanShaw027 <131567472+IanShaw027@users.noreply.github.com>
Date: Mon, 29 Dec 2025 15:36:04 +0800
Subject: [PATCH] =?UTF-8?q?fix(frontend):=20=E7=AE=80=E6=98=93=E6=A8=A1?=
 =?UTF-8?q?=E5=BC=8F=E4=B8=8B=E7=A6=81=E7=94=A8=E6=96=B0=E6=89=8B=E5=BC=95?=
 =?UTF-8?q?=E5=AF=BC=E5=B9=B6=E4=BC=98=E5=8C=96=E6=98=BE=E7=A4=BA=E9=80=BB?=
 =?UTF-8?q?=E8=BE=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

修复 Gemini 审查发现的潜在问题，并增强新手引导功能：

1. 简易模式下完全禁用新手引导
   - useOnboardingTour: 添加 isSimpleMode 判断，简易模式下不自动启动
   - 只在标准模式的管理员第一次加载时自动弹出

2. 动态过滤简易模式相关步骤
   - steps.ts: getAdminSteps 添加 isSimpleMode 参数
   - 简易模式下自动过滤分组管理和账号分组选择步骤
   - 避免引导找不到被隐藏的元素

3. 优化引导按钮显示条件
   - AppHeader: 添加 showOnboardingButton computed
   - 只在标准模式的管理员下显示"重新开始引导"按钮
   - 非管理员或简易模式下不显示按钮

4. 确保引导只在首次自动弹出
   - 关闭后不再自动出现
   - 只能从右上角手动重新打开
---
 frontend/src/components/Guide/steps.ts        | 24 +++++++++++++++++--
 frontend/src/components/layout/AppHeader.vue  | 10 +++++++-
 frontend/src/composables/useOnboardingTour.ts | 16 ++++++++++++-
 3 files changed, 46 insertions(+), 4 deletions(-)

diff --git a/frontend/src/components/Guide/steps.ts b/frontend/src/components/Guide/steps.ts
index 62ffeac9..c79db78f 100644
--- a/frontend/src/components/Guide/steps.ts
+++ b/frontend/src/components/Guide/steps.ts
@@ -3,8 +3,11 @@ import { DriveStep } from 'driver.js'
 /**
  * 管理员完整引导流程
  * 交互式引导：指引用户实际操作
+ * @param t 国际化函数
+ * @param isSimpleMode 是否为简易模式（简易模式下会过滤分组相关步骤）
  */
-export const getAdminSteps = (t: (key: string) => string): DriveStep[] => [
+export const getAdminSteps = (t: (key: string) => string, isSimpleMode = false): DriveStep[] => {
+  const allSteps: DriveStep[] = [
   // ========== 欢迎介绍 ==========
   {
     popover: {
@@ -221,7 +224,24 @@ export const getAdminSteps = (t: (key: string) => string): DriveStep[] => [
       showButtons: ['close']
     }
   }
-]
+  ]
+
+  // 简易模式下过滤分组相关步骤
+  if (isSimpleMode) {
+    return allSteps.filter(step => {
+      const element = step.element as string | undefined
+      // 过滤掉分组管理和账号分组选择相关步骤
+      return !element || (
+        !element.includes('sidebar-group-manage') &&
+        !element.includes('groups-create-btn') &&
+        !element.includes('group-form-') &&
+        !element.includes('account-form-groups')
+      )
+    })
+  }
+
+  return allSteps
+}
 
 /**
  * 普通用户引导流程
diff --git a/frontend/src/components/layout/AppHeader.vue b/frontend/src/components/layout/AppHeader.vue
index 24020203..e3985619 100644
--- a/frontend/src/components/layout/AppHeader.vue
+++ b/frontend/src/components/layout/AppHeader.vue
@@ -199,7 +199,7 @@
                 </div>
               </div>
 
-              <div class="border-t border-gray-100 py-1 dark:border-dark-700">
+              <div v-if="showOnboardingButton" class="border-t border-gray-100 py-1 dark:border-dark-700">
                 <button @click="handleReplayGuide" class="dropdown-item w-full">
                   <svg class="h-4 w-4" fill="currentColor" viewBox="0 0 24 24">
                     <path
@@ -208,6 +208,9 @@
                   </svg>
                   {{ $t('onboarding.restartTour') }}
                 </button>
+              </div>
+
+              <div class="border-t border-gray-100 py-1 dark:border-dark-700">
                 <button
                   @click="handleLogout"
                   class="dropdown-item w-full text-red-600 hover:bg-red-50 dark:text-red-400 dark:hover:bg-red-900/20"
@@ -256,6 +259,11 @@ const dropdownOpen = ref(false)
 const dropdownRef = ref<HTMLElement | null>(null)
 const contactInfo = computed(() => appStore.contactInfo)
 
+// 只在标准模式的管理员下显示新手引导按钮
+const showOnboardingButton = computed(() => {
+  return !authStore.isSimpleMode && user.value?.role === 'admin'
+})
+
 const userInitials = computed(() => {
   if (!user.value) return ''
   // Prefer username, fallback to email
diff --git a/frontend/src/composables/useOnboardingTour.ts b/frontend/src/composables/useOnboardingTour.ts
index 3f689d17..c5ad470c 100644
--- a/frontend/src/composables/useOnboardingTour.ts
+++ b/frontend/src/composables/useOnboardingTour.ts
@@ -76,7 +76,8 @@ export function useOnboardingTour(options: OnboardingOptions) {
   const startTour = async (startIndex = 0) => {
     // 动态获取当前用户角色和步骤
     const isAdmin = userStore.user?.role === 'admin'
-    const steps = isAdmin ? getAdminSteps(t) : getUserSteps(t)
+    const isSimpleMode = userStore.isSimpleMode
+    const steps = isAdmin ? getAdminSteps(t, isSimpleMode) : getUserSteps(t)
 
     // 确保 DOM 就绪
     await nextTick()
@@ -608,6 +609,19 @@ export function useOnboardingTour(options: OnboardingOptions) {
       return
     }
 
+    // 简易模式下禁用新手引导
+    if (userStore.isSimpleMode) {
+      console.log('Simple mode detected, skipping onboarding tour')
+      return
+    }
+
+    // 只在管理员+标准模式下自动启动
+    const isAdmin = userStore.user?.role === 'admin'
+    if (!isAdmin) {
+      console.log('Non-admin user, skipping auto-start')
+      return
+    }
+
     if (!options.autoStart || hasSeen()) return
     autoStartTimer = setTimeout(() => {
       void startTour()