<template>
  <div class="addressMaskDiv" v-if="show">
    <basicPop :pop="pop" :title='pop.title' @closeClick="closeClick">
      <div class="inputAllDiv">
        <div class="listDivAll">
          <div class="itemDivAll" v-for="(item, index) in prizeList" :key="index">
            <div class="imageDiv">
                <!-- 0 不展示 1展示 -->
              <img v-if="item.showDrawType == 0" class="imgClass" src="//img10.360buyimg.com/imgzone/jfs/t1/187007/16/25038/16621/628b4201E7144769a/fe46a08f8a6464f9.png" />
              <img v-else  class="imgClass" :src="item.prizeUrl" />

              <div class="statusImgDiv" v-if="item.lestNumber > 0">
                <img class="statusImgClass" src="//img10.360buyimg.com/imgzone/jfs/t1/27063/8/16708/5073/628b0378Ea43f50a2/1c761eb2954b69a0.png" />
              </div>
              <div class="statusImgDiv1" v-else>
                <img class="statusImgClass" src="//img10.360buyimg.com/imgzone/jfs/t1/116819/5/26595/3096/628b03c9Eeba5cece/7e54baacafade5bb.png" />
              </div>
            </div>
            <!-- 签到类型  0 每日  1 累计  2 连续 3 七日签到-->

            <div class="dayDiv" v-if="item.signType == 0">每日签到</div>
            <div class="dayDiv" v-if="item.signType == 1">累计签到{{item.signNumber}}天</div>
            <div class="dayDiv" v-if="item.signType == 2">连续签到{{item.signNumber}}天</div>
            <div class="dayDiv" v-if="item.signType == 3">签到{{item.signNumber}}天</div>

          </div>
          <!-- <div class="prizePromptDiv"><span>本次活动的部分奖品已被领光，您可以继续签到领取其他奖品哦～ （所有奖品数量有限，先到先得）</span></div> -->
          <div class="prizePromptDiv"><span>签到成功后有机会获得奖品，也有可能会与奖品擦肩而过，奖品数量有限，以实际中奖为准；期待您在活动中收获满满～</span></div>
          <div class="checkBoxDiv">
            <van-checkbox v-model="isAgreement">我已阅读并知晓</van-checkbox>
          </div>
          <div class="btnDiv">
            <div class="leftDiv" @click="goToShop"><span>进店逛逛</span></div>
            <div class="rightDiv" @click="closePop"><span>知道了，继续签到</span></div>
          </div>
        </div>
      </div>
    </basicPop>
  </div>
</template>

<script>
import api1 from '../../../util/apis1.js'
let {storeGoodsPoint} = api1
import basicPop from './hdzxtNoCloseBasicPop.vue';
import Vue from 'vue';
import { goToShopPage } from '../../../util/tools.js';
import { Checkbox } from 'vant';

Vue.use(Checkbox);
export default {
  props: [],
  components: {
    basicPop
  },
  data() {
    return {
      prizeList: [],
      isAgreement:false,
      pop: {
        title: '奖品剩余活动提示',
        titlepop: ''
      }
    };
  },

  created() {
    // console.log(this.styleData, 'shenm');
    this.pop.titlepop = this.styleData ? this.styleData.titlepop : {"backgroundImage":"url(//img10.360buyimg.com/imgzone/jfs/t1/141588/29/18217/44025/5fd571b9Ef55329ec/42dba91b188b9dce.png)"};
    this.pop.leftLineDiv = this.styleData.leftLineDiv;
    this.pop.rightLineDiv = this.styleData.rightLineDiv;
    this.pop.background = { background: '#ffffff' };
    this.prizeList = this.prizeData;
    // console.log(this.pop,'assssssssssss')
  },

  methods: {
    goToShop() {
      storeGoodsPoint(4)
      goToShopPage(sessionStorage.getItem('shopId'));
    },
    closePop(){
      console.log(this.isAgreement,'isAgreement');
      if(!this.isAgreement){
        this.$toast('请确认已阅读并知晓')
        return;
      }
      this.submit();
      this.publicData.$emit('cloasAddressPop');
    },
    closeClick() {
      console.log('1111111111111111');
      this.submit();
      this.publicData.$emit('cloasAddressPop');
    }
  }
};
</script>

<style lang="scss" scoped="scoped">
.addressMaskDiv {
  .inputAllDiv {
    padding: 0.48rem 0.26rem 0 0.26rem;
    position: relative;
    z-index: 300;
    background: #ffffff;
    .listDivAll {
      margin: 0;
      box-sizing: border-box;
      display: flex;
      flex-wrap: wrap;
      .itemDivAll {
        width: calc(100% / 5);
        position: relative;
        display: flex;
        justify-content: center;
        flex-direction: column;
        padding-bottom: 0.54rem;
        .imageDiv {
          width: 1rem;
          height: 1rem;
          background: linear-gradient(to bottom, #ffe888, #fdbc3c);
          position: relative;
          border-radius: 0.16rem;
          .imgClass {
            width: 1rem;
            height: 1rem;
            border-radius: 0.16rem;
          }
          .statusImgDiv {
            .statusImgClass {
              position: absolute;
              left: 0;
              top: 0;
              width: 0.6rem;
              height: 0.6rem;
            }
          }
          .statusImgDiv1 {
            .statusImgClass {
              position: absolute;
              right: -0.13rem;
              top: -0.1rem;
              width: 0.56rem;
              height: 0.26rem;
            }
          }
        }
        .dayDiv {
          font-size: 0.22rem;
          color: #343434;
          margin-top: 0.2rem;
        }
      }
      .prizePromptDiv {
        font-size: 0.2rem;
        color: #999999;
      }
      .btnDiv {
        display: flex;
        flex-direction: row;
        font-size: 0.34rem;
        color: #ffffff;
        margin-top: 1.16rem;
        padding-bottom: 0.3rem;
        .leftDiv {
          background: linear-gradient(to right, #ff9900, #ff9900);
          width: 3.34rem;
          padding: 0.28rem 0;
          border-radius: 0.16rem;
          text-align: center;
        }
        .rightDiv {
          background: linear-gradient(to right, #f2270c, #ff6420);
          width: 3.34rem;
          padding: 0.28rem 0;
          margin-left: 0.24rem;
          border-radius: 0.16rem;
          text-align: center;
        }
      }
    }
  }
  .checkBoxDiv{
    font-size: 0.18rem;
    margin-top: 0.08rem;
     .van-icon{
      width: 1rem !important;
      height: 1rem !important;
    }
  }
}
</style>
