<template>
  <div class="shopNameDivClassC" :style="shopDivClassStyle">
    <div class="shopNameDiv" v-if="isShowShopName" :style="shopNameStyle">
      <span class="shopNameSpan">{{ dataAll[keyData.shopName] }}</span>
    </div>
    <div class="shopLogoDiv" v-if="isShowShopImage" :style="isShowShopImageStyle">
      <img :style="isShowShopImageStyle.img" :src="dataAll[keyData.shopLogo]" />
    </div>

    <div v-if="isShowShopImage" class="shopImageClass">
      <div class="div1">
        每邀请1位好友
      </div>
      <div class="div2">
        可得<span>100</span>积分
      </div>
      <div class="div3">
        最高获取1000积分
      </div>
    </div>

  </div>
</template>

<script>
export default {
  props: ['datas', 'styleData', 'keyData'],
  data() {
    return {
      dataAll: {
        shopName: ''
      },
      shopNameStyle: '',
      shopDivClassStyle:'',
      isShowShopImageStyle:"",
      isShowShopImage: false,
      isShowShopName: false,
    };
  },


  created() {
    console.log(this.styleData, 'this.datas22222222222222');
    // this.isShowShopImage = this.datas.isShowShopImage;
    // this.isShowShopName = this.datas.isShowShopName;
    // this.dataAll = this.datas;
    // this.$forceUpdate()
  },


  methods: {
    initData(data) {
      console.log(data)
      this.isShowShopImage = this.datas.isShowShopImage;
      this.isShowShopName = this.datas.isShowShopName;
      this.shopDivClassStyle = this.styleData.shopDivClassStyle
      this.shopNameStyle = this.styleData.shopNameStyle;
      this.isShowShopImageStyle = this.styleData.isShowShopImageStyle;
      this.dataAll = data;
    }
  }
};
</script>

<style lang="scss" scoped="scoped">
  .shopNameDivClassC{
    .shopImageClass{
      position: absolute;
      top: 4.36rem;
      display: flex;
      width: 100%;
      justify-content: center;
      flex-direction: column;
      .div1{
        color: #FFFFFF;
        font-size: 0.44rem;
      }
      .div2{
        font-size: 0.96rem;
        color: #FFFFFF;
        // margin-top: 0.2rem;
        text-shadow: 0.05rem 0.05rem 0.05rem #888888;
        span{
          color: #fffd77;
        }
      }
      .div3{
        color: #5b4611;
        font-size: 0.4rem;
        margin-top: 0.18rem;
      }
    }
  }

</style>
