144 lines
3.7 KiB
Vue
144 lines
3.7 KiB
Vue
<template>
|
|
<view class="page-wrapper">
|
|
<view class="pay-wait">
|
|
<view class="pay-number">
|
|
<text class="icon">￥</text>
|
|
{{ vdata.payment }}
|
|
</view>
|
|
等待用户付款
|
|
</view>
|
|
<view class="but-content">
|
|
<JButton @tap="cancel">取消付款</JButton>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { reactive, ref } from 'vue'
|
|
import { req, $appPay, API_URL_PAY_ORDER_LIST } from '@/http/apiManager'
|
|
import wxTextToSpeach from '@/commons/utils/wxTextToSpeach'
|
|
import { onLoad, onReady } from '@dcloudio/uni-app'
|
|
onLoad((options) => {
|
|
vdata.payment = options.payment
|
|
})
|
|
onReady(() => {
|
|
wxfaceapp.onRemoteMessage(function (res) {
|
|
console.log('刷脸结果:' + res.content)
|
|
const data = JSON.parse(res.content)
|
|
$appPay(vdata.payment, data.faceCode || data.code).then((r) => {
|
|
console.log('支付后结果', r)
|
|
findOrderState(r.bizData)
|
|
})
|
|
})
|
|
postFront({ type: 'amount', amount: vdata.payment }) // 通知 支付页面 支付金额
|
|
})
|
|
const vdata = reactive({
|
|
payment: '0.00',
|
|
})
|
|
const cancel = () => {
|
|
postFront({ type: 'toBanner' })
|
|
uni.navigateBack()
|
|
}
|
|
const postFront = (content) => {
|
|
wxfaceapp.postMsg({
|
|
targetAppid: 'wx4710a1619fbb3714',
|
|
content: JSON.stringify(content),
|
|
success(res) {
|
|
console.log('通信成功', res)
|
|
},
|
|
fail(res) {
|
|
console.log('通信失败 ', res)
|
|
},
|
|
})
|
|
}
|
|
|
|
function findOrderState(val) {
|
|
switch (val.orderState) {
|
|
case 2:
|
|
if (val.payDataType == 'aliapp' || val.wayCode == 'ALIPAY') {
|
|
wxTextToSpeach(`支付宝支付成功金额${vdata.payment}元`)
|
|
}
|
|
if (val.payDataType == 'ysfapp' || val.wayCode == 'YSFPAY') {
|
|
wxTextToSpeach(`云闪付支付成功金额${vdata.payment}元`)
|
|
}
|
|
uni.$J.showToast('支付成功').then((res) => {
|
|
uni.redirectTo({
|
|
url: '/pages/paySuc/paySuc?amount=' + vdata.payment,
|
|
})
|
|
postFront({ type: 'toBanner' }) //支付成功后 返回支付页面
|
|
})
|
|
break
|
|
case 3:
|
|
uni.$J.showToast('支付失败' + val.errMsg)
|
|
break
|
|
case 4:
|
|
uni.$J.showToast('订单撤销')
|
|
break
|
|
case 1:
|
|
// 支付中 进行查单操作
|
|
console.log('订单状态1进行查单 操作 ')
|
|
findOrder(val.payOrderId)
|
|
break
|
|
}
|
|
}
|
|
let num = 1
|
|
function findOrder(payOrderId) {
|
|
if (num > 15)
|
|
return uni.showModal({
|
|
title: '确认订单状态',
|
|
content: '订单状态查询失败 请与客户确认订单状态 点击确认跳转订单列表页面',
|
|
showCancel: true,
|
|
success: ({ confirm, cancel }) => {
|
|
if (confirm) {
|
|
uni.navigateTo({
|
|
url: '/pages/order/order',
|
|
})
|
|
}
|
|
},
|
|
})
|
|
uni.$J.showToast(`支付中正在进行第${num}次订单查询`).then((res) => {
|
|
req.getById(API_URL_PAY_ORDER_LIST, payOrderId).then(({ bizData }) => {
|
|
num += 1
|
|
console.log('查单结果', bizData)
|
|
bizData.orderState = bizData.state
|
|
findOrderState(bizData)
|
|
})
|
|
})
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.page-wrapper {
|
|
padding: 0.1rpx 30rpx;
|
|
|
|
.pay-wait {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
margin-top: 140rpx;
|
|
height: 220rpx;
|
|
background: linear-gradient(135deg, rgba(86, 222, 114, 1) 0%, rgba(58, 233, 174, 1) 100%);
|
|
border-radius: 15rpx;
|
|
color: #fff;
|
|
|
|
.pay-number {
|
|
display: flex;
|
|
align-items: flex-end;
|
|
margin-bottom: 15rpx;
|
|
font-size: 60rpx;
|
|
font-weight: 700;
|
|
|
|
.icon {
|
|
transform: translateY(-7rpx);
|
|
font-size: 28rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.but-content {
|
|
transform: translateY(400rpx);
|
|
}
|
|
}
|
|
</style>
|