mobileclient/v1_5_0_C/payPop.js

const payPop = {
  template: `
            <div class="mask model" @touchmove.prevent @mousewheel.prevent v-if="show">
                <div class="model-box">
                    <img class="coles" @click='show=false' src="./img/coles.png" alt="">
                    <p class="money"><span class="sign">￥</span>128.00</p>
                    <p class="title">选择支付方式</p>
                    <div class="list">
                        <div class="list-children" @click='active=1'>
                            <div>
                                <img class="icon" src="./img/wx.png" alt="">
                                <span>微信支付</span>
                            </div>
                            <img class="icon-select" v-if="active===1" src="./img/active.png" alt="">
                            <img class="icon-select" v-else src="./img/no-active.png" alt="">
                        </div>
                        <div class="list-children" @click='active=2'>
                            <div>
                                <img class="icon" src="./img/zfb.png" alt="">
                                <span>支付宝支付</span>
                            </div>
                            <img class="icon-select" v-if="active===2"  src="./img/active.png" alt="">
                            <img class="icon-select" v-else src="./img/no-active.png" alt="">
                        </div>
                    </div>
                    <button @click='pay=true' class="pay">确认付款</button>
                </div>
            </div>
          `,
  props: {
    /* 弹窗状态 */
    show: {
      type: Object,
      default: false
    },

    /* 支付方式 1:微信 2:支付宝 */
    active: {
      type: Number,
      default: 1
    },

    /* 是否点击支付 */
    pay: {
      type: Object,
      default: false
    }
  },

  watch: {
    show: function (va) {
      if (!va) {
        this._events.setshow[0](va)
      }
    },

    pay: function (va) {
      if (va) {
        const us = navigator.userAgent
        let isSupport = false /* false:支持当前环境  true:不支持当前环境 */
        if (!!us.match(/DingTalk/gi) && this.active !== 2) isSupport = true
        if (!!us.match(/weiXin/gi) && this.active !== 1) isSupport = true
        this._events.payfunction[0](this.active, isSupport)
      }
    }
  }
}