<template>
  <el-dialog
    :title="option.fileName"
    :append-to-body="true"
    :modal-append-to-body="true"
    :close-on-click-modal="false"
    :visible.sync="showDialog"
    :modal="false"
    width="60%"
    custom-class="dialog-style video-dialog"
    @close="close"
    :destroy-on-close="true"
    v-el-drag-dialog>
    <div class="cont">
      <video :src="url" controls="controls" autoplay="true" style="width: 100%;height: 100%">
        {{ $t2('您的浏览器不支持 video 标签。', 'components.video.warmMsg1')}}
      </video>
    </div>
  </el-dialog>
</template>

<script>

export default {
  name: "index",
  props: {
    option: Object
  },
  components: {},
  created() {
    if (this.option) {
      this.url = this.option.url;
    }
  },
  data() {
    return {
      url: null,
      showDialog: true,
    }
  },
  methods: {
    close() {
      this.$emit('update:visiable', false);
    }
  }
}
</script>

<style>
/*.video-dialog .vjs-progress-control{
  pointer-events: none !important;
}*/
</style>
