<template>
  <div
    v-if="isShowExpoure && exposureList.length > 0"
    class="exposureDivAll"
    ref="zdyExposure"
    @click="styleClick('click', 'zdyExposure')"
    @mousemove="styleClick('mousemove', 'zdyExposure')"
    @mouseout="styleClick('mouseout')"
  >
    <div :style="styleData.goodTitleStyle" v-if="isShowTitle">
      <img :style="goodTitleStyle.img" :src="titleImg" />
    </div>
    <div :style="styleData.goodTitleStyle" v-if="isShowTitleByWords">
      {{ datas.exposureTitle }}
    </div>
    <div :style="styleData.listStyle">
      <div
        v-for="(item, index) in exposureList"
        :key="index"
        v-lz-click="'9'"
        @click="goToBuy(item.skuId)"
        :style="styleData.listLiStyle"
      >
        <div class="23" :style="styleData.picStyle">
          <img
            alt=""
            :src="item.imagePath ? item.imagePath : item.skuImg"
            :style="styleData.picImageStyle"
          />
        </div>
        <div class="asda" :style="styleData.goodNameTitleStyle">
          {{ item.skuName }}
        </div>
        <div :style="styleData.detailStyle">
          <div :style="styleData.prizeDivStyle">
            <div :style="styleData.prizeStyle">￥{{ item.skuPrice }}</div>
          </div>
          <div :style="styleData.goBuyDivStyle">
            <div
              :style="styleData.goBuyStyle"
              v-lz-click="'9'"
              @click="goToBuy(item.skuId)"
            >
              购买
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { goToSkuPage } from "../../../util/tools.js";
import apis from "../../../util/apis1.js";
let { getGoods } = apis;
import { exposureData } from "../../../js/good.js";
import store from "../../../store/store.js";
export default {
  props: [
    "datas",
    "keyData",
    "styleData",
    "isTemplate",
    "templateData",
    "templateData",
    "isWebClick",
  ],
  data() {
    return {
      goumaiBigbox: "",
      goodbg: "",
      goodulbox: "",
      goodlibox: "",
      goumai: "", //购买按钮图片
      isgoumaiShow: false, //是否显示购买按钮图片形式
      titleImg: "",
      isShowTitle: false, //是否显示title
      isShowTitleByWords: false, //是否显示title文字
      goodTitleStyle: "",
      exposureList: [],
      isShowExpoure: true, //没有曝光商品页面不显示
      titleShow: true,
      styleDataOld: {},
      isCustomSwitching:"",
    };
  },
  created() {
    //深拷贝重置需要
    this.styleDataOld = JSON.parse(JSON.stringify(this.styleData));
    this.isShowTitle = this.datas.isShowTitle;
    this.isShowTitleByWords = this.datas.isShowTitleByWords;
    this.titleImg = this.datas.titleImg;
    this.titleShow = this.datas.titleShow;
    this.initData();
    this.publicData.$on("clickPointsHelpFriend", (isCustomSwitching, refName) =>{
      this.isCustomSwitching = isCustomSwitching;
      if(isCustomSwitching == "2") {
         this.isShowExpoure = false
       }else if(isCustomSwitching == "3") {
         this.isShowExpoure = false
       }else{
         this.isShowExpoure = true
       }
    })
  },

  methods: {
    //点击可修改位置的方法
    styleClick(type, refName) {
      if (this.isWebClick) {
        //传值给B端
        let byValue = {
          modifyContent: this.modifyContent,
          refName: refName,
          styleData: this.styleData,
          styleDataOld: this.styleDataOld,
          c_this: this,
        };
        this.$emit("opertaionCom", type, byValue);
      }
    },
    initData() {
      //展示曝光商品去请求接口
      if (this.isShowExpoure) {
        exposureData(this, {}, () => {});
      }
    },
    goToBuy(sku) {
      if (this.isTemplate) {
        this.$toast("活动预览，仅供查看");
        return;
      }
      console.log(sku);
      goToSkuPage(sku);
    },
  },
};
</script>

<style lang="scss">
.exposureDivAll {
  height: 100%;
}
</style>
