<template>
  <div class="basicMaskDiv" v-if="show">
    <div class="van-popup-coupon van-popup-coupon-center" style="z-index: 2012;">
      <div class="couponBackGround">
        <div style="position: absolute;top: 4.15rem;width: 100%;height: 0.9rem;" @click="couponFollowShop"></div>
        <div @click="closeClick" style="position: absolute;top: 0;right: 0;width: 0.6rem;height: 0.6rem;"></div>
      </div>
    </div>
  </div>
</template>

<script>
import apis1 from "../../../util/apis1.js";
let { couponFollow } = apis1;
export default {
  props: [],
  components: {
  },
  data() {
    return {
      show:true,
    };
  },
  created() {
    document.querySelector("body").setAttribute("style",
        "position:#fixed;top:0;height:100%;overflow:hidden"
      );
  },
  methods: {
    couponFollowShop(){
      couponFollow(data => {
        this.closeClick();
      });
    },
    closeClick() {
      document.querySelector("body").removeAttribute("style");
      this.submit();
    },
  },
};
</script>

<style lang="scss">
.couponBackGround {
  width: 5.26rem;
  height: 5.5rem;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-image: url(https://lzkj-yc.isvjd.com/resources/wxcss/coupon/common/follow_bg.png);
  box-sizing: border-box;
}
.van-popup-coupon {
  position: fixed;
  max-height: 100%;
  overflow-y: auto;
  transition: transform .3s,-webkit-transform .3s;
  background-color: transparent;
}
.van-popup-coupon-center {
  top: 50%;
  left: 50%;
  -webkit-transform: translate3d(-50%,-50%,0);
  transform: translate3d(-50%,-50%,0);
}
.basicMaskDiv{
  position: fixed;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.7);
  top: 0;
  bottom: 0;
  z-index: 200;
}
</style>
