<template>
  <div id="box" class="home">
    <div :is="this.$store.state.tempName"></div>
  </div>
</template>
<script>
import { strategytemplate, detMainProduct } from '../api'
export default {
  name: "home",
  data () {
    return {
      imgUrl: process.env.VUE_APP_IMGS_URL,
      template: "",
    };
  },
  created () {
    this.$nextTick(() => {
      window.addEventListener('message', messageEvent => {
        const data = messageEvent.data
        if (data.template && data.template !== '') {
          this.pageData(data)
        }
      })
    })
  },


  methods: {
    getPorduct (productId) {
      return detMainProduct({
        productId: productId,
      });
    },
    pageData (data) {
      this.$store.commit('setTempName', 'loding')
      detMainProduct({
        productId: data.item.primaryProductId,
      }).then(res => {
        let mainProduct = {
          activeType: res.data.activeType,
          bannerPics: [data.productJson.bannerImg, data.productJson.jsonImg, data.productJson.upImg, data.productJson.topImg,],
          bgColor: [data.productJson.pageBgcol, '', data.productJson.orderBgcol, data.productJson.orderBdcol],
          cacheSeatOne: [{
            dongHua: data.productJson.drawVal,
            memberUrl: res.data.cacheSeatOne[0].memberUrl,
            proC: {
              e: data.productJson.hideCol,
              s: data.productJson.pageTextcol
            },
            productV: data.productJson.productV,
            rushC: {
              e: data.productJson.orderTextcol,
              s: data.productJson.orderNumcol,
            },
            tabC: {
              e: data.productJson.tabVicecol,
              s: data.productJson.tabMaincol,
            },
            btnUrl: "",
          }],
          cpid: res.data.cpid,
          discountInfo: null,
          flowJumpUrl: res.data.flowJumpUrl,
          givePhoneInfo: res.data.givePhoneInfo,
          guidancePic: {
            c: data.productJson.orderImg,
            p: data.productJson.explainImg
          },
          id: data.item.primaryProductId,
          isCompositeProduct: 0,   //是否复合产品
          logoPic: data.productJson.logoPic,
          manualInfo: res.data.manualInfo,
          memberName: res.data.memberName,
          orderingInfo: res.data.orderingInfo,
          originalPrice: res.data.originalPrice,
          pageTitle: data.productJson.pageTitle,
          productName: res.data.productName,
          productType: res.data.productType,
          promotionPic: res.data.promotionPic,
          pushJumpUrl: res.data.pushJumpUrl,
          remark: res.data.producremarktName,
          remark1: res.data.remark1,
          remark2: res.data.remark2,
          remark3: data.productJson.remark3,
          spid: res.data.spid,
          themeColor: [data.productJson.btnTopcol, data.productJson.btnBotcol],
        }
        let recommend = [];
        if (data.item.recommendStrategyIds.length > 0 && data.item.recommendStrategyIds) {
          data.item.recommendStrategyIds.forEach(async val => {
            let list = await strategytemplate(val)
            recommend.push(list.data);
          });
        }
        let pageData = {
          mainProduct: mainProduct,
          channl: {
            channelKey: "464c87375658",
            channelName: "新策略H5整合测试",
            fullCode: "173966823233",
            edition: 1
          },
          recommend: recommend,
          remarks: data.extJson, //策略信息
          viceJson: data.viceJson, //副产品json
          mainJson: data.productJson,
          otherJson: data.otherJson, //备用json
          strategyInfo: {
            activityLogo: data.item.activityLogo,
            activityType: data.item.activityType,
            directCharge: null,
            extJson: data.extJson,
            id: 11111,
            linkUrl: data.item.linkUrl,
            maskText: data.item.maskText,
            posterPhoto: data.item.posterPhoto,
            primaryProductId: data.item.primaryProductId,
            primarySpid: null,
            productInfo: [],
            promotePhoto: data.item.promotePhoto,
            recommendStrategyList: data.item.recommendStrategyIds,
            strategyName: data.item.strategyName,
            strategyStatus: data.item.strategyStatus,
            strategyType: data.item.strategyType,
            templateCode: data.template,
            templateId: data.item.templateId,
            templateName: "",
            testGroupId: null,
            testId: null,
            unsubscribeStrategyList: data.item.unsubscribeStrategyIds,
            viceProductStrategyList: data.item.viceProductIds,
          }
        };
        this.$store.commit('setTempName', data.template)
        this.$store.commit("setPageData", pageData);
      })

    }
  },
};
</script>
<style lang="scss">
</style>