<template>
  <div>
    <div class="mainStyle" ref="followShop"
    @click="styleClick('click', 'followShop')"
    @mousemove="styleClick('mousemove', 'followShop')"
    @mouseout="styleClick('mouseout')">
      <div alt="" :style="styleData.drawEggDiv"></div>
      <div class="f-tac" style="margin-top: .4rem">
        <div class="f-ib" :style="styleData.partakeStyle">
          <span v-if="isShow && isWebClick">立即参与</span>
          <span v-if="isShow && !isWebClick" v-lz-click = "'1'" @click="boom">立即参与</span>
          <i class="light animated infinite"></i>
        </div>
      </div>
      <div :style="styleData.drawInfo">
        已有
        <span :style="styleData.drawInfoSpan">{{ winPrize }}</span> 人参与活动
      </div>
    </div>
  </div>
</template>
<script>
import dateUtil from "../../../util/dateUtil.js";
import apis1 from "../../../util/apis1.js";
let { followShopTask,followShopAdd } = apis1;
import store from "../../../store/store";
import { goToShopPage } from "../../../util/tools.js";
import {
  PrizeResultPopComService,
  FollowShopnotWinPrizePopComService,
  FollowShopFirstPopComService,
  eggPopComService,
} from "../../../util/comCreate.js";
export default {
  props: ["isTemplate", "datas", "keyData", "styleData", "templateData", "isWebClick", "modifyContent"],
  components: {},
  data() {
    return {
      winPrize: "0",
      followStatus: "0", //是否参与过
      newUser: "1", //是否需要新用户
      eggBg: "", // 金蛋图片
      isShow: "", // 按钮文字是一张图片 false,否则true
      shopName: "",
       styleDataOld:{},
       isCustomSwitching:"", //有tab切换时
    };
  },

  mounted() {
    this.eggBg = this.datas.eggBg;
    this.isShow = this.datas.isShow;
    this.initData();
    //深拷贝重置需要
    this.styleDataOld = JSON.parse(JSON.stringify(this.styleData));
  },

  methods: {
     //点击可修改位置的方法
    styleClick(type, refName) {
      if (this.isWebClick) {
        //传值给B端
        let byValue = {
          modifyContent: this.modifyContent,
          refName: refName,
          styleData: this.styleData,
          isCustomSwitching: this.isCustomSwitching, //有tab切换时
          c_this: this,
          styleDataOld: this.styleDataOld,
        };
        this.$emit("opertaionCom", type, byValue);
      }
    },
    async initData() {
      if (this.isTemplate) {
        var datasAll = this.templateData;
        if (datasAll) {
        }
      } else {
        // 获取关注店铺主接口
        followShopTask((initdatas) => {
          console.log(initdatas + "initdatas");
          this.winPrize = initdatas.data.followCount;
          this.shopName = initdatas.data.shopName;
          this.followStatus = initdatas.data.status;
          this.newUser = initdatas.data.followShopStatus;
          const self = this;
          let actStatus = sessionStorage.getItem("actStatus");
          if (actStatus == 2) {
            return;
          }
          if (actStatus == 1) {
            return;
          }
        });
      }
    },
    boom() {
      if (this.isTemplate) {
        this.$toast("活动预览，仅供查看");
        return;
      }
      const self = this;
      let actStatus = sessionStorage.getItem("actStatus");
      if (actStatus == 2) {
        this.$toast("活动已结束");
        return;
      }
      if (actStatus == 1) {
        this.$toast("活动未开始");
        return;
      }
      if (this.newUser != 0) {
        if (this.followStatus == "0") {
         
          FollowShopFirstPopComService.create(this.shopName,0, (submit) => {
            FollowShopFirstPopComService.close();
            if (submit == 1) {
               followShopAdd((initdatas) => {});
              eggPopComService.create(this.shopName, (submit) => {
                eggPopComService.close();
              });
            }
          });
        } else {
          FollowShopnotWinPrizePopComService.create(
            "亲，您已参加过活动。",
            "https://img10.360buyimg.com/imgzone/jfs/t18640/237/360861051/18605/7bbde14/5a7126a4Nfb005ae2.png",
            (submit) => {
              FollowShopnotWinPrizePopComService.close();
            }
          );
        }
      } else {
          if (this.followStatus == "0") {
            this.$toast("此活动针对新粉丝，您是老客户不满足条件");
            }else {
          FollowShopnotWinPrizePopComService.create(
            "亲，您已参加过活动。",
            "https://img10.360buyimg.com/imgzone/jfs/t18640/237/360861051/18605/7bbde14/5a7126a4Nfb005ae2.png",
            (submit) => {
              FollowShopnotWinPrizePopComService.close();
            }
          );
        }
         
        return;
      }
    },
  },
};
</script>
<style lang="scss" scoped>
.mainStyle {
  position:absolute;
  top: 2.8rem;
  left: calc(50% - 5.05rem / 2);
}
.f-tac {
  text-align: center;
}

.f-ib {
  display: inline-block;
  vertical-align: middle;
}
</style>