zhouyanli/chengkong-huakaiwuye
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

新增支付失败逻辑

Browse Source
This commit is contained in:
zhouyanli
2026-08-25 09:56:34 +08:00
parent 1ab7b22221
commit a138e2df44
4 changed files with 99 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
huakai-app/pages/arrearsPayment/arrearsPayment.vue
View File

@@ -7,6 +7,11 @@
<view class="title">缴费成功</view>
<view class="desc">成功缴纳{{ paymentItem.type || '' }}费用</view>
</view>
<view class="container" v-if="currentStep === 3">
<view class="fail-icon"><text class="icon-fail">✕</text></view>
<view class="title">缴费失败</view>
<view class="desc">未能完成缴费，请重新尝试</view>
</view>
</view>
</scroll-view>
@@ -18,13 +23,19 @@
返回
</button>
</view>
<view class="btn-section" v-if="currentStep === 3">
<!-- <button class="retry-btn" @click="handleRetry">重新缴费</button> -->
<button class="pay-btn" open-type="launchApp" app-parameter="payResult=fail" @error="handleLaunchAppError">
返回
</button>
</view>
</view>
</template>
<script setup>
import { ref, reactive } from 'vue'
import { onShow, onLoad } from '@dcloudio/uni-app'
import { getAppPaymentData, getAppQueryParams, clearAppPaymentData, buildPaymentItemFromApp } from '/pageSubPack/api/appLaunch.js'
import { getAppPaymentData, getAppQueryParams, clearAppPaymentData, buildPaymentItemFromApp, getPaymentReturnResult, clearPaymentReturnResult, resolvePaymentResult } from '/pageSubPack/api/appLaunch.js'
import { getBankMiniProgramParams } from '/pageSubPack/api/apiSub.js'
import { showApiError } from '/pageSubPack/api/request.js'
@@ -38,10 +49,12 @@ onLoad(() => {
})
onShow(() => {
// 从日照银行支付小程序返回后，显示支付成功页
// 从日照银行支付小程序返回后，根据返回结果显示成功/失败页
if (navigatedToPayment.value) {
navigatedToPayment.value = false
currentStep.value = 2
const result = resolvePaymentResult(getPaymentReturnResult())
clearPaymentReturnResult()
currentStep.value = result === 'fail' ? 3 : 2
}
})
@@ -76,6 +89,7 @@ const handlePay = async () => {
return
}
navigatedToPayment.value = true
clearPaymentReturnResult()
wx.navigateToMiniProgram({
appId: 'wxc0189436c58b59cd',
path: 'pages/pay/pay',
@@ -100,6 +114,10 @@ const handlePay = async () => {
const handleLaunchAppError = () => {
uni.showToast({ title: '请点击左上角关闭返回', icon: 'none', duration: 2000 })
}
// const handleRetry = () => {
// currentStep.value = 1
// }
</script>
<style lang="scss">
@@ -114,6 +132,9 @@ page { background-color: #f9f9f9; }
.container { display: flex; flex-direction: column; align-items: center; }
.success-icon { width: 220rpx; height: 220rpx; border-radius: 50%; background-color: #1677ff; display: flex; align-items: center; justify-content: center; margin-top: 200rpx; margin-bottom: 60rpx; }
.icon-check { color: #fff; font-size: 130rpx; font-weight: bold; }
.fail-icon { width: 220rpx; height: 220rpx; border-radius: 50%; background-color: #fa5151; display: flex; align-items: center; justify-content: center; margin-top: 200rpx; margin-bottom: 60rpx; }
.icon-fail { color: #fff; font-size: 130rpx; font-weight: bold; }
.retry-btn { width: 100%; height: 100rpx; line-height: 100rpx; background-color: #fff; color: #007aff; border: 2rpx solid #007aff; border-radius: 16rpx; font-size: 32rpx; margin-bottom: 20rpx; }
.title { font-size: 40rpx; font-weight: bold; color: #000; margin-bottom: 20rpx; }
.desc { font-size: 32rpx; color: #666; text-align: center; margin-bottom: 150rpx; }
</style>