<template>
  <div class="main_right_height">
    <TopDes :flag="true" topDesFont="播放视频"></TopDes>
    <el-row>
      <el-col :span="1">&nbsp;</el-col>
      <el-col :span="22" style="text-align: center">
        <video
          :width="id === '4' ? 'auto' : '100%'"
          x-webkit-airplay="true"
          webkit-playsinline="true"
          :controls="controls"
          style="border-radius: 16px;"
        >
          <source :src="vodeoUrl" type="video/mp4" />
        </video>
      </el-col>
      <el-col :span="1">&nbsp;</el-col>
    </el-row>
  </div>
</template>
<script>
export default {
  data() {
    return {
      id: this.$route.query.id,
      player: null,
      vodeoUrl: __static + this.$route.query.url,
      controls: {
        type: Boolean,
        required: false,
        default: true,
      },
    };
  },
  mounted() {
    // document.getElementById("fullScreen")
    // if (document.documentElement.webkitRequestFullScreen) {
    //   console.log("谷歌");
    //   document.documentElement.webkitRequestFullScreen();
    // }
  },
  berforeDestroy() {},
  methods: {
    goBack() {
      this.$router.go(-1);
    },
  },
};
</script>
<style scoped>
.musicTitle {
  display: block;
  font-size: 18px;
  color: #57acbb;
  margin-bottom: 5px;
}
.main_right_height {
  height: 95vh !important;
  display: block !important;
  overflow-y: auto !important;
}
</style>