<template>
	<view class="bg">
		<view class="popupBox">
			<view class="name">请输入卡密兑换</view>
			<input type="text" v-model="password">
			<view class="btns" @click="submitPassword">
				立即兑换
			</view>
		</view>
		
		<image class="bottom-img" src="https://static.ticket.sz-trip.com/uploads/20251014/e935f1d616f992dc05c702ba763cece2.png"></image>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				password:''
			}
		},
		onShow() {
			
		},
		methods: {
			submitPassword() {
				console.log('提交的兑换码',this.password);
				let that = this
				that.password = that.password.trim()
				if (that.password== '') {
					uni.showToast({
						title: '请输入优惠券领取卡号',
						icon: 'none'
					})
					return
				}
				that.Post({
					key: that.password
				}, "/api/coupon/get_coupon").then((res) => {
					console.log(res.code);
					if (res.code == 200) {
						uni.showToast({
							title: '兑换成功',
							icon: 'none'
						})
					} else{
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				});
				that.password = ''
			},
		}
	}
</script>

<style lang="scss" scoped>
.bg {
	min-height: 100vh;
	background: #EDF5DC;
	position: relative;
	padding-top: 94rpx;
}
.bottom-img{
	position: absolute;
	bottom: 0;
	right: 0;
	width: 591.33rpx;
	height: 535.27rpx;
	z-index: 1;
}


.popupBox {
	height: 862rpx;
	width: 708.67rpx;
	background-image: url("https://static.ticket.sz-trip.com/uploads/20251014/24a49d4a15b1b9a1270253d7a68cfd9e.png");
	background-size: 100% 100%;
	position: relative;
	z-index: 2;
	padding-top: 174rpx;
	margin: 0 auto;
}

.popupBox .name {
	font-weight: bold;
	font-size: 36rpx;
	color: #6A8A2D;
	text-align: center;
	margin-bottom: 59rpx;
}

.popupBox input {
	width: 433rpx;
	height: 80rpx;
	background: #F7F7F7;
	border-radius: 13rpx;
	border: 1px solid #CCCCCC;
	margin: 0 auto;
	text-align: center;
}

.popupBox .btns {
	width: 400rpx;
	height: 80rpx;
	background: #6A8A2D;
	border-radius: 40rpx;
	font-weight: 500;
	font-size: 31rpx;
	color: #FFFFFF;
	text-align: center;
	line-height: 80rpx;
	margin:  264rpx auto 0;
}


</style>
