xiaoe_mp_npm 0.2.2-beta1 → 0.2.2-beta2

package/miniprogram_dist/Lottery/components/NobodyAttend/index.js

@@ -0,0 +1,33 @@
+import {connect} from '../../store/index'
+import remotePic from '../../remotePic'
+
+const computedBehavior = require('miniprogram-computed').behavior
+
+const mapState = state => ({
+  visible: state.nobodyAttendVisible
+})
+Component(
+  connect(mapState)({
+    behaviors: [computedBehavior],
+    properties: {
+      prize: {
+        type: Object,
+        value: {}
+      }
+    },
+    data: {remotePic},
+    computed: {},
+    observers: {},
+    lifetimes: {
+      attached() {},
+      detached() {}
+    },
+    methods: {
+      onVisibleChange({detail: visible}) {
+        this.store.dispatch({
+          type: visible ? 'show_nobody_attend' : 'hide_nobody_attend'
+        })
+      }
+    }
+  })
+)

package/miniprogram_dist/Lottery/components/NobodyAttend/index.json

@@ -0,0 +1,6 @@
+{
+  "component": true,
+  "usingComponents": {
+    "common-popup": "../CommonPopup/index"
+  }
+}

package/miniprogram_dist/Lottery/components/NobodyAttend/index.less

@@ -0,0 +1,33 @@
+.nobody-attend {
+  position: relative;
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  box-sizing: border-box;
+  height: 100%;
+  .title-box {
+    display: flex;
+    align-items: center;
+    flex-direction: column;
+    .title {
+      margin-bottom: 16rpx;
+      width: 288rpx;
+      height: 108rpx;
+    }
+    .desc {
+      color: #ff6b5c;
+      font-size: 28rpx;
+      font-weight: 500;
+    }
+  }
+  .icon-box {
+    display: flex;
+    align-items: center;
+    flex-direction: column;
+    justify-content: center;
+    height: calc(100% - 95rpx);
+    .losing-icon {
+      width: 320rpx;
+    }
+  }
+}

package/miniprogram_dist/Lottery/components/NobodyAttend/index.wxml

@@ -0,0 +1,11 @@
+<common-popup type="white" isOverlayTransparent="{{true}}" visible="{{visible}}" bind:visibleChange="onVisibleChange">
+  <view class="nobody-attend">
+    <view class="title-box">
+      <image class="title" src="{{remotePic.losing_lottery_title}}" />
+      <view class="desc">本次抽奖无人中奖</view>
+    </view>
+    <view class="icon-box">
+      <image class="losing-icon" mode="widthFix" src="{{remotePic.losing_lottery}}" />
+    </view>
+  </view>
+</common-popup>

package/miniprogram_dist/Lottery/components/NobodyAttend/index.wxss

@@ -0,0 +1,33 @@
+.nobody-attend {
+  position: relative;
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  box-sizing: border-box;
+  height: 100%;
+}
+.nobody-attend .title-box {
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+}
+.nobody-attend .title-box .title {
+  margin-bottom: 16rpx;
+  width: 288rpx;
+  height: 108rpx;
+}
+.nobody-attend .title-box .desc {
+  color: #ff6b5c;
+  font-size: 28rpx;
+  font-weight: 500;
+}
+.nobody-attend .icon-box {
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  justify-content: center;
+  height: calc(100% - 95rpx);
+}
+.nobody-attend .icon-box .losing-icon {
+  width: 320rpx;
+}

package/miniprogram_dist/Lottery/components/PrizeCard/index.js

@@ -0,0 +1,19 @@
+const computedBehavior = require('miniprogram-computed').behavior
+
+Component({
+  behaviors: [computedBehavior],
+  properties: {
+    prize: {
+      type: Object,
+      value: {}
+    }
+  },
+  data: {},
+  computed: {},
+  observers: {},
+  lifetimes: {
+    attached() {},
+    detached() {}
+  },
+  methods: {}
+})

package/miniprogram_dist/Lottery/components/PrizeCard/index.json

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

package/miniprogram_dist/Lottery/components/PrizeCard/index.less

@@ -0,0 +1,42 @@
+.prize-card {
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  box-sizing: border-box;
+  padding: 24rpx 0;
+  width: 424rpx;
+  height: 424rpx;
+  border: 6rpx solid #fc9;
+  border-radius: 24rpx;
+  background: #fff;
+  box-shadow: 0 0.5rem 1rem 0 #E91B16;
+  .prize-pic {
+    margin-bottom: 16rpx;
+    width: 352rpx;
+    height: 264rpx;
+    border-radius: 8rpx;
+  }
+  .prize-custom-title {
+    display: flex;
+    align-items: center;
+    margin-bottom: 8rpx;
+    max-width: 380rpx;
+    font-weight: 500;
+    font-size: 28rpx;
+    .custom-title {
+      display: inline-block;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      max-width: 280rpx;
+    }
+  }
+  .prize-title {
+    overflow: hidden;
+    max-width: 380rpx;
+    color: #666;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    font-size: 28rpx;
+  }
+}

package/miniprogram_dist/Lottery/components/PrizeCard/index.wxml

@@ -0,0 +1,8 @@
+<view class="prize-card">
+  <image class="prize-pic" mode="aspectFit" src="{{prize.prize_image_url}}" />
+  <view class="prize-custom-title">
+    <text class="custom-title">{{prize.prize_custom_title}}</text>
+    <text class="num">({{prize.prize_num}}份)</text>
+  </view>
+  <text class="prize-title">{{prize.title}}</text>
+</view>

package/miniprogram_dist/Lottery/components/PrizeCard/index.wxss

@@ -0,0 +1,42 @@
+.prize-card {
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  box-sizing: border-box;
+  padding: 24rpx 0;
+  width: 424rpx;
+  height: 424rpx;
+  border: 6rpx solid #fc9;
+  border-radius: 24rpx;
+  background: #fff;
+  box-shadow: 0 0.5rem 1rem 0 #E91B16;
+}
+.prize-card .prize-pic {
+  margin-bottom: 16rpx;
+  width: 352rpx;
+  height: 264rpx;
+  border-radius: 8rpx;
+}
+.prize-card .prize-custom-title {
+  display: flex;
+  align-items: center;
+  margin-bottom: 8rpx;
+  max-width: 380rpx;
+  font-weight: 500;
+  font-size: 28rpx;
+}
+.prize-card .prize-custom-title .custom-title {
+  display: inline-block;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  max-width: 280rpx;
+}
+.prize-card .prize-title {
+  overflow: hidden;
+  max-width: 380rpx;
+  color: #666;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  font-size: 28rpx;
+}

package/miniprogram_dist/Lottery/components/RewardList/RewardItem/index.js

@@ -0,0 +1,137 @@
+/* eslint-disable promise/catch-or-return */
+/* eslint-disable camelcase */
+import {getInfoCollectionData} from 'mp-plugins-info-collection'
+import {RESOURCE_TYPE, PRIZE_TYPE, REDEEM_STATUS} from '../../../constants'
+import {connect} from '../../../store/index'
+import eventBus from '../../../eventBus'
+import {getLotteryPrize} from '../../../store/effect'
+
+const computedBehavior = require('miniprogram-computed').behavior
+
+const mapState = state => ({
+  baseInfo: state.baseInfo,
+  addressInfo: state.addressInfo
+})
+Component(
+  connect(mapState)({
+    behaviors: [computedBehavior],
+    properties: {
+      reward: {
+        type: Object,
+        value: {}
+      }
+    },
+    data: {},
+    computed: {
+      prizeLabel(data) {
+        if (!data.reward.win_product_info) return ''
+        const resourceMap = {
+          [RESOURCE_TYPE.IMAGE_TEXT]: '图文',
+          [RESOURCE_TYPE.AUDIO]: '音频',
+          [RESOURCE_TYPE.VIDEO]: '视频',
+          [RESOURCE_TYPE.ALIVE]: '直播',
+          [RESOURCE_TYPE.MEMBER]: '会员',
+          [RESOURCE_TYPE.COLUMN]: '专栏',
+          [RESOURCE_TYPE.TOPIC]: '大专栏',
+          [RESOURCE_TYPE.BOOK]: '电子书',
+          [RESOURCE_TYPE.ENTITY_GOODS]: '实物商品',
+          [RESOURCE_TYPE.CAMP]: '训练营',
+          [RESOURCE_TYPE.SMALL_CLASS]: '小班课',
+          [RESOURCE_TYPE.BIG_CLASS]: '班课',
+          [RESOURCE_TYPE.SUPER_VIP]: '超级会员'
+        }
+        return resourceMap[data.reward.win_product_info.resource_type] || ''
+      },
+      isCustomPrize(data) {
+        const winProductInfo = data.reward.win_product_info
+        if (!winProductInfo) {
+          return false
+        }
+        return winProductInfo.prize_type === PRIZE_TYPE.CUSTOM
+      },
+      isPrizeNotReceived(data) {
+        return [REDEEM_STATUS.NOT_RECEIVE, REDEEM_STATUS.NOT_RECEIVE_ALSO].includes(data.reward.winner_result_status)
+      },
+      isPrizeReceived(data) {
+        return data.reward.winner_result_status === REDEEM_STATUS.ALREADY_RECEIVE
+      },
+      isPrizeExpired(data) {
+        return data.reward.winner_result_status === REDEEM_STATUS.EXPIRED
+      },
+      isBtnDisabled(data) {
+        if (data.isPrizeExpired) return true
+        if (data.isCustomPrize) return false
+        if (data.isPrizeReceived) return true
+        return false
+      },
+      btnText(data) {
+        if (data.isPrizeNotReceived) return '立即领取'
+        if (data.isPrizeExpired) return '已失效'
+        if (data.isPrizeReceived) {
+          if (data.isCustomPrize) return '兑奖方式'
+          return '已领取'
+        }
+        return ''
+      },
+      btnCls(data) {
+        if (data.isPrizeNotReceived || data.isPrizeExpired) { 
+          return 'info-btn'
+        }
+        if (data.isCustomPrize) {
+          return 'default-btn'
+        }
+        return 'info-btn';
+      }
+    },
+    methods: {
+      // 信息采集 => 实物商品地址 => 领取
+      onReceivePrize() {
+        if (this.data.isPrizeReceived) {
+          if (this.data.isCustomPrize) {
+            this.store.dispatch({
+              type: 'set_merchant_contact_info',
+              payload: this.data.reward.win_product_info.prize_value.contact_information
+            })
+            this.store.dispatch({type: 'show_merchant_contact_info'})
+          }
+        } else {
+          const {resource_id, resource_type, prize_type} = this.data.reward.win_product_info
+          getInfoCollectionData(resource_id, resource_type, {
+            isAliveDraw: true,
+            resource_class: prize_type === PRIZE_TYPE.PROMO_CODE ? '105' : '',
+            operationBtn: '提交并领取奖品',
+            content: this,
+            next: this.getPrize
+          }).then(({isNeedInfoCollection}) => {
+            if (isNeedInfoCollection) {
+              eventBus.emit(
+                'dialog_confirm',
+                {
+                  title: '领取奖品',
+                  message: '为了给您提供更优质的服务，请先填写报名信息',
+                  confirmButtonText: '去填写',
+                  cancelButtonText: '我再想想'
+                },
+                () => {
+                  eventBus.emit('collect_info')
+                }
+              )
+            } else {
+              this.getPrize()
+            }
+          }).catch(err => {
+            console.error(err)
+            this.getPrize();
+          })
+        }
+      },
+      getPrize() {
+        this.store.dispatch(getLotteryPrize(this.data.reward.win_product_info))
+          .then(() => {
+            this.store.dispatch({type: 'set_my_lottery_content', payload: 'reward_list'})
+            this.triggerEvent('fetchRewardList')
+          })
+      }
+    }
+  })
+)

package/miniprogram_dist/Lottery/components/RewardList/RewardItem/index.json

@@ -0,0 +1,6 @@
+{
+  "component": true,
+  "usingComponents": {
+    "van-button": "@vant/weapp/button/index"
+  }
+}

package/miniprogram_dist/Lottery/components/RewardList/RewardItem/index.less

@@ -0,0 +1,77 @@
+.reward-item {
+    display: flex;
+    box-sizing: border-box;
+    margin-bottom: 20rpx;
+    padding: 16rpx;
+    border-radius: 16rpx;
+    background: #fff;
+    height: 200rpx;
+    .left-box {
+        position: relative;
+        box-sizing: border-box;
+        width: 224rpx;
+        height: 168rpx;
+        .label {
+            position: absolute;
+            right: 16rpx;
+            bottom: 16rpx;
+            padding: 0 10rpx;
+            border-radius: 4rpx;
+            background: rgba(0, 0, 0, 0.5);
+            color: #fff;
+            font-size: 22rpx;
+        }
+        .prize-pic {
+            width: 100%;
+            height: 100%;
+            border-radius: 10rpx;
+        }
+    }
+    .right-box {
+        position: relative;
+        box-sizing: border-box;
+        padding-left: 20rpx;
+        width: calc(100% - 200rpx);
+        .receive-btn {
+            position: absolute;
+            right: 0;
+            bottom: 0;
+            width: 112rpx;
+            height: 40rpx;
+            font-size: 20rpx;
+            display: flex;
+            align-items: center;
+            &.info-btn {
+                border: 1px solid #1472FF !important;
+                background-color: #1472FF !important;
+            }
+            &.default-btn {
+                border: 1px solid #1472FF !important;
+                color: #1472FF !important;
+                background-color: #fff;
+            }
+        }
+        .name {
+            height: 80rpx;
+            font-weight: 500;
+            font-size: 28rpx;
+            display: -webkit-box;
+            overflow: hidden;
+            -webkit-line-clamp: 2;
+            -webkit-box-orient: vertical;
+        }
+        .desc {
+            color: #666;
+            font-size: 24rpx;
+            text-overflow: ellipsis;
+            overflow: hidden;
+            white-space: nowrap;
+        }
+        .winning-time {
+            position: absolute;
+            bottom: 0;
+            color: #666;
+            font-size: 20rpx;
+        }
+    }
+}

package/miniprogram_dist/Lottery/components/RewardList/RewardItem/index.wxml

@@ -0,0 +1,14 @@
+<view class="reward-item">
+  <view class="left-box">
+    <view class="label">{{prizeLabel}}</view>
+    <image class="prize-pic" src="{{reward.win_product_info.prize_image_url}}" />
+  </view>
+  <view class="right-box">
+    <view class="name">{{reward.win_product_info.title}}</view>
+    <view class="desc">{{reward.win_product_info.prize_custom_title}}</view>
+    <view class="winning-time">中奖时间：{{reward.prize_info.end_at}}</view>
+    <van-button custom-class="receive-btn {{btnCls}}" round type="info" size="mini" disabled="{{isBtnDisabled}}" bind:click="onReceivePrize">
+      {{btnText}}
+    </van-button>
+  </view>
+</view>

package/miniprogram_dist/Lottery/components/RewardList/RewardItem/index.wxss

@@ -0,0 +1,77 @@
+.reward-item {
+  display: flex;
+  box-sizing: border-box;
+  margin-bottom: 20rpx;
+  padding: 16rpx;
+  border-radius: 16rpx;
+  background: #fff;
+  height: 200rpx;
+}
+.reward-item .left-box {
+  position: relative;
+  box-sizing: border-box;
+  width: 224rpx;
+  height: 168rpx;
+}
+.reward-item .left-box .label {
+  position: absolute;
+  right: 16rpx;
+  bottom: 16rpx;
+  padding: 0 10rpx;
+  border-radius: 4rpx;
+  background: rgba(0, 0, 0, 0.5);
+  color: #fff;
+  font-size: 22rpx;
+}
+.reward-item .left-box .prize-pic {
+  width: 100%;
+  height: 100%;
+  border-radius: 10rpx;
+}
+.reward-item .right-box {
+  position: relative;
+  box-sizing: border-box;
+  padding-left: 20rpx;
+  width: calc(100% - 200rpx);
+}
+.reward-item .right-box .receive-btn {
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  width: 112rpx;
+  height: 40rpx;
+  font-size: 20rpx;
+  display: flex;
+  align-items: center;
+}
+.reward-item .right-box .receive-btn.info-btn {
+  border: 1px solid #1472FF !important;
+  background-color: #1472FF !important;
+}
+.reward-item .right-box .receive-btn.default-btn {
+  border: 1px solid #1472FF !important;
+  color: #1472FF !important;
+  background-color: #fff;
+}
+.reward-item .right-box .name {
+  height: 80rpx;
+  font-weight: 500;
+  font-size: 28rpx;
+  display: -webkit-box;
+  overflow: hidden;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+}
+.reward-item .right-box .desc {
+  color: #666;
+  font-size: 24rpx;
+  text-overflow: ellipsis;
+  overflow: hidden;
+  white-space: nowrap;
+}
+.reward-item .right-box .winning-time {
+  position: absolute;
+  bottom: 0;
+  color: #666;
+  font-size: 20rpx;
+}

package/miniprogram_dist/Lottery/components/RewardList/index.js

@@ -0,0 +1,70 @@
+import remotePic from '../../remotePic'
+import {connect} from '../../store/index'
+import {fetchSelfPrizes} from '../../../common/api/lottery'
+import {MY_LOTTERY_CONTENT_TYPE} from '../../constants'
+
+const computedBehavior = require('miniprogram-computed').behavior
+
+const mapState = state => ({
+  baseInfo: state.baseInfo,
+  myLotteryVisible: state.myLotteryVisible,
+  myLotteryContent: state.myLotteryContent,
+  canBack: state.canRewardListBack
+})
+Component(
+  connect(mapState)({
+    options: {},
+    behaviors: [computedBehavior],
+    properties: {},
+    data: {
+      remotePic,
+      rewards: []
+    },
+    computed: {},
+    lifetimes: {
+      attached() {}
+    },
+    observers: {
+      myLotteryVisible(val) {
+        if (val && this.data.myLotteryContent === MY_LOTTERY_CONTENT_TYPE.REWARD_LIST) {
+          this.fetchRewardList()
+        }
+      }
+    },
+    methods: {
+      closePopup() {
+        this.store.dispatch({type: 'hide_my_lottery'})
+        const POPUP_SLIDE_DURATION = 250
+        setTimeout(() => {
+          this.store.dispatch({type: 'set_my_lottery_content', payload: ''})
+        }, POPUP_SLIDE_DURATION)
+      },
+      switchToJoinRecords() {
+        this.store.dispatch({
+          type: 'set_my_lottery_content',
+          payload: 'join_records'
+        })
+      },
+      fetchRewardList() {
+        const params = {
+          alive_id: this.data.baseInfo.alive_id,
+          page: 0,
+          page_size: 50,
+          order_type: 0,
+          sort: 0
+        }
+        fetchSelfPrizes(params)
+          .then(({data}) => {
+            if (data.code === 0) {
+              this.setData({
+                rewards: data.data
+              })
+            }
+          })
+          .catch(err => {
+            console.error(err)
+          })
+      }
+    }
+  })
+)

package/miniprogram_dist/Lottery/components/RewardList/index.json

@@ -0,0 +1,7 @@
+{
+  "component": true,
+  "usingComponents": {
+    "van-button": "@vant/weapp/button/index",
+    "reward-item": "./RewardItem/index"
+  }
+}