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='colesFunction' src="./img/coles.png" alt="">
                    <p class="money"><span class="sign">￥</span>{{money}}</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=5'>
                            <div>
                                <img class="icon" src="./img/zfb.png" alt="">
                                <span>支付宝支付</span>
                            </div>
                            <img class="icon-select" v-if="active===5"  src="./img/active.png" alt="">
                            <img class="icon-select" v-else src="./img/no-active.png" alt="">
                        </div>
                    </div>
                    <button @click='payFunctions' class="pay">确认付款</button>
                </div>
            </div>
          `,
  props: {
    /* 弹窗状态 */
    show: {
      type: Boolean,
      default: false
    },

    /* 支付方式 1:微信 2:支付宝 */
    active: {
      type: Number,
      default: 1
    },
    money: {
      type: Number || String,
      default: "88.88"
    }
  },

  methods: {
    /* 支付 */
    payFunctions() {
      const us = navigator.userAgent
      let isSupport = false /* false:支持当前环境  true:不支持当前环境 */
      if (!!us.match(/DingTalk/gi) && this.active !== 5) isSupport = true
      if (!!us.match(/weiXin/gi) && this.active !== 1) isSupport = true
      this.$emit("payfunction", { payType: this.active, isSupport })
    },

    /* 关闭 */
    colesFunction() {
      this.$emit("update:show", false)
    }
  }
}