抽奖

api/luck-draw.js

@@ -0,0 +1,104 @@
+import request from '../utils/request.js'
+
+class LuckDraw extends request {
+
+    static getActivityDetail(id) {
+        let params = {
+            id
+        }
+        return this.postRequest(`${this.BASE_URL}open/luck-draw/detail`, params)
+    }
+
+    static drawPrize(activityId, mobile) {
+        const params = {
+            activityId,
+            mobile
+        }
+        return this.postRequest(`${this.BASE_URL}open/luck-draw/draw-prize`, params)
+    }
+
+    static getHitList(activityId) {
+        const params = {
+            activityId
+        }
+        return this.postRequest(`${this.BASE_URL}open/luck-draw/hit-list`, params)
+    }
+
+    static getActivityList(params) {
+        return this.postRequest(`${this.BASE_URL}open/luck-draw/activity-list`, params)
+    }
+
+    /**
+     * 用户抽奖记录
+     * @param {} params 
+     */
+    static getUserDrawRecord(params) {
+        return this.postRequest(`${this.BASE_URL}open/luck-draw/user-draw-record`, params)
+    }
+
+    /**
+     * @param {*} params 
+     */
+    static getUserPrizeList(params) {
+        return this.postRequest(`${this.BASE_URL}open/luck-draw/user-prize-list`, params)
+    }
+
+    /**
+     * 分享回调
+     */
+    static shareActivity(activityId, mobile) {
+        const params = {
+            activityId,
+            mobile
+        }
+        return this.postRequest(`${this.BASE_URL}open/luck-draw/share-activity`, params)
+    }
+
+    static getTimes(activityId, mobile) {
+        const params = {
+            activityId,
+            mobile
+        }
+        return this.postRequest(`${this.BASE_URL}open/luck-draw/get-times`, params)
+    }
+
+}
+
+export default LuckDraw;
+
+// 示例
+// LuckDraw.drawPrize(3, "16602120168").then(res => {
+
+// }).catch(_ => {})
+// LuckDraw.getHitList(3).then(res => {
+
+// }).catch(_ => {})
+// LuckDraw.getActivityList({
+//     page: 1,
+//     pageSize: 20
+// }).then(res => {
+
+// }).catch(_ => {})
+
+// LuckDraw.getUserDrawRecord({
+//     mobile: "16602120168",
+//     activityId: 3,
+//     page: 1,
+//     pageSize: 20
+// }).then(res => {
+
+// }).catch(_ => {})
+
+// LuckDraw.getUserPrizeList({
+//     mobile: "16602120168",
+//     goodsType: 1,
+//     page: 1,
+//     pageSize: 20
+// }).then(res => {
+
+// }).catch(_ => {})
+
+// LuckDraw.shareActivity(3, "16602120168").then(res => {
+// }).catch(_ => {})
+// LuckDraw.getTimes(3, "16602120168").then(res => {
+// }).catch(_ => {})

pages/luckDraw/components/tabbar.js

@@ -0,0 +1,68 @@
+// pages/luckDraw/components/tabbar.js
+Component({
+    /**
+     * 组件的属性列表
+     */
+    properties: {
+
+    },
+
+    /**
+     * 组件的初始数据
+     */
+    data: {
+        list: [
+            {
+                text: "首页",
+                pagePath: "/pages/luckDraw/index",
+                selectedIconPath: "../../../images/luck-draw/home-active.png",
+                iconPath: "../../../images/luck-draw/home.png",
+            },
+            {
+                text: "我的",
+                pagePath: "/pages/luckDraw/profile",
+                selectedIconPath: "../../../images/luck-draw/user-active.png",
+                iconPath: "../../../images/luck-draw/user.png",
+            }
+        ]
+    },
+
+    attached: function() {
+        var url =getCurrentPages()[getCurrentPages().length-1].route
+        this.data.list.forEach(v => {
+            if (this.getPathName(v.pagePath) == this.getPathName(url)) {
+                v.active = true
+            }
+        })
+        this.setData({
+            list: this.data.list
+        })
+    },
+
+    /**
+     * 组件的方法列表
+     */
+    methods: {
+        toPage: function(e) {
+            const index = e.currentTarget.dataset.index;
+            this.data.list.forEach((v, i) => {
+                if (i == index) {
+                    v.active = true
+                } else {
+                    v.active = false
+                }
+            })
+            this.setData({
+                list: this.data.list
+            })
+            wx.redirectTo({
+              url: this.data.list[index].pagePath,
+            })
+        },
+        getPathName(path) {
+            let pos = path.indexOf("luckDraw/");
+            pos += "luckDraw/".length;
+            return path.substr(pos)
+        }
+    }
+})

pages/luckDraw/components/tabbar.json

@@ -0,0 +1,4 @@
+{
+    "component": true,
+    "usingComponents": {}
+}

pages/luckDraw/components/tabbar.wxml

@@ -0,0 +1,11 @@
+<!--pages/luckDraw/components/tabbar.wxml-->
+<view class="tab-bar-body">
+    <view wx:for="{{list}}" wx:key="index" data-index="{{index}}" catchtap="toPage" class="{{item.active?'_active':''}}">
+       <view class="_ico">
+          <image class="_image" src="{{item.active ? item.selectedIconPath : item.iconPath}}" />
+       </view>
+       <view class="_text">
+          <text>{{item.text}}</text>
+       </view>
+    </view>
+</view>

pages/luckDraw/components/tabbar.wxss

@@ -0,0 +1,28 @@
+/* pages/luckDraw/components/tabbar.wxss */
+.tab-bar-body{
+    position: fixed;
+    z-index: 1000;
+    left: 0;
+    bottom: 0;
+    height: 98rpx;
+    background: #fff;
+    width: 100vw;
+    box-shadow: 0 8px 49px 0 rgba(179, 117, 117, 0.22);
+    display: flex;
+    justify-content: space-around;
+}
+.tab-bar-body ._ico {
+    height: 60rpx;
+    width: 60rpx;
+    padding-top: 4rpx;
+}
+.tab-bar-body ._image {
+    width: 100%;
+    height: 100%;
+}
+.tab-bar-body ._text {
+    line-height: 28rpx;
+    height: 28px;
+    text-align: center;
+    font-size: 28rpx;
+}

pages/luckDraw/detail.js

@@ -0,0 +1,173 @@
+// pages/luckDraw/detail.js
+import LuckDraw from '../../api/luck-draw'
+import {getMobileCache, getPhoneNumber} from '../../utils/user'
+const app = getApp();
+
+const DEFAULT_GIFTS = [
+    { icoUrl: '', text: '' }, { iconUrl: '', text: '' },{ icoUrl: '', text: '' }, { icoUrl: '', text: ''},
+    { icoUrl: '', text: ''}, { icoUrl: '', text: '' }, { icoUrl: '', text: ''}, { icoUrl: '', text: '' }
+];
+Page({
+
+    /**
+     * 页面的初始数据
+     */
+    data: {
+        activityId: 0,
+        forbidTurn: false,
+        giftList: DEFAULT_GIFTS,
+        allNum: 1000,
+        remainNum: 128,
+        remainNumSplits: [],
+        showHitPrizeDlg: false,
+        showNoHitPrizeDlg: false,
+        showPage: true
+    },
+
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad: function (options) {
+        if (!options.id) {
+            app.showToast ('入参错误');
+            wx.navigateTo({
+              url: './index',
+            })
+            return
+        }
+        this.data.activityId = options.id
+        this.loadActivity()
+        this.getDrawTimes()
+    },
+    loadActivity: function() {
+        LuckDraw.getActivityDetail(this.data.activityId).then(resp => {
+            if (resp.code == 200 && resp.data != null) {
+                this.mapDataToView(resp.data)
+            }
+       }).catch(_ => {
+           console.log(_)
+           app.showToast ('活动不存在');
+           wx.navigateTo({
+             url: './index',
+           })
+           return
+       })
+    },
+
+    /**
+     * 获取次数
+     */
+    getDrawTimes: function() {
+        LuckDraw.getTimes(this.data.activityId, getMobileCache()).then(res => {
+            if (res.code == 200) {
+                this.setData({
+                    remainNum: res.data.remainTimes,
+                    allNum: res.data.allTimes,
+                })
+                this.setRemainNumSplits()
+            }
+        }).catch(_ => {})
+    },
+
+    /**
+     * 活动数据映射
+     */
+    mapDataToView: function(activity) {
+        activity.goodsItemList.forEach(v => {
+            const pos = parseInt(v.pos || 0)
+            if (pos > 0) {
+                if (this.data.giftList[pos-1].isLoaded) {
+                    return true
+                }
+                this.data.giftList[pos - 1].isLoaded = true
+                this.data.giftList[pos - 1].text = v.goodsName
+                this.data.giftList[pos - 1].iconUrl = v.goodsSmallImage
+                this.data.giftList[pos - 1].hitIconUrl = v.goodsBigImage
+                this.data.giftList[pos - 1].goodsId = v.goodsId
+                this.data.giftList[pos - 1].couponId = v.couponId
+                this.data.giftList[pos - 1].isSpecial = v.isSpecial
+                this.data.giftList[pos - 1].hitDesc = v.hitDesc
+                this.data.giftList[pos - 1].active = false
+            }
+        })
+        this.setData({
+            activityTitle: activity.activityTitle,
+            showBeginTime: activity.showBeginTime,
+            showEndTime: activity.showEndTime,
+            beginTime: activity.beginTime,
+            endTime: activity.endTime,
+            timeType: activity.timeType,
+            giftList: this.data.giftList,
+            ruleDesc: activity.ruleDesc || ''
+        })
+    },
+
+    /**
+     * 开始转动奖品，抽奖
+     */
+    turnPrize: function() {
+        console.log("开始抽奖")
+    },
+
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面隐藏
+     */
+    onHide: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面卸载
+     */
+    onUnload: function () {
+
+    },
+
+    /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+    onPullDownRefresh: function () {
+
+    },
+
+    /**
+     * 页面上拉触底事件的处理函数
+     */
+    onReachBottom: function () {
+
+    },
+
+    /**
+     * 用户点击右上角分享
+     */
+    onShareAppMessage: function () {
+
+    },
+
+    setRemainNumSplits: function() {
+        this.setData({
+            remainNumSplits: (this.data.remainNum || 0).toString().split("")
+        })
+    },
+
+    closeDlg: function() {
+        this.setData({
+            showHitPrizeDlg: false,
+            showNoHitPrizeDlg: false
+        })
+    }
+})

pages/luckDraw/detail.json

@@ -0,0 +1,4 @@
+{
+  "navigationBarTitleText": "活动抽奖",
+  "usingComponents": {}
+}

pages/luckDraw/detail.wxml

@@ -0,0 +1,135 @@
+<!--pages/luckDraw/detail.wxml-->
+<view class="page" wx:if="{{showPage}}">
+    <view class="head-bg">
+       <image src="/images/luck-draw/head-bg.png" />
+    </view>
+    <!-- 抽奖视图 -->
+    <view class="luck-draw-box">
+
+       <view class="luck-draw-body">
+            <view class="luck-draw-tip">
+                <image class="_niyou" src="/images/luck-draw/niyou.png" />
+                <image wx:for="{{remainNumSplits}}" wx:key="key" class="_num _{{item}}" src="/images/luck-draw/{{item}}.png" />
+                <image class="_ci" src="/images/luck-draw/ci.png" />
+                <image class="_cjjh" src="/images/luck-draw/cjjh.png" />
+            </view>
+            <view class="luck-draw-record-btn">抽奖记录</view>
+
+            <!-- 奖品转盘 -->
+            <view class="luck-draw-gifts">
+                <view wx:for="{{giftList}}" wx:key="idx" wx:for-index="idx" class="_gift _pos_{{idx}}">
+                    <view class="_ico">
+                        <image wx:if="item.iconPath" src="{{item.iconUrl}}"/>
+                    </view>
+                    <view class="_text">
+                    <text>{{item.text}}</text>
+                    </view>
+                    <image class="_bg" src="{{item.active ? '/images/luck-draw/gift-booth-active.png': '/images/luck-draw/gift-booth.png'}}" />
+                </view>
+
+                <!-- 抽奖按钮 -->
+                <block wx:if="{{forbidTurn}}">
+                    <view class="_gift _turn_btn">
+                        <image class="_bg" src="/images/luck-draw/gift-booth-center-disable.png" />
+                    </view>
+                </block>
+                <block wx:else>
+                    <view class="_gift _turn_btn" catchtap="turnPrize">
+                        <image class="_bg" src="/images/luck-draw/gift-booth-center.png" />
+                        <view class="_nums">
+                            <text>{{remainNum}}/{{allNum}}</text>
+                        </view>
+                    </view>    
+                </block>
+
+            </view>
+
+        </view>
+
+        <!-- 背景 -->
+        <view class="luck-draw-bg">
+            <image src="/images/luck-draw/gift-box.png" />
+        </view>
+
+    </view>
+
+    <!-- 活动规则 -->
+    <view class="block-item-title">
+        <view/>
+        <text>活动规则</text>
+        <view/>
+    </view>
+    <view class="rule-des">
+        <view>1. 每人每天可以抽奖100次</view>
+        <view>2. 当次数用完了， 可分享给好友获得额外xx次抽奖机会 </view>
+        <view>3. 抽奖奖品会再XXXX里兑换XXX</view>
+    </view>
+
+    <!-- 中奖名单 -->
+    <view class="block-item-title">
+        <view/>
+        <text>中奖名单</text>
+        <view/>
+    </view>
+    <view class="hit-record-list">
+        <view class="_item">
+            <view>166*****2223</view>
+            <viwe>XXXX优惠券</viwe>
+        </view>
+        <view class="_item">
+            <view>166*****2223</view>
+            <viwe>XXXX优惠券</viwe>
+        </view>
+        <view class="_item">
+            <view>133*****2233</view>
+            <viwe>XXXX优惠券</viwe>
+        </view>
+        <view class="_item">
+            <view>134*****2223</view>
+            <viwe>XXXX优惠券</viwe>
+        </view>
+    </view>
+
+</view>
+
+<!-- 中奖对话框 -->
+<view class="dlg" wx:if="{{showHitPrizeDlg}}">
+    <view class="prize-body">
+        <view class="prize-title">
+            恭喜您中奖了!
+            <image src="/images/luck-draw/hbar.png" />
+        </view>
+        <view class="prize-subtitle">抽到神秘大奖一份~</view>
+        <view class="prize-figure">
+           <!-- 图片封面 -->
+           <image src="/images/luck-draw/gift.png" />
+        </view>
+        <view class="prize-tip">某某优惠券</view>
+        <view class="btns">
+            <view class="_btn _confirm">确定</view>
+            <view class="_btn _exchange">去兑换</view>
+        </view>
+        <image class="_bg" src="/images/luck-draw/hitdlgbg.png" />
+    </view>
+    <view class="_layer" catchtap="closeDlg" />
+</view>
+
+<!-- 未中奖对话框 -->
+<view class="dlg" wx:if="{{showNoHitPrizeDlg}}">
+    <view class="prize-body">
+        <view class="prize-title">
+            再接再厉!
+            <image src="/images/luck-draw/hbar.png" />
+        </view>
+        <view class="prize-subtitle">离奖品只差一个手势~</view>
+        <view class="prize-figure">
+           <image src="/images/luck-draw/nogift.png" />
+        </view>
+        <view class="prize-tip">分享可获得更多抽奖机会!</view>
+        <view class="btns">
+            <view class="_btn _share">分享</view>
+        </view>
+        <image class="_bg" src="/images/luck-draw/hitdlgbg.png" />
+    </view>
+    <view class="_layer" catchtap="closeDlg" />
+</view>

pages/luckDraw/detail.wxss

@@ -0,0 +1,391 @@
+/* pages/luckDraw/detail.wxss */
+page {
+    background: #BF2637;
+}
+.head-bg {
+    width: 750rpx;
+    height: 576rpx;
+    position: absolute;
+    left: 0;
+    top: 0;
+    z-index: 1;
+}
+.head-bg image {
+    width: 750rpx;
+    height: 576rpx
+}
+
+.luck-draw-box {
+    width: 680rpx;
+    height: 848rpx;
+    margin: 370rpx auto 0;
+    position: relative;
+    z-index: 2;
+}
+.luck-draw-bg {
+    width: 680rpx;
+    height: 848rpx;
+    position: absolute;
+    left: 0;
+    top: 0;
+    z-index: 0;
+}
+.luck-draw-bg image {
+    width: 680rpx;
+    height: 848rpx;
+}
+.luck-draw-body {
+    width: 680rpx;
+    height: 848rpx;
+    z-index: 2;
+    position: relative;
+}
+.luck-draw-tip {
+    width: 100%;
+    height: 68rpx;
+    margin: auto;
+    padding-top: 116rpx;
+    text-align: center;
+    font-size: 56rpx;
+    font-weight: 800;
+    color: #fff;
+    font-style: italic;
+}
+
+.luck-draw-tip image {
+    height: 46rpx;
+}
+.luck-draw-tip ._niyou {
+    width: 110rpx;
+    margin-right: 6rpx;
+}
+.luck-draw-tip ._ci {
+    width: 56rpx;
+    margin-left: 6rpx;
+}
+.luck-draw-tip ._cjjh {
+    width: 220rpx;
+}
+.luck-draw-tip ._num {
+    height: 38rpx;
+}
+.luck-draw-tip ._0 {
+    width: 40rpx;
+}
+.luck-draw-tip ._1 {
+    width: 18rpx;
+}
+.luck-draw-tip ._2 {
+    width: 40rpx;
+}
+.luck-draw-tip ._3 {
+    width: 42rpx;
+}
+
+.luck-draw-tip ._4 {
+    width: 38rpx;
+}
+
+.luck-draw-tip ._5 {
+    width: 40rpx;
+}
+
+.luck-draw-tip ._6 {
+    width: 40rpx;
+}
+
+.luck-draw-tip ._7 {
+    width: 36rpx;
+}
+
+.luck-draw-tip ._8 {
+    width: 40rpx;
+}
+.luck-draw-tip ._9 {
+    width: 40rpx;
+}
+
+.luck-draw-record-btn {
+    width: 178rpx;
+    height: 38rpx;
+    border-radius: 30rpx;
+    background: #FF7A95;
+    color: #fff;
+    font-size: 24rpx;
+    text-align: center;
+    margin: 20rpx auto;
+}
+
+.luck-draw-gifts {
+    width: 528rpx;
+    height: 510rpx;
+    margin: auto;
+    position: relative;
+}
+
+._gift {
+    position: absolute;
+}
+._pos_0 {
+    left: 0;
+    top: 0;
+}
+._pos_1 {
+    left: 178rpx;
+    top: 0;
+}
+._pos_2 {
+    left: 356rpx;
+    top: 0;
+}
+._pos_3 {
+    left: 0;
+    top: 176rpx;
+}
+._pos_4 {
+    left: 356rpx;
+    top: 176rpx;
+}
+._pos_5 {
+    left: 0;
+    top: 352rpx;
+}
+._pos_6 {
+    left: 178rpx;
+    top: 352rpx;
+}
+._pos_7 {
+    left: 356rpx;
+    top: 352rpx;
+}
+
+._gift ._ico {
+    width: 168rpx;
+    height: 160rpx;
+    position: absolute;
+    left: 0;
+    top: 0;
+    z-index: 1;
+}
+
+._gift ._ico image {
+    width: 168rpx;
+    height: 160rpx;
+}
+
+._gift ._text {
+    height: 24rpx;
+    font-size: 22rpx;
+    line-height: 24rpx;
+    width: 168rpx;
+    position: absolute;
+    text-align: center;
+    z-index: 2;
+    color: #6C4EC2;
+    left: 0;
+    top: 102rpx;
+}
+
+._gift ._bg {
+    width: 168rpx;
+    height: 160rpx;
+    position: absolute;
+    left: 0;
+    top: 0;
+}
+
+._turn_btn {
+    left: 178rpx;
+    top: 176rpx;
+}
+
+._turn_btn ._nums {
+    width: 168rpx;
+    font-size: 32rpx;
+    font-weight: 800;
+    height: 32rpx;
+    position: absolute;
+    left: 0;
+    top: 88rpx;
+    color: #fff;
+    text-align: center;
+}
+
+.block-item-title {
+    height: 38rpx;
+    line-height: 38rpx;
+    text-align: center;
+    margin: 104rpx auto 80rpx;
+    display: flex;
+    justify-content: center;
+}
+
+.block-item-title view:nth-child(1) {
+    width: 90rpx;
+    height: 1px;
+    position: relative;
+    top: 20rpx;
+    background: linear-gradient(to left, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0.5)); 
+}
+.block-item-title text {
+    font-weight: 580;
+    font-size: 40rpx;
+    color: #fff;
+    margin: 0 20rpx;
+}
+.block-item-title view:nth-child(3) {
+    width: 90rpx;
+    height: 1px;
+    background: #fff;
+    position: relative;
+    top: 20rpx;
+    background: linear-gradient(to right, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0.5)); 
+}
+
+.rule-des {
+    width: 600rpx;
+    margin: auto;
+    color: #fff;
+    font-size: 28rpx;
+}
+.rule-des view {
+    margin-bottom: 20rpx;
+}
+
+.hit-record-list {
+    width: 600rpx;
+    margin: auto;
+    min-height: 300rpx;
+    max-height: 1000rpx;
+}
+.hit-record-list ._item {
+    display: flex;
+    justify-content: space-between;
+    color: #fff;
+    font-size: 28rpx;
+    height: 60rpx;
+}
+
+/**
+ * 弹出框
+**/
+.dlg {
+    width: 100vw;
+    height: 100vh;
+    z-index: 1001;
+    background: rgba(0, 0, 0, 0.5);
+    left: 0;
+    top: 0;
+    position: fixed;
+}
+.prize-body {
+    width: 630rpx;
+    height: 750rpx;
+    position: absolute;
+    left: calc(100vw / 2 - 630rpx / 2);
+    top: calc(100vh / 2 - 750rpx / 2);
+    z-index: 1;
+}
+.prize-body ._bg {
+    width: 630rpx;
+    height: 750rpx;
+    position: absolute;
+    left: 0;
+    top: 0;
+    z-index: -1;
+}
+
+.prize-title {
+    width: 534rpx;
+    height: 134rpx;
+    position: absolute;
+    left: calc(630rpx / 2 - 534rpx / 2);
+    top: 112rpx;
+    z-index: 0;
+    text-align: center;
+    font-size: 68rpx;
+    color: #F9635F;
+    font-weight: 800;
+    line-height: 134rpx;
+}
+.prize-title image {
+    width: 534rpx;
+    height: 134rpx;
+    position: absolute;
+    left: 0;
+    top: 0;
+    z-index: -1;
+}
+
+.prize-figure {
+    width: 306rpx;
+    height: 216rpx;
+    position: absolute;
+    left: 164rpx;
+    top: 365rpx;
+}
+.prize-figure image {
+    width: 306rpx;
+    height: 216rpx;
+}
+
+.prize-subtitle {
+    width: 100%;
+    height: 35rpx;
+    font-size: 34rpx;
+    color: #fff;
+    line-height: 35rpx;
+    position: absolute;
+    top: 265rpx;
+    left: 0;
+    text-align: center;
+}
+
+.prize-tip {
+    width: 100%;
+    font-size: 30rpx;
+    height: 32rpx;
+    position: absolute;
+    top: 595rpx;
+    left: 0;
+    text-align: center;
+    color: #fff;
+}
+
+.dlg .btns {
+    height: 96rpx;
+    width: 100%;
+    position: absolute;
+    top: 651rpx;
+    display: flex;
+    justify-content:center;
+}
+.dlg .btns ._btn {
+    height: 80rpx;
+    background: #FC7A73;
+    border-radius: 28rpx;
+    line-height: 80rpx;
+    text-align: center;
+    color: #fff;
+    font-size: 36rpx;
+    font-weight: 600;
+    margin: 0 10rpx;
+    box-shadow:rgba(229, 80, 79, 1) 0 0 5px;
+}
+.dlg ._confirm {
+    width: 240rpx;
+}
+.dlg ._exchange {
+    width: 240rpx;
+}
+.dlg ._share {
+    width: 400rpx;
+}
+.dlg ._layer {
+    width: 100vw;
+    height: 100vh;
+    position: absolute;
+    left: 0;
+    top: 0;
+    z-index: 0;
+}

pages/luckDraw/index.js

@@ -0,0 +1,133 @@
+// pages/luckDraw/index.js
+import LuckDraw from '../../api/luck-draw'
+import { parseTime } from '../../utils/util';
+Page({
+
+    /**
+     * 页面的初始数据
+     */
+    data: {
+        page: 1,
+        pageSize: 10,
+        lock: false,
+        noResult: false,
+        noMore: false,
+        activityList: []
+    },
+
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad: function (options) {
+        this.getActivityList();
+    },
+
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面隐藏
+     */
+    onHide: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面卸载
+     */
+    onUnload: function () {
+
+    },
+
+    /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+    onPullDownRefresh: function () {
+
+    },
+
+    /**
+     * 用户点击右上角分享
+     */
+    onShareAppMessage: function () {
+
+    },
+
+    getActivityList: function() {
+        LuckDraw.getActivityList({
+            page: this.data.page,
+            pageSize: this.data.pageSize
+        }).then(res => {
+            if (res.code == 200) {
+                this.drawListView(res.data)
+            }
+            this.data.lock = false
+        }).catch(_ => {
+            this.data.lock = false
+        })
+    },
+
+    drawListView: function(data) {
+        if (!Array.isArray(data) || data.length == 0) {
+            console.log("没有获取到数据");
+            if (this.data.page == 1) {
+                this.setData({
+                    noResult: true
+                })
+            } else {
+                this.setData({
+                    noMore: true
+                })
+            }
+            return
+        }
+        data.forEach(v => {
+            let beginTime = v.beginTime
+            let endTime = v.endTime
+            if (v.timeType == 1 || beginTime == null) {
+                beginTime = "2021.11.01"
+            }
+            if (v.timeType == 2 || endTime == null) {
+                endTime = "2031.11.01"
+            }
+            v.beginTime = parseTime(beginTime, "{y}.{m}.{d}")
+            v.endTime = parseTime(endTime, "{y}.{m}.{d}")
+        })
+
+        this.data.activityList = this.data.activityList.concat(...data)
+        this.setData({
+            activityList: this.data.activityList
+        })
+    },
+
+    /**
+     * 页面上拉触底事件的处理函数
+     */
+    onReachBottom: function () {
+        if (this.data.lock || this.data.noMore) {
+            return
+        }
+        this.data.lock = true
+        this.data.page++
+        this.getActivityList()
+    },
+
+    toDetail(e) {
+        const url = "detail?id=" + e.currentTarget.dataset.id
+        wx.redirectTo({
+            url
+        })
+    }
+
+})

pages/luckDraw/index.json

@@ -0,0 +1,6 @@
+{
+  "navigationBarTitleText": "抽奖活动",
+  "usingComponents": {
+    "tab-bar": "./components/tabbar"
+  }
+}

pages/luckDraw/index.wxml

@@ -0,0 +1,30 @@
+<!--pages/luckDraw/index.wxml-->
+<view>
+
+   <!-- 活动列表 -->
+   <view class="_list">
+       <view class="_item" wx:for="{{activityList}}" wx:key="index" data-id="{{item.id}}" catchtap="toDetail">
+            <view class="_figure">
+               <image mode="aspectFill" src="{{item.fullActivityFigure}}" />
+            </view>
+            <view class="_info">
+                <view class="_base_info">
+                    <view class="_title">{{item.activityTitle}}</view>
+                    <view class="_subtitle">{{item.activitySubtitle}}</view>
+                    <view class="_time">{{item.beginTime}}-{{item.endTime}}</view>
+                </view>
+                <view class="_status">
+                    <view class="_status_btn _status{{item.status}}">{{item.statusText}}</view>
+                </view>
+            </view>
+       </view>
+
+       <view class="_no_result" wx:if="{{noResult}}">———— 暂无抽奖活动|敬请期待 ————</view>
+       <view class="_no_more" wx:if="{{noMore}}">———— 更多活动 | 敬请期待 ————</view>
+
+   </view>
+
+</view>
+
+<!-- 底部导航 -->
+<tab-bar />

pages/luckDraw/index.wxss

@@ -0,0 +1,105 @@
+/* pages/luckDraw/index.wxss */
+page {
+    background: #f0f0f0;
+    padding-bottom: 98rpx;
+}
+
+._list {
+    width: 702rpx;
+    margin: auto;
+    padding-top: 32rpx;
+}
+
+._item {
+    background: #fff;
+    margin-bottom: 28rpx;
+    border-radius: 10rpx;
+    box-sizing: border-box;
+}
+._figure {
+    height: 260rpx;
+    width: 100%;
+    border-radius: 10rpx 10rpx 0 0;
+    overflow: hidden;
+}
+._figure image {
+    height: 260rpx;
+    width: 100%;
+}
+
+._info {
+    display: flex;
+    flex-direction: row;
+}
+._base_info {
+    flex: 1;
+}
+._status {
+    width: 210rpx;
+}
+
+._base_info {
+    padding: 28rpx 28rpx 28rpx 40rpx;
+}
+._title {
+    font-weight: 1000;
+    font-size: 36rpx;
+    color: #000;
+    margin-bottom: 16rpx;
+}
+
+._subtitle {
+    font-size: 26rpx;
+    color: #8c8c8c;
+    font-size: 24rpx;
+    margin-bottom: 4rpx;
+}
+._time {
+    font-size: 28rpx;
+    color: #8c8c8c;
+}
+
+._status_btn {
+    width: 174rpx;
+    height: 60rpx;
+    border-radius: 60rpx;
+    line-height: 60rpx;
+    text-align: center;
+    font-size: 30rpx;
+    font-weight: 600;
+    margin: 60rpx 0 0 0;
+}
+._status2 {
+    border: 1rpx solid #CF4F58;
+    background: #FFE3E5;
+    color: #BD1925;
+}
+
+._status1 {
+    border: 1rpx solid #EE7C00;
+    background: #FFE6CB;
+    color: #EE7C00;
+}
+
+._status3 {
+    border: 1rpx solid #B1B1B1;
+    background: #F5F5F5;
+    color: #B1B1B1;
+}
+
+._no_more {
+    font-size: 24rpx;
+    color: #B1B1B1;
+    text-align: center;
+    line-height: 100rpx;
+    padding-bottom: 28rpx;
+    font-weight: 1000;
+}
+
+._no_result {
+    font-size: 24rpx;
+    color: #B1B1B1;
+    text-align: center;
+    line-height: 100rpx;
+    font-weight: 1000;
+}

pages/luckDraw/profile.js

@@ -0,0 +1,66 @@
+// pages/luckDraw/profile.js
+Page({
+
+    /**
+     * 页面的初始数据
+     */
+    data: {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad: function (options) {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面隐藏
+     */
+    onHide: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面卸载
+     */
+    onUnload: function () {
+
+    },
+
+    /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+    onPullDownRefresh: function () {
+
+    },
+
+    /**
+     * 页面上拉触底事件的处理函数
+     */
+    onReachBottom: function () {
+
+    },
+
+    /**
+     * 用户点击右上角分享
+     */
+    onShareAppMessage: function () {
+
+    }
+})

pages/luckDraw/profile.json

@@ -0,0 +1,6 @@
+{
+  "navigationBarTitleText": "个人中心",
+  "usingComponents": {
+    "tab-bar": "./components/tabbar"
+  }
+}

pages/luckDraw/profile.wxml

@@ -0,0 +1,6 @@
+<!--pages/luckDraw/profile.wxml-->
+
+
+
+<!-- 底部导航 -->
+<tab-bar />

pages/luckDraw/profile.wxss

@@ -0,0 +1 @@
+/* pages/luckDraw/profile.wxss */

utils/user.js

@@ -0,0 +1,31 @@
+function getUserInfo() {
+    return wx.getStorageSync('userInfo') || null;
+}
+
+function getMobileCache() {
+    const userInfo = getUserInfo()
+    if (userInfo != null) {
+        return userInfo.mobile || ''
+    }
+    return ''
+}
+
+function getPhoneNumber(e, func) {
+    var encryptedData = e.detail.encryptedData;
+    console.log(encryptedData);
+    var iv = e.detail.iv;
+    if (!encryptedData || encryptedData.length == 0 || !iv || iv.length == 0) {
+      return;
+    }
+    //获取手机号
+    getApp().doDecodePhone(encryptedData, iv, function () {
+      func(getMobileCache())
+    });
+}
+
+module.exports = {
+    getUserInfo,
+    getMobileCache,
+    getPhoneNumber
+}
+