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

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

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

src/views/basic-elements/camera-movement/index.vue

@@ -4,14 +4,19 @@ import { useRouter } from 'vue-router'
 import ImgButton from '@/components/Button/ImgButton.vue'
 import { StepNavigation } from '@/components/Guide'
 import { Video } from '@/components'
-import { getBackgroundImage, getPublicPath, getStaticImage, IMAGE_PATHS } from '@/utils'
+import { getPublicPath, getStaticImage, IMAGE_PATHS } from '@/utils'
 // 运镜初识 - 暂时用运镜的基本方式代替
-import video1 from '/video/new/xinshou_yunjingdejibenfangshi.mp4'
-import video2 from '/video/new/xinshou_zhengquedeshoujipaishe.mp4'
-import video3 from '/video/new/xinshou_yunjingdejibenfangshi.mp4'
 import { GuideSteps, GuideStepsItem } from '@/components/Guide'
+import { useBasicElementsStore } from '@/stores/modules/basic-elements'
 
 const router = useRouter()
+const basicElementsStore = useBasicElementsStore()
+const introGuideKey = 'basic-camera-movement-intro'
+const showIntroGuide = ref(!basicElementsStore.guideShown[introGuideKey])
+
+if (showIntroGuide.value) {
+  basicElementsStore.markGuideShown(introGuideKey)
+}
 const props = defineProps<{
   label: string
 }>()
@@ -43,18 +48,21 @@ const navigationSteps = ref([
   //   id: 'step1',
   //   label: '视觉素养',
   //   content: '运镜初识',
+  //   videoUrl: getPublicPath('video/new/movement/xxx.mp4'),
   //   type: 'planning' as const
   // },
   {
     id: 'step2',
     label: '视觉素养',
     content: '正确的手机拍摄持机姿势',
+    videoUrl: getPublicPath('video/new/movement/xinshou_zhengquedeshoujipaishe.mp4'),
     type: 'planning' as const
   },
   {
     id: 'step3',
     label: '视觉素养',
     content: '运镜的基本方式',
+    videoUrl: getPublicPath('video/new/movement/xinshou_yunjingdejibenfangshi.mp4'),
     type: 'planning' as const
   }
 ])
@@ -64,13 +72,12 @@ const showStepNavigation = ref(false)
 const currentNavigationStep = ref(0) // 对应视频索引，从0开始
 
 // 视频列表
-const videoList = [video2, video3]
 const currentVideoIndex = ref(0)
 
 //按顺序播放
-const currentVideo = computed(() => videoList[currentVideoIndex.value])
+const currentVideo = computed(() => navigationSteps.value[currentVideoIndex.value].videoUrl)
 const handleVideoChange = () => {
-  if (currentVideoIndex.value < videoList.length - 1) {
+  if (currentVideoIndex.value < navigationSteps.value.length - 1) {
     currentVideoIndex.value++
     currentNavigationStep.value = currentVideoIndex.value
   } else {
@@ -170,7 +177,11 @@ const handleStepNavigationClose = () => {
       @close="handleStepNavigationClose"
     />
 
-    <GuideSteps :visible="true" position-offset-y="85%" @complete="handleIntroGuideComplete">
+    <GuideSteps
+      :visible="showIntroGuide"
+      position-offset-y="85%"
+      @complete="handleIntroGuideComplete"
+    >
       <GuideStepsItem :audio-src="getPublicPath('audio/py_1_014.MP3')">
         想拍出好的视频效果，画面稳定性是最基本的要求。
       </GuideStepsItem>