captain-ui/es/pay/src/components/qrcode.js

有赞vue wap业务组件库

import "vant/es/button/style";
import _Button from "vant/es/button";
import "vant/es/icon/style";
import _Icon from "vant/es/icon";
import "vant/es/popup/style";
import _Popup from "vant/es/popup";
export default {
  render: function render() {
    var _vm = this;

    var _h = _vm.$createElement;

    var _c = _vm._self._c || _h;

    return _c('van-popup', {
      staticClass: "cap-qrcode-pay__container",
      attrs: {
        "value": true,
        "close-on-click-overlay": false,
        "lock-on-scroll": ""
      }
    }, [_c('div', {
      staticClass: "cap-qrcode-pay__header"
    }, [_c('van-icon', {
      staticClass: "cap-qrcode-pay__close",
      attrs: {
        "name": "close"
      },
      on: {
        "click": _vm.doHidePopup
      }
    }), _c('p', {
      staticClass: "cap-qrcode-pay__header-row"
    }, [_c('van-icon', {
      staticClass: "cap-qrcode-pay__wechat",
      attrs: {
        "name": "wechat"
      }
    }), _vm._v("\n      点击确定\n    ")], 1), _c('p', {
      staticClass: "cap-qrcode-pay__header-row"
    }, [_vm._v("长按图片 识别二维码 支付")])], 1), _c('div', {
      staticClass: "cap-qrcode-pay__content"
    }, [_c('img', {
      staticClass: "cap-qrcode-pay__qrcode",
      attrs: {
        "src": _vm.qrcodeUrl
      },
      on: {
        "touchstart": _vm.doShowFooter,
        "click": _vm.doShowFooter
      }
    })]), _vm.showFooter ? _c('div', {
      staticClass: "cap-qrcode-pay__footer"
    }, [_c('van-button', {
      attrs: {
        "type": "primary",
        "block": ""
      },
      on: {
        "click": function click($event) {
          _vm.doBtnClick('finish');
        }
      }
    }, [_vm._v("\n      我已完成支付\n    ")]), _c('van-button', {
      attrs: {
        "block": ""
      },
      on: {
        "click": function click($event) {
          _vm.doBtnClick();
        }
      }
    }, [_vm._v("\n      更换支付方式\n    ")])], 1) : _vm._e()]);
  },
  components: {
    'van-popup': _Popup,
    'van-icon': _Icon,
    'van-button': _Button
  },
  props: {
    qrcodeUrl: String,
    onBtnClicked: Function
  },
  data: function data() {
    return {
      showFooter: false
    };
  },
  methods: {
    doHidePopup: function doHidePopup() {
      this.$emit('input', false);
    },
    doShowFooter: function doShowFooter() {
      this.showFooter = true;
    },
    doBtnClick: function doBtnClick(type) {
      this.onBtnClicked(type);
    }
  }
};