hubez-admin/frontend/src/modules/sendNumMgt/components/NumberRegPop.vue

<template>
  <!-- <div class="wrap bg-wrap"> -->
  <div>
    <div class="dimmed numberRegModal" @click="numberRegPopClose();"></div>
    <!-- 발신번호 등록 (타사업자)-->
    <div class="popup numberRegModal popup_form register w700">
      <div class="pop-head">
        <h3 class="pop-tit">발신번호 등록</h3>
      </div>
      <table>
        <tbody>
        <tr>
          <th>관리자 ID</th>
          <td>
            <div class="input_search">
              <input class="search-box" type="text" placeholder="아이디 입력" disabled v-model="adminId">
              <button type="button" class="button btn-p2color" @click="searchIdPop">조회</button>
            </div>
          </td>
        </tr>
        <tr>
          <th>고객사명</th>
          <td><input type="text" disabled v-model="custNm"></td>
        </tr>
        <tr>
          <th>사업자번호</th>
          <td><input type="text" disabled v-model="bRegNo"></td>
        </tr>
        <tr v-show="bizrAuthYn !== 'Y'">
          <th>명의자 구분</th>
          <td>
            <input type="radio" name="nmineeDivCd" value="01" id="popup_radio5" v-model="nmineeDivCd"
                   @change="changeNmineDiv($event)">
            <label for="popup_radio5">사업자</label>
            <input type="radio" name="nmineeDivCd" value="02" id="popup_radio6" v-model="nmineeDivCd"
                   @change="changeNmineDiv($event)">
            <label for="popup_radio6">타사업자</label>
          </td>
        </tr>
        <tr>
          <th>발신번호</th>
          <td>
            <div class="input_add">
              <div>
                <input type="text" placeholder="발신번호명" v-model="sendNm" maxlength="20">
                <input type="text" placeholder="발신번호(숫자만입력)" v-model="sendNum" @keypress="onlyNum" @input="onlyNum"
                       maxlength="11">
                <button class="button white add" @click="addNumberInput"></button>
              </div>
              <div v-for="(numberInput, index) in numberInputs">
                <input type="text" placeholder="발신번호명" v-model="numberInput.sendNm" maxlength="20">
                <input type="text" placeholder="발신번호(숫자만입력)" v-model="numberInput.sendNum" @keypress="onlyNum"
                       @input="onlyNum" maxlength="11">
                <button class="button white" @click="delNumberInput">삭제</button>
              </div>
            </div>
          </td>
        </tr>
        <tr v-show="bizrAuthYn !== 'Y'">
          <th>제출서류</th>
          <td>
            <p class="file">파일형식 : jpg, png, pdf, tiff (최대 5MB)</p>
            <div class="attach" v-show="fileType === 2">
              <p class="essential list"><span>*</span>위임-수임사간 관계 확인 문서</p>
              <input type="file" ref="delegationFile" style="display: none" @change="readDelegationFile"
                     accept=".jpg,.png,.pdf,.tiff"/>
              <button class="button btn-p2color" @click="$refs.delegationFile.click()">파일업로드</button>
              <p class="file" id="delegationNm"></p>
            </div>
            <div class="attach" v-show="fileType === 2">
              <p class="essential list"><span>*</span>위임장</p>
              <input type="file" ref="attorneyFile" style="display: none" @change="readAttorneyFile"
                     accept=".jpg,.png,.pdf,.tiff"/>
              <button class="button btn-p2color" @click="$refs.attorneyFile.click()">파일업로드</button>
              <p class="file" id="attorneyNm"></p>
            </div>

            <div class="attach" v-show="fileType === 2">
              <p class="essential list"><span>*</span>법인인감증명서</p>
              <input type="file" ref="corporateCertificateFile" style="display: none" @change="readCorporateCertificateFile"
                     accept=".jpg,.png,.pdf,.tiff"/>
              <button class="button btn-p2color" @click="$refs.corporateCertificateFile.click()">파일업로드</button>
              <p class="file" id="corporateCertificateNm"></p>
            </div>

            <div class="attach" v-show="fileType === 2">
              <p class="essential list"><span>*</span>위임사 사업자등록증</p>
              <input type="file" ref="delegatedBusinessFile" style="display: none" @change="readDelegatedBusinessFile"
                     accept=".jpg,.png,.pdf,.tiff"/>
              <button class="button btn-p2color" @click="$refs.delegatedBusinessFile.click()">파일업로드</button>
              <p class="file" id="delegatedBusinessNm"></p>
            </div>

            <div class="attach" v-show="fileType === 2">
              <p class="essential list"><span>*</span>수임사 사업자등록증</p>
              <input type="file" ref="authorizedBusinessFile" style="display: none" @change="readAuthorizedBusinessFile"
                     accept=".jpg,.png,.pdf,.tiff"/>
              <button class="button btn-p2color" @click="$refs.authorizedBusinessFile.click()">파일업로드</button>
              <p class="file" id="authorizedBusinessNm"></p>
            </div>

            <div class="attach">
              <p v-if="fileType === 1" class="essential list"><span>*</span>통신서비스 이용증명원</p>
              <p v-if="fileType === 2" class="essential list">발신번호의 통신서비스 이용증명원</p>
              <input type="file" ref="communicationFile" style="display: none" @change="readCommunicationFile"
                     accept=".jpg,.png,.pdf,.tiff"/>
              <button class="button btn-p2color" @click="$refs.communicationFile.click()">파일업로드</button>
              <p class="file" id="communicationNm"></p>
            </div>

              <div class="attach" v-show="fileType === 1">
                <p class="essential list"><span></span>재직증명서</p>
                <input type="file" ref="tenureFile" style="display: none" @change="readTenureFile"
                       accept=".jpg,.png,.pdf,.tiff"/>
                <button class="button btn-p2color" @click="$refs.tenureFile.click()">파일업로드</button>
                <p class="file" id="tenureNm"></p>
              </div>

            <div class="attach" v-show="fileType === 2">
              <p class="essential list"><span></span>위임사 재직증명서(임직원 신청시)</p>
              <input type="file" ref="delegateCertificateFile" style="display: none" @change="readDelegateCertificateFile"
                     accept=".jpg,.png,.pdf,.tiff"/>
              <button class="button btn-p2color" @click="$refs.delegateCertificateFile.click()">파일업로드</button>
              <p class="file" id="delegateCertificateNm"></p>
            </div>

            <div class="attach" v-show="fileType === 2">
              <p class="essential list"><span></span>위임사 신분증(임직원 신청시)</p>
              <input type="file" ref="delegatedIdentificationFile" style="display: none" @change="readDelegatedIdentificationFile"
                     accept=".jpg,.png,.pdf,.tiff"/>
              <button class="button btn-p2color" @click="$refs.delegatedIdentificationFile.click()">파일업로드</button>
              <p class="file" id="delegatedIdentificationNm"></p>
            </div>
            
            
          </td>
        </tr>
        <tr>
          <th>사업자 등록증</th>
          <td v-show="bizrAuthYn !== 'Y'">
              <p class="file">파일형식 : jpg, png, pdf, tiff (최대 5MB)</p>
            <div class="attach" v-show="fileType === 1">
              <p class="essential list"><span>*</span>사업자등록증</p>
              <input type="file" ref="businessFile" style="display: none" @change="readBusinessFile"
                     accept=".jpg,.png,.pdf,.tiff"/>
              <button class="button btn-p2color" @click="$refs.businessFile.click()">파일업로드</button>
              <p class="file" id="businessNm"></p>
            </div>

            <div class="attach" v-show="fileType === 2">
              <p class="essential list"><span>*</span>사업자등록증</p>
              <input type="file" ref="otherBusinessFile" style="display: none" @change="readOtherBusinessFile"
                     accept=".jpg,.png,.pdf,.tiff"/>
              <button class="button btn-p2color" @click="$refs.otherBusinessFile.click()">파일업로드</button>
              <p class="file" id="otherBusinessNm"></p>
            </div>
          </td>
          
          <td class="red" v-show="bizrAuthYn === 'Y'">인증 완료</td>
        </tr>
        <tr v-show="bizrAuthYn !== 'Y'">
          <th>본인확인</th>
          <td>
              <p class="file">파일형식 : jpg, png, pdf, tiff (최대 5MB)</p>
            <div class="attach">
              <p class="essential list"><span></span>신분증</p>
              <input type="file" ref="identificationCardFile" style="display: none" @change="readIdentificationCardFile"
                     accept=".jpg,.png,.pdf,.tiff"/>
              <button class="button btn-p2color" @click="$refs.identificationCardFile.click()">파일업로드</button>
              <p class="file" id="identificationCardNm"></p>
            </div>

            <div class="attach">
              <p class="essential list"><span></span>재직증명서</p>
              <input type="file" ref="identificationEvidenceFile" style="display: none" @change="readIdentificationEvidenceFile"
                     accept=".jpg,.png,.pdf,.tiff"/>
              <button class="button btn-p2color" @click="$refs.identificationEvidenceFile.click()">파일업로드</button>
              <p class="file" id="identificationEvidenceNm"></p>
            </div>
          </td>
        </tr>
        </tbody>
      </table>
      <div class="popup-btn2">
        <button class="btn-pcolor" @click="saveSendNum">저장</button>
        <button class="btn-default" @click="numberRegPopClose();">취소</button>
      </div>

      <admin-list-pop ref="admnListPop" :send-data="childData" @event-data="setChildData"/>
    </div>
  </div>
</template>

<script>
import AdminListPop from "@/modules/sendNumMgt/components/AdminListPop";
import {utils_mixin, chkPattern2} from '../service/mixins';
import sendNumMgtApi from "@/modules/sendNumMgt/service/sendNumMgtApi";

export default {
  name: "numberRegPop",
  mixins: [utils_mixin, chkPattern2],
  watch: {
    nmineeDivCd() {
    }
  },
  data() {
    return {
      row: {},
      adminId: '',
      custNm: '',
      bRegNo: '',
      bizrAuthYn: '',
      custSeq: '',
      nmineeDivCd: '01',
      sendNm: '',
      sendNum: '',
      numberInputs: [],
      saveSendNums: [],
      fileType: 1,
      communicationFile: null,
      tenureFile: null,
      delegationFile: null,
      attorneyFile: null,
      businessFile: null,
      otherBusinessFile: null,
      delegatedIdentificationFile: null,
      delegateCertificateFile: null,
      delegatedBusinessFile: null,
      authorizedBusinessFile: null,
      corporateCertificateFile: null,
      identificationCardFile: null,
      identificationEvidenceFile: null,
      childData: 20,
      reqCnt: 0,
    }
  },
  components: {
    AdminListPop,
    // commonModal,
  },
  model: {
    prop: 'sendData',
    event: 'event-data'
  },
  props: ['sendData'],
  created() {
    this.formReset();
  },
  methods: {
    
    returnFileSize(number, event) {
      if (number === 0){
        this.row.title = '발신번호 등록';
        this.row.msg1 = '첨부파일을 확인해 주세요';
        // this.getParent('NumberList').commonModalOpen(this.row)
        this.$parent.$refs.commmonModal.alertModalOpen(this.row);
        event.target.files[0] = '';
        return false;
      } 
      if(number > 1) {
        return (number/1048576).toFixed(2) + 'MB';
      }
    },
            
    searchIdPop() {
      this.$refs.admnListPop.adminNmPopOpen();
    },
    setChildData(data) {
      this.adminId = data.adminId
      this.custNm = data.custNm
      this.bRegNo = data.bregNo
      this.bizrAuthYn = data.bizrAuthYn
      this.custSeq = data.custSeq
    },
    addNumberInput() {
      if(this.numberInputs.length == 9){
        return false;
      }
      this.numberInputs.push({
        sendNm: '',
        sendNum: ''
      })
    },
    
    delNumberInput(index) {
      this.numberInputs.splice(index, 1)
    },
    changeNmineDiv(event) {
      var data = event.target.value;
      if (data === '01') {
        this.fileType = 1
      }
      if (data === '02') {
        this.fileType = 2
      }
    },
    // 모달 띄우기
    numberRegPopopen() {
      var dimmed = document.getElementsByClassName('numberRegModal');
      for (var i = 0; i < dimmed.length; i++) {
        dimmed[i].style.display = 'block';
      }
    },
    // 모달 끄기
    numberRegPopClose() {
      this.formReset();
      var dimmed = document.getElementsByClassName('numberRegModal');
      for (var i = 0; i < dimmed.length; i++) {
        dimmed[i].style.display = 'none';
      }
    },
    formReset() {
      Object.assign(this.$data, this.$options.data());
    },
    fileExtCheck(file){
        // 마지막 . 위치를 찾고 + 1 하여 확장자 명을 가져온다.
        let fileExt = file.name.substring(
            file.name.lastIndexOf(".") + 1
        )


        // 소문자로 변환
        fileExt = fileExt.toLowerCase()
        var fileSize = file.size
        var maxSize = 5 * 1024 * 1024;
        // 이미지 확장자 체크, jpg, png, pdf, tiff
        if (["jpg", "png", "pdf", "tiff"].includes(fileExt) && fileSize <= maxSize) {
          return true;
        } else {
          this.row.title = '발신번호 파일 업로드';
          this.row.msg1 = '첨부파일을 확인해 주세요.';
          this.row.msg2 = '파일형식 : jpg, png, pdf, tiff (최대5MB)';
          this.$parent.$refs.commmonModal.alertModalOpen(this.row);
          return false
        }
    },
    // 위임-수임사간 관계 확인 문서
    readDelegationFile(event) {
      const file = event.target.files[0];      

      if(this.fileExtCheck(file)) {
        if (file != null) {
          this.delDelegationFile(event);
        }

        // inner Html.
        const button = document.createElement('button');
        const text = document.createElement('p');
        text.innerText = file.name;
        button.addEventListener('click', () => {
          this.delDelegationFile(event);
        })
        button.innerText = 'X'
        const root = document.getElementById('delegationNm');
        root.textContent = `${file.name}  ${ '('+ this.returnFileSize(file.size, event) + ')'}`;
        root.appendChild(button);
        this.delegationFile = file;
      }
    },
    delDelegationFile(event) {
      const file = event.target.files[0];
      this.$refs.delegationFile.value = null;
      let element = document.getElementById("delegationNm");
      while (element.firstChild) {
        element.removeChild(element.firstChild);
      }
      this.delegationFile = null;
    },
    // 위임장
    readAttorneyFile(event) {
      const file = event.target.files[0];
      if(this.fileExtCheck(file)) {
        if (file != null) {
          this.delAttorneyFile(event);
        }

        // inner Html.
        const button = document.createElement('button');
        const text = document.createElement('p');
        text.innerText = file.name;
        button.addEventListener('click', () => {
          this.delAttorneyFile(event);
        })
        button.innerText = 'X'
        const root = document.getElementById('attorneyNm');
        root.textContent = `${file.name}  ${ '('+ this.returnFileSize(file.size, event) + ')'}`;
        root.appendChild(button);
        this.attorneyFile = file;
      }
    },
    delAttorneyFile(event) {
      const file = event.target.files[0];
      this.$refs.attorneyFile.value = null;
      let element = document.getElementById("attorneyNm");
      while (element.firstChild) {
        element.removeChild(element.firstChild);
      }
      this.attorneyFile = null;
    },

    // 법인인감증명서
    readCorporateCertificateFile(event) {
      const file = event.target.files[0];
      if(this.fileExtCheck(file)) {
        if (file != null) {
          this.delCorporateCertificateFile(event);
        }

        // inner Html.
        const button = document.createElement('button');
        const text = document.createElement('p');
        text.innerText = file.name;
        button.addEventListener('click', () => {
          this.delCorporateCertificateFile(event);
        })
        button.innerText = 'X'
        const root = document.getElementById('corporateCertificateNm');
        root.textContent = `${file.name}  ${ '('+ this.returnFileSize(file.size , event) + ')'}`;
        root.appendChild(button);
        this.corporateCertificateFile = file;
      }
    },
    delCorporateCertificateFile(event) {
      const file = event.target.files[0];
      this.$refs.corporateCertificateFile.value = null;
      let element = document.getElementById("corporateCertificateNm");
      while (element.firstChild) {
        element.removeChild(element.firstChild);
      }
      this.corporateCertificateFile = null;
    },

        // 위임사 사업자 등록증
    readDelegatedBusinessFile(event) {
      const file = event.target.files[0];
      if(this.fileExtCheck(file)) {
        if (file != null) {
          this.delDelegatedBusinessFile(event);
        }

        // inner Html.
        const button = document.createElement('button');
        const text = document.createElement('p');
        text.innerText = file.name;
        button.addEventListener('click', () => {
          this.delDelegatedBusinessFile(event);
        })
        button.innerText = 'X'
        const root = document.getElementById('delegatedBusinessNm');
        root.textContent = `${file.name}  ${ '('+ this.returnFileSize(file.size, event) + ')'}`;
        root.appendChild(button);
        this.delegatedBusinessFile = file;
      }
    },
    delDelegatedBusinessFile(event) {
      const file = event.target.files[0];
      this.$refs.delegatedBusinessFile.value = null;
      let element = document.getElementById("delegatedBusinessNm");
      while (element.firstChild) {
        element.removeChild(element.firstChild);
      }
      this.delegatedBusinessFile = null;
    },

        // 수임사 사업자 등록증
    readAuthorizedBusinessFile(event) {
      const file = event.target.files[0];
      if(this.fileExtCheck(file)) {
        if (file != null) {
          this.delAuthorizedBusinessFile(event);
        }

        // inner Html.
        const button = document.createElement('button');
        const text = document.createElement('p');
        text.innerText = file.name;
        button.addEventListener('click', () => {
          this.delAuthorizedBusinessFile(event);
        })
        button.innerText = 'X'
        const root = document.getElementById('authorizedBusinessNm');
        root.textContent = `${file.name}  ${ '('+ this.returnFileSize(file.size , event) + ')'}`;
        root.appendChild(button);
        this.authorizedBusinessFile = file;
      }
    },
    delAuthorizedBusinessFile(event) {
      const file = event.target.files[0];
      this.$refs.authorizedBusinessFile.value = null;
      let element = document.getElementById("authorizedBusinessNm");
      while (element.firstChild) {
        element.removeChild(element.firstChild);
      }
      this.authorizedBusinessFile = null;
    },

      // 위임사 재직증명서(임직원 신청시)
    readDelegateCertificateFile(event) {
      const file = event.target.files[0];
      if(this.fileExtCheck(file)) {
        if (file != null) {
          this.delDelegateCertificateFile(event);
        }

        // inner Html.
        const button = document.createElement('button');
        const text = document.createElement('p');
        text.innerText = file.name;
        button.addEventListener('click', () => {
          this.delDelegateCertificateFile(event);
        })
        button.innerText = 'X'
        const root = document.getElementById('delegateCertificateNm');
        root.textContent = `${file.name}  ${ '('+ this.returnFileSize(file.size, event) + ')'}`;
        root.appendChild(button);
        this.delegateCertificateFile = file;
      }
    },
    delDelegateCertificateFile(event) {
      const file = event.target.files[0];
      this.$refs.delegateCertificateFile.value = null;
      let element = document.getElementById("delegateCertificateNm");
      while (element.firstChild) {
        element.removeChild(element.firstChild);
      }
      this.delegateCertificateFile = null;
    },

    // 위임사 신분증(임직원 신청시)
    readDelegatedIdentificationFile(event) {
      const file = event.target.files[0];
      if(this.fileExtCheck(file)) {
        if (file != null) {
          this.delDelegatedIdentificationFile(event);
        }

        // inner Html.
        const button = document.createElement('button');
        const text = document.createElement('p');
        text.innerText = file.name;
        button.addEventListener('click', () => {
          this.delDelegatedIdentificationFile(event);
        })
        button.innerText = 'X'
        const root = document.getElementById('delegatedIdentificationNm');
        root.textContent = `${file.name}  ${ '('+ this.returnFileSize(file.size, event) + ')'}`;
        root.appendChild(button);
        this.delegatedIdentificationFile = file;
      }
    },
    delDelegatedIdentificationFile(event) {
      const file = event.target.files[0];
      this.$refs.delegatedIdentificationFile.value = null;
      let element = document.getElementById("delegatedIdentificationNm");
      while (element.firstChild) {
        element.removeChild(element.firstChild);
      }
      this.delegatedIdentificationFile = null;
    },

    // 재직
    readTenureFile(event) {
      const file = event.target.files[0];
      if(this.fileExtCheck(file)) {
        if (file != null) {
          this.delTenureFile(event);
        }

        // inner Html.
        const button = document.createElement('button');
        const text = document.createElement('p');
        text.innerText = file.name;
        button.addEventListener('click', () => {
          this.delTenureFile(event);
        })
        button.innerText = 'X'
        const root = document.getElementById('tenureNm');
        root.textContent = `${file.name}  ${ '('+ this.returnFileSize(file.size, event) + ')'}`;
        root.appendChild(button);
        this.tenureFile = file;
      }
    },
    delTenureFile(event) {
      const file = event.target.files[0];
      this.$refs.tenureFile.value = null;
      let element = document.getElementById("tenureNm");
      while (element.firstChild) {
        element.removeChild(element.firstChild);
      }
      this.tenureFile = null;
    },
    //사업자 등록증.
    readBusinessFile(event) {
      const file = event.target.files[0];
      if(this.fileExtCheck(file)) {
        if (file != null) {
          this.delBusinessFile(event);
        }

        // inner Html.
        const button = document.createElement('button');
        const text = document.createElement('p');
        text.innerText = file.name;
        button.addEventListener('click', () => {
          this.delBusinessFile(event);
        })
        button.innerText = 'X'
        const root = document.getElementById('businessNm');
        root.textContent = `${file.name}  ${ '('+ this.returnFileSize(file.size, event) + ')'}`;
        root.appendChild(button);
        this.businessFile = file;
      }
    },
    delBusinessFile(event) {
      const file = event.target.files[0];
      this.$refs.businessFile.value = null;
      let element = document.getElementById("businessNm");
      while (element.firstChild) {
        element.removeChild(element.firstChild);
      }
      this.businessFile = null;
    },
    //신분증 (본인확인)
    readIdentificationCardFile(event) {
      const file = event.target.files[0];
      if(this.fileExtCheck(file)) {
        if (file != null) {
          this.delIdentificationCardFile(event);
        }

        // inner Html.
        const button = document.createElement('button');
        const text = document.createElement('p');
        text.innerText = file.name;
        button.addEventListener('click', () => {
          this.delIdentificationCardFile(event);
        })
        button.innerText = 'X'
        const root = document.getElementById('identificationCardNm');
        root.textContent = `${file.name}  ${ '('+ this.returnFileSize(file.size, event) + ')'}`;
        root.appendChild(button);
        this.identificationCardFile = file;
      }
    },
    delIdentificationCardFile(event) {
      const file = event.target.files[0];
      this.$refs.identificationCardFile.value = null;
      let element = document.getElementById("identificationCardNm");
      while (element.firstChild) {
        element.removeChild(element.firstChild);
      }
      this.identificationCardFile = null;
    },
    //재직증명서 (본인확인)
    readIdentificationEvidenceFile(event) {
      const file = event.target.files[0];
      if(this.fileExtCheck(file)) {
        if (file != null) {
          this.delIdentificationEvidenceFile(event);
        }

        // inner Html.
        const button = document.createElement('button');
        const text = document.createElement('p');
        text.innerText = file.name;
        button.addEventListener('click', () => {
          this.delIdentificationEvidenceFile(event);
        })
        button.innerText = 'X'
        const root = document.getElementById('identificationEvidenceNm');
        root.textContent = `${file.name}  ${ '('+ this.returnFileSize(file.size, event) + ')'}`;
        root.appendChild(button);
        this.identificationEvidenceFile = file;
      }
    },
    delIdentificationEvidenceFile(event) {
      const file = event.target.files[0];
      this.$refs.identificationEvidenceFile.value = null;
      let element = document.getElementById("identificationEvidenceNm");
      while (element.firstChild) {
        element.removeChild(element.firstChild);
      }
      this.identificationEvidenceFile = null;
    },
    //통신서비스 증명원
    readCommunicationFile(event) {
      const file = event.target.files[0];


      if(this.fileExtCheck(file)) {
        if (file != null) {
          this.delCommunicationFile(event);
        }

        // inner Html.
        const button = document.createElement('button');
        const text = document.createElement('p');
        text.innerText = file.name;
        button.addEventListener('click', () => {
          this.delCommunicationFile(event);
        })
        button.innerText = 'X'
        const root = document.getElementById('communicationNm');
        root.textContent = `${file.name}  ${ '('+ this.returnFileSize(file.size, event) + ')'}`;
        root.appendChild(button);
        //root.appendChild( `${this.returnFileSize(file.size)}`);
        this.communicationFile = file;       
      }
    },
    delCommunicationFile(event) {
      const file = event.target.files[0];
      this.$refs.communicationFile.value = null;
      let element = document.getElementById("communicationNm");
      while (element.firstChild) {
        element.removeChild(element.firstChild);
      }
      this.communicationFile = null;
    },
    // 타사업자 등록증
    readOtherBusinessFile(event) {
      const file = event.target.files[0];
      if(this.fileExtCheck(file)) {
        if (file != null) {
          this.delOtherBusinessFile(event);
        }

        // inner Html.
        const button = document.createElement('button');
        const text = document.createElement('p');
        text.innerText = file.name;
        button.addEventListener('click', () => {
          this.delOtherBusinessFile(event);
        })
        button.innerText = 'X'
        const root = document.getElementById('otherBusinessNm');
        root.textContent = `${file.name}  ${ '('+ this.returnFileSize(file.size, event) + ')'}`;
        root.appendChild(button);
        this.otherBusinessFile = file;
      }
    },
    delOtherBusinessFile(event) {
      const file = event.target.files[0];
      this.$refs.otherBusinessFile.value = null;
      let element = document.getElementById("otherBusinessNm");
      while (element.firstChild) {
        element.removeChild(element.firstChild);
      }
      this.otherBusinessFile = null;
    },

    /** 저장 */
    async saveSendNum() {
      this.saveSendNums = []
      this.saveSendNums.push({
        sendNm: this.sendNm,
        sendNum: this.sendNum
      })
      
      // 등록할 발신 번호 
      if (this.numberInputs.length > 0) {
        for(var i=0; i<this.numberInputs.length; i++){
          if(this.numberInputs[i].sendNm !== '' && this.numberInputs[i].sendNum !== ''){
            this.saveSendNums.push({
              sendNm: this.numberInputs[i].sendNm,
              sendNum: this.numberInputs[i].sendNum
            })
          }
        }
      }

      if (this.doValidate()) {
        if (this.bizrAuthYn !== 'Y') {
          if (this.nmineeDivCd === '01') {
            // 사업자
            const response = await sendNumMgtApi.insertNumber1(this.communicationFile,this.tenureFile,this.businessFile, this.identificationCardFile, this.identificationEvidenceFile, this.adminId, this.custNm, this.bRegNo, this.nmineeDivCd, this.saveSendNums, this.bizrAuthYn, this.custSeq, this.bRegNo)
            const result = response.data;
            // if(this.communicationFile.size >= 1024){
            //   alert('파일용량test')
            //   return false;
            // }
            
            if (result != null && result.retCode == "0000") {              
              if(result.data.list != null && result.data.list.length > 0){
                this.row.title = '발신번호 등록';
                var failMsg = "";
                for(var i=0; i<result.data.list.length; i++){
                  failMsg += "[" + (i+1) + "] " +  result.data.list[i].sendNum + "<br>"
                }
                this.row.failMsg = failMsg
                this.$parent.$refs.commmonModal.sendNumFailMsgOpen(this.row);
              }
              this.toComplete()
            }else if(result != null && result.retCode == "4021") {            
              if(result.data.list != null && result.data.list.length > 0){
                this.row.title = '발신번호 등록';
                var failMsg = "";
                for(var i=0; i<result.data.list.length; i++){
                  failMsg += "[" + (i+1) + "] " +  result.data.list[i].sendNum + "<br>"
                }
                this.row.failMsg = failMsg
                this.$parent.$refs.commmonModal.sendNumFailMsgOpen(this.row);
              }
              return false;
            }

          } else if (this.nmineeDivCd === '02') {
            // 타사업자
            const response = await sendNumMgtApi.insertNumber2(this.communicationFile, this.delegationFile, this.attorneyFile, this.otherBusinessFile ,this.delegatedIdentificationFile, this.delegateCertificateFile, this.delegatedBusinessFile, this.authorizedBusinessFile, this.corporateCertificateFile, this.identificationCardFile, this.identificationEvidenceFile, this.adminId, this.custNm, this.bRegNo, this.nmineeDivCd, this.saveSendNums, this.bizrAuthYn, this.custSeq, this.bRegNo)
            
            const result = response.data;                        
            if (result != null && result.retCode == "0000") {              
              if(result.data.list != null && result.data.list.length > 0){                
                  this.row.title = '발신번호 등록';
                  var failMsg = "";
                  for(var i=0; i<result.data.list.length; i++){
                    failMsg += "[" + (i+1) + "] " +  result.data.list[i].sendNum + "<br>"
                  }
                  this.row.failMsg = failMsg
                  this.$parent.$refs.commmonModal.sendNumFailMsgOpen(this.row);
              }
              this.toComplete()
            }else if(result != null && result.retCode == "4021") {              
              if(result.data.list != null){                
                if(result.data.list.length > 0){                  
                  this.row.title = '발신번호 등록';
                  var failMsg = "";
                  for(var i=0; i<result.data.list.length; i++){
                    failMsg += "[" + (i+1) + "] " +  result.data.list[i].sendNum + "<br>"
                  }
                  this.row.failMsg = failMsg
                  this.$parent.$refs.commmonModal.sendNumFailMsgOpen(this.row);
                }
              }
              return false;
            }

          }
        } else {
          const response = await sendNumMgtApi.insertNumber(this.adminId, this.custNm, this.bRegNo, this.nmineeDivCd, this.saveSendNums, this.bizrAuthYn, this.custSeq, this.bRegNo)
          const result = response.data;          
          if (result != null && result.retCode == "0000") {            
            if(result.data.list != null && result.data.list.length > 0){
              this.row.title = '발신번호 등록';
              var failMsg = "";
              for(var i=0; i<result.data.list.length; i++){
                failMsg += "[" + (i+1) + "] " +  result.data.list[i].sendNum + "<br>"
              }
              this.row.failMsg = failMsg
              this.$parent.$refs.commmonModal.sendNumFailMsgOpen(this.row);
            }
            this.toComplete()
          }else if(result != null && result.retCode == "4021") {            
            var failMsg = "";
            for(var i=0; i<result.data.list.length; i++){
              failMsg += "[" + (i+1) + "] " +  result.data.list[i].sendNum + "<br>"
            }
            this.row.failMsg = failMsg
            this.$parent.$refs.commmonModal.sendNumFailMsgOpen(this.row);
            return false;
          }
        }
      }
    },
    doValidate() {
      if (this.isNull(this.adminId) || this.isNull(this.custNm) || this.isNull(this.bRegNo)) {
        this.row.title = '발신번호 등록';
        this.row.msg1 = '관리자ID를 조회 해주세요.';
        // this.getParent('NumberList').commonModalOpen(this.row)
        this.$parent.$refs.commmonModal.alertModalOpen(this.row);
        return false;
      }
      if (this.isNull(this.sendNm) || this.isNull(this.sendNum)) {
        this.row.title = '발신번호 등록';
        this.row.msg1 = '발신번호명/발신번호를 입력해 주세요.';
        this.$parent.$refs.commmonModal.alertModalOpen(this.row);
        return false;
      }
      if (this.bizrAuthYn !== 'Y') {
        if (this.nmineeDivCd == '01') {
          if (this.communicationFile == null) {
            this.row.title = '발신번호 등록';
            this.row.msg1 = '통신서비스 이용증명원 파일을 업로드 하세요.';
            this.$parent.$refs.commmonModal.alertModalOpen(this.row);
            return false
          }

          if (this.businessFile == null) {
            this.row.title = '발신번호 등록';
            this.row.msg1 = '사업자등록증 파일을 업로드 하세요.';
            this.$parent.$refs.commmonModal.alertModalOpen(this.row);
            return false
          }

        } else {
          if (this.delegationFile == null) {
            this.row.title = '발신번호 등록';
            this.row.msg1 = '위임-수임사간 관계 확인 문서 파일을 업로드 하세요.';
            this.$parent.$refs.commmonModal.alertModalOpen(this.row);
            return false
          }
          if (this.attorneyFile == null) {
            this.row.title = '발신번호 등록';
            this.row.msg1 = '위임장 파일을 업로드 하세요.';
            this.$parent.$refs.commmonModal.alertModalOpen(this.row);
            return false
          }
          if (this.corporateCertificateFile == null) {
            this.row.title = '발신번호 등록';
            this.row.msg1 = '법인인감증명서 파일을 업로드 하세요.';
            this.$parent.$refs.commmonModal.alertModalOpen(this.row);
            return false
          }
          if (this.delegatedBusinessFile == null) {
            this.row.title = '발신번호 등록';
            this.row.msg1 = '위임사 사업자등록증 파일을 업로드 하세요.';
            this.$parent.$refs.commmonModal.alertModalOpen(this.row);
            return false
          }
          if (this.authorizedBusinessFile == null) {
            this.row.title = '발신번호 등록';
            this.row.msg1 = '수임사 사업자등록증 파일을 업로드 하세요.';
            this.$parent.$refs.commmonModal.alertModalOpen(this.row);
            return false
          }
          if (this.otherBusinessFile == null) {
            this.row.title = '발신번호 등록';
            this.row.msg1 = '사업자등록증 파일을 업로드 하세요.';
            this.$parent.$refs.commmonModal.alertModalOpen(this.row);
            return false
          }
        }
      }
      return true;
    },
    toComplete() {      
      this.getParent('numberList').$refs.table.reloadData();      
      this.numberRegPopClose();      
    },
  }
}
</script>