<template>
  <hs-dialog
    ref='hsDialog'
    :visible='dialogVisible'
    :allSourceData='hsDialogConfig'
    @close='close'
  >
    <div slot="body">
      <iframe
        id='hsDialogIframe'
        name="hsDialogIframe"
        :src='pageSrc'
        style="width:100%;height:600px;padding-top:10px"
        sandbox="allow-same-origin allow-scripts allow-forms allow-top-navigation allow-popups"
      ></iframe>
    </div>
  </hs-dialog>
</template>
<script>
export default {
  name: 'hs-iframe-dialog',
  data() {
    return {
      pageSrc: '',
      hsDialogConfig: {
        config: {
          title: ''
        },
        sourceData: []
      },
      dialogVisible: false,
      message: null,
      confirmCallback: null,
      cancelCallback: null
    }
  },
  methods: {
    postMessage(data) {
      if (!data) return
      // const hsIframe = document.getElementById('hsDialogIframe')
      const message = {
        type: 'hsData',
        data
      }
      hsDialogIframe.window.postMessage(message, '*')
    },
    addEventListener() {
      window.addEventListener('message', this.handleMessage, false)
    },
    removeEventListener() {
      window.removeEventListener('message', this.handleMessage, false)
    },
    handleMessage(message) {
      if (message.data.type === 'popSaveData') {
        this.ok(message.data.data)
      } else if (message.data.type === 'isReadeyWindow') {
        console.log('给child 发消息')
        this.postMessage(this.message)
      }
    },
    ok(data) {
      if (this.confirmCallback) {
        this.confirmCallback(data)
      } else if (this.resolve) {
        this.resolve(data)
      }
      this.close()
    },
    close() {
      this.removeEventListener()
      if (this.cancelCallback) {
        this.cancelCallback()
      } else if (this.resolve) {
        this.resolve()
      }
      // const { closed } = this.config
      // if (closed) {
      //   this.exectAction(closed)
      // }
      this.dialogVisible = false
    },
    exectAction(action) {
      const type = typeof action
      if (type === 'function') {
        action()
      }
    },
    show(url, parms, message, config, confirm, cancel) {
      this.message = message// 发给iframe 页面的消息
      this.initIframeConfig(config)
      this.addEventListener()
      this.dialogVisible = true
      const origin = location.origin
      const hostname = location.hostname
      const startUrl = hostname === '0.0.0.0' ? origin : origin + '/queryBi/web//'
      let u = startUrl + '/#' + url + '?'
      for (const key in parms) {
        u += `&${key}=${parms[key]}`
      }
      this.pageSrc = u
      if (!confirm && !cancel) {
        return new Promise((resolve, reject) => {
          this.resolve = resolve
          this.reject = reject
        })
      } else {
        if (confirm) {
          this.confirmCallback = confirm
        }
        if (cancel) {
          this.cancelCallback = cancel
        }
      }
    },
    initIframeConfig(config) {
      if (typeof config === 'object') {
        Object.assign(this.hsDialogConfig.config, config)
      } else if (typeof config === 'string') {
        this.hsDialogConfig.config.title = config
      }
    }
  }
}
</script>