|
|
- <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>
|