<template>
  <div class="van-popup van-popup--bottom" style="background: rgba(0,0,0,0.7); z-index: 2008;height: 100vh;
    display: -webkit-box;
    -webkit-box-pack: center;
    -webkit-box-align: center;" v-if="show"  @click="close()">
    <div class="challenge-fail-content" @click="stopClickEmpty">
      <div style="font-size: 0.68rem; color: rgb(242, 60, 60); text-align: center">挑战成绩{{ grade }}</div>
      <div style="font-size: 0.26rem; color: rgb(153, 153, 153); text-align: center">就差那么一点点啦<br/>哎！游戏太难试试降低游戏难度</div>
      <img src="https://img10.360buyimg.com/imgzone/jfs/t1/129697/29/4290/3722/5f0bcd42Eaa328e8e/66348a3d8307d3b8.png"
           alt=""
           style="width: 4rem; height: 1rem; display: block; margin: 0.3rem auto 0px" @click="ReduceDifficulty()"/>
      <img src="https://img10.360buyimg.com/imgzone/jfs/t1/149633/23/2732/3469/5f0bcd42Eb4316b70/8b866769e4767847.png"
           alt="" style="width: 4rem; height: 1rem; display: block; margin: 0.1rem auto 0px" @click="closeBtn()"/>
      <div class="close-btn-dumiao" @click="close()"></div>
    </div>
  </div>
</template>
<script>
import { levelDialogService } from "../../../util/comCreate.js";
export default {
  name: "gradeDialog",
  data() {
    return {
      grade:0,
      img_path:
        "https://img10.360buyimg.com/imgzone/jfs/t1/125587/19/7077/16212/5f0bc7ebEaa698c41/f3ad84ac3db3a901.png",
      commodityList: [], //商品信息
      mainDatas: [],
      isShow: false, //是否显示一键加购
      acRulePopComData: {
        styleData: {},
        datas: {},
        keyData: {},
      },
    };
  },
  created() {
    this.initData();
  },
  methods: {
    initData() {
     console.log(this.mainDatas,"grade 数据")
     this.mainDatas = this.mainDatas
    },
    closeBtn() {
      this.submit();
    },
    close() {
      this.submit();
    },
     stopClickEmpty(event){
      event.stopPropagation();
    },
    ReduceDifficulty() {

      this.submit();
      levelDialogService.create(
        this.isTemplate,
        this.isTemplate,
        this.mainDatas,
        (prizeRecordDetilClick) => {
          levelDialogService.close();
        }
      );
    },
  },
};
</script>
<style scoped>
.van-popup {
    position: fixed;
    max-height: 100%;
    overflow-y: auto;
    background-color: rgb(211, 31, 70);
    -webkit-transition: -webkit-transform .3s;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s,-webkit-transform .3s;
    -webkit-overflow-scrolling: touch;
}
.van-popup--bottom {
    bottom: 0;
    left: 0;
    width: 100%;
}
.challenge-fail-content {
    background: url(https://img10.360buyimg.com/imgzone/jfs/t1/121210/9/7068/7598/5f0bcd42E3113368d/b29e9c1a41147c56.png) no-repeat;
    background-size: 100%;
    width: 5.9rem;
    height: 7.4rem;
    position: relative;
    padding-top: 3rem;
    box-sizing: border-box;
}
.close-btn-dumiao {
  width: 0.45rem;
  height: 0.45rem;
  position: absolute;
  right: 0.2rem;
  top: 0.15rem;
}
</style>
