moxuan_takeaway_user/my/index/coupon/index.vue

<template>
	<view class="container">
		<!-- 优惠券信息 -->
		<view class="info">
			<view class="info_name">{{ info.couponName }}</view>
			<view class="info_term" v-if="info.minMoney">满{{ info.minMoney || 0 }}可用</view>
			<view class="info_box">
				<text class="text">¥</text>
				{{ info.money || 0 }}
			</view>
			<view class="info_btn" @click="handleFetch">立即领取</view>
			<view class="info_time" v-if="info.expirationTime">{{ info.expirationTime }}到期</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			shopId: '',
			couponId: '',
			info: {}
		}
	},
	onLoad(option) {
		if (option.scene) {
			const scene = decodeURIComponent(option.scene)

			let params = {}
			// 分割成键值对数组
			let pairs = scene.split('&')
			// 遍历并解析每个键值对
			pairs.forEach((pair) => {
				const [key, value] = pair.split('=')
				params[key] = value
			})

			this.shopId = params.shopId
			this.couponId = params.couponId

			this.getInfo()
		}
	},
	methods: {
		getInfo() {
			let data = {
				couponId: this.couponId
			}
			this.$Request.get('/app/coupon/selectCoupon', data).then((res) => {
				// console.log(res, 963)
				if (res.code == 0) {
					this.info = res.data
				}
			})
		},
		handleFetch() {
			let userId = uni.getStorageSync('userId')

			if (userId) {
				let data = {
					couponId: this.couponId,
					shopId: this.shopId,
					userId
				}
				this.$Request.get('/app/coupon/receiveCoupon', data).then((res) => {
					// console.log(res, 888)
					if (res.code == 0) {
						uni.showToast({
							title: '领取成功',
							icon: 'success'
						})
						setTimeout(() => {
							uni.reLaunch({
								url: '/my/coupon/index'
							})
						}, 1500)
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				})
			} else {
				uni.showToast({
					title: '请先登录',
					icon: 'none'
				})
				setTimeout(() => {
					uni.navigateTo({
						url: '/pages/public/login'
					})
				}, 1500)
			}
		}
	}
}
</script>

<style lang="scss" scoped>
.container {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100vw;
	height: 100vh;
	background-image: url('https://mxys.chuanghai-tech.com/wmfile/20250926/a27624ab752f4623ab069c555e497531.png');
	background-size: 100% 100%;

	.info {
		margin-top: 4vh;
		width: 42vw;
		height: 30vh;
		color: #fd322e;

		.info_name {
			font-size: 36rpx;
		}

		.info_term {
			margin-top: 10rpx;
			font-size: 32rpx;
		}

		.info_box {
			margin-left: 90rpx;
			font-size: 150rpx;

			.text {
				margin-right: 35rpx;
				font-size: 60rpx;
			}
		}

		.info_btn {
			display: flex;
			align-items: center;
			justify-content: center;
			margin: 10rpx 0 20rpx 35rpx;
			width: 262rpx;
			height: 74rpx;
			font-size: 40rpx;
			color: #fff;
			border-radius: 32rpx;
			background-color: #fd322e;
		}

		.info_time {
			width: 100%;
			text-align: center;
			color: #000;
			font-size: 24rpx;
		}
	}
}
</style>