<template>
  <section class="DomainLonlatSection" v-if="dialogPopVisible">
    <div class="DomainLonlatMain">
      <div class="supertitle">完善定位信息通知</div>
      <div class="supercontent">
        <div class="contentH2">为了更好的使用平台功能，请先完善组织定位坐标信息。</div>        
      </div>
      <div class="superbottom">
        <button class="btnprimary" @click="onOk">已了解，前往填报定位坐标信息</button>        
      </div>
    </div>
  </section>
</template>
<script>
export default {
  props: ['domainLonLatPopDialogVisible', 'domainLonLatData'],
  data() {
    return {
      dialogPopVisible: this.domainLonLatPopDialogVisible,
      superviseCompletedUrl: `/static/portal/vue/index.html#/open?appId=__DXZvc8mnEmDqMARhK7G&actionContent=__DRWRVHekZL0pUfzfTwb&opentarget=detail&linkType=00`,//从业单位--监管归属url
      infoCompletedUrl: `/static/portal/vue/index.html#/open?appId=__DXZvc8mnEmDqMARhK7G&actionContent=__AOkTvsah9VLicJhQ1FO&opentarget=detail&linkType=00&isAllEdit=true`,//从业单位--单位信息url
    }
  },
  watch: {
    domainLonLatPopDialogVisible() {
      this.dialogPopVisible = this.domainLonLatPopDialogVisible;
    }
  },
  methods: {
    onOk() {      
      this.$emit('domainLonLatPopOk',true)
      this.dialogPopVisible=false
    },   
  }
}
</script>
<style lang="scss" scoped>
.DomainLonlatSection {
  position: fixed;
  top: 0%;
  bottom: 0%;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.3);
  z-index: 666666; //层级级别999990

  .DomainLonlatMain {
    width: 850px;
    height: 250px;
    position: absolute;
    top: 20%;
    bottom: 20%;
    margin-left: 50%;
    transform: translateX(-50%);
    z-index: 666667; //层级级别999990
    background: #fff;
    border-radius: 5px;
    display: flex;
    flex-direction: column;
    padding: 0 40px;

    .supertitle {
      font-size: 22px;
      font-weight: 700;
      color: #3C4766;
      text-align: center;
      padding: 30px 0;
    }

    .supercontent {
      display: flex;
      flex-direction: column;
      overflow: auto;

      .contentH2 {
        color: #FF0000;
        font-weight: 400;
        font-style: normal;
        font-size: 13px;
        text-align: center;
        border-bottom: 1px solid #ccc;
        padding-bottom: 15px;
      }

      .contentDetail {
        display: flex;
        flex-direction: column;
        padding-top: 20px;
        margin-left: 7%;

        .contenttitle {
          color: #3C4766;
          font-size: 13px;
          font-weight: 700;
          font-style: normal;
          line-height: 25px;
        }

        .contentdesc {
          color: #444444;
          font-weight: 400;
          font-size: 13px;
          line-height: 25px;
        }
      }
    }

    .superbottom {
      margin: 30px auto;

      .btnprimary {
        background: rgba(15, 113, 255, 1);
        padding: 10px 15px;
        border: 1px solid rgba(15, 113, 255, 1);
        color: #fff;
        text-align: center;
        border-radius: 5px;
        margin-right: 20px;
      }

      .btndefault {
        background: #fff;
        padding: 10px 15px;
        border: 1px solid rgba(164, 164, 164, 1);
        color: #666666;
        text-align: center;
        border-radius: 5px;
      }
    }
  }
}
</style>