抽奖活动

assets/scss/common.scss

@@ -1005,10 +1005,11 @@ img.new-animate{
 
 //中奖提示
 .get-prise .el-dialog--small {
-  height: 360px;
+  height: auto;
 }
 .get-prise .dialog-content p{
   font-size: 28px;
+  text-align: left;
 }
 .get-prise .qr{
   padding: 0 90px 0 20px;
@@ -1053,13 +1054,13 @@ img.new-animate{
   color: #f08829;
   font-size: 30px;
   &:first-child{
-    width: 110px;
+    width: 180px;
   }
   &:nth-child(2){
     width: 170px;
   }
   &:nth-child(3){
-    width: 240px;
+    width: 170px;
   }
   &:last-child{
     width: 150px;
@@ -1084,13 +1085,13 @@ img.new-animate{
   text-overflow: ellipsis;
   white-space: nowrap;
   &:first-child{
-    width: 110px;
+    width: 180px;
   }
   &:nth-child(2){
     width: 170px;
   }
   &:nth-child(3){
-    width: 240px;
+    width: 170px;
   }
   &:last-child{
     width: 150px;
@@ -1105,3 +1106,13 @@ img.new-animate{
   width: 100px;
   height: 100px;
 }
+.look-prise .no_prise{
+  margin: 60px auto 50px;
+  font-size: 32px;
+  color: #f08829;
+}
+.look-prise .no_prise i{
+  margin-right: 10px;
+  font-size: 40px;
+  color: #f08829;
+}

components/lotteryDraw/lottery.vue

@@ -1,42 +1,42 @@
 <template>
-  <div class="lucky">
+  <div class="lucky" v-if="nextLevel">
     <div class="banner"></div>
     <div class="lottery container">
-      <div class="level" v-if="true">
+      <div class="level" style="margin-top: 80px;" v-if="user.itemName === '王者'">
+        <img src="/images/lottery/level-04.png" alt=""/>
+        <div class="high_title">联系客服直接领取</div>
+      </div>
+      <div class="level" v-else>
         <div class="low_level">
-          <img src="/images/lottery/level-01.png" alt=""/>
+          <img :src="user.itemName === '青铜' ? '/images/lottery/level-01.png' : user.itemName === '黄金' ? '/images/lottery/level-02.png' : '/images/lottery/level-03.png'" alt=""/>
           <div class="level_title">青铜买家用户每发布十条询价便可获得一次抽奖机会</div>
         </div>
         <div class="up"><img src="/images/lottery/up.png" alt=""/><span>升级</span></div>
         <div class="high_level">
-          <img src="/images/lottery/level-020.png" alt=""/>
+          <img :src="nextLevel.nextItem.name === '黄金' ? '/images/lottery/level-020.png' : nextLevel.nextItem.name === '钻石' ? '/images/lottery/level-030.png' : '/images/lottery/level-040.png'" alt=""/>
         </div>
         <div class="progress_bar">
           <div class="buyer_inquiry inquiry">
-            <el-progress :text-inside="true" :stroke-width="15" :percentage="33"></el-progress>
-            <span class="all_count">300条询价</span>
-            <div class="tip_text"><img src="/images/lottery/update.png" alt=""/>买家再增加<span>200</span>条报价，便可升级黄金用户</div>
+            <el-progress :text-inside="true" :stroke-width="15" :percentage="inquiryRate"></el-progress>
+            <span class="all_count"><span v-text="buyerInquiryCount"></span>条询价</span>
+            <div class="tip_text"><img src="/images/lottery/update.png" alt=""/>买家再增加<span v-text="activityInquiryCount"></span>条报价，便可升级黄金用户</div>
           </div>
           <div class="vendor_inquiry inquiry">
-            <el-progress :text-inside="true" :stroke-width="15" :percentage="10"></el-progress>
-            <span class="all_count">1000条询价</span>
-            <div class="tip_text"><img src="/images/lottery/update.png" alt=""/>卖家再增加<span>900</span>条报价，便可升级黄金用户</div>
+            <el-progress :text-inside="true" :stroke-width="15" :percentage="replyRate"></el-progress>
+            <span class="all_count"><span v-text="vendorInquiryCount"></span>条询价</span>
+            <div class="tip_text"><img src="/images/lottery/update.png" alt=""/>卖家再增加<span v-text="activityReplyCount"></span>条报价，便可升级黄金用户</div>
           </div>
         </div>
       </div>
-      <div class="level" style="margin-top: 80px;" v-else>
-        <img src="/images/lottery/level-04.png" alt=""/>
-        <div class="high_title">联系客服直接领取</div>
-      </div>
       <div class="prize">
         <div class="press-prise">
           <div class="press_prise">
             <ul class="nineGrid">
               <li class="row">
-                <div v-for="(list, index) in lists.slice(0, 3)" :class="activeIndex === index ? `active` : ``">
+                <div v-for="(prise, index) in currentPrizes.slice(0, 3)" :class="activeIndex === index ? `active` : ``">
                   <div class="wrapper">
-                    <img src="/images/lottery/red_moeny.png" alt="">
-                    <p>一等奖</p>
+                    <img :src="prise.img" alt="">
+                    <p v-text="prise.name"></p>
                   </div>
                   <div class="mask"></div>
                 </div>
@@ -44,8 +44,8 @@
               <li class="row">
                 <div :class="activeIndex === 7 ? 'active': ''" class="grid_center">
                   <div class="wrapper">
-                    <img src="/images/lottery/moeny.png" alt="">
-                    <p>二等奖</p>
+                    <img :src="sevenPrize.img" alt="">
+                    <p v-text="sevenPrize.name"></p>
                   </div>
                   <div class="mask"></div>
                 </div>
@@ -54,30 +54,35 @@
                 </div>
                 <div :class="activeIndex === 3 ? 'active': ''" class="grid_center">
                   <div class="wrapper">
-                    <img src="/images/lottery/red_moeny.png" alt="">
-                    <p>三等奖</p>
+                    <img :src="thirdPrize.img" alt="">
+                    <p v-text="thirdPrize.name"></p>
                   </div>
                   <div class="mask"></div>
                 </div>
               </li>
               <li class="row">
-                <div v-for="(list, index) in lists02" :class="activeIndex === 6-index ? `active` : ``">
+                <div v-for="(prise, index) in currentPrize" :class="activeIndex === 6-index ? `active` : ``">
                   <div class="wrapper">
-                    <img src="/images/lottery/moeny.png" alt="">
-                    <p>一等奖</p>
+                    <img :src="prise.img" alt="">
+                    <p v-text="prise.name"></p>
                   </div>
                   <div class="mask"></div>
                 </div>
               </li>
             </ul>
           </div>
-          <div class="lave-count">剩余<span>5</span>次</div>
-          <div class="tab-prise"><span class="active">青铜用户</span><span>黄金用户</span></div>
+          <div class="lave-count">剩余<span>{{restCount}}</span>次</div>
+          <div class="tab-prise">
+            <span class="toggle"
+                  v-for="(item, index) in user.userDetails"
+                  :class="{'active' : index === selectLevelIndex}"
+                  @click="toggleLevel(item)">{{item.itemName}}用户</span>
+          </div>
         </div>
         <div class="look_prise">
           <div class="header">
             <span>获奖名单</span>
-            <span>查看我的奖品</span>
+            <span @click="lookMyPrizes(true)">查看我的奖品</span>
           </div>
           <div class="body">
             <div class="list_head">
@@ -86,10 +91,10 @@
               <span>奖品</span>
             </div>
             <ul>
-              <li>
-                <div class="time">2018-08-08</div>
-                <div class="company">深圳市优软科技有限公司公司深圳市优软科技有限公司公司</div>
-                <div class="prise_level">一等奖</div>
+              <li v-for="(record, index) in recordData" :key="index" :style="'top: -' + 40 * scrollTimerIndex + 'px'" :class="{'scrollTop': isTop}">
+                <div class="time" :title="record.drawnTime" v-text="record.drawnTime">2018-08-08</div>
+                <div class="company" :title="record.userName" v-text="record.userName">深圳市优软科技有限公司公司深圳市优软科技有限公司公司</div>
+                <div class="prise_level" :title="record.prizeName" v-text="record.prizeName">一等奖</div>
               </li>
             </ul>
           </div>
@@ -152,16 +157,16 @@
       </el-dialog>
     </div>
     <!--中奖提示-->
-    <div class="no-prise get-prise">
+    <div class="no-prise get-prise" v-if="winningInfo.data">
       <el-dialog
         :visible.sync="showGetPriseBox">
         <div class="dialog-content">
           <!--<div class="close" @click="showGetPriseBox = false">&times;</div>-->
           <img src="/images/lottery/hua.png" class="hua" alt=""/>
-          <p>恭喜您抽中XXX，请添加客服微信使用兑换码兑换</p>
+          <p>恭喜您抽中<span v-text="winningInfo.data.name"></span>，请添加客服微信使用兑换码兑换</p>
           <div class="qr"><p>扫描微信二维码或添加XXX微信领取奖品</p><img src="/images/lottery/qr.png" alt=""/></div>
           <span slot="footer" class="dialog-footer">
-          <a type="button" @click="showGetPriseBox = false">确认</a>
+          <a type="button" @click="closeGotPriseInfo(false)">确认</a>
         </span>
         </div>
       </el-dialog>
@@ -174,18 +179,27 @@
           <div class="close" @click="lookPriseBox = false">&times;</div>
           <img src="/images/lottery/hua.png" class="hua" alt=""/>
           <div class="btn-tip">奖品列表</div>
-          <div style="margin: 0 auto; text-align: center; width: 700px;">
-            <div class="prise-tab"><span>奖品</span><span>竞换码</span><span>中奖时间</span><span>竞换状态</span></div>
-            <ul>
-              <li>
-                <div>一等奖</div>
-                <div>YRQT0010</div>
-                <div>2018年12月30日</div>
-                <div>已兑换</div>
-              </li>
-            </ul>
+          <div v-if="ownRecordData.content && ownRecordData.content.length">
+            <div style="margin: 0 auto; text-align: center; width: 700px;">
+              <div class="prise-tab"><span>奖品</span><span>竞换码</span><span>中奖时间</span><span>竞换状态</span></div>
+              <ul>
+                <li v-for="item in ownRecordData.content">
+                  <div :title="item.prizeName" v-text="item.prizeName">一等奖</div>
+                  <div :title="item.code" v-text="item.code">YRQT0010</div>
+                  <div :title="item.drawnTime" v-text="item.drawnTime">2018年12月30日</div>
+                  <div v-text="item.status === 100 ? '已兑奖' : item.status === 200 ? '未兑奖' : ''">已兑换</div>
+                </li>
+              </ul>
+              <div style="float: right;">
+                <page :total="ownRecordData.totalElements" :page-size="pageParams.count"
+                      :current="pageParams.page" @childEvent="handleCurrentChange"></page>
+              </div>
+            </div>
+            <div class="prise-style">兑奖方式：扫描微信二维码或添加XXXX微信领取奖品 <img src="/images/lottery/mall_qr.png" alt=""/></div>
+          </div>
+          <div v-else>
+            <div class="no_prise"><i class="fa fa-smile-o fa-lg"></i>暂无中奖记录</div>
           </div>
-          <div class="prise-style">兑奖方式：扫描微信二维码或添加XXXX微信领取奖品 <img src="/images/lottery/mall_qr.png" alt=""/></div>
         </div>
       </el-dialog>
     </div>
@@ -196,11 +210,15 @@
   </div>
 </template>
 <script>
-  import {LoginBox, RemindBox} from '~components/mobile/common'
+  import Page from '~components/common/page/pageComponent.vue'
   export default {
     name: 'lottery',
     data () {
       return {
+        pageParams: {
+          page: 1,
+          count: 3
+        },
         activeIndex: -1,  // 当前转动到哪个位置，起点位置
         count: 8,    // 总共有多少个位置
         timer: 0,    // 每次转动定时器
@@ -210,28 +228,140 @@
         prize: -1,   // 中奖位置
         click: true,
         showToast: false,
-        toastType: 'luck',
         showLoginBox: false,
         showNoPriseBox: false,
         lookPriseBox: false,
         showChooseBox: false,
-        showGetPriseBox: false
+        showGetPriseBox: false,
+        scrollTimer: {},
+        scrollTimerIndex: 0,
+        isTop: false,
+        selectLevelIndex: 0,
+        // 青铜询价
+        buyerInquiryCount: 0,
+        activityInquiryCount: 0,
+        inquiryRate: 0,
+        // 青铜回复
+        vendorInquiryCount: 0,
+        activityReplyCount: 0,
+        replyRate: 0,
+        thirdPrize: {},
+        sevenPrize: {},
+        restCount: 0,
+        pCode: '',
+        gotIndexItem: 0
       }
     },
     components: {
-      LoginBox,
-      RemindBox
+      Page
+    },
+    fetch ({ store }) {
+      return Promise.all([
+        // 获取个人中奖
+        store.dispatch('lottery/getOwnLotteryInfo', {activityCode: '11wwwwwwww',itemCode: this.user.itemCode})
+      ])
     },
     computed: {
-      lists () {
-        console.log(this.$store.state.supplier.merchant.merchant.data)
-        return this.$store.state.supplier.merchant.merchant.data ? this.$store.state.supplier.merchant.merchant.data.content : []
+      user () {
+        return this.$store.state.lottery.lotteryInfo.userInfo.data ? this.$store.state.lottery.lotteryInfo.userInfo.data.data : []
+      },
+      nextLevel () {
+        return this.$store.state.lottery.lotteryInfo.nextLevel.data ? this.$store.state.lottery.lotteryInfo.nextLevel.data.data : []
+      },
+      recordData () {
+        console.log(this.$store.state.lottery.lotteryInfo.record.data.data, 'recordData')
+        return this.$store.state.lottery.lotteryInfo.record.data ? this.$store.state.lottery.lotteryInfo.record.data.data : []
+      },
+      ownRecordData () {
+        return this.$store.state.lottery.lotteryInfo.ownRecord.data ? this.$store.state.lottery.lotteryInfo.ownRecord.data : []
       },
-      lists02 () {
-        return this.lists.slice(4,7).reverse()
+      currentPrizes () {
+        return this.$store.state.lottery.lotteryInfo.prizes.data ? this.$store.state.lottery.lotteryInfo.prizes.data : []
+      },
+      currentPrize () {
+        return this.currentPrizes.slice(4,7).reverse()
+      },
+      winningInfo () {
+        return this.$store.state.lottery.lotteryInfo.ownLotteryInfo.data ? this.$store.state.lottery.lotteryInfo.ownLotteryInfo.data : []
       }
     },
+    mounted () {
+      this.$nextTick(() => {
+        this.scrollInterval(true)
+        this.getDetail()
+        this.getLevel()
+      })
+    },
     methods: {
+      // 获取第3和第7奖品详情
+      getDetail () {
+        this.currentPrizes.forEach((item, index) => {
+          if (index === 3) {
+            this.thirdPrize = item
+          }
+          if (index === 7) {
+            this.sevenPrize = item
+          }
+        })
+      },
+      // 获取等级
+      getLevel () {
+        this.nextLevel.currentItem.activityItemDetails.forEach(item => {
+          let percent = Number(100)
+          if (item.type === 'CUSTOMER_UPGRADE') {
+            this.buyerInquiryCount = item.amount
+            this.activityInquiryCount =  (this.buyerInquiryCount - this.user.activityInquiryCount)
+            this.inquiryRate = percent - (this.activityInquiryCount / this.buyerInquiryCount) * 100
+          }
+          if (item.type === 'SELLER_UPGRADE') {
+            this.vendorInquiryCount = item.amount
+            this.activityReplyCount =  (this.vendorInquiryCount - this.user.activityReplyCount)
+            this.replyRate = percent - (this.activityReplyCount / this.vendorInquiryCount) * 100
+          }
+        })
+      },
+      getOwnWiningInfo () {
+        this.$http.get('/lottery/user/draw', {params: {activityCode: '11wwwwwwww', itemCode: this.pCode ? this.pCode : this.user.itemCode}})
+          .then(res => {
+            console.log(res.data, 'res.data')
+            let _arr = []
+            for (let i = 0; i < this.currentPrizes.length; i++) {
+              console.log(this.currentPrizes[i].code, 'code')
+              if (this.currentPrizes[i].code === res.data.data.code) {
+                _arr.push(this.currentPrizes[i])
+              }
+            }
+            this.gotIndexItem = _arr.slice(0, 1)[0].$index
+            console.log(_arr.slice(0, 1)[0], 'gotItem0')
+            console.log(this.gotIndexItem, 'gotItem')
+            console.log(_arr)
+            this.$store.commit('lottery/lotteryInfo/GET_OWN_LOTTERY_INFO_SUCCESS', res.data)
+          }, err => {
+            this.$store.commit('lottery/lotteryInfo/GET_OWN_LOTTERY_INFO_FAILURE', err)
+            console.log(err)
+          })
+      },
+      // 切换等级
+      toggleLevel (item) {
+        console.log(item)
+        this.pCode = item.itemCode
+        this.restCount = item.drawnCount
+        if (code) {
+          this.$http.get('/lottery//user/prizes', {params: {activityCode: '11wwwwwwww', itemCode: this.pCode}})
+            .then(res => {
+              this.$store.commit('lottery/lotteryInfo/GET_CURRENT_GRADE_PRIZES_SUCCESS', res.data)
+              setTimeout( () => {
+                this.getDetail()
+              }, 0)
+            }, err => {
+              this.$store.commit('lottery/lotteryInfo/GET_CURRENT_GRADE_PRIZES_FAILURE', err)
+            })
+        }
+      },
+      // 查看我的奖品
+      lookMyPrizes (type) {
+        this.lookPriseBox = type
+      },
       // 去登录
       goLogin () {
         this.$router.push('/auth/login?returnUrl=' + window.location.href)
@@ -242,13 +372,13 @@
           if (!this.click) {
             return
           }
+          this.getOwnWiningInfo()
           this.closeToast()
           this.speed = 200
           this.click = false
           this.startRoll()
         } else {
           this.showLoginBox = true
-          this.goLogin()
         }
       },
       // 开始转动
@@ -262,25 +392,24 @@
           this.times = 0
           this.click = true
           this.showToast = true
-          this.toastType = 'comeOn'
-          console.log('你已经中奖了')
+          // console.log('你已经中奖了')
+          this.showGetPriseBox = true
         } else {
           if (this.times < this.cycle) {
             this.speed -= 10   // 加快转动速度
           } else if (this.times === this.cycle) {    // 随机获得一个中奖位置
-            const index = parseInt(Math.random() * 10, 0) || 0
-            this.prize = index
+            // const index = parseInt(Math.random() * 10, 0) || 0
+            this.prize = this.gotIndexItem
             if (this.prize > 7) {
               this.prize = 7
             }
-            console.log(`中奖位置${this.prize}`)
+            // console.log(`中奖位置${this.prize}`)
           } else if (this.times > this.cycle + 10 &&
             ((this.prize === 0 && this.activeIndex === 7) || this.prize === this.activeIndex + 1)) {
             this.speed += 110
           } else {
             this.speed += 20
           }
-
           if (this.speed < 40) {
             this.speed = 40
           }
@@ -301,9 +430,40 @@
       closeToast () {
         this.showToast = false
       },
-      onRemind: function (str) {
-        this.remindText = str
-        this.timeoutCount ++
+      // 我的奖品
+      scrollInterval (flag) {
+        if (flag && this.recordData.length > 5) {
+          this.scrollTimer = setInterval(() => {
+            this.scrollTimerIndex ++
+            this.isTop = (this.scrollTimerIndex % 45 === 0)
+            if (this.isTop) {
+              this.scrollTimerIndex = 0
+            }
+          }, 3000)
+        } else {
+          clearInterval(this.scrollTimer)
+        }
+      },
+      // 个人奖品分页
+      handleCurrentChange (page) {
+        this.pageParams.page = page
+        this.pageCommodity(this.pageParams)
+      },
+      async pageCmpGoods (pageParams) {
+        console.log(pageParams)
+        params.page = pageParams.page
+        params.count = pageParams.count
+        params.activityCode = '11wwwwwwww'
+        try {
+          let { data } = await this.$http.get('/lottery/user/winninghistories/one', { params })
+          this.$store.commit('lottery/lotteryInfo/GET_OWN_WIN_RECORD_SUCCESS', data)
+        } catch (err) {
+          this.$store.commit('lottery/lotteryInfo/GET_OWN_WIN_RECORD_FAILURE', err)
+        }
+      },
+      closeGotPriseInfo (type) {
+        this.showGetPriseBox = type
+        this.prize = -1
       }
     }
   }
@@ -421,14 +581,14 @@
             font-size: 30px;
             font-weight: bold;
             color: #ff6600;
-            span{
+            >span{
               font-size: 30px;
               font-weight: bold;
               color: #ff6600;
             }
           }
           .tab-prise{
-            span{
+            span.toggle{
               display: inline-block;
               width: 131px;
               height: 44px;
@@ -484,8 +644,8 @@
                   -webkit-box-shadow: 0 7px 0 #ffc63c;
                 }
                 img {
-                  width: 46px;
-                  height: 38px;
+                  /*width: 46px;*/
+                  /*height: 38px;*/
                   vertical-align: middle;
                   margin: 8px 0;
                 }
@@ -530,6 +690,7 @@
                 -moz-box-shadow: 0 7px 0 #ffc63c;
                 -o-box-shadow: 0 7px 0 #ffc63c;
                 -webkit-box-shadow: 0 7px 0 #ffc63c;
+                cursor: pointer;
                 p {
                   font-size: 27px;
                   font-weight: 900;
@@ -603,10 +764,24 @@
             ul{
               width: 100%;
               height: 296px;
+              overflow: hidden;
               li{
                 display: inline-block;
                 overflow: hidden;
-                margin-top: 20px;
+                height: 40px;
+                line-height: 40px;
+                position: relative;
+                top: 0;
+                transition: top 1s;
+                -moz-transition: top 1s;
+                -webkit-transition: top 1s;
+                -o-transition: top 1s;
+                &.scrollTop {
+                  transition: top 0s;
+                  -moz-transition: top 0s;
+                  -webkit-transition: top 0s;
+                  -o-transition: top 0s;
+                }
                 div{
                   float: left;
                   font-size: 18px;

nuxt.config.js

@@ -1,7 +1,7 @@
 const path = require('path')
 const isProdMode = Object.is(process.env.NODE_ENV, 'production')
 // b2c后台
-const baseUrl = process.env.BASE_URL || (isProdMode ? 'http://api.usoftmall.com/' : 'http://192.168.253.3:36006/')
+const baseUrl = process.env.BASE_URL || (isProdMode ? 'http://api.usoftmall.com/' : 'http://10.1.51.79:8080/')
 // 公共询价
 const commonUrl = process.env.COMMON_URL || (isProdMode ? 'https://api-inquiry.usoftmall.com/' : 'http://218.17.158.219:24000/')
 // 公共物料
@@ -207,6 +207,8 @@ module.exports = {
     '/mPhone/**': baseUrl,
     '/sso**': baseUrl,
     // 代办事项
-    '/adminToDo/**': baseUrl
+    '/adminToDo/**': baseUrl,
+    // 抽奖
+    '/lottery/**': baseUrl
   }
 }

pages/lotteryDraw/index.vue

@@ -9,7 +9,11 @@
     layout: 'main',
     fetch ({ store }) {
       return Promise.all([
-        store.dispatch('supplier/loadVendorList', {page: 1, size: 10})
+        store.dispatch('lottery/getUserInfo', {activityCode: '11wwwwwwww'}),
+        store.dispatch('lottery/getNextLevel', {activityCode: '11wwwwwwww'}),
+        store.dispatch('lottery/getWinningRecord', {activityCode: '11wwwwwwww', size: 20}),
+        store.dispatch('lottery/getOwnWinningRecord', {activityCode: '11wwwwwwww', page: 1, count: 10}),
+        store.dispatch('lottery/currentGradePrizes', {activityCode: '11wwwwwwww'})
       ])
     },
     components: {

store/lottery.js

@@ -0,0 +1,69 @@
+import axios from '~/plugins/axios'
+
+export const actions = {
+  // 获取用户信息
+  getUserInfo ({ commit }, params = {}) {
+    commit('lotteryInfo/REQUEST_USER_INFO')
+    return axios.get('/lottery/userInfo', {params})
+      .then(response => {
+        commit('lotteryInfo/GET_USER_INFO_SUCCESS', response.data)
+      }, err => {
+        commit('lotteryInfo/GET_USER_INFO_FAILURE', err)
+      })
+  },
+  // 获取下一等级
+  getNextLevel ({ commit }, params = {}) {
+    commit('lotteryInfo/REQUEST_NEXT_LEVEL')
+    return axios.get('/lottery/user/activityItems', {params})
+      .then(response => {
+        commit('lotteryInfo/GET_NEXT_LEVEL_SUCCESS', response.data)
+      }, err => {
+        commit('lotteryInfo/GET_NEXT_LEVEL_FAILURE', err)
+      })
+  },
+  // 获取活动参与者中奖记录
+  getWinningRecord ({ commit }, params = {}) {
+    commit('lotteryInfo/REQUEST_WIN_RECORD')
+    return axios.get('/lottery/user/winninghistories', {params})
+      .then(response => {
+        commit('lotteryInfo/GET_WIN_RECORD_SUCCESS', response.data)
+      }, err => {
+        commit('lotteryInfo/GET_WIN_RECORD_FAILURE', err)
+      })
+  },
+  // 获取个人中奖记录
+  getOwnWinningRecord  ({ commit }, params = {}) {
+    commit('lotteryInfo/REQUEST_OWN_WIN_RECORD')
+    return axios.get('/lottery/user/winninghistories/one', {params})
+      .then(response => {
+        commit('lotteryInfo/GET_OWN_WIN_RECORD_SUCCESS', response.data)
+      }, err => {
+        commit('lotteryInfo/GET_OWN_WIN_RECORD_FAILURE', err)
+      })
+  },
+  // 获取当前等级对应奖品
+  currentGradePrizes ({ commit }, params = {}) {
+    let resItems = []
+    commit('lotteryInfo/REQUEST_CURRENT_GRADE_PRIZES')
+    return axios.get('/lottery/user/prizes', {params})
+      .then(res => {
+        resItems = res.data.data
+        for (let i = 0; i < resItems.length; i++) {
+          resItems[i].$index = i
+        }
+        commit('lotteryInfo/GET_CURRENT_GRADE_PRIZES_SUCCESS', resItems)
+      }, err => {
+        commit('lotteryInfo/GET_CURRENT_GRADE_PRIZES_FAILURE', err)
+      })
+  },
+  // 抽奖
+  getOwnLotteryInfo ({ commit }, params = {}) {
+    commit('lotteryInfo/REQUEST_OWN_LOTTERY_INFO')
+    return axios.get('/lottery/user/draw', {params})
+      .then(response => {
+        commit('lotteryInfo/GET_OWN_LOTTERY_INFO_SUCCESS', response.data)
+      }, err => {
+        commit('lotteryInfo/GET_OWN_LOTTERY_INFO_FAILURE', err)
+      })
+  }
+}

store/lottery/lotteryInfo.js

@@ -0,0 +1,92 @@
+/**
+ * 用户信息
+ */
+export const state = () => ({
+  userInfo: {
+    fetching: false,
+    data: {}
+  },
+  nextLevel: {
+    fetching: false,
+    data: {}
+  },
+  record: {
+    fetching: false,
+    data: {}
+  },
+  ownRecord: {
+    fetching: false,
+    data: {}
+  },
+  prizes: {
+    fetching: false,
+    data: {}
+  },
+  ownLotteryInfo: {
+    fetching: false,
+    data: {}
+  }
+})
+
+export const mutations = {
+  REQUEST_USER_INFO (state) {
+    state.userInfo.fetching = true
+  },
+  GET_USER_INFO_FAILURE (state) {
+    state.userInfo.fetching = false
+  },
+  GET_USER_INFO_SUCCESS (state, result = {}) {
+    state.userInfo.fetching = false
+    state.userInfo.data = result
+  },
+  REQUEST_NEXT_LEVEL (state) {
+    state.nextLevel.fetching = true
+  },
+  GET_NEXT_LEVEL_FAILURE (state) {
+    state.nextLevel.fetching = false
+  },
+  GET_NEXT_LEVEL_SUCCESS (state, result = {}) {
+    state.nextLevel.fetching = false
+    state.nextLevel.data = result
+  },
+  REQUEST_WIN_RECORD (state) {
+    state.record.fetching = true
+  },
+  GET_WIN_RECORD_FAILURE (state) {
+    state.record.fetching = false
+  },
+  GET_WIN_RECORD_SUCCESS (state, result = {}) {
+    state.record.fetching = false
+    state.record.data = result
+  },
+  REQUEST_OWN_WIN_RECORD (state) {
+    state.ownRecord.fetching = true
+  },
+  GET_OWN_WIN_RECORD_FAILURE (state) {
+    state.ownRecord.fetching = false
+  },
+  GET_OWN_WIN_RECORD_SUCCESS (state, result = {}) {
+    state.ownRecord.fetching = false
+    state.ownRecord.data = result
+  },
+  REQUEST_CURRENT_GRADE_PRIZES (state) {
+    state.prizes.fetching = true
+  },
+  GET_CURRENT_GRADE_PRIZES_FAILURE (state) {
+    state.prizes.fetching = false
+  },
+  GET_CURRENT_GRADE_PRIZES_SUCCESS (state, result = {}) {
+    state.prizes.fetching = false
+    state.prizes.data = result
+  },
+  REQUEST_OWN_LOTTERY_INFO (state) {
+    state.ownLotteryInfo.fetching = true
+  },
+  GET_OWN_LOTTERY_INFO_FAILURE (state) {
+    state.ownLotteryInfo.fetching = false
+  },
+  GET_OWN_LOTTERY_INFO_SUCCESS (state, result = {}) {
+    state.ownLotteryInfo.fetching = false
+    state.ownLotteryInfo.data = result
+  }
+}