<template>

  <div>
    <div class="dimmed modal21" @click="adminDetailModalClose();"></div>
    <div class="popup-wrap modal21">
      <!-- 관리자/유치채널 상세정보 -->
      <div class="popup modal21 popup_form">
        <div class="pop-head">
          <h3 class="pop-tit">관리자 상세정보</h3>
        </div>
        <form autocomplete="off">
          <table>
            <tbody>
            <tr>
              <th>ID</th>
              <td><input type="text" disabled v-model.trim="madangId" ref="_madangId2"></td>
            </tr>         
            <tr>
              <th>
                비밀번호
              </th>
              <td>
              <button class="button grey Ty02" @click.self.prevent="ajaxReset">비밀번호 초기화 문자 발송하기</button>
              </td>
            </tr>
            <tr>
              <th>이름</th>
              <td><input type="text" disabled v-model.trim="userNm" ref="_userNm"></td>
            </tr>
            <tr>
              <th>휴대폰번호</th>
              <td><input type="number" disabled v-model.trim="mdn" ref="_phone"></td>
            </tr>
            <tr>
              <th>이메일</th>
              <td><input type="email" disabled v-model.trim="email" ref="_email"></td>
            </tr>
            <tr>
              <th>권한</th>
              <td>
                <div v:class="select_box">
                  <select name="" id="right" v-model="auth" ref="_auth">
                    <option value="">선택</option>
                    <option
                        v-for="(option, i) in authType"
                        v-bind:value="option.autCd"
                        v-bind:key="i"
                        :selected="auth === option.autCd">
                      {{ option.autNm }}
                    </option>
                  </select>
                </div>
              </td>
            </tr>
            <tr>
              <th class="center">상태</th>
              <td>
                <input type="radio" name="state" value="01" id="detail_popup_radio1" v-model="stat">
                <label for="detail_popup_radio1">사용</label>
                <input type="radio" name="state" value="02" id="detail_popup_radio2" v-model="stat">
                <label for="detail_popup_radio2">정지</label>
              </td>
            </tr>
            </tbody>
          </table>
        </form>
        <div class="popup-btn2">
          <button class="btn-pcolor" @click="doInsert">저장</button>
          <button class="btn-default" @click="adminDetailModalClose();">취소</button>
        </div>
      </div>
      <!-- 관리자 상세정보 팝업 끝-->
    </div>
    <!--    <common-modal ref="commmonModal"></common-modal>-->
  </div>
</template>


<script>
import api from '@/service/api';
import sysMgtApi from "../service/sysMgtApi.js";
import {utils_mixin, chkPattern2} from '../service/mixins';
import lodash from "lodash";
// import commonModal from "../components/commonModal";
import SearchIdPopup from "@/modules/sysMgt/components/SearchIdPopup";

export default {
  name: "adminDetailPop",
  mixins: [utils_mixin, chkPattern2],
  watch: {
    stat() {
    }
  },
  data() {
    return {
      row: {},
      authType: [],

      madangId: '',
      name: '',
      mdn: '',
      email: '',
      auth: '',
      stat: "",
      userNm: "",
      userPwd1: "",
      userPwd2: "",
      code: "",
    }
  },
  model: {
    prop: 'sendData',
    event: 'event-data'
  },
  props: ['sendData'],
  created() {
    //this.formReset();
    this.setAuthData();
    this.formReset();
  },
  components: {
    // commonModal,
  },
  methods: {
    async ajaxReset(){
      var params =
      {
        "userId": this.madangId
      }
      try {
        const response = await sysMgtApi.resetPassword(params)
        const rsp = response.data;

        if(rsp.retCode == '0000'){
          this.row.title = '비밀번호 초기화';
          this.row.msg1 = '등록된 휴대폰 번호로 초기화된 비밀번호가';
          this.row.msg2 = '발송되었습니다.';
          this.$parent.$refs.commmonModal.alertModalOpen(this.row);
        }
      } catch(err){
        this.row.title = '비밀번호 초기화';
        this.row.msg1 = '실패 하였습니다.';
        this.$parent.$refs.commmonModal.alertModalOpen(this.row);
        return false;
      }

    },

    doPwdValidate() {
      if (this.isNull(this.userPwd2)) {
        this.row.title = '관리자/유치채널 관리';
        this.row.msg1 = '비밀번호를 입력해 주세요.';
        this.$parent.$refs.commmonModal.alertModalOpen(this.row);
        this.$refs._pwd2.focus();
        return false;
      }
      if (!lodash.isEqual(this.userPwd1, this.userPwd2)) {
        // alert("비밀번호가 일치하지 않습니다.");
        this.row.title = '관리자/유치채널 관리';
        this.row.msg1 = '비밀번호가 일치하지 않습니다.';
        this.$parent.$refs.commmonModal.alertModalOpen(this.row);
        this.$refs._pwd2.focus();
        return false;
      }
      const pwdLen = this.bytes(this.userPwd1);
      if (!(pwdLen >= 8 && pwdLen <= 16)) {
        // alert("비밀번호는 8~16자의 영문, 숫자, 특수문자(!,@, $, %, ^, &, *) 조합이 필요합니다.");
        this.row.title = '관리자/유치채널 관리';
        this.row.msg1 = '비밀번호는 8~16자의 영문, 숫자, 특수문자(!,@, $, %, ^, &, *) 조합이 필요합니다.';
        this.$parent.$refs.commmonModal.alertModalOpen(this.row);
        this.$refs._pwd1.focus();
        return false;
      }
      const pEng = /[A-Za-z]/g;	// 영문자
      const pNum = /[0-9]/g;	// 숫자
      const pSpc = /[!@$%^&*]/g; // 특수문자
      if (!(pEng.test(this.userPwd1) && pNum.test(this.userPwd1) && pSpc.test(this.userPwd1))) {
        // alert("비밀번호는 8~16자의 영문, 숫자, 특수문자(!,@, $, %, ^, &, *) 조합이 필요합니다.");
        this.row.title = '관리자/유치채널 관리';
        this.row.msg1 = '비밀번호는 8~16자의 영문, 숫자, 특수문자(!,@, $, %, ^, &, *) 조합이 필요합니다.';
        this.$parent.$refs.commmonModal.alertModalOpen(this.row);
        this.$refs._pwd1.focus();
        return false;
      }
      this.row.adminPw = this.userPwd1;
      return true;
    },
    doValidate() {
      if (!this.isNull(this.userPwd1)) {
        if (!this.doPwdValidate()) {
          return false;
        }
      }
      if (!this.isNull(this.auth)) {
        if (this.code == '') {
          this.row.auth = this.auth;
        } else {
          this.row.auth = this.auth;
        }
      }
      if (!this.isNull(this.stat)) {
        this.row.stat = this.stat;
      }
      this.row.adminId = this.madangId;
      return true;
    },
    // 모달 띄우기
    async adminDetailModalOpen(props) {
      this.formReset();
      this.setAuthData();
      this.row.adminId = props.adminId;
      try {
        const response = await sysMgtApi.adminDetail(this.row);
        const result = response.data;
        if (result != null && result.retCode == "0000") {
          this.madangId = result.data.adminId;
          this.auth = result.data.auth;
          this.userNm = result.data.name;
          this.email = result.data.email;
          this.mdn = result.data.mdn;
          this.stat = result.data.stat;
        }
      } catch (err) {
        this.row.title = '관리자/유치채널 관리';
        this.row.msg1 = '실패 하였습니다.';
        this.$parent.$refs.commmonModal.alertModalOpen(this.row);
      }
      var dimmed = document.getElementsByClassName('modal21');
      for (var i = 0; i < dimmed.length; i++) {
        dimmed[i].style.display = 'block';
      }
    },
    // 모달 끄기
    adminDetailModalClose() {
      var dimmed = document.getElementsByClassName('modal21');
      for (var i = 0; i < dimmed.length; i++) {
        dimmed[i].style.display = 'none';
      }
    },
    toComplete() {
      this.getParent('adminList').$refs.table.reloadData();
      this.adminDetailModalClose();
    },
    async doInsert() {

      if (this.doValidate()) {
        try {
          const response = await sysMgtApi.updateAdmin(this.row);
          const result = response.data;
          if (result != null && result.retCode == "0000") {
            this.toComplete();
          }
        } catch (err) {
          this.row.title = '관리자/유치채널 관리';
          this.row.msg1 = '실패 하였습니다.';
          this.$parent.$refs.commmonModal.alertModalOpen(this.row);
        }
      }
    },
    async setAuthData() {
      // 권한 옵션.
      // api.commAuth().then(response => {
      //   this.authType = response.data.data.list;
      // });
      try {
				const response = await api.commAuth();
				if(response.data.retCode == '0000'){
					this.authType = response.data.data.list;
				}				
			}catch(err){
				
			}
    },
    formReset() {
      var type = this.insertType;
      Object.assign(this.$data, this.$options.data());
      this.insertType = type;
    },
  }
}
</script>