xiaoe_mp_npm 0.2.2-beta1 → 0.2.2-beta2

package/miniprogram_dist/LiveGoodsList/index.wxss

@@ -0,0 +1,50 @@
+.box {
+  margin: 0 12px;
+}
+.title {
+  margin: 0;
+  padding: 32px 16px 16px;
+  color: rgba(69, 90, 100, 0.6);
+  font-weight: normal;
+  font-size: 18px;
+  line-height: 20px;
+  text-align: center;
+}
+.btn {
+  display: block;
+  width: 100%;
+  margin: 10px 0;
+  background-color: #fff;
+}
+.page-main {
+  height: 100%;
+}
+.goods-list {
+  box-sizing: border-box;
+  min-height: 300px;
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+}
+.goods-list .finished-text {
+  display: flex;
+  justify-content: center;
+  color: #999;
+  font-size: 28rpx;
+  padding-bottom: 20rpx;
+}
+.goods-list .no-data {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  margin-top: 80rpx;
+}
+.goods-list .no-data .no-data-png {
+  width: 176rpx;
+  height: 176rpx;
+}
+.goods-list .no-data .no-data-text {
+  color: #999999;
+  font-size: 28rpx;
+  margin-top: 32rpx;
+}

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

@@ -0,0 +1,73 @@
+import {connect} from '../../store/index'
+import {toast, hasKey} from '../../utils'
+
+const computedBehavior = require('miniprogram-computed').behavior
+
+const mapState = state => ({
+  addressQuery: state.addressQuery,
+  addressInfo: state.addressInfo,
+  addressSubmitCallback: state.addressSubmitCallback
+})
+
+
+Component(
+  connect(mapState)({
+    behaviors: [computedBehavior],
+    data: {
+      title: '',
+      isEntry: false // 是否为入口（选择收获地址｜选择自提地址）
+    },
+    computed: {
+      isAddressQueryReady(data) {
+        return Object.keys(data.addressQuery).length > 0
+      },
+      isAddressInfoReady(data) {
+        const { addressInfo } = data
+        if(addressInfo.express_type === 2) {
+          return hasKey(addressInfo.pickerUserInfo) && hasKey(addressInfo.picksiteInfo)
+        }
+        return hasKey(addressInfo.addressInfo) 
+      }
+    },
+    observers: {},
+    lifetimes: {
+      attached() {},
+      detached() {}
+    },
+    methods: {
+      goBackTo() {
+        if (this.data.isEntry) {
+          this.store.dispatch({type: 'set_my_lottery_content', payload: 'reward_list'})
+        } else {
+          this.selectComponent('#collection-address').changeMain()
+        }
+      },
+      onGetAddressInfo({detail: info}) {
+        this.store.dispatch({type: 'set_address_info', payload: info})
+      },
+      onTitleChange({detail: title}) {
+        this.setData({title})
+      },
+      onStateChange({detail: isEntry}) {
+        this.setData({isEntry})
+      },
+      validateSubmitInfo() {
+        const info = this.data.addressInfo
+        if (info.express_type === 1 && !hasKey(info.addressInfo)) {
+          toast('请先添加收货地址')
+          return false
+        }
+        if (info.express_type === 2 && !(hasKey(info.pickerUserInfo) && hasKey(info.picksiteInfo))) {
+          toast('请完善提货信息')
+          return false
+        }
+        return true
+      },
+      onSubmit() {
+        if (!this.validateSubmitInfo()) return
+        if (!this.data.addressSubmitCallback) return
+        this.data.addressSubmitCallback()
+      }
+    }
+  })
+)

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

@@ -0,0 +1,7 @@
+{
+  "component": true,
+  "usingComponents": {
+    "van-button": "@vant/weapp/button/index",
+    "collection-address": "../../../CollectionAddress/index"
+  }
+}

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

@@ -0,0 +1,39 @@
+.address-collection {
+  position: relative;
+  .go-back-icon {
+    position: absolute;
+    top: 36rpx;
+    left: 24rpx;
+    width: 18rpx;
+    height: 28rpx;
+  }
+  .title-box {
+    display: flex;
+    justify-content: center;
+    width: 100%;
+    background: #fff;
+    .title {
+      height: 100rpx;
+      display: flex;
+      align-items: center;
+      color: #333;
+      font-size: 32rpx;
+      font-weight: 500;
+    }
+  }
+  .submit-btn-box {
+    position: fixed;
+    margin: auto;
+    left: 0;
+    right: 0;
+    background: #fff;
+    bottom: 0;
+    box-sizing: border-box;
+    padding: 16rpx 28rpx 72rpx 28rpx;
+    .submit-btn {
+      background: #1472FF;
+      width: 100%;
+      height: 80rpx;
+    }
+  }
+}

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

@@ -0,0 +1,16 @@
+<view wx:if="{{isAddressQueryReady}}" class="address-collection">
+  <image class="go-back-icon" src="../../../common/assets/images/lottery/icon_back_black.png" bind:tap="goBackTo" />
+  <view class="title-box">
+    <view class="title">{{title}}</view>
+  </view>
+  <collection-address
+    id="collection-address"
+    baseInfoQuery="{{addressQuery}}"
+    bind:outData="onGetAddressInfo"
+    bind:changeTitle="onTitleChange"
+    bind:changeState="onStateChange"
+  ></collection-address>
+  <view wx:if="{{isEntry}}" class="submit-btn-box">
+    <van-button custom-class="submit-btn" round type="info" disabled="{{!isAddressInfoReady}}" bind:click="onSubmit">提交</van-button>
+  </view>
+</view>

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

@@ -0,0 +1,39 @@
+.address-collection {
+  position: relative;
+}
+.address-collection .go-back-icon {
+  position: absolute;
+  top: 36rpx;
+  left: 24rpx;
+  width: 18rpx;
+  height: 28rpx;
+}
+.address-collection .title-box {
+  display: flex;
+  justify-content: center;
+  width: 100%;
+  background: #fff;
+}
+.address-collection .title-box .title {
+  height: 100rpx;
+  display: flex;
+  align-items: center;
+  color: #333;
+  font-size: 32rpx;
+  font-weight: 500;
+}
+.address-collection .submit-btn-box {
+  position: fixed;
+  margin: auto;
+  left: 0;
+  right: 0;
+  background: #fff;
+  bottom: 0;
+  box-sizing: border-box;
+  padding: 16rpx 28rpx 72rpx 28rpx;
+}
+.address-collection .submit-btn-box .submit-btn {
+  background: #1472FF;
+  width: 100%;
+  height: 80rpx;
+}

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

@@ -0,0 +1,57 @@
+import remotePic from '../../remotePic'
+
+const computedBehavior = require('miniprogram-computed').behavior
+
+const POPUP_TYPE = {
+  BASIC: 'basic',
+  ORANGE: 'orange',
+  RED: 'red',
+  WHITE: 'white'
+}
+Component({
+  options: {},
+  behaviors: [computedBehavior],
+  properties: {
+    visible: {
+      type: Boolean,
+      value: false
+    },
+    type: {
+      type: String,
+      value: POPUP_TYPE.BASIC
+    },
+    customCls: {
+      type: String,
+      value: ''
+    },
+    isOverlayTransparent: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data: {
+    remotePic
+  },
+  computed: {
+    isBasicType(data) {
+      return data.type === POPUP_TYPE.BASIC
+    },
+    isOrangeType(data) {
+      return data.type === POPUP_TYPE.ORANGE
+    },
+    isRedType(data) {
+      return data.type === POPUP_TYPE.RED
+    },
+    isWhiteType(data) {
+      return data.type === POPUP_TYPE.WHITE
+    }
+  },
+  methods: {
+    showPopup() {
+      this.triggerEvent('visibleChange', true)
+    },
+    closePopup() {
+      this.triggerEvent('visibleChange', false)
+    }
+  }
+})

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

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

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

@@ -0,0 +1,66 @@
+.common-popup {
+  .close-icon {
+    position: absolute;
+    right: 24rpx;
+    z-index: 1;
+    box-sizing: border-box;
+    padding: 10rpx;
+    width: 52rpx;
+    height: 52rpx;
+  }
+  .bg {
+    position: absolute;
+    box-sizing: border-box;
+    width: 100%;
+    height: 100%;
+  }
+  &.red {
+    // 红色背景的抽奖弹窗顶部超出一部分，高度特殊计算
+    overflow: hidden;
+    height: calc(100% - 320rpx);
+    background: transparent !important;
+    .close-icon {
+      top: 136rpx;
+    }
+    .bg {
+      top: 0;
+      left: 0;
+    }
+    // 底部背景拼接，防止屏幕过大时背景展示不全
+    .bottom-bg {
+      position: absolute;
+      bottom: 0;
+      left: 0;
+      width: 100%;
+      height: 160rpx;
+      background: linear-gradient(to right, #FE8758, #FE9656);
+    }
+  }
+  &.orange {
+    height: calc(100% - 422rpx);
+    background: transparent !important;
+    .close-icon {
+      top: 24rpx;
+    }
+    .bg {
+      bottom: 0;
+      left: 0;
+    }
+  }
+  &.white {
+    height: calc(100% - 422rpx);
+    background: #fff;
+    .close-icon {
+      top: 24rpx;
+    }
+    .bg {
+      top: 0;
+      height: 240rpx;
+    }
+  }
+  // custom-classes
+  &.address-collection-popup {
+    height: calc(100% - 422rpx);
+    background: #f5f5f5;
+  }
+}

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

@@ -0,0 +1,23 @@
+<van-popup
+  custom-class="common-popup {{type}} {{customCls}}"
+  overlay-style="{{isOverlayTransparent ? 'background-color: transparent !important;' : ''}}"
+  show="{{visible}}"
+  position="bottom"
+  bind:close="closePopup"
+  closeable="{{isBasicType}}"
+>
+  <block wx:if="{{isRedType}}">
+    <div class="bottom-bg"></div>
+    <image class="close-icon" src="../../../common/assets/images/lottery/close-f-new.png" bind:tap="closePopup" />
+    <image class="bg" mode="widthFix" src="{{remotePic.draw_background_new}}" />
+  </block>
+  <block wx:elif="{{isOrangeType}}">
+    <image class="close-icon" src="{{remotePic.white_close}}" bind:tap="closePopup" />
+    <image class="bg" src="{{remotePic.rewards_full_bg}}" />
+  </block>
+  <block wx:elif="{{isWhiteType}}">
+    <image class="close-icon" src="{{remotePic.white_close}}" bind:tap="closePopup" />
+    <image class="bg" src="{{remotePic.no_winner_bg_top}}" />
+  </block>
+  <slot></slot>
+</van-popup>

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

@@ -0,0 +1,61 @@
+.common-popup .close-icon {
+  position: absolute;
+  right: 24rpx;
+  z-index: 1;
+  box-sizing: border-box;
+  padding: 10rpx;
+  width: 52rpx;
+  height: 52rpx;
+}
+.common-popup .bg {
+  position: absolute;
+  box-sizing: border-box;
+  width: 100%;
+  height: 100%;
+}
+.common-popup.red {
+  overflow: hidden;
+  height: calc(100% - 320rpx);
+  background: transparent !important;
+}
+.common-popup.red .close-icon {
+  top: 136rpx;
+}
+.common-popup.red .bg {
+  top: 0;
+  left: 0;
+}
+.common-popup.red .bottom-bg {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: 160rpx;
+  background: linear-gradient(to right, #FE8758, #FE9656);
+}
+.common-popup.orange {
+  height: calc(100% - 422rpx);
+  background: transparent !important;
+}
+.common-popup.orange .close-icon {
+  top: 24rpx;
+}
+.common-popup.orange .bg {
+  bottom: 0;
+  left: 0;
+}
+.common-popup.white {
+  height: calc(100% - 422rpx);
+  background: #fff;
+}
+.common-popup.white .close-icon {
+  top: 24rpx;
+}
+.common-popup.white .bg {
+  top: 0;
+  height: 240rpx;
+}
+.common-popup.address-collection-popup {
+  height: calc(100% - 422rpx);
+  background: #f5f5f5;
+}

package/miniprogram_dist/Lottery/components/JoinRecords/RecordItem/index.js

@@ -0,0 +1,34 @@
+import {connect} from '../../../store/index'
+
+const computedBehavior = require('miniprogram-computed').behavior
+
+// const mapState = state => ({})
+Component(
+  connect()({
+    behaviors: [computedBehavior],
+    properties: {
+      record: {
+        type: Object,
+        value: {}
+      }
+    },
+    data: {},
+    computed: {},
+    methods: {
+      switchToWinners() {
+        this.store.dispatch({
+          type: 'set_current_prize_id',
+          payload: this.data.record.prize_id
+        })
+        this.store.dispatch({
+          type: 'set_winners_back_to',
+          payload: 'join_records'
+        })
+        this.store.dispatch({
+          type: 'set_my_lottery_content',
+          payload: 'winners'
+        })
+      }
+    }
+  })
+)

package/miniprogram_dist/Lottery/components/JoinRecords/RecordItem/index.json

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

package/miniprogram_dist/Lottery/components/JoinRecords/RecordItem/index.less

@@ -0,0 +1,36 @@
+.record-item {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  box-sizing: border-box;
+  margin-bottom: 24rpx;
+  padding: 16rpx 24rpx;
+  border-radius: 16rpx;
+  background: #fff;
+  height: 160rpx;
+  .name {
+    color: #333;
+    font-weight: 500;
+    font-size: 28rpx;
+  }
+  .result {
+    color: #666;
+    font-size: 28rpx;
+  }
+  .winning-time {
+    color: #666;
+    font-size: 20rpx;
+  }
+  .winners-btn {
+    position: absolute;
+    right: 24rpx;
+    bottom: 16rpx;
+    font-weight: 500;
+    border: 2rpx solid #1472FF !important;
+    color: #1472FF !important;
+    width: 168rpx;
+    height: 64rpx;
+    font-size: 28rpx;
+  }
+}

package/miniprogram_dist/Lottery/components/JoinRecords/RecordItem/index.wxml

@@ -0,0 +1,8 @@
+<view class="record-item">
+  <view class="name">{{record.prize_name}}</view>
+  <view class="result">抽奖结果：{{record.is_win ? '已中奖' : '未中奖'}}</view>
+  <view class="winning-time">中奖时间：{{record.end_at}}</view>
+  <van-button custom-class="winners-btn" plain type="info" round size="small" bind:tap="switchToWinners">
+    中奖名单
+  </van-button>
+</view>

package/miniprogram_dist/Lottery/components/JoinRecords/RecordItem/index.wxss

@@ -0,0 +1,36 @@
+.record-item {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  box-sizing: border-box;
+  margin-bottom: 24rpx;
+  padding: 16rpx 24rpx;
+  border-radius: 16rpx;
+  background: #fff;
+  height: 160rpx;
+}
+.record-item .name {
+  color: #333;
+  font-weight: 500;
+  font-size: 28rpx;
+}
+.record-item .result {
+  color: #666;
+  font-size: 28rpx;
+}
+.record-item .winning-time {
+  color: #666;
+  font-size: 20rpx;
+}
+.record-item .winners-btn {
+  position: absolute;
+  right: 24rpx;
+  bottom: 16rpx;
+  font-weight: 500;
+  border: 2rpx solid #1472FF !important;
+  color: #1472FF !important;
+  width: 168rpx;
+  height: 64rpx;
+  font-size: 28rpx;
+}

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

@@ -0,0 +1,59 @@
+import remotePic from '../../remotePic'
+import {connect} from '../../store/index'
+import {fetchPrizeRecords} 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
+})
+Component(
+  connect(mapState)({
+    options: {},
+    behaviors: [computedBehavior],
+    properties: {},
+    data: {
+      remotePic,
+      records: []
+    },
+    computed: {},
+    lifetimes: {
+      attached() {}
+    },
+    observers: {
+      myLotteryVisible(val) {
+        if (val && this.data.myLotteryContent === MY_LOTTERY_CONTENT_TYPE.JOIN_RECORDS) {
+          this.fetchJoinRecords()
+        }
+      }
+    },
+    methods: {
+      switchToRewardList() {
+        this.store.dispatch({
+          type: 'set_my_lottery_content',
+          payload: 'reward_list'
+        })
+      },
+      fetchJoinRecords() {
+        const params = {
+          alive_id: this.data.baseInfo.alive_id
+        }
+        fetchPrizeRecords(params)
+          .then(({data}) => {
+            if (data.code === 0) {
+              // attention：这里接口返回的data.data有时候是object，有时候是array，需要先统一转成数组
+              const recordsObj = data.data
+              const records = Object.keys(recordsObj).map(key => recordsObj[key])
+              this.setData({records})
+            }
+          })
+          .catch(err => {
+            console.error(err)
+          })
+      }
+    }
+  })
+)

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

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

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

@@ -0,0 +1,40 @@
+.join-records {
+  position: relative;
+  height: 100%;
+  overflow: hidden;
+  .go-back-icon {
+    position: absolute;
+    top: 30rpx;
+    left: 20rpx;
+    width: 36rpx;
+    height: 36rpx;
+  }
+  .title-box {
+    display: flex;
+    justify-content: center;
+    padding-bottom: 16rpx;
+    .title {
+      width: 236rpx;
+      height: 96rpx;
+    }
+  }
+  .record-list {
+    padding: 32rpx 32rpx 0 32rpx;
+  }
+  .record-empty {
+    display: flex;
+    align-items: center;
+    flex-direction: column;
+    justify-content: center;
+    height: calc(100% - 120rpx);
+    .empty-icon {
+      width: 200rpx;
+      height: 200rpx;
+    }
+    .desc {
+      padding-top: 40rpx;
+      color: #ffbd67;
+      font-size: 28rpx;
+    }
+  }
+}