<!--许可证弹窗-->
<template>
  <el-dialog
      class="pop-up-permit"
      :title="title"
      append-to-body
      :modal="false"
      :close-on-click-modal="false"
      :visible.sync="dialogVisibleForBigPop"
      width="648"
      top="5vh"
      :before-close="handleClose">
    <div slot="title">
      <p class="title-style">{{title}}</p>
      <el-divider></el-divider>
    </div>
    <slot></slot>
  </el-dialog>
</template>
<script lang="ts">
import {Component, PropSync, Prop, Vue, Emit} from 'vue-property-decorator';

@Component
export default class PermitPopUpComponent extends Vue {
  //传入的报警信息列表
  @PropSync('dialogVisibleForBigPop', {default: false}) syncDialogVisibleForPermit!: boolean;
  @Prop({default: '排污许可证'}) title!: string;
  @Emit("onClose")
  onCloseCallback(){
    //
  }


  //关闭弹窗
  handleClose() {
    this.syncDialogVisibleForPermit = false
    this.onCloseCallback()
  }


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


.pop-up-permit {
  .el-dialog {
    width: 648px;
    height: 410px;
    background: url("~@/assets/img/permitBg.png") no-repeat 50% 50%;
    .el-dialog__header{
      padding-bottom: 0;
      padding-left: 36px;
      padding-right: 36px;
    }
    .el-dialog__headerbtn {
      top: 25px;
      right: 30px;
    }

    .el-dialog__title,.title-style {
      //font-weight: bold;
      position: relative;
      font-size: 16px;
      top: 8px;
      left: 0;
      color: #FFFFFF;
    }

    .el-dialog__body {
      padding-top: 0 !important;
      padding-left: 36px;
      padding-right: 36px;
    }
  }

  .el-dialog__headerbtn .el-dialog__close {
    color: #FFFFFF;
  }

  .el-dialog__title, .el-dialog__body, .el-form-item__label {
    color: #FFFFFF;
  }
}

</style>
