feat(pay): 支付二维码展示使用组件替换

This commit is contained in:
appleyou 2025-04-17 13:28:24 +08:00
parent 6a831d8c3e
commit 0d5c16eaa2
3 changed files with 50 additions and 137 deletions

View File

@ -5,6 +5,7 @@
mode="center"
closeable
:round="10"
@close="closeHandler"
>
<view class="qr-code-container-content">
<view class="qr-code-container-title">{{ title }}</view>
@ -55,6 +56,9 @@ export default {
}
},
methods: {
closeHandler() {
this.$emit('update:show', false)
},
initQRCode() {
if (!this.qrData) return
this.$nextTick(() => {
@ -64,11 +68,6 @@ export default {
qrCode.make()
const canvasContext = uni.createCanvasContext('QRCodeCanvas', this)
qrCode.canvasContext = canvasContext
console.log(
'%c [ qrCode ]-58',
'font-size:13px; background:#777244; color:#bbb688;',
qrCode
)
qrCode.drawCanvas()
})
}

View File

@ -8,7 +8,7 @@ import { getToken, removeToken } from '@/config/auth.js'
module.exports = (vm) => {
// 初始化请求配置
uni.$u.http.setConfig((config) => {
config.baseURL = 'http://t-app.beida413.com/prod-api'
config.baseURL = 'http://192.168.0.104:8080'
// 192.168.0.100:8080
//#ifdef DEV_SERVER

View File

@ -10,17 +10,17 @@
<view class="contxt">
<!-- 充值 -->
<template v-if="ifcz">
<div class="tit4">{{ '充值金额' }}</div>
<div class="tit4">充值金额</div>
<u-input class="czinputbox" v-model="czJe"></u-input>
</template>
<template v-else>
<view class="tit">{{ '待支付金额' }}</view>
<view class="tit">待支付金额</view>
<view class="tit1">
{{ userInfo.currencyIcon
}}{{ orderData.orderAmount | numberToCurrency }}
</view>
<view class="tit2"
>{{ '请在' }} <view class="tit3">{{ countDown }}</view
>请在 <view class="tit3">{{ countDown }}</view
>{{ '内完成支付,否则订单将会被自动取消' }}
</view>
</template>
@ -642,7 +642,7 @@
@tap="quickPay(ifcz)"
color="linear-gradient(to right, #fb3024, #fb3024 )"
>
{{ '立即支付' }}
立即支付
</u-button>
</view>
</view>
@ -658,19 +658,12 @@
:asyncClose="true"
></u-modal>
<!-- 二维码 -->
<u-popup :show="wxPopup" mode="center" closeable @close="closewxPopup">
<!-- <u-popup :show="wxPopup" mode="center" closeable @close="closewxPopup">
<view class="t_tit">{{ '微信支付' }}</view>
<view class="pay_code">
<canvas canvas-id="qrcodeCanvasWx" style="width: 280px; height: 280px;"></canvas>
</view>
</u-popup>
<!-- 支付宝二维码 -->
<u-popup :show="wxPopup1" mode="center" closeable @close="closewxPopup">
<view class="t_tit">{{ '支付宝支付' }}</view>
<view class="pay_code">
<canvas canvas-id="qrcodeCanvasAlipay" style="width: 280px; height: 280px;"></canvas>
</view>
</u-popup>
</u-popup> -->
<successDialog
@successClose="successClose"
ref="successDialog"
@ -684,7 +677,7 @@
:showCancelButton="true"
content="是否确定解绑该银行卡"
></u-modal>
<QRCode :qrData="qrData" :show="qrCodeVisible" />
<QRCode :qrData="qrData" :show.sync="qrCodeVisible" />
</view>
</template>
@ -732,8 +725,6 @@ export default {
showSucce: false, //
sucPay: 0,
content: '支付成功',
wxPopup: false,
wxPopup1: false,
luckydrawData: {},
ifcz: false,
czJe: '',
@ -803,6 +794,10 @@ export default {
//
// this.getBankList()
},
onUnload() {
clearInterval(this.clockTime)
clearInterval(this.payStatus)
},
methods: {
showQRCode(text) {
this.qrCodeVisible = true
@ -849,11 +844,6 @@ export default {
}
})
},
closewxPopup() {
this.wxPopup = false
this.wxPopup1 = false
clearInterval(payStatus)
},
//
bindBank(val) {
uni.navigateTo({
@ -1174,115 +1164,51 @@ export default {
}
},
scanPayBfWx(val) {
let params
if (this.ifcz) {
params = {
businessType: 3, //
businessCode: this.orderCode,
payChannel: val,
payType: 2,
}
} else {
params = {
businessType: this.businessType, //
businessCode: this.orderCode,
payChannel: val,
payType: 2,
}
const params = {
businessType: this.ifcz ? 3 : this.businessType, //
businessCode: this.orderCode,
payChannel: val,
payType: 2,
}
api.unifiedorder(params).then(res => {
this.wxPopup = true
this.$nextTick(() => {
const ctx = uni.createCanvasContext('qrcodeCanvasWx', this)
const uqrcode = new UQRCode(ctx, { width: 280, height: 280 })
uqrcode.make(res.data).then(() => {
uqrcode.drawCanvas()
})
})
this.showQRCode(res.data)
})
this.checkPayStatus(params)
},
//
scanPayWx(val) {
let params
if (this.ifcz) {
params = {
businessType: 3, //
businessCode: this.orderCode,
payChannel: val,
payType: 2,
}
}
else {
params = {
businessType: this.businessType, //
businessCode: this.orderCode,
payChannel: val,
payType: 2,
}
api.unifiedorder(params).then(res => {
this.wxPopup = true
this.$nextTick(() => {
const ctx = uni.createCanvasContext('qrcodeCanvasWx', this)
const uqrcode = new UQRCode(ctx, { width: 280, height: 280 })
uqrcode.make(res.data).then(() => {
uqrcode.drawCanvas()
})
})
})
this.checkPayStatus(params)
const params = {
businessType: this.ifcz ? 3 : this.businessType, //
businessCode: this.orderCode,
payChannel: val,
payType: 2,
}
api.unifiedorder(params).then(res => {
this.showQRCode(res.data)
})
this.checkPayStatus(params)
},
//
scanPayAl(val) {
let params
if (this.ifcz) {
params = {
businessType: 3, //
businessCode: this.orderCode,
payChannel: val,
payType: 1,
}
} else {
params = {
businessType: this.businessType, //
businessCode: this.orderCode,
payChannel: val,
payType: 1,
}
const params = {
businessType: this.ifcz ? 3 : this.businessType, //
businessCode: this.orderCode,
payChannel: val,
payType: 1,
}
api.unifiedorder(params).then(res => {
this.wxPopup1 = true
this.$nextTick(() => {
const ctx = uni.createCanvasContext('qrcodeCanvasAlipay', this)
const uqrcode = new UQRCode(ctx, { width: 280, height: 280 })
uqrcode.make(res.data).then(() => {
uqrcode.drawCanvas()
})
})
this.showQRCode(res.data)
})
this.checkPayStatus(params)
},
//
scanPayBfWxJump(val) {
let params
if (this.ifcz) {
params = {
businessType: 3, //
businessCode: this.orderCode,
payChannel: val,
payType: 2,
appletFlag: 0,
}
} else {
params = {
businessType: this.businessType, //
businessCode: this.orderCode,
payChannel: val,
payType: 2,
appletFlag: 0,
}
const params = {
businessType: this.ifcz ? 3 : this.businessType, //
businessCode: this.orderCode,
payChannel: val,
payType: 2,
appletFlag: 0,
}
api.unifiedorder(params).then(res => {
let url =
@ -1297,23 +1223,12 @@ export default {
},
//
scanPayTlWxJump(val) {
let params
if (this.ifcz) {
params = {
businessType: 3, //
businessCode: this.orderCode,
payChannel: val,
payType: 2,
appletFlag: 0,
}
} else {
params = {
businessType: this.businessType, //
businessCode: this.orderCode,
payChannel: val,
payType: 2,
appletFlag: 0,
}
const params = {
businessType: this.ifcz ? 3 : this.businessType, //
businessCode: this.orderCode,
payChannel: val,
payType: 2,
appletFlag: 0,
}
api.unifiedorder(params).then(res => {
let url =
@ -1418,8 +1333,7 @@ export default {
this.$refs.successDialog.showSuccess(res.data)
})
} else {
this.wxPopup = false
this.wxPopup1 = false
this.qrCodeVisible = false
this.showSucce = true
}
} else {