<template>
  <el-dialog
    v-if="visible"
    :append-to-body="appendToBody"
    :visible.sync="visible"
    :v-loading="loading"
    :title="title"
    width="800px"
    @close="close">
    <iframe :src="url" class="content-iframe" width="100%" height="600px"/>
  </el-dialog>
</template>

<script>
import waves from '@/directive/waves' // waves directive

export default {
  directives: { waves },
  props: {
    appendToBody: {
      type: Boolean,
      default: false
    },
    title: {
      type: String,
      default: '文件'
    }
  },
  data() {
    return {
      visible: false,
      url: '',
      heirloom: {},
      loading: false
    }
  },
  methods: {
    init(e) {
      this.heirloom = e
      this.url = e.url
      this.visible = true
    },
    close() {
      this.url = ''
      this.visible = false
    }
  }
}
</script>
