<template>
	<view class="page">
		<!-- 主要内容区域 -->
		<view class="main-content">
			<!-- 签到成功图片 -->
			<view class="success-image-container">
				<image class="success-image" src="/static/签到成功.png" mode="aspectFit"></image>
			</view>
			
			<!-- 获得积分文字 -->
			<view class="points-text">
				<text class="points-label">获得{{score}}积分！</text>
			</view>
		</view>
		
		<!-- 底部按钮区域 -->
		<view class="bottom-section">
			<view class="button-container">
				<uv-button 
					type="primary" 
					text="我知道了" 
					@click="goBack"
					customStyle="width: 600rpx; height: 88rpx; border-radius: 44rpx; background: #218CDD; font-size: 32rpx;"
				></uv-button>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			score: 0
		}
	},
	methods: {
		// 返回上一页
		goBack() {
			uni.navigateBack({
				delta: 1
			})
		}
	},
  onLoad(options) {
    this.score = options.score
  },
}
</script>

<style lang="scss" scoped>
.page {
	background-color: #F3F7F8;
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	position: relative;
}

.main-content {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 0 60rpx;
	box-sizing: border-box;
}

.success-image-container {
	// margin-bottom: 80rpx;
	display: flex;
	justify-content: center;
	
	.success-image {
		width: 480rpx;
		height: 320rpx;
	}
}

.points-text {
	text-align: center;
	
	.points-label {
		font-size: 36rpx;
		color: #333;
		font-weight: 600;
		line-height: 1.4;
	}
}

.bottom-section {
	padding: 60rpx 60rpx 120rpx;
	box-sizing: border-box;
}

.button-container {
	display: flex;
	justify-content: center;
}
</style>