河马支付

2022-09-23 17:02:55 +08:00
parent 872a125fc1
commit 9002c868c4
19 changed files with 1429 additions and 585 deletions
--- a/pages/account/hmState.vue
+++ b/pages/account/hmState.vue
@@ -0,0 +1,145 @@
+<template>
+	<view>
+		<view class="vertical results">
+			<block v-if="loding">
+				<u-loading-icon mode="circle" size="58" color="#34CE98"></u-loading-icon>
+				<view class="circle-toast">
+					<view class="sub-title">已等待{{time}}秒</view>
+					<view class="sub-title">查询支付结果中，请耐心等待...</view>
+				</view>
+			</block>
+			<block v-else>
+				<view v-if="success">
+					<uni-icons type="checkbox-filled" size="88" color="#34CE98"></uni-icons>
+					<view class="title">支付成功</view>
+					<view class="sub-title">{{remove}}</view>
+					<button class="results-button" type="default" size="default" @click="navBack">返回</button>
+				</view>
+				<view v-else>
+					<uni-icons type="info-circle-fill" size="88" color="#34CE98"></uni-icons>
+					<view class="title">{{code === 0 ? '查询失败' : '订单不存在'}}</view>
+					<view class="sub-title">{{code === 0 ? '暂未查询到您的支付信息，如支付成功未到账请联系管理员': '暂未查询到您的订单信息'}}</view>
+					<button class="results-button" type="default" size="default" @click="navBack">返回</button>
+				</view>
+			</block>
+		</view>
+	</view>
+</template>
+
+<script>
+	import { hmState } from '@/apis/interfaces/pay.js'
+	var outTime;
+	export default {
+		data() {
+			return {
+				type	: 'recharge',
+				hash	: '',
+				time	: 0,
+				loding	: false,
+				success : false,
+				code	: 0,
+				remove  : '充值成功，预计10秒内到账，可在账户交易记录中查询，以实际到账时间为准，如充值失败金额将原路退还'
+			};
+		},
+		created() {
+			this.type = this.$Route.query.type
+			if(this.type === 'vip') this.remove = '恭喜您成功开通共力生态会员'
+			if(this.type === 'buy') this.remove = '订单支出成功，可在个人中心中订单中查询您购物的订单'
+			this.queryState()
+		},
+		methods:{
+			queryState(){
+				this.loding = true
+				let outTimeN = 0
+				outTime = setInterval(() => {
+					hmState(this.type, this.$Route.query.orderId).then(res => {
+						outTimeN += 1
+						this.time 		= outTimeN
+						if(res.code === 1){
+							clearInterval(outTime)
+							this.success	= true
+							this.loding		= false
+						}
+						if(res.code === 0 && outTimeN >= 10){
+							clearInterval(outTime)
+							this.code		= 0
+							this.loding		= false
+						}
+						if(res.code === 2){
+							clearInterval(outTime)
+							this.code		= 2
+							this.loding		= false
+						}
+					}).catch(err => {
+						uni.showToast({
+							title: err.message,
+							icon : 'none'
+						})
+					})
+				}, 1000)
+			},
+			navBack(){
+				uni.navigateBack()
+			}
+		},
+		onUnload() {
+			clearInterval(outTime)
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.results{
+		height: 100vh;
+		box-sizing: border-box;
+		text-align: center;
+		padding-left: $padding * 3;
+		padding-right: $padding * 3;
+		padding-bottom: 20vh;
+		.title{
+			font-size: $title-size + 8;
+			color: $text-color;
+			font-weight: bold;
+			line-height: 80rpx;
+			padding: $padding 0;
+		}
+		.sub-title{
+			color: $text-gray;
+			line-height: 40rpx;
+		}
+		.hash{
+			background-color: white;
+			padding: $padding * 2;
+			border-radius: $radius-lg;
+			margin-top: $margin * 2;
+			font-size: $title-size;
+			color: $text-color;
+			.hash-title{
+				padding-bottom: $padding;
+			}
+			.hash-text{
+				word-break:break-all;
+			}
+		}
+		.results-button{
+			width: 100%;
+			margin-top: $margin * 3;
+			height: 90rpx;
+			line-height: 90rpx;
+			border-radius: 45rpx;
+			background-color: $main-color;
+			color: white;
+			font-size: $title-size;
+			font-weight: bold;
+			&::after{
+				display: none;
+			}
+		}
+		.circle-toast{
+			padding-top: 60rpx;
+			.sub-title{
+				line-height: 60rpx;
+			}
+		}
+	}
+</style>