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

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

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
zhongyidianandClaude Opus 4.7 committed 2026-05-08 09:44:59 +08:00
1 parent fc9633f371
commit 6f8252472f
114 files changed
+2758 -1798

No files matched your search

+39 -5
View File
@@ -1,12 +1,14 @@
<script setup lang="ts">
import { ref } from 'vue'
import { ref, watch } from 'vue'
import { useRouter } from 'vue-router'
import { getBackgroundImage, getPublicPath, getStaticImage, IMAGE_PATHS } from '@/utils'
import { ImgButton } from '@/components/Button'
import { GuideSteps, GuideStepsItem } from '@/components/Guide'
import { GuideSteps, type GuideStep } from '@/components/Guide'
import { Video } from '@/components'
import { useFilmStore } from '@/stores'
const router = useRouter()
const film = useFilmStore()
const handleClose = () => {
router.back()
@@ -47,6 +49,33 @@ const goAssociation = () => {
const goContinuity = () => {
router.push({ name: 'FilmEditingContinuity' })
}
// 6 个剪辑子视频学习完成后的一次性引导
const editingCompleteSteps: GuideStep[] = [
{
id: 'editing-complete-step1',
content:
'刚才我们提到的剪辑方式,并不是孤立存在的技巧,而是针对不同问题的解决方案。所以,理解剪辑逻辑才是最重要的!',
audioSrc: getPublicPath('audio/py_4_018.MP3')
}
]
const showEditingCompleteGuide = ref(false)
watch(
() => film.allEditingVideosWatched,
watched => {
if (watched && film.isGuideFilmEditingComplete) {
showEditingCompleteGuide.value = true
}
},
{ immediate: true }
)
const handleEditingCompleteGuideDone = () => {
showEditingCompleteGuide.value = false
film.setIsGuideFilmEditingComplete(false)
}
</script>
<template>
@@ -157,9 +186,14 @@ const goContinuity = () => {
@click="handleClose"
/>
<GuideSteps :visible="true" position-offset-y="85%">
<GuideStepsItem>选择任意图片按钮,进入对应拍摄场景!</GuideStepsItem>
</GuideSteps>
<!-- 6 个剪辑视频学完后的一次性引导 -->
<GuideSteps
v-if="showEditingCompleteGuide"
:steps="editingCompleteSteps"
position-offset-y="85%"
@complete="handleEditingCompleteGuideDone"
@skip="handleEditingCompleteGuideDone"
/>
</div>
</template>