<template>
    <video-player
        class="video-player-box"
        ref="videoPlayer"
        :options="playerOptions"
        :playsinline="true"
        @ended="onPlayerEnded($event)"
        @waiting="onPlayerWaiting($event)"
        @loadeddata="onPlayerLoadeddata($event)"
        @ready="playerReadied">
  </video-player>
</template>

<script>
export default {
    name: 'playerVideo',
    props: ['url'],
    data () {
        return {
            playerOptions: {
                muted: true,
                language: 'zh',
                playbackRates: [0.7, 1.0, 1.5, 2.0],
                fluid: true,
                sources: [{
                    type: "video/mp4",
                    src: this.url,//'http://183.230.133.69:8081/tms/video/38?token=12345',
                }],
                notSupportedMessage: '此视频暂无法播放，请稍后再试',
                poster: require('@/assets/video.png'),
            }
        }
    },
    methods: {
        playerReadied(e) {
            console.log('playerReadied: ', e);
        },
        onPlayerEnded(e) {
            console.log('onPlayerEnded: ', e);
        },
        onPlayerWaiting(e) {
            console.log('onPlayerWaiting: ', e);
        },
        onPlayerLoadeddata(e) {
            console.log('onPlayerLoadeddata: ', e);
        }
    },
}
</script>