<template>
  <div class="back" :style="styleData.backStyle" v-if="exposureList.length > 0"  ref="exposureGoods"
    @click="styleClick('click', 'exposureGoods')"
    @mousemove="styleClick('mousemove', 'exposureGoods')"
    @mouseout="styleClick('mouseout')">
    <div class="imgTitle" :style="styleData.imgTitleStyle"></div>
    <div class="goodClass" :style="styleData.goodClassStyle">
      <div class="goodList" :style="styleData.goodListStyle">
        <div
          class="goodsItem"
          v-for="(item, index) in exposureList"
          :key="index"
          :style="styleData.goodsItemStyle"
        >
          <div v-if="isWebClick"
            class="goodImg"
            :style="styleData.goodImgStyle"
          >
            <img class="Img1" :src="item.skuImg" :style="styleData.Img1Style" />
          </div>
          <div
          v-else
            class="goodImg"
            @click="goToBuy(item.skuId)"
            v-lz-click="'5'"
            :style="styleData.goodImgStyle"
          >
            <img class="Img1" :src="item.skuImg" :style="styleData.Img1Style" />
          </div>

          <div class="goodBottom" :style="styleData.goodBottomStyle">
            <p class="goodName" :style="styleData.goodNameStyle">
              {{ item.skuName }}
            </p>
            <p
              class="goodPrice"
              :style="styleData.goodPriceStyle"
              v-if="item.skuPrice > 0"
            >
              ￥{{ item.skuPrice }}
            </p>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div v-else :style="styleData.goodsMainStyle"></div>
</template>

<script>
import { goToSkuPage } from "../../../util/tools.js";
import apis1 from "../../../util/apis1.js";
export default {
  props: ["datas", "keyData", "styleData", "isTemplate", "templateData","isWebClick","modifyContent",],
  data() {
    return {
      exposureList: [],
      styleDataOld: {},
      isCustomSwitching: "",
    };
  },
  mounted() {
  },
  created() {
    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,
          c_this: this,
          isCustomSwitching: this.isCustomSwitching,
          styleDataOld: this.styleDataOld,
        };
        this.$emit("opertaionCom", type, byValue);
      }
    },
    initData() {
      var datasAll = this.templateData;
      if (this.isTemplate == true) {
         if(this.isWebClick){
           this.exposureList = [{
                      skuImg: 'http://img10.360buyimg.com/n0/jfs/t1/127444/23/4432/144265/5edef4d9E0acddac4/7fd90344735c0059.jpg',
                      skuName: '滴露Dettol 衣物除菌液 清新柠檬 750ml 高效杀菌除螨 配合洗衣液消毒液使用 孕妇儿童衣物一起洗',
                      skuPrice: '27.6',
                      skuId: '27.6',
                    }];
         }
        
          
        
        if (datasAll) {

          if (datasAll.goodsData.assignGoodsFlag == '1') {
            // 指定商品
            this.exposureList = datasAll.goodsData.exposedGoods
             for (var i = 0; i < this.exposureList.length; i++){
              this.exposureList[i].skuImg = datasAll.goodsData.exposedGoods[i].imagePath;
              this.exposureList[i].skuName = datasAll.goodsData.exposedGoods[i].name;
              this.exposureList[i].skuPrice = datasAll.goodsData.exposedGoods[i].price;
              this.exposureList[i].skuId = datasAll.goodsData.exposedGoods[i].skuId;
            }
          } else {
            // 曝光商品
            this.exposureList = datasAll.exposedData.exposedGoods;
            for (var i = 0; i < this.exposureList.length; i++){
              this.exposureList[i].skuImg = datasAll.exposedData.exposedGoods[i].imagePath;
              this.exposureList[i].skuName = datasAll.exposedData.exposedGoods[i].name;
              this.exposureList[i].skuPrice = datasAll.exposedData.exposedGoods[i].price;
              this.exposureList[i].skuId = datasAll.exposedData.exposedGoods[i].skuId;
            }
          }
        }
      } else {
        let goodsList = apis1[this.datas.goodsList];
        goodsList((data) => {
          this.exposureList = data.data.skuInfoList;
        });
      }
    },
    goToBuy(sku) {
      goToSkuPage(sku);
    },
  },
};
</script>

<style lang="scss" scoped="scoped">
</style>
