<template>
  <view class="p10lr p20tb">
    <view 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">一等奖</view>
      </view>
      <view class="df ai-c jcsb p20tb p10lr">
        <view class="item-label">
          <view>活动名称：幸运刮刮乐开心赢大奖</view>
          <view>参与时间：2024-01-01 08:00</view>
          <view>有效期至：2024-03-01 08:00</view>
        </view>
        <view class="ml20" style="width: 120rpx;">
          <img v-if="index%2==0" src="/static/image/mine/writeoff.png" style="width: 120rpx;height: 120rpx;" />
          <view v-else class="btn" @tap="handleWriteoff(item)">核销</view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        list: []
      }
    },
    onShow() {
      this.handleSearch()
    },
    methods: {
      handleSearch() {
        this.list = [1,2,3,4,5]
      },
      handleWriteoff(item) {
        uni.navigateTo({
          url: `/pages/me/qrCode?item=${item}`
        })
      }
    }
  }
</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>
