2.2.3 更换price页面，增加滚动名单

README.md

@@ -37,4 +37,5 @@ https://mp.weixin.qq.com/
 ###版本分析
 - 2.0.0： 2.0大版本迭代
 - 2.2.1： 文字超出更改
-- 2.2.2： 添加新用户来源渠道
+- 2.2.2： 添加新用户来源渠道
+- 2.2.3： 更换price页面，增加滚动名单

pages/social/prize/prize.js

@@ -4,10 +4,113 @@ import {
 } from '../../../utils/util';
 Page({
     data: {
+        price1: '乐高大号积木盒',
+        price2: '乐高睡美人的童话城堡',
+        priceRoll:[
+            {
+                name: '妮妮妈妈',
+                price: 1
+            },
+            {
+                name: '默默宝贝',
+                price: 2
+            },
+            {
+                name: '素素',
+                price: 1
+            },
+            {
+                name: '王哲',
+                price: 2
+            },
+            {
+                name: '万桃花',
+                price: 2
+            },
+            {
+                name: '奋斗',
+                price: 1
+            },
+            {
+                name: '小胖爸爸',
+                price: 2
+            },
+            {
+                name: '红梅',
+                price: 1
+            },
+            {
+                name: 'AA叶叶',
+                price: 2
+            },
+            {
+                name: '若木',
+                price: 1
+            },
+            {
+                name: '心想事成',
+                price: 2
+            },
+            {
+                name: '不蔫的风',
+                price: 2
+            },
+            {
+                name: '贝贝妈妈',
+                price: 1
+            },
+            {
+                name: '戴本军',
+                price: 2
+            },
+            {
+                name: '虔诚',
+                price: 1
+            },
+            {
+                name: '辰好',
+                price: 2
+            },
+            {
+                name: '开心就好',
+                price: 1
+            },
+            {
+                name: '万发缘生',
+                price: 2
+            },
+            {
+                name: '忘掉曾经',
+                price: 1
+            },
+            {
+                name: '王姑娘',
+                price: 1
+            },
+            {
+                name: '往后余生',
+                price: 2
+            },
+            {
+                name: '空白',
+                price: 1
+            },
+            {
+                name: '可爱宝贝',
+                price: 2
+            },
+            {
+                name: '大兵小将',
+                price: 1
+            }
+        ]
     },
     onLoad: function (options) {
         // wx.setNavigationBarTitle({
         //     title: '消息列表'
         // })
+    },
+    doNothing: function(){
+        // return;
     }
 })

pages/social/prize/prize.wxml

@@ -1,3 +1,17 @@
-<view class="prize-page">
-    <image class="prize-icon" src="https://efunbox.lingjiao.cn/activity/resource/poster/xx_01.jpg" />
+<view class="prize-page" >
+    <image class="prize-icon" src="https://efunbox.lingjiao.cn/reader/resource/prize.jpg" />
+    <view class="price-roll-wrapper">
+        <view class="price-roll">
+            <view class="price-line" wx:for="{{priceRoll}}" wx:key="{{index}}">
+                <view>{{item.name}}</view>
+                <view>兑换了1份{{item.price === 1 ? price1 : price2}}</view>
+            </view>
+        </view>
+        <view class="price-roll">
+            <view class="price-line" wx:for="{{priceRoll}}" wx:key="{{index}}">
+                <view>{{item.name}}</view>
+                <view>兑换了1份{{item.price === 1 ? price1 : price2}}</view>
+            </view>
+        </view>
+    </view>
 </view>

pages/social/prize/prize.wxss

@@ -2,12 +2,43 @@
     width: 100%;
     /* height: 100%; */
     /* overflow: hidden; */
-    background: rgb(248, 130, 43);
-    min-height:100%;
+    background: #FC8A3C;
+    min-height:1334rpx;
+    max-height: 100%;
+    overflow: hidden;
 }
 .prize-icon{
     width: 750rpx;
     height: 1334rpx;
     margin: 0 auto;
 
-}
+}
+.price-roll-wrapper{
+    width: 650rpx;
+    height: 240rpx;
+    position: relative;
+    top: -335rpx;
+    left: 48rpx;
+    overflow: hidden;
+}
+.price-line{
+    width: 100%;
+    font-size: 27rpx;
+    color: #eee;
+    display: flex;
+    justify-content: space-between;
+}
+.price-roll{
+    width: 100%;
+    position: relative;
+    animation: roll 15s linear .3s infinite
+}
+
+@keyframes roll{
+    from{
+        transform: translateY(0);
+    }
+    to{
+        transform: translateY(-100%);
+    }
+  }

project.config.json

@@ -36,7 +36,7 @@
 			"list": []
 		},
 		"miniprogram": {
-			"current": 4,
+			"current": 5,
 			"list": [
 				{
 					"id": -1,
@@ -72,6 +72,12 @@
 					"pathName": "pages/index/index",
 					"query": "",
 					"scene": 1058
+				},
+				{
+					"id": -1,
+					"name": "小红花兑换页面",
+					"pathName": "pages/social/prize/prize",
+					"scene": null
 				}
 			]
 		}