<template>
  <CommonTcPlayer style="flex" :options="videoOptions">

  </CommonTcPlayer>
</template>
<script>
// import TcPlayer from 'vue-tcplayer'
import CommonTcPlayer from "@/components/common/common-tcplayer";
export default {
  name: 'common-banner-video',
  data() {
    return {
      isShow: false,
      // videoOptions: {
      //   "mp4": 'https://pica-pro.oss-cn-shanghai.aliyuncs.com/2019/03/05/movie.mp4',
      //   // "mp4": this.cVideoUrl,
      //   // "mp4": "http://1258717429.vod2.myqcloud.com/24a74910vodcq1258717429/7c37c18f5285890786204547811/9BFIyaoXYAcA.mp4",
      //   // "m3u8": "http://2157.liveplay.myqcloud.com/2157_358535a.m3u8",
      //   // "flv": "http://2157.liveplay.myqcloud.com/live/2157_358535a.flv", //增加了一个flv的播放地址，用于PC平台的播放 请替换成实际可用的播放地址
      //   "autoplay" : true,      //iOS下safari浏览器，以及大部分移动端浏览器是不开放视频自动播放这个能力的
      //   "coverpic" : "http://www.test.com/myimage.jpg",
      //   "width" : '375',//视频的显示宽度，请尽量使用视频分辨率宽度
      //   "height" : '210'//视频的显示高度，请尽量使用视频分辨率高度
      // }
    }
  },
  props: {
    videoUrl: {
      type: String,
      default: ''
    },
    videoOptions: {
      type: Object,
      default: () => {}
    }
  },
  computed: {
    cVideoUrl() {
      return this.videoUrl
    },
  },
  watch: {
    videoOptions: {
        handler: function(val,oldval){
          this.isShow = true
        },
        deep:true//对象内部的属性监听，也叫深度监听
      },
  },
  components: {
    CommonTcPlayer
  },
  props: {
    title: {
      type: String,
      default: ""
    },
    bgColor: {
      type: String,
      default: "#999"
    },
    fontWeight: {
      type: Number,
      default: 600
    },
    textFontSize: {
      type: Number,
      default: 16
    },
    paddingTop: {
      type: Number,
      default: 15
    },
    paddingBottom: {
      type: Number,
      default: 15
    }
  },
  created() {},
  mounted() {
  },
  computed: {
  },
  methods: {}
};
</script>
<style lang="less" scoped>
.comp-title {
  display: flex;
  padding-left: 15px;
}
</style>
