security_study_h5/shopping/paysuccess.vue

<template>
	<view class="pages">
		<view class="icon-wrap u-flex u-row-center" v-if="success=='true'">
			<u-icon name="checkmark" color="#fff" size="80"></u-icon>
		</view>
		<view class="icon-wrap u-flex u-row-center" v-else style="background-color: #FFB100;">
			<u-icon name="close" color="#fff" size="80"></u-icon>
		</view>
		<view class="title">{{title}}</view>
		<view class="full-btn" v-if="success=='true'" @click="btnClick">查看兑换码</view>
		<view class="msg" v-else>{{msg}}</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title:'兑换成功',
				codeData:null,
				msg:null,
				success:null,
			}
		},
		onShow() {		
		},
		onLoad(page) {
			this.codeData = page.codeData;
			this.msg = page.msg;
			this.success = page.success;
			console.log('success',this.success);
			if(this.success=='true'){
				this.title = '兑换成功';
			}else{
				this.title = '兑换失败';
			}
			uni.setNavigationBarTitle({
			    title:this.title
			});
		},
		methods: {
			btnClick(){
				uni.$u.route('/center/paycode', {
					qrContent: this.codeData,
				});
				// uni.reLaunch({url: `/center/paycode?qrContent=${this.codeData}`});
			}
		}
	}
</script>
<style>
	page{
		background-color: #F5F5F5;
	}
</style>
<style lang="scss" scoped>
.pages{
	text-align: center;
}

.icon-wrap{
	width: 180rpx;
	height: 180rpx;
	margin: 120rpx auto 20rpx;
	padding: 20rpx;
	background-color: #00EFB2;
	border-radius: 50%;
}
.title{
	font-size: 34rpx;
	font-family: PingFangSC-Semibold, PingFang SC;
	font-weight: 600;
	color: #333333;
	line-height: 48rpx;
	margin-bottom: 120rpx;
}
.full-btn{
	margin: 20rpx 10%;
	background-color: #009AEF;
}
.msg{
	font-size: 30rpx;
	font-family: PingFangSC-Regular, PingFang SC;
	font-weight: 400;
	color: #999999;
	line-height: 42rpx;
}
</style>