<template>
  <div>
    <div class="dimmed alertModal" @click="alertModalCancel()"></div>
    <div class="popup-wrap alertModal">
      <!-- 확인 -->
      <div class="popup alertModal">
        <div class="pop-head">
          <h3 class="pop-tit">{{ title }}</h3>
        </div>
        <div class="pop-cont">
          <p>{{ msg1 }}</p>
          <p v-if="msg2 !== ''">{{ msg2 }}</p>
          <p v-if="msg3 !== ''">{{ msg3 }}</p>
          <p v-if="msg4 !== ''">{{ msg4 }}</p>
        </div>
        <div class="popup-btn1">
          <button class="btn-pcolor" v-if="type" @click="alertModalClose(type)">확인</button>
          <button class="btn-pcolor" v-else @click="alertModalClose()">확인</button>
        </div>
      </div>
    </div>

    <!-- 공지사항 등록-->
    <div class="dimmed confirm-insert" @click="confirmInsertClose()"></div>
    <div class="popup-wrap confirm-insert">
      <div class="popup confirm-insert">
        <div class="pop-head">
          <h3 class="pop-tit">공지사항 등록</h3>
        </div>
        <div class="pop-cont">
          <p>작성된 내용으로 등록 하시겠습니까?</p>
        </div>
        <div class="popup-btn2">
          <button class="btn-pcolor" @click="confirmInsert()">확인</button>
          <button class="btn-default" @click="confirmInsertClose()">취소</button>
        </div>
      </div>
    </div>

    <!-- 공지사항 수정-->
    <div class="dimmed confirm-update" @click="confirmUpdateClose()"></div>
    <div class="popup-wrap confirm-update">
      <div class="popup confirm-update">
        <div class="pop-head">
          <h3 class="pop-tit">공지사항 수정</h3>
        </div>
        <div class="pop-cont">
          <p>작성된 내용으로 수정 하시겠습니까?</p>
        </div>
        <div class="popup-btn2">
          <button class="btn-pcolor" @click="confirmUpdate()">확인</button>
          <button class="btn-default" @click="confirmUpdateClose()">취소</button>
        </div>
      </div>
    </div>

    <!-- 자주하는 질문 등록-->
    <div class="dimmed confirm-insert-faq" @click="confirmInsertFaqClose()"></div>
    <div class="popup-wrap confirm-insert-faq">
      <div class="popup confirm-insert-faq">
        <div class="pop-head">
          <h3 class="pop-tit">자주하는 질문 등록</h3>
        </div>
        <div class="pop-cont">
          <p>작성된 내용으로 등록 하시겠습니까?</p>
        </div>
        <div class="popup-btn2">
          <button class="btn-pcolor" @click="confirmInsertFaq()">확인</button>
          <button class="btn-default" @click="confirmInsertFaqClose()">취소</button>
        </div>
      </div>
    </div>

    <!-- 자주하는 질문 수정-->
    <div class="dimmed confirm-update-faq" @click="confirmUpdateFaqClose()"></div>
    <div class="popup-wrap confirm-update-faq">
      <div class="popup confirm-update-faq">
        <div class="pop-head">
          <h3 class="pop-tit">자주하는 질문 수정</h3>
        </div>
        <div class="pop-cont">
          <p>작성된 내용으로 수정 하시겠습니까?</p>
        </div>
        <div class="popup-btn2">
          <button class="btn-pcolor" @click="confirmUpdateFaq()">확인</button>
          <button class="btn-default" @click="confirmUpdateFaqClose()">취소</button>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'validationConfirmPopup',
  data() {
    return {
      row: {},
      title: '',
      msg: '',
      msg1: '',
      msg2: '',
      msg3: '',
      msg4: '',
      targetFocus: '',
      type: '',
    };
  },
  methods: {
    alertModalOpen(props) {
      this.title = props.title;
      this.msg1 = props.msg1;
      this.msg2 = props.msg2;
      this.msg3 = props.msg3;
      this.msg4 = props.msg4;
      this.type = props.type;
      var dimmed = document.getElementsByClassName('alertModal');
      for (var i = 0; i < dimmed.length; i++) {
        dimmed[i].style.display = 'block';
      }
    },
    alertModalClose(type) {
      if (type) {
        this.$parent.formReset();

        var dimmed0 = document.getElementsByClassName('alertModal');
        for (var i = 0; i < dimmed0.length; i++) {
          dimmed0[i].style.display = 'none';
        }

        var dimmed1 = document.getElementsByClassName('modal52');
        for (var k = 0; k < dimmed1.length; k++) {
          dimmed1[k].style.display = 'none';
        }
      } else {
        var dimmed = document.getElementsByClassName('alertModal');
        for (var j = 0; j < dimmed.length; j++) {
          dimmed[j].style.display = 'none';
        }
        this.$parent.checkFocus();
      }
    },

    //공지사항 등록 팝업
    confirmInsertOpen() {
      var dimmed = document.getElementsByClassName('confirm-insert');
      for (var i = 0; i < dimmed.length; i++) {
        dimmed[i].style.display = 'block';
      }
    },
    //공지사항 등록
    confirmInsert() {
      var dimmed = document.getElementsByClassName('confirm-insert');
      for (var i = 0; i < dimmed.length; i++) {
        dimmed[i].style.display = 'none';
      }

      this.$parent.insertNotice();
    },
    //공지사항 등록 팝업 Close
    confirmInsertClose() {
      var dimmed = document.getElementsByClassName('confirm-insert');
      for (var i = 0; i < dimmed.length; i++) {
        dimmed[i].style.display = 'none';
      }
    },

    //공지사항 수정 팝업
    confirmUpdateOpen() {
      var dimmed = document.getElementsByClassName('confirm-update');
      for (var i = 0; i < dimmed.length; i++) {
        dimmed[i].style.display = 'block';
      }
    },
    //공지사항 수정
    confirmUpdate() {
      var dimmed = document.getElementsByClassName('confirm-update');
      for (var i = 0; i < dimmed.length; i++) {
        dimmed[i].style.display = 'none';
      }

      this.$parent.updateNotice();
    },
    //공지사항 수정 팝업 Close
    confirmUpdateClose() {
      var dimmed = document.getElementsByClassName('confirm-update');
      for (var i = 0; i < dimmed.length; i++) {
        dimmed[i].style.display = 'none';
      }
    },

    /* ****************************************************************************************  */

    //자주하는 질문 등록 팝업
    confirmInsertFaqOpen() {
      var dimmed = document.getElementsByClassName('confirm-insert-faq');
      for (var i = 0; i < dimmed.length; i++) {
        dimmed[i].style.display = 'block';
      }
    },
    //자주하는 질문 등록
    confirmInsertFaq() {
      var dimmed = document.getElementsByClassName('confirm-insert-faq');
      for (var i = 0; i < dimmed.length; i++) {
        dimmed[i].style.display = 'none';
      }

      this.$parent.insertFaq();
    },
    //자주하는 질문 등록 팝업 Close
    confirmInsertFaqClose() {
      var dimmed = document.getElementsByClassName('confirm-insert-faq');
      for (var i = 0; i < dimmed.length; i++) {
        dimmed[i].style.display = 'none';
      }
    },

    //자주하는 질문 수정 팝업
    confirmUpdateFaqOpen() {
      var dimmed = document.getElementsByClassName('confirm-update-faq');
      for (var i = 0; i < dimmed.length; i++) {
        dimmed[i].style.display = 'block';
      }
    },
    //자주하는 질문 수정
    confirmUpdateFaq() {
      var dimmed = document.getElementsByClassName('confirm-update-faq');
      for (var i = 0; i < dimmed.length; i++) {
        dimmed[i].style.display = 'none';
      }

      this.$parent.updateFaq();
    },
    //자주하는 질문 수정 팝업 Close
    confirmUpdateFaqClose() {
      var dimmed = document.getElementsByClassName('confirm-update-faq');
      for (var i = 0; i < dimmed.length; i++) {
        dimmed[i].style.display = 'none';
      }
    },
  },
};
</script>
