forked from zhongyidian/super_video
44 lines
928 B
Vue
44 lines
928 B
Vue
<script lang="ts" setup>
|
|
import { ref } from 'vue'
|
|
import { useRouter } from 'vue-router'
|
|
import ImgButton from '@/components/Button/ImgButton.vue'
|
|
import { IMAGE_PATHS } from '@/utils'
|
|
import six from '/video/xinshou_jiuzhonggoutufa.mp4'
|
|
|
|
const router = useRouter()
|
|
|
|
const videoRef = ref()
|
|
|
|
const handleClose = () => {
|
|
router.back()
|
|
}
|
|
|
|
const handlePlay = () => {
|
|
if (!videoRef.value) return
|
|
videoRef.value.muted = false
|
|
videoRef.value.volume = 1
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="w-full h-full relative bg-white/10" @click="handlePlay">
|
|
<!-- 返回 -->
|
|
<ImgButton
|
|
class="absolute right-0 top-0 z-10"
|
|
:image="IMAGE_PATHS.COMPONENTS.BACK"
|
|
@click="handleClose"
|
|
/>
|
|
|
|
<video ref="videoRef" :src="six" controls></video>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
video {
|
|
width: 100%;
|
|
height: 100%;
|
|
/* 核心:保持视频比例,多余部分被裁剪 */
|
|
object-fit: cover;
|
|
}
|
|
</style>
|