Files
super_video/src/views/film/after-editing/sound-effect/index.vue
T
zhongyidianandClaude Opus 4.7 6f8252472f feat: 完善模块引导与学习进度体验
统一引导提示的持久化控制,补充学习进度入口与模块资源,避免用户返回页面时重复触发提示。

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-08 09:44:59 +08:00

64 lines
1.8 KiB
Vue

<script lang="ts" setup>
import { IMAGE_PATHS, getPublicPath, getStaticImage } from '@/utils'
import { ImgButton } from '@/components/Button'
import { Video } from '@/components'
import { useRouter } from 'vue-router'
const router = useRouter()
const back = () => {
// 返回上一页
router.back()
}
</script>
<template>
<div class="relative w-full h-full overflow-hidden">
<!-- 返回按钮 -->
<ImgButton
class="absolute right-0 top-0 z-20"
:image="IMAGE_PATHS.COMPONENTS.BACK"
@click="back"
/>
<!-- 背景 -->
<img class="absolute inset-0" :src="getStaticImage('img/背景.png')" alt="" />
<!-- 标题 -->
<img class="absolute top-5 z-10" :src="getStaticImage('img/音效-标题.png')" alt="" />
<!-- 内容 [&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] -->
<div class="relative h-full pt-28 overflow-y-scroll">
<img :src="getStaticImage('film/img/音效.png')" alt="" />
<div class="absolute top-[3850px] left-64 w-[1450px] h-[1000px] rounded-2xl overflow-hidden">
<Video
:src="getPublicPath('video/editing/yingxiao_batch.mp4')"
playsinline
controls
:volume="1"
:muted="false"
/>
</div>
<div class="absolute top-[480px] left-[12%] w-[840px]">
<Video
:src="getPublicPath('video/editing/yingxiao_wu.mp4')"
playsinline
controls
:volume="1"
:muted="false"
/>
</div>
<div class="absolute top-[1900px] left-[18.5%] w-[1250px]">
<Video
:src="getPublicPath('video/editing/yingxiao_you.mp4')"
playsinline
controls
:volume="1"
:muted="false"
/>
</div>
</div>
</div>
</template>