<template>
  <div
    class="van-popup van-popup--bottom"
    style="
      background: rgba(0, 0, 0, 0.7);
      z-index: 2008;
      height: 100vh;
      display: -webkit-box;
      -webkit-box-pack: center;
      -webkit-box-align: center;
    "
    v-if="show"
  >
    <div class="can-draw-content">
      <img
        src="https://img10.360buyimg.com/imgzone/jfs/t1/133162/26/4023/4048/5f056c0aEe40d8033/9665b5ce3cfc9918.png"
        alt=""
        style="
          width: 2.22rem;
          height: 0.55rem;
          display: block;
          margin: 0px auto 0.5rem;
        "
      />
      <img
        src="https://img10.360buyimg.com/imgzone/jfs/t1/146082/38/2420/26502/5f056ce6Eb73672c4/c10b0b05cb56a359.png"
        alt=""
        class="animate__animated animate__infinite animate__tada"
        style="
          width: 3.56rem;
          height: 3.87rem;
          display: block;
          margin: 0px auto;
          position: relative;
          z-index: 2;
        "
      />
      <img
        src="https://img10.360buyimg.com/imgzone/jfs/t1/143756/35/2468/26862/5f056e4fEab53aa0f/0dc05925698a45f9.png"
        alt=""
        class="light"
      />
      <img
        src="https://img10.360buyimg.com/imgzone/jfs/t1/143013/25/2403/7875/5f057d69Eb8700c8b/9a54183ebdb56fbb.png"
        alt=""
        style="
          width: 4rem;
          height: 1rem;
          display: block;
          margin: -0.3rem auto 0px;
          position: relative;
          z-index: 2;
        "
        @click="getPrizes()"
        v-lz-click="'16'"
      />
    </div>
  </div>
</template>
<script>
import { levelDialogService,prizeDialogService,getPrizeDialogService } from "../../../util/comCreate.js";
import apis1 from "../../../util/apis1.js";
let { drawPrize, startDraw, pinshousuRequest,pinshousuTaskRequest,drawRequest } = apis1;
export default {
  name: "prizeDialog",
  data() {
    return {
      grade: 0,
      img_path:
        "https://img10.360buyimg.com/imgzone/jfs/t1/125587/19/7077/16212/5f0bc7ebEaa698c41/f3ad84ac3db3a901.png",
      commodityList: [], //商品信息
      isShow: false, //是否显示一键加购
      mainDatas1: [],
      voma:{},
      acRulePopComData: {
        styleData: {},
        datas: {},
        keyData: {},
      },
    };
  },
  created() {
    this.initData();
  },
  methods: {
   initData() {
    drawRequest(this.canDrawFlag,this.differenceTime,this.challengeTime,data => {
      this.voma =  data.data
      })
    },
    close(){
      document.querySelector("body").removeAttribute("style");
      this.submit();
    },
    getPrizes() {
      getPrizeDialogService.create(
          this.voma,// 结果
          this.canDrawFlag,
          this.isTemplate,
          (prizeRecordDetilClick) => {
            getPrizeDialogService.close();
            this.close();
          });
    },
  },
};
</script>
<style scoped>
.van-popup {
  position: fixed;
  max-height: 100%;
  overflow-y: auto;
  background-color: rgb(211, 31, 70);
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
  -webkit-overflow-scrolling: touch;
}
.van-popup--bottom {
  bottom: 0;
  left: 0;
  width: 100%;
}
.can-draw-content {
    width: 5.92rem;
    height: 6.56rem;
    position: relative;
}
.light {
    width: 4.53rem;
    height: 5.1rem;
    /* -webkit-animation: rotate360 10s infinite linear; */
    position: absolute;
    left: 50%;
    margin-left: -39%;
    top: .1rem;
}
.animate__animated.animate__infinite {
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
.animate__tada {
    -webkit-animation-name: tada;
    animation-name: tada;
}
.animate__animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-duration: var(--animate-duration);
    animation-duration: var(--animate-duration);
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}
.close-btn {
  width: 0.45rem;
  height: 0.45rem;
  position: absolute;
  right: 1rem;
  top: 3.2rem;
}
</style>
