<script setup>
|
const props = defineProps({
|
width: {
|
type: String,
|
default: '800'
|
},
|
modelValue: {
|
type: Boolean,
|
default: false
|
},
|
playUrl: {
|
type: String,
|
default: ''
|
},
|
title:{
|
type: String,
|
default: '视频播放'
|
}
|
})
|
|
const emit = defineEmits(['update:modelValue'])
|
const handleClose = () => {
|
emit('update:modelValue', false)
|
}
|
</script>
|
|
<template>
|
<el-dialog
|
class="gd-dialog"
|
:title="props.title"
|
append-to-body
|
v-model="props.modelValue"
|
width="60%"
|
destroy-on-close
|
:close-on-click-modal="false"
|
@close="handleClose"
|
>
|
<video ref="videoRefs" controls preload="auto" :src="props.playUrl">
|
<source :src="props.playUrl" type="video/mp4" />
|
</video>
|
<!-- <el-carousel trigger="click" :autoplay="false" @change="handleCarouselChange">-->
|
<!-- <el-carousel-item v-for="(item, index) in videoList" :key="index">-->
|
<!-- <video ref="videoRefs" controls preload="auto" :src="currentVideoUrl" @play="handleVideoPlay" @ended="handleVideoEnded(index)">-->
|
<!-- <source :src="item.smallUrl" type="video/mp4" />-->
|
<!-- </video>-->
|
<!-- </el-carousel-item>-->
|
<!-- </el-carousel>-->
|
</el-dialog>
|
</template>
|
|
<style scoped lang="scss">
|
video {
|
height: 600px;
|
width: 100%;
|
}
|
</style>
|
