<template>
  <el-dialog
    append-to-body
    title="预览"
    :visible.sync="dialogVisible"
    :before-close="handleClose"
    v-if="fileData">
    <video :src="fileData.url" controls v-if="fileData.fileType == 'video'"></video>
    <el-image 
      :src="fileData.url" 
      v-if="fileData.fileType == 'image'">
    </el-image>
  </el-dialog>
</template>

<script>
export default {
  name: '',
  data() {
    return {
      dialogVisible:false
    };
  },
  props:['fileData'],
  computed:{
  },
  watch:{
  },
  created() {

  },
  methods: {
    handleClose() {
      this.dialogVisible = false
    }
  },
};
</script>

<style scoped>
  video {
    width: 100%;
  }
  img {
    width: 100%;
  }
  /deep/.el-dialog__body {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  /deep/.el-dialog {
    z-index: 9999;
  }
</style>
