提交 cccc4c3b authored 作者: lihuihui's avatar lihuihui

修改bug

上级 b8b217e1
<template> <template>
<div ref="videoWrapper"> <div ref="videoWrapper">
<!-- <video ref="videoPlayer" class="video-js vjs-default-skin vjs-big-play-centered vjs-16-9" id="videoJS"></video> --> <video v-if="isAdd" ref="videoPlayer" class="video-js vjs-default-skin vjs-big-play-centered vjs-16-9" id="videoJS"></video>
</div> </div>
</template> </template>
...@@ -17,6 +17,10 @@ const DEFAULT_OPTIONS = { ...@@ -17,6 +17,10 @@ const DEFAULT_OPTIONS = {
export default { export default {
name: 'AppVideoPlayer', name: 'AppVideoPlayer',
props: { props: {
isAdd: {
type: Boolean,
default: false
},
options: { options: {
type: Object, type: Object,
default() { default() {
...@@ -51,6 +55,9 @@ export default { ...@@ -51,6 +55,9 @@ export default {
} }
}, },
mounted() { mounted() {
if (this.isAdd) {
this.initPlayer()
}
this.player && this.initPlayer() this.player && this.initPlayer()
}, },
beforeUnmount() { beforeUnmount() {
......
...@@ -20,10 +20,19 @@ interface Emits { ...@@ -20,10 +20,19 @@ interface Emits {
const handleCancel = () => { const handleCancel = () => {
emit('update:isShowVideoPlayDialog', false) emit('update:isShowVideoPlayDialog', false)
} }
const videoOptions = computed(() => {
return {
sources: [
{
src: props.videoOptions
}
]
}
})
</script> </script>
<template> <template>
<el-dialog :model-value="isShowVideoPlayDialog" draggable :before-close="handleCancel" width="35%"> <el-dialog :model-value="isShowVideoPlayDialog" draggable :before-close="handleCancel" width="35%">
{{props.videoOptions}} <AppVideoPlayer :options="videoOptions" :isAdd="true"></AppVideoPlayer>
<AppVideoPlayer :options="{ sources: [{ src: props.videoOptions }] }"></AppVideoPlayer>
</el-dialog> </el-dialog>
</template> </template>
...@@ -134,7 +134,6 @@ const handleConsult = (node: any) => { ...@@ -134,7 +134,6 @@ const handleConsult = (node: any) => {
if (node.data.resource_type === '2') { if (node.data.resource_type === '2') {
getVideoDetails({ id: node.data.resource_id }).then(res => { getVideoDetails({ id: node.data.resource_id }).then(res => {
videoUrl.value = res.data.play_auth.play_info_list.filter((item: any) => item.Definition === 'SD')[0].PlayURL videoUrl.value = res.data.play_auth.play_info_list.filter((item: any) => item.Definition === 'SD')[0].PlayURL
console.log(videoUrl.value, 'videoUrl.value')
isShowVideoPlayDialog.value = true isShowVideoPlayDialog.value = true
}) })
} }
......
...@@ -62,7 +62,7 @@ const bytesToSize = (bytes: number) => { ...@@ -62,7 +62,7 @@ const bytesToSize = (bytes: number) => {
</div> </div>
</div> </div>
</template> </template>
<style lang="scss"> <style lang="scss" scoped>
.statistics-list { .statistics-list {
display: flex; display: flex;
margin-top: -20px; margin-top: -20px;
......
...@@ -37,7 +37,7 @@ const bytesToSize = (bytes: number) => { ...@@ -37,7 +37,7 @@ const bytesToSize = (bytes: number) => {
</div> </div>
</div> </div>
</template> </template>
<style lang="scss"> <style lang="scss" scoped>
.statistics-list { .statistics-list {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
......
...@@ -38,7 +38,7 @@ const videoOptions = $computed(() => { ...@@ -38,7 +38,7 @@ const videoOptions = $computed(() => {
</div> </div>
</div> </div>
<div style="max-width:1200px; padding-bottom: 20px; margin:0 auto;"> <div style="max-width:1200px; padding-bottom: 20px; margin:0 auto;">
<AppVideoPlayer :options="videoOptions"></AppVideoPlayer> <AppVideoPlayer :isAdd="true" :options="videoOptions"></AppVideoPlayer>
</div> </div>
</div> </div>
</template> </template>
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论