feat: 完善模块引导与学习进度体验

统一引导提示的持久化控制，补充学习进度入口与模块资源，避免用户返回页面时重复触发提示。

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

src/views/home/action.vue

@@ -5,6 +5,7 @@ defineOptions({
 import { getBackgroundImage, getPublicPath, IMAGE_PATHS, getStaticImage } from '@/utils'
 import { ImgButton } from '@/components/Button'
 import { ModuleSwitcher } from './components/ModuleSwitcher'
+import StudyProgressPopup from './components/StudyProgressPopup.vue'
 import { computed, ref, onMounted } from 'vue'
 import { useRouter, type RouteRecordName } from 'vue-router'
 import {
@@ -35,10 +36,9 @@ type GuideNode = {
   children?: GuideChildNode[]
 }
 
-const homeGuideShow = ref(true)
-const unlockedHomeGuideShow = ref(false)
-const elementGuideShow = ref(false)
-const unlockedHomeGuideCompleted = ref(false)
+const actionGuideKey = 'home-action-guide'
+const activeActionGuide = ref<'home' | 'unlocked' | 'element' | null>(null)
+const studyProgressVisible = ref(false)
 
 const homeGuideSteps: GuideStep[] = [
   {
@@ -109,16 +109,16 @@ const elementGuideSteps: GuideStep[] = [
 ]
 
 const handleHomeGuideComplete = () => {
-  homeGuideShow.value = false
+  activeActionGuide.value = null
 }
 
 const handleUnlockedHomeGuideComplete = () => {
-  unlockedHomeGuideShow.value = false
+  activeActionGuide.value = null
 }
 
 const handleElementGuideComplete = () => {
-  elementGuideShow.value = false
-  unlockedHomeGuideCompleted.value = true
+  activeActionGuide.value = null
+  basicElements.markGuideShown(actionGuideKey)
 }
 
 const router = useRouter()
@@ -142,6 +142,7 @@ const imageMap = {
 
 //获取新手导航引导状态
 const isGuideNewUser = computed(() => basicElements.isGuideNewUser)
+const hasFinishedActionGuide = computed(() => basicElements.guideShown[actionGuideKey] === true)
 
 // 预加载所有图片
 const preloadImages = () => {
@@ -155,8 +156,8 @@ const preloadImages = () => {
 // 事件处理函数
 const handleOpenGuide = () => {
   guideShow.value = true
-  if (!homeGuideShow.value && isGuideNewUser.value) {
-    unlockedHomeGuideShow.value = true
+  if (activeActionGuide.value !== 'home' && isGuideNewUser.value && !hasFinishedActionGuide.value) {
+    activeActionGuide.value = 'unlocked'
   }
 }
 
@@ -193,8 +194,11 @@ const selectedImage = computed(() => {
   return getBackgroundImage(imageMap[selectedModule.value])
 })
 
-const hasFinishedAllHomeGuides = computed(() => unlockedHomeGuideCompleted.value)
-const isSkillDisabled = computed(() => !hasFinishedAllHomeGuides.value)
+const isSkillDisabled = computed(() => !hasFinishedActionGuide.value)
+
+const handleOpenStudyProgress = () => {
+  studyProgressVisible.value = true
+}
 
 const handleSkill = () => {
   if (isSkillDisabled.value) return
@@ -268,8 +272,8 @@ const handleNodeClick = (node: GuideNode, event?: MouseEvent) => {
   }
 
   showChildrenNodeId.value = node.id
-  if (!unlockedHomeGuideShow.value && !unlockedHomeGuideCompleted.value) {
-    elementGuideShow.value = true
+  if (activeActionGuide.value !== 'unlocked' && !hasFinishedActionGuide.value) {
+    activeActionGuide.value = 'element'
   }
 }
 
@@ -287,25 +291,28 @@ const handleClickOutside = () => {
 // 生命周期
 onMounted(() => {
   preloadImages()
+  if (isGuideNewUser.value && !hasFinishedActionGuide.value) {
+    activeActionGuide.value = 'home'
+  }
 })
 </script>
 
 <template>
   <div class="w-full h-full relative">
     <GuideSteps
-      v-if="isGuideNewUser && homeGuideShow"
+      v-if="activeActionGuide === 'home'"
       :steps="homeGuideSteps"
       position-offset-y="82%"
       @complete="handleHomeGuideComplete"
     />
     <GuideSteps
-      v-if="unlockedHomeGuideShow"
+      v-if="activeActionGuide === 'unlocked'"
       :steps="unlockedHomeGuideSteps"
       position-offset-y="82%"
       @complete="handleUnlockedHomeGuideComplete"
     />
     <GuideSteps
-      v-if="elementGuideShow"
+      v-if="activeActionGuide === 'element'"
       :steps="elementGuideSteps"
       position-offset-y="82%"
       @complete="handleElementGuideComplete"
@@ -317,6 +324,13 @@ onMounted(() => {
       :style="{ backgroundImage: getBackgroundImage(IMAGE_PATHS.ACTION_BG) }"
     ></div>
 
+    <!-- 学习进度 -->
+    <div class="absolute top-0 left-0">
+      <ImgButton image="home/action/学习进度入口" @click="handleOpenStudyProgress" />
+    </div>
+
+    <StudyProgressPopup v-model="studyProgressVisible" />
+
     <div
       class="absolute top-4 left-4 flex items-center text-white text-xl bg-black/10 px-4 py-2 rounded-xl"
     >
@@ -355,8 +369,11 @@ onMounted(() => {
 
     <!-- 新手指导遮罩 -->
     <div
-      v-if="isGuideNewUser"
-      :class="['absolute inset-0 z-10', homeGuideShow ? 'bg-black/0' : 'bg-black/50']"
+      v-if="isGuideNewUser && !hasFinishedActionGuide"
+      :class="[
+        'absolute inset-0 z-10',
+        activeActionGuide === 'home' ? 'bg-black/0' : 'bg-black/50'
+      ]"
     ></div>
 
     <!-- 新手指导 -->