77 lines
1.7 KiB
Vue
77 lines
1.7 KiB
Vue
<template>
|
|
<!-- 报价/客户支付模态框 -->
|
|
<view class="cu-modal" :class="show?'show':''">
|
|
<view class="cu-dialog bg-white">
|
|
<view class="cu-bar bg-white justify-end">
|
|
<view class="content">支付宝扫码支付</view>
|
|
<view class="action" data-modal="showPayQrcodeModal" @click="finishQrPay">
|
|
<text class="cuIcon-close text-red"></text>
|
|
</view>
|
|
</view>
|
|
<view class="bg-white">
|
|
<view class="padding-tb-sm" style="width: 300px; margin: 0 auto;" v-show="modal_qr">
|
|
<ayQrcode ref="qrcode" :modal="modal_qr" :url="url" @hideQrcode="hideQrcode" :height="300"
|
|
:width="300" />
|
|
</view>
|
|
</view>
|
|
<view class="text-center padding-bottom-xl">
|
|
<view>请客户扫描码付款后方能提交完单</view>
|
|
<view class="text-red">必须按二维码生成金额支付</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import ayQrcode from "@/components/ay-qrcode/ay-qrcode.vue";
|
|
|
|
export default {
|
|
nama: 'pay-qrcode',
|
|
emits: ['finishQrPay'],
|
|
components: {
|
|
ayQrcode
|
|
},
|
|
props: {
|
|
show: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
data: {
|
|
type: Object,
|
|
default: {}
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
//二维码相关参数
|
|
modal_qr: false,
|
|
url: ''
|
|
}
|
|
},
|
|
methods: {
|
|
finishQrPay(e) {
|
|
this.$emit('finishQrPay', e);
|
|
this.hideQrcode();
|
|
},
|
|
// 展示二维码
|
|
showQrcode(url) {
|
|
this.url = url;
|
|
let _this = this;
|
|
this.modal_qr = true;
|
|
// uni.showLoading()
|
|
setTimeout(function() {
|
|
// uni.hideLoading()
|
|
_this.$refs.qrcode.crtQrCode()
|
|
}, 50)
|
|
},
|
|
//传入组件的方法
|
|
hideQrcode() {
|
|
this.modal_qr = false;
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
</style>
|