store-new/pages/shop-gift-suce/shop-gift-suce.vue

<template>
	<view class="suce">
		<image src="../../static/imgs/shop/change_suce.png" class="suce_icon"></image>
		<view class="suce_hint">恭喜您！兑换成功！</view>
		<view class="suce_intr">
			<text>
				消耗积分：
			</text>
			<text style="color:#FB231F">{{integral}}积分</text>
		</view>
		<view class="suce_btn flexB">
			<view class="flexC" @click="skip(0)">继续兑换</view>
			<view class="flexC" @click="skip(1)">查看兑换记录</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				integral: 0
			}
		},
		onLoad(ops) {
			this.integral = ops.integral;
		},
		methods: {
			skip(type) {
				let url = '';
				switch (type) {
					case 0:
						url = '../integral-store/integral-store' //继续兑换
						break;
					case 1:
						url = '../shop-gift-record/shop-gift-record'
						break;
					default:
						break;
				}
				uni.redirectTo({
					url
				})
			}
		}
	}
</script>

<style lang="scss">
	.suce {
		width: 100%;
		min-height: 100%;
		background: #fff;
		display: flex;
		flex-direction: column;
		align-items: center;
		padding: 0 30rpx;
		box-sizing: border-box;

		.suce_hint {
			font-size: 46rpx;
			font-weight: bold;
			padding: 30rpx 0 56rpx;
		}

		.suce_intr {
			margin-bottom: 30rpx;

			text {
				font-size: 36rpx;
				font-weight: bold;
			}
		}

		.suce_icon {
			width: 338rpx;
			height: 261rpx;
			margin: 40rpx 0 30rpx;
		}

		.suce_btn {
			width: 100%;

			view {
				width: 300rpx;
				height: 88rpx;
				border-radius: 44px;
				font-size: 32rpx;
			}

			view:first-child {
				background: #FFF4F3;
				border: 2px solid $base-color;
				color: $base-color;
			}

			view:last-child {
				background: $base-line-bg;
				border: 2px solid $base-color;
				color: #fff
			}

		}
	}
</style>