jwl-applet/src/pages/me/myGift.vue

<template>
  <view class="p10lr p20tb">
    <u-list @scrolltolower="loadmore">
      <u-list-item v-for="(item, index) in list" :key="index" class="item">
        <view class="relative">
          <img src="/static/image/mine/giftitem.png" style="width: 100%;" mode="widthFix" alt="" />
          <view class="ab_full df ai-c jcc">{{item.awards}}</view>
        </view>
        <view class="df ai-c jcsb p20tb p10lr">
          <view class="item-label">
            <view>活动名称：{{ item.activityName }}</view>
            <view>参与时间：{{ item.createTime }}</view>
            <view>有效期至：{{ item.endTime }}</view>
          </view>
          <view class="ml20" style="width: 120rpx;">
            <view v-if="item.status == 0" class="btn" @tap="handleHelp(item)">助力</view>
			 <view v-else-if="item.status == 1" class="btn" @tap="handleWriteoff(item)">核销</view>
			 <img v-else-if="item.status == 2" src="/static/image/mine/writeoff.png" style="width: 120rpx;height: 120rpx;" />
			 <img v-else src="/static/image/mine/outtime.png" style="width: 120rpx;height: 120rpx;" />
          </view>
        </view>
      </u-list-item>
    </u-list>
  </view>
</template>

<script>
  import useUserStore from '@/jtools/store/user'
  import { getLuckyRecord } from '@/jtools/api/activity'
  export default {
    data() {
      return {
        pageNum: 1,
        list: []
      }
    },
    onShow() {
      this.pageNum = 1
      this.list = []
      this.handleSearch()
    },
    methods: {
      handleSearch() {
        getLuckyRecord({
          phone: useUserStore().userInfo.phone,
          pageSize: 10,
          pageNum: this.pageNum
        }).then(resp => {
          if(resp.code == 200) {
            if(resp.rows && resp.rows.length) {
              this.list = [...this.list, ...resp.rows]
            } else {
              this.pageNum = this.pageNum > 1 ? this.pageNum-1 : 1
            }
          }
        })
      },
      loadmore() {
        this.handleSearch(this.pageNum++)
      },
      handleWriteoff(item) {
        uni.navigateTo({
          url: `/pages/me/qrCode?id=${item.id}`
        })
      },
	  handleHelp(item){
		  uni.navigateTo({
		    url: `/pages/me/help?id=${item.id}`
		  })
	  }
    }
  }
</script>

<style lang="scss" scoped>
.item {
  margin-bottom: 30rpx;
  border-radius: 36rpx;
  background-color: #fff;
  .item-label {
    font-size: 28rpx;
    color: #666;
    line-height: 48rpx;
  }
  .btn {
    width: 120rpx;
    height: 68rpx;
    text-align: center;
    line-height: 68rpx;
    border-radius: 34rpx;
    background-color: #BE1200;
    color: #fff;
    font-size: 28rpx;
  }
}
</style>