<template>
  <el-dialog
    :width="width"
    :title="title"
    :close-on-click-modal="false"
    :close-on-press-escape="false"
    :before-close="handleClose"
    :visible.sync="childVisible"
    @open="handleOpen"
  >
    <slot></slot>
  </el-dialog>
</template>

<script>
import posMixin from '@/pages/common/posMixin'
export default {
  mixins: [posMixin],
  props: {
    value: {
      type: Boolean,
      default: false
    },
    title: {
      type: String,
      default: '标题'
    },
    submitDisable: {
      type: Boolean,
      default: false
    },
    width: {
      type: String,
      default: '50%'
    }
  },
  computed: {
    childComponent () {
      return this.$slots.default[0].componentInstance
    }
  },
  data () {
    return {
      childVisible: false
    }
  },
  watch: {
    value (val) {
      this.childVisible = val
    }
  },
  beforeDestroy () {
    this.killAllPosProcess()
  },
  methods: {

    handleClose (done) {
      console.log('调用handleClose时的submitDisable', this.submitDisable)
      // 子元素需要验证表单
      if (this.childComponent.verify) {
        this.childComponent.verify.then(val => {
          if (val) {
            this.childVisible = false
            this.$emit('input', false)
            this.$emit('close')
            // 通知slot 弹出关闭了
            this.$nextTick(() => {
              this.childComponent.visible = false
            })
          }
        }).catch(e => {
          this.$message.error('输入的信息有误，请检查')
        })
      } else if (!this.submitDisable) {
        this.childVisible = false
        this.$emit('input', false)
        this.$emit('close')
        // 通知slot 弹出关闭了
        this.$nextTick(() => {
          this.childComponent.visible = false
        })
      }
      if (this.submitDisable) {
        this.$confirm('支付尚未完成，是否强制关闭？', '提示', {
          confirmButtonText: '确认',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$log.info('支付进程被强制关闭')
          this.visible = false
          this.$emit('input', false)
          this.$emit('close')
          // 结束支付进程
          this.killAllPosProcess()

          this.$emit('updateDisable', false)
          /*
          this.submitDisable = false
          */
        }).catch(() => {})
      }
    },
    handleOpen () {
      // 通知slot 弹出打开了
      this.$nextTick(() => {
        this.childComponent.visible = true
      })
    }
  }
}
</script>

<style scoped>

</style>
