<template>
  <div class="content-zone full-page">
    <div class="content">
      <div class="scroll">
        <div open class="form-box">
          <div class="form-box-title">
            <p>기본정보</p>
            <p><span>*</span>로그인 정책을 변경하면 전체 사용자가 로그아웃됩니다.</p>
          </div>
          <div class="form-content">
            <div class="layout">
              <label class="form-title">중복로그인 설정</label>
              <div class="form-group">
                <div class="check-area">
                  <div class="form-check">
                    <input type="radio" id="allowMultipleLoginY" class="mr5" value="Y" v-model="allowMultipleLogin"
                      @change="saveByLoginPolicy" />
                    <label for="allowMultipleLoginY">허용</label>
                  </div>
                  <div class="form-check">
                    <input type="radio" id="allowMultipleLoginN" class="mr5" value="N" v-model="allowMultipleLogin"
                      @change="saveByLoginPolicy" />
                    <label for="allowMultipleLoginN">비허용</label>
                  </div>
                </div>
                <!--    <p>{{ allowMultipleLogin ? '중복 로그인을 허용하고 있습니다.' : '중복 로그인을 허용하지 않습니다.' }}</p>-->
              </div>
            </div>
            <div class="layout border-bottom">
              <label class="form-title">로그인 방식 설정</label>
              <div class="form-group">
                <div class="check-area">
                  <div class="form-check">
                    <input type="radio" id="loginModeJ" class="mr5" value="J" v-model="lgnMode"
                      @change="saveByLoginMode" />
                    <label for="loginModeJ">JWT 방식</label>
                  </div>
                  <div class="form-check">
                    <input type="radio" id="loginModeS" class="mr5" value="S" v-model="lgnMode"
                      @change="saveByLoginMode" />
                    <label for="loginModeS">SESSION 방식</label>
                  </div>
                </div>
                <!-- <span class="ml10 gray">
                  현재 로그인 방식은 <strong>{{ loginModeLabel }}</strong> 입니다.
                </span> -->
              </div>
            </div>
            <div class="layout">
              <label class="form-title">Context Path 설정</label>
              <div class="form-group">
                <div class="check-area">
                  <div class="form-check">
                    <input type="text" id="cntxtPth" class="form-control sm" v-model="cntxtPth" ref="cntxtPth" />
                  </div>
                  <button class="btn sm main" @click="fnSave">저장</button>
                </div>
                <span class="ml10 gray">
                  <strong>/경로</strong> 형식으로 입력해주세요.
                </span>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { findAllByLoginPolicy, saveByLoginPolicy, findAllByLoginMode, saveByLoginMode } from '../../../../../resources/api/loginPolicy.js';
import { getCntxtPth, saveCntxtPth } from '../../../../../resources/api/cntxtPth';
import { cacheReSet } from "../../../../../resources/api/cacheReSet";
import store from "../../../../../views/pages/AppStore";
export default {
  data() {
    return {
      allowMultipleLogin: null,
      lgnMode: null,
      previousLgnMode: null, // 이전 로그인 모드 저장
      previousAllowMultipleLogin: null,

      cntxtPth: '/', // context path 초기값
      defaultCntxtPth: null, // 현재 설정된 Context Path
    }
  },
  created() {
    this.findAll();
    this.findCntxtPth();
  },
  mounted() {
  },
  computed: {
    // loginModeLabel() {
    //   return this.lgnMode === 'J' ? 'JWT' : 'SESSION';
    // }
  },
  methods: {
    async findAll() {
      try {
        const res1 = await findAllByLoginPolicy();
        this.allowMultipleLogin = res1.data.data === true ? 'Y' : 'N';
        this.previousAllowMultipleLogin = this.allowMultipleLogin;
        const res2 = await findAllByLoginMode();
        this.lgnMode = res2.data.data;
        this.previousLgnMode = this.lgnMode; // 초기 상태를 저장
      } catch (err) {
        alert('설정 정보를 불러오는 데 실패했습니다.');
      }
    },
    async saveByLoginPolicy() {
      const confirmed = confirm(
        '로그인 설정을 변경하면 전체 사용자가 로그아웃됩니다.\n계속하시겠습니까?'
      );
      if (!confirmed) {
        this.allowMultipleLogin = this.previousAllowMultipleLogin;
        return;
      }

      try {
        const loginPolicy = {};
        loginPolicy.allowMultipleLogin = this.allowMultipleLogin;
        await saveByLoginPolicy(loginPolicy);
        alert('중복 로그인 설정이 저장되었습니다.');
        store.commit("setStoreReset");
        window.location = this.$filters.ctxPath('/login.page');
      } catch (err) {
        alert('중복 로그인 설정 저장 실패'+ (err.response?.data?.message || err.message));
        this.allowMultipleLogin = this.previousAllowMultipleLogin;
      }
    },
    async saveByLoginMode() {
      const confirmed = confirm(
        '로그인 방식을 변경하면 전체 사용자가 로그아웃됩니다.\n계속하시겠습니까?'
      );
      if (!confirmed) {
        this.lgnMode = this.previousLgnMode;
        return;
      }

      try {
        const loginMode = {};
        loginMode.lgnMode = this.lgnMode;
        await saveByLoginMode(loginMode);
        alert('로그인 방식이 변경되었습니다.\n다시 로그인해주세요.');
        store.commit("setStoreReset");
        window.location = this.$filters.ctxPath('/login.page');
      } catch (err) {
        alert('로그인 방식 저장 실패: ' + (err.response?.data?.message || err.message));
        this.lgnMode = this.previousLgnMode;
      }
    },

    // 최신 Context Path 조회
    async findCntxtPth() {
      try {
        const res = await getCntxtPth();
        if (res.status == 200) {
          this.cntxtPth = res.data.data;
          this.defaultCntxtPth = res.data.data;
        }
      } catch (error) {
        alert(error.response.data.message);
      }
    },

    // Context Path 저장
    async fnSave() {
      if (!this.validation()) {
        return;
      }
      const isCheck = confirm("Context Path를 변경하면 로그아웃됩니다.\n계속하시겠습니까?");
      // const isCheck = confirm("Context Path를 변경하시겠습니까?");
      if (isCheck) {
        try {
          let ctx = { path: this.cntxtPth };
          const res = await saveCntxtPth(ctx);
          alert(res.data.message);
          if (res.status == 200) {
            let storeCtx = this.cntxtPth;
            if (storeCtx == '/') {
              storeCtx = '';
            }
            store.commit("setContextPath", storeCtx); // 캐시 초기화 요청을 보내기 위한 Context Path 정보 저장
            await this.$store.dispatch("logout");
            /* const cacheRes = await cacheReSet(); // 캐시 초기화
            if (cacheRes.status !== 200) {
              alert(cacheRes.data.message);
            }
            store.commit("setStoreReset"); // 캐시 초기화 후 Store 초기화
            store.commit("setContextPath", storeCtx); // 라우터 Context Path 정보 저장
            window.location.href = `${storeCtx}/login.page`;
            // window.location.href = `${storeCtx}/adm/main.page`; */
          } else {
            alert(res.data.message);
          }
        } catch (error) {
          alert('에러가 발생했습니다.\n시스템관리자에게 문의하세요.');
        }
      }
    },

    // 유효성 검사
    validation() {
      const regex = /^\/[a-zA-Z0-9\-_]*$/;
      if (this.cntxtPth == null || this.cntxtPth == "") {
        alert("Context Path를 입력해주세요.");
        this.$refs.cntxtPth.focus();
        return false;
      }
      if (this.cntxtPth.length > 50) {
        alert("Context Path는 50자 이내로 입력해주세요.");
        this.$refs.cntxtPth.focus();
        return false;
      }
      if (this.cntxtPth == this.defaultCntxtPth) {
        alert("변경된 내용이 없습니다.");
        this.$refs.cntxtPth.focus();
        return false;
      }
      if (!regex.test(this.cntxtPth)) {
        alert("Context Path는 '/'로 시작해야 하며, 알파벳, 숫자, '-' 또는 '_'만 포함할 수 있습니다.");
        this.$refs.cntxtPth.focus();
        return false;
      }
      return true;
    },
  }
}
</script>