zhywpt-h5/pages/payment/paymentSucess.vue

<template>
	<view class="container">
		<image class='bg-image' mode="widthFix"
			src="https://qtzl.etcjz.cn/default-bucket/20240324/3eba2095f5204798a1f8101b_beijing.jpg"></image>
		<view class="content-re" v-if='shows'>
			<custom-header :back="false" title="下单"></custom-header>
			<view style="padding: 20rpx" class="content">
				<icon type="success" size="80" class="icon-sucess" color="#1AAC1B" />
				<view class="sucess-txt">下单成功</view>
				<button @click="handleFinish" class='nav-bg btn btn-text as-gravity-center' v-if='isShow'>办理完成</button>
			</view>
		</view>
	</view>
</template>
<script setup lang="ts">
	import CustomHeader from '@/components/CustomHeader.vue';
	import {
		handleToTypes,
		isWeb,
		handleToZhifubao,
		handleTonei
	} from '@/utils/utils';
	import { ref } from 'vue';
	import { unifyTemplate } from '@/hooks/unifyTemplate';
	import { onLoad } from '@dcloudio/uni-app';
	import { request } from '@/utils/network/request';
	const {
		initData, //初始化数据
		isShow,
		cusQdOrderVal,
		qdOrderVal //qdOrder中数据 ref
	} = unifyTemplate(); //初始化数据
	let orderObj = {}
	let shows = ref(false)
	//获取页面配置
	onLoad((opin) => {
		initData(opin, 5).then(data => {
			if (data.order.returnUrl) {
				orderObj = data.order
				console.log('orderObj', orderObj, qdOrderVal.value);
				if (cusQdOrderVal.value.channelTypes) {
					handleFinish()
					shows.value = false
					return
				} else {
					isShow.value = true
				}
			}
			shows.value = true
		});
	});

	const handleOther = (returnUrl) => {
		const type = handleToTypes();
		if (type === 'alipaymini') {
			handleToZhifubao(returnUrl);
		} else if (type === 'wechatmini') {
			let returnUrls = returnUrl.split('?')
			if (returnUrls.length === 1) {
				returnUrls = returnUrl + `?orderId=${orderObj.orderNo}&ownerName=${orderObj.ownerName}&productName=${orderObj.productName}&tel=${orderObj.customerTel || orderObj.agentTel}&vehicleId=${orderObj.vehicleId}&qdOrderNo=${orderObj.orderNo}`
			} else {
				returnUrls = returnUrl
			}
			console.log('returnUrls', returnUrls);
			handleTonei(returnUrls);
		}
	};
	const handleFinish = () => {
		console.log(qdOrderVal.value, '获取的qdorder');
		const returnUrl = qdOrderVal.value.returnUrl || '';
		if (!returnUrl) {
			return;
		}
		if (isWeb(returnUrl)) {
			window.open(returnUrl, '_self');
		} else if (returnUrl.toLowerCase() === 'app') {
			console.log(Android.goBackToApp, '安卓跳转方法');
			Android.goBackToApp();
		} else {
			handleOther(returnUrl);
		}
	};
</script>
<style lang="scss" scoped>
	.content {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}

	.sucess-txt {
		font-size: 30rpx;
		margin-top: 15px;
		color: #1aac1b;
		font-weight: bold;
	}

	.sig-manage {
		height: 100vh;
		width: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.btn {
		height: 80rpx;
		opacity: 1;
		border-radius: 100rpx;
		margin: 30rpx 20rpx 20rpx 20rpx;
		width: 250rpx;
	}

	.btn-text {
		color: #ffffff;
		font-size: 28rpx;
	}

	.nav-bg {
		/* background: linear-gradient(to right, #13E7C1, #43A1E0); */
		border: 1px solid #ffffff;
		background: #1aac1b;
	}
</style>