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

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

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

src/views/vlog/midterm-shooting/shooting/index.vue

@@ -4,10 +4,12 @@ import { useRouter } from 'vue-router'
 import { GuideSteps, GuideStepsItem } from '@/components/Guide'
 import { Overlay } from '@/components/Overlay'
 import { ImgButton } from '@/components/Button'
+import { Video } from '@/components/Video'
 import { getBackgroundImage, getPublicPath, IMAGE_PATHS } from '@/utils'
 import shootingtitle from '@/assets/images/shooting/标题-实地取景.png'
 import videoSrc from '/video/xinshou_jiuzhonggoutufa.mp4'
 import KnowledgeCard from '@/components/KnowledgeCard/KnowledgeCard.vue'
+import { useVlogStore } from '@/stores/modules/vlog'
 
 type Btn = {
   key: string
@@ -18,6 +20,13 @@ type Btn = {
 }
 
 const router = useRouter()
+const vlogStore = useVlogStore()
+const guideKey = 'vlog-shooting-intro'
+const showIntroGuide = ref(!vlogStore.guideShown[guideKey])
+
+if (showIntroGuide.value) {
+  vlogStore.markGuideShown(guideKey)
+}
 
 const showModal = ref(false)
 
@@ -87,7 +96,7 @@ const back = () => {
     <!-- 背景图片 -->
     <div
       class="absolute inset-0 bg-cover bg-center bg-no-repeat shooting-bg"
-      :style="{ backgroundImage: getBackgroundImage(IMAGE_PATHS.SHOOTING.BG) }"
+      :style="{ backgroundImage: getBackgroundImage('vlog/shooting/实地取景底图') }"
     >
       <div class="shooting-title">
         <img :src="shootingtitle" alt="" />
@@ -95,23 +104,20 @@ const back = () => {
       <div class="shooting-return">
         <ImgButton image="shooting/返回.png" @click="back" />
       </div>
-      <div class="shooting-left">
-        <ImgButton image="shooting/按钮-取景地A.png" @click="handleClickA" />
+      <div class="absolute left-[12%] top-1/2 -translate-y-[calc(50%-70px)]">
+        <ImgButton image="vlog/shooting/热带植物馆-入口.png" @click="handleClickA" />
       </div>
-      <div class="shooting-right">
-        <ImgButton image="shooting/按钮-取景地B.png" @click="handleClickB" />
+      <div class="absolute right-[12%] top-1/2 -translate-y-[calc(50%-70px)]">
+        <ImgButton image="vlog/shooting/沉水栈道-入口.png" @click="handleClickB" />
       </div>
-      <div class="shooting-composition">
-        <ImgButton
-          class="shooting-composition-btn"
-          image="shooting/构图指南.png"
-          @click="showModal = true"
-        />
+      <div class="shooting-composition btn-1">
+        <ImgButton image="shooting/构图指南.png" @click="showModal = true" />
       </div>
     </div>
 
     <!-- 引导步骤 -->
     <GuideSteps
+      v-if="showIntroGuide"
       :highlight-selector="'.shooting-composition-btn'"
       :highlight-padding="12"
       :highlight-radius="20"
@@ -170,7 +176,7 @@ const back = () => {
       />
       <!-- 视频 -->
       <Overlay :visible="showModal3" :clickable="false">
-        <video :src="videoSrc" controls></video>
+        <Video :src="videoSrc" controls :volume="1" :muted="false"></Video>
         <!-- 返回 -->
         <ImgButton
           class="absolute right-0 top-0 z-10"