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">
			<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,
		qdOrderVal //qdOrder中数据 ref
	} = unifyTemplate(); //初始化数据
	//获取页面配置
	onLoad((opin) => {
		initData(opin, 5).then(data => {
			if (data.qdOrder.returnUrl) {
				isShow.value = true
			}
		});
	});

	const handleOther = (returnUrl) => {
		const type = handleToTypes();
		if (type === 'alipaymini') {
			handleToZhifubao(returnUrl);
		} else if (type === 'wechatmini') {
			handleTonei(returnUrl);
		}
	};
	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>