<template>
  <div>
    <div class="basicbackground" @click='clickEmpty()'>
      <div class="basicbackgroundClass">
        <div class="close-btn" @click="closeClick()"></div>
        <slot></slot>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  name: "basicbackground10015Fly",
  data() {
    return {

    };
  },
  mounted() {
    document
      .querySelector("body")
      .setAttribute(
        "style",
        "position:#fixed;top:0;height:100%;overflow:hidden"
      );
  },
  created() {

  },
  methods: {
    closeClick() {
      this.$emit("closeClick");
    },
    //点击空白处关闭弹框
    clickEmpty() {
      this.$emit("closeClick");
    },
  },
};
</script>
<style lang="scss" scoped>
.basicbackground {
  .basicbackgroundClass {
    height: 6.57rem;
    width: 6.48rem;
    background-image: url("//img10.360buyimg.com/imgzone/jfs/t1/143969/22/39615/81010/64e416a9Faf7c0133/0575e38d79127ff7.png");
    background-repeat: no-repeat;
    background-size: 100%;
    position: relative;
    padding-top: 0.85rem;
    .close-btn {
      position: absolute;
      width: 0.45rem;
      height: 0.45rem;
      background: url("//img10.360buyimg.com/imgzone/jfs/t1/183690/31/37249/1097/64e2d8dcFb8273014/2bd869caeaf31168.png")
        no-repeat;
      background-size: 100% 100%;
      bottom: -0.8rem;
      left: 50%;
      transform: translateX(-50%);
    }
  }
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  background-color: rgba(0, 0, 0, 0.7);
  z-index: 200;
  display: flex;
  justify-content: center;
  align-items: center;
}
</style>
