<template>
  <div style="height: 0rem">
    <div
      :style="styleData.machineStyle"
      ref="mainKv"
      @click="styleClick('click', 'mainKv')"
      @mousemove="styleClick('mousemove', 'mainKv')"
      @mouseout="styleClick('mouseout')"
    >
    </div>
  </div>
</template>
<script>
import apis1 from "../../../util/apis1.js";
import { Toast } from "vant";
let { drawPrize, startDraw } = apis1;
export default {
  props: [
    "styleData",
    "keyData",
    "datas",
    "isTemplate",
    "templateData",
    "modifyContent",
    "isWebClick",
  ],
  data() {
    return {
      prizeResultData: {
        styleData: {},
        styleDataOld: {},
        datas: {},
        keyData: {
          prizeUrl: "showImg",
          prizeName: "prizeName",
          prizeType: "prizeType",
          priceInfo: "priceInfo",
          discountType: "discountType",
          couponType: "couponType",
        },
      },
    };
  },
  created() {
    // 深拷贝重置需要
    this.styleDataOld = JSON.parse(JSON.stringify(this.styleData));
  },
  mounted() {
    // this.initDatas();
  },
  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);
      }
    },
  },
};
</script>
<style lang="scss" scoped>
.machineList {
  flex: 1;
  width: 100%;
  height: 800%;
  margin: 0 0.015rem;
  transition: 0.3s all;
}
.machineListBox {
  width: 1.6rem;
  height: 3.05rem;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 0.24rem;
}
.machineButton {
  background-repeat: no-repeat;
  background-size: 100%;
  margin: 0.42rem auto 0;
}
</style>
