90 lines
2.1 KiB
Vue
90 lines
2.1 KiB
Vue
<template>
|
|
<div class="slw">
|
|
<iframe
|
|
v-if="isShow"
|
|
:id="id"
|
|
allow="autoplay *; microphone *; fullscreen *" allowfullscreen allowtransparency key="" allowusermedia frameBorder="no"
|
|
style="width: 100%; height: 100%;"
|
|
:src="`https://cdn.cunwuyun.cn/jssdk/slw/index.html?url=${src}`"></iframe>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
props: ['src'],
|
|
|
|
name: 'slwVideo',
|
|
|
|
data () {
|
|
return {
|
|
isShow: true,
|
|
id: `video-${new Date().getTime()}`
|
|
}
|
|
},
|
|
|
|
watch: {
|
|
src: {
|
|
handler (val) {
|
|
if (val) {
|
|
this.isShow = false
|
|
|
|
this.$nextTick(() => {
|
|
this.isShow = true
|
|
})
|
|
}
|
|
},
|
|
immediate: true,
|
|
deep: true
|
|
}
|
|
},
|
|
|
|
mounted () {
|
|
window.addEventListener('message', e => {
|
|
if (e.data.type && e.data.name === 'fullscreen') {
|
|
this.requestFullScreen(document.getElementById(this.id))
|
|
}
|
|
|
|
if (!e.data.type && e.data.name === 'fullscreen') {
|
|
this.exitFullscreen()
|
|
}
|
|
}, false)
|
|
},
|
|
|
|
methods: {
|
|
exitFullscreen () {
|
|
if (document.exitFullscreen) {
|
|
document.exitFullscreen()
|
|
} else if (document.msExitFullscreen) {
|
|
document.msExitFullscreen()
|
|
} else if (document.mozCancelFullScreen) {
|
|
document.mozCancelFullScreen()
|
|
} else if (document.webkitExitFullscreen) {
|
|
document.webkitExitFullscreen()
|
|
}
|
|
},
|
|
|
|
requestFullScreen (element) {
|
|
var requestMethod = element.requestFullScreen || element.webkitRequestFullScreen || element.mozRequestFullScreen || element.msRequestFullScreen;
|
|
if (requestMethod) {
|
|
requestMethod.call(element);
|
|
} else if (typeof window.ActiveXObject !== 'undefined') {
|
|
var wscript = new ActiveXObject('WScript.Shell')
|
|
if (wscript !== null) {
|
|
wscript.SendKeys('{F11}')
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.slw {
|
|
width: 100%;
|
|
height: 100%;
|
|
|
|
iframe {
|
|
border: none;
|
|
}
|
|
}
|
|
</style> |