<template>
  <div id='MisPos'>
    <modal :show.sync="misposShow" backdrop="false">
      <header slot="modal-header" class="modal-header">
      </header>
      <article slot="modal-body" class="modal-body">
        <div class="form-horizontal">
          <div class="form-group">
            <h3 class="modal-title">将对用户收取{{money}}元,请点击确定后扫描用户付款码或提醒用户刷卡支付</h3>
          </div>
        </div>
      </article>
      <footer slot="modal-footer" class="modal-footer">
        <button type="button" class="btn btn-default" @click='closeCode'>取消</button>
        <button type="button" class="btn btn-default" @click='ConfirmCode'>确认</button>
      </footer>
    </modal>
  </div>
</template>

<script>
  export default {
    name: 'MisPos',
    props: {
      // 付款方式
      payment: {},
      // 用户信息
      row: {},
      // 付款金额
      money: {}
    },
    data () {
      return {
        // 付款码弹框显示
        misposShow: false,
        // 付款码流程控制
        posresolve: null,
        // 付款码返回数据
        misposReturnData: {},
        // 定时器
        timer: null,
      }
    },
    created () {
    },
    ready () {
    },
    methods: {
      // 返回结果为true意味着可以通行
      flowPath () {
        return new Promise((resolve) => {
          this.posresolve = resolve
          // 如果是付款码支付则显示界面扫用户付款码收钱
          if (this.payment.toString().indexOf('无线pos支付') !== -1) {
            this.misposShow = true
          } else {
            this.posresolve({msg: '不是无线pos支付', result: true})
          }
        })
      },
      // 付款码支付流程
      async ConfirmCode () {
        let data = {
          config: "gehua",
          f_userfiles_id: this.row ? this.row.f_userfiles_id : null,
          money: this.money,
          f_orgid: this.$login.f.orgid,
          f_orgname: this.$login.f.orgs,
          f_depid: this.$login.f.f_dep_id,
          f_depname: this.$login.f.deps,
          f_operator: this.$login.f.ename,
          f_operatorid: this.$login.f.id,
          pay_method:  this.payment[0],
        }
        console.log(this.$login.f.f_orgid)
        let res = await this.$resetpost('/mispos/rs/misposPay/makeOrder', data, {resolveMsg: null, rejectMsg: '服务器内部出错,'},90000)
        this.misposReturnData = res = res.data
        if (res.state == 'SUCCESS') {
          this.posresolve({msg: '支付完成', result: true})
          this.$closeAlert()
        } else if (res.state == 'UNKNOWN') {
          // 支付结果未知, 根据商户订单号继续查询
          this.$showAlert(`正在查询用户付款状态,请勿进行任何操作,耐心等待,如长时间未响应可手动取消`, 'warning')
          let self = this
          // 启动定时器之前先关闭定时器,防止之前的定时器未关闭
          if (this.timer) {
            this.closeTimer()
          }
          let times = 1
          this.timer = setInterval(async () => {
            times++
            let res1 = await self.$resetpost('/mispos/rs/logic/queryBillState', res, {resolveMsg: null, rejectMsg: '付款码支付查询出错,'})
            res1 = res1.data
            // 支付成功关闭定时器
            if (res1.state == 'SUCCESS') {
              self.posresolve({msg: '支付完成', result: true})
              this.misposShow = false
              self.closeTimer()
              return
            }
            if (times > 12) {
              self.$showAlert(`多次查询未成功，请提醒用户重新付款`, 'danger')
              self.closeTimer()
            }
          }, 5000)
        } else {
          this.$showAlert(`支付失败, 请提醒用户重新付款`, 'danger')
          this.closeTimer()
        }
      },
      // 关闭定时器
      closeTimer () {
        console.log('关闭定时器')
        clearInterval(this.timer)
        this.timer = null
      },
      closeCode () {
        this.$showMessage('取消后无法继续收款,确定取消吗?', ['confirm', 'cancel']).then((res) => {
          if (res == 'confirm') {
            this.misposShow = false
            this.$closeAlert()
            this.posresolve({msg: '支付取消', result: false})
            this.closeTimer()
          }
        })
      }
    }
  }
</script>

<style lang="less">

</style>
