<template>
  <div>
    <!-- <transformationSign></transformationSign> -->
    <div class="wishGetPrizeInfoStyle">
       <div class="Noprize">请及时领取奖品，逾期视为自动放弃</div>
      <ul>
        <li v-for="(item, index) in getPrizeInfoList" :key="index"> 
          <div class="xuyuanImg"></div>
          <div style="fontSize:.2rem">编号：{{ item.cardId }}</div>
          <div v-if='item.receive' class="button"
            v-lz-click="'16'"
            @click="
              lingqu(
                item.prizeId,
                item.prizeType,
                item.position,
                item.prizeName,
                item.showImg,
                item.cardId,
                index
              )
            "
          >
          已领取
          </div>
          <div v-else  class="button1"
          v-lz-click="'16'"
           @click="
              lingqu(
                item.prizeId,
                item.prizeType,
                item.position,
                item.prizeName,
                item.showImg,
                item.cardId,
                index
              )
            ">立即领取</div>
        </li>
      </ul>
    </div>
  </div>
</template>

<script>

import apis1 from "../../../util/apis1.js";
import { Toast } from "vant";
let {getPrizeInfo, immediatelyDraw1, wishGetPrize } = apis1;
import { virtualWinningService ,wishRealWinnersService} from "../../../util/comCreate.js";
export default {
  props: ["styleData"],
  components: {
    // transformationSign
  },
  data() {
    return {
      getPrizeInfoList: [],
    };
  },
  // 父beforeCreated ->父created ->父beforeMounted ->子beforeCreated ->子created ->子beforeMounted ->子mounted -> 父mounted
  mounted() {
   this.initDatas()
  },
  methods: {
       initDatas(){
       getPrizeInfo((data) => {
        this.getPrizeInfoList = data.data;
      });
    },
    //按钮点击
    lingqu(prizeId, prizeType, position, prizeName, showImg, cardId, index) {
        // debugger
      if (this.getPrizeInfoList[index].receive == 1) {
        Toast("您已经领取过");
        return;
      } else {
          if(prizeType == 3){
            //实物中奖
              
// debugger
               immediatelyDraw1(prizeId, (data) => {
                 this.wishaddressId =   data.data.addressId;
                 this.wishid = data.data.id;
                  wishGetPrize(cardId, (data) => {
                       wishRealWinnersService.create(
                  position,
                  prizeName,
                  showImg,
                  cardId,
                  this.wishaddressId,
                   this.wishid,
                  (submit) => {
                    console.log(submit, "sub1111miq111q请 aa111atq");
                    this.initDatas()
                    wishRealWinnersService.close();
                  }
                );
                  })
                  
            })
          }else{
            immediatelyDraw1(prizeId, (data) => {
              wishGetPrize(cardId, (data) => {
                // this.getPrizeInfoList[index].receive = 1;
                virtualWinningService.create(
                  position,
                  prizeName,
                  showImg,
                  cardId,
                  (submit) => {
                      this.initDatas()
                    virtualWinningService.close();
                  }
                );
              });
            })
          }
      }
    },
  },
};
</script>

<style lang="scss" scoped="scoped">
.wishGetPrizeInfoStyle {
  width: 7.45rem;
  height: 5.77rem;
  background-image: url(//img10.360buyimg.com/imgzone/jfs/t1/158872/10/19077/24888/6076488aE720d9914/574652d0c4c8fe6c.png);
  background-size: 100%;
  display: flex;
  justify-content: center;
  position: relative;

  ul {
    width: 90%;
    height: 3.7rem;
    margin-top: 1.8rem;
    overflow-y: scroll;

    li {
      width: 1.94rem;
      height: 100%;
      // background: chartreuse;
      float: left;
      margin-left: 0.23rem;
      margin-bottom: 0.2rem;
      font-size: 0.24rem;
      position: relative;

      .xuyuanImg {
        width: 1.94rem;
        height: 2.6rem;
        background-image: url(//img10.360buyimg.com/imgzone/jfs/t1/163455/2/18447/56631/60765916E37446d6e/c7ceb1811660bbe9.png);
        background-size: 100%;
      }

      .button {
        width: 1.75rem;
        height: 0.45rem;
        background: #878787;
        color: white;
        display: flex;
        justify-content: center;
        align-items: center;
        position: absolute;
        border-radius: .225rem;
        left: calc(50% - 1.75rem / 2);
        font-size: .24rem;
      }
      .button1 {
         width: 1.75rem;
        height: 0.45rem;
        background: #3a91f7;
        color: white;
        display: flex;
        justify-content: center;
        align-items: center;
        position: absolute;
        border-radius: .225rem;
        left: calc(50% - 1.75rem / 2);
        font-size: .24rem;
      }
    }
  }
}
.Noprize{
  font-size: .24rem;
  width: 100%;
  // height: .5rem;
  // background: red;
  position: absolute;
  top: 1.3rem;
}
</style>