feat(payment): 优化支付结果页面并支持多种支付状态展示
- 新增支付结果查询接口并调用该接口获取支付状态 - 根据支付状态动态显示支付结果信息 - 更新国际化文案,增加支付失败、未支付、支付过期等状态的提示 - 调整支付结果页面布局和样式
This commit is contained in:
parent
d974db8286
commit
2919400d7f
@ -78,3 +78,11 @@ export async function createBuyOrder(data) {
|
|||||||
data
|
data
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
export async function orderQuery(data) {
|
||||||
|
|
||||||
|
return await request( {
|
||||||
|
url:'/api/v1/payment/order/query',
|
||||||
|
method: 'POST',
|
||||||
|
data
|
||||||
|
})
|
||||||
|
}
|
@ -21,7 +21,6 @@ const { auctionDetail} = goodStore();
|
|||||||
const player = ref(null)
|
const player = ref(null)
|
||||||
const {quoteStatus, show, playerId, show1, auctionData, getSocketData, getLiveLink, fullLive} = liveStore()
|
const {quoteStatus, show, playerId, show1, auctionData, getSocketData, getLiveLink, fullLive} = liveStore()
|
||||||
const pullLink = ref('')
|
const pullLink = ref('')
|
||||||
|
|
||||||
const handlePlayerError = (error) => {
|
const handlePlayerError = (error) => {
|
||||||
console.error('播放器错误:', error)
|
console.error('播放器错误:', error)
|
||||||
player.value?.play()
|
player.value?.play()
|
||||||
|
@ -1,16 +1,31 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
|
import {orderQuery} from "~/api/goods/index.js";
|
||||||
definePageMeta({
|
definePageMeta({
|
||||||
layout: 'default',
|
|
||||||
i18n: 'payment.text1',
|
i18n: 'payment.text1',
|
||||||
})
|
})
|
||||||
|
const {t}=useI18n();
|
||||||
|
const route = useRoute();
|
||||||
|
const resData=ref({})
|
||||||
|
const res=await orderQuery({
|
||||||
|
orderNo:route.query.orderNo
|
||||||
|
})
|
||||||
|
if (res.status===0){
|
||||||
|
resData.value=res.data
|
||||||
|
}
|
||||||
|
const statusLabel={
|
||||||
|
1:t('payment.text2'),
|
||||||
|
2:t('payment.text3'),
|
||||||
|
3:t('payment.text4'),
|
||||||
|
4:t('payment.text5'),
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="w-[100vw] bg-[url('@/static/images/3532@2x.png')] bg-cover pt-43px flex-grow-1 flex flex-col pt-180px">
|
<div class="w-[100vw] bg-[url('@/static/images/3532@2x.png')] bg-cover pt-43px flex-grow-1 flex flex-col">
|
||||||
<div class="flex flex-col items-center">
|
<div class="flex flex-col items-center mt-150px">
|
||||||
<img class="w-119px h-120px mb-36px" src="@/static/images/5554@2x1.png" alt="">
|
<img class="w-119px h-120px mb-36px" src="@/static/images/5554@2x1.png" alt="">
|
||||||
<div class="text-#000 text-16px mb-25px">{{$t('payment.text2')}}!</div>
|
<div class="text-#000 text-16px mb-25px">{{statusLabel[resData.status]}}!</div>
|
||||||
<div class="text-#999 text-16px">RMB5,000</div>
|
<div class="text-#999 text-16px">{{resData.currency}}{{resData.money}}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
@ -148,8 +148,11 @@
|
|||||||
"next": "下一步"
|
"next": "下一步"
|
||||||
},
|
},
|
||||||
"payment": {
|
"payment": {
|
||||||
"text1": "支付",
|
"text1": "支付结果",
|
||||||
"text2":"付款成功",
|
"text2":"支付成功",
|
||||||
|
"text3":"支付失败",
|
||||||
|
"text4":"未支付",
|
||||||
|
"text5":"支付过期",
|
||||||
"next": "下一步"
|
"next": "下一步"
|
||||||
}
|
}
|
||||||
}
|
}
|
Loading…
Reference in New Issue
Block a user