import { createStore } from "vuex";
import createPersistedState from "vuex-persistedstate";
import { logOutProc } from "../../resources/api/logOut"

export default createStore({
  plugins: [createPersistedState({
    paths: ['loginMode', 'authorization', 'mbrId', 'mbrNm', 'roles', 'contextPath', 'pageAuth']
  })],
  state: {
    authorization: null,
    // refresh: null,
    loginMode: 'J',
    userType: "portal",
    menu: null,
    path: null,
    roles: [{authority: "ROLE_NONE"}],
    pageAuth: null,
    contextPath: null,
  },
  getters: {
    getAuthorization: function () {},
    // getRefresh: function () {},
    getMbrNm: function () {},
    getRoles: function () {},
    getLoginMode: state => state.loginMode,
  },
  mutations: {
    setAuthorization(state, newValue) {
      state.authorization = newValue;
    },
    // setRefresh(state, newValue) {
    //   state.refresh = newValue;
    // },
    setMbrNm(state, newValue) {
      state.mbrNm = newValue;
    },
    setMbrId(state, newValue) {
      state.mbrId = newValue;
    },
    setRoles(state, newValue) {
      state.roles = newValue;
    },
    setUserType(state, newValue) {
      state.userType = newValue;
    },
    setMenu(state, newValue) {
      state.menu = newValue;
    },
    setPath(state, newValue) {
      state.path = newValue;
    },
    setStoreReset(state) {
      state.authorization = null;
      // state.refresh = null;
      state.loginMode = 'J';
      state.mbrNm = null;
      state.mbrId = null;
      state.roles = [{authority: "ROLE_NONE"}];
      state.menu = null;
      state.pageAuth = null;
      state.contextPath = null;
    },
    setPageAuth(state, newValue) {
      state.pageAuth = newValue;
    },
    setMenuList(state, menuList) {
      state.menuList = menuList;
      // 메뉴트리 펼치기
      const flattenMenus = (menus) => {
        const result = [];

        for (const menu of menus) {
          result.push(menu);
          if (menu.childList?.length) {
            result.push(...flattenMenus(menu.childList));
          }
        }

        return result;
      }
      const flattenedMenuList = flattenMenus(menuList);
      state.flatMenuList = flattenedMenuList;
    },
    setContextPath(state, ctx) {
      state.contextPath = ctx;
    },
    setLoginMode(state, value) {
      state.loginMode = value;
    },
  },
  actions: {
    async logout({ commit }) {
      try {
        const ctx = this.state.contextPath; // 캐시 초기화 전 contextPath 저장
        const admPath = this.state.path?.includes("/adm") // 캐시 초기화 전 경로 구분 (true: 관리자 페이지, false: 사용자 페이지)
        const loginMode = this.state.loginMode; // 로그인 모드 확인
        
        console.log("로그아웃 처리 시작 - 로그인 모드:", loginMode);
        
        // 로그인 모드에 따른 처리
        if (loginMode === 'J') {
          // JWT 방식인 경우만 서버 API 호출
          try {
            const res = await logOutProc();
            alert(res.data.message);
          } catch (error) {
            console.log("JWT 로그아웃 API 에러, 클라이언트만 정리:", error);
            // API 에러가 발생해도 클라이언트는 정리
          }
        } else {
          // 세션 방식 (OAuth 포함)은 서버 API 호출 없이 클라이언트만 정리
          console.log("세션 방식 로그아웃 - 클라이언트만 정리");
        }
        
        // 공통 클라이언트 정리 작업
        // 1. 상태 초기화
        commit("setStoreReset");
        
        // 2. 로컬스토리지와 세션스토리지 초기화
        localStorage.clear();
        sessionStorage.clear();

        // 3. 쿠키 삭제
        document.cookie = "refresh=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
        document.cookie = "Authorization=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
        document.cookie = "JSESSIONID=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
        
        console.log("로그아웃 완료");
        
        // 4. 로그인 페이지로 이동
        if(admPath) {
          window.location = ctx + "/cmslogin.page";
        } else {
          window.location = ctx + "/login.page";
        }
        
      } catch(error) {
        console.error("로그아웃 처리 중 오류:", error);
        
        // 에러가 발생해도 클라이언트 상태는 정리
        commit("setStoreReset");
        localStorage.clear();
        sessionStorage.clear();
        
        const ctx = this.state.contextPath;
        const admPath = this.state.path?.includes("/adm");
        
        // 에러 메시지 표시
        const errorData = error.response?.data;
        if (errorData?.message) {
          alert(errorData.message);
        } else {
         
        }
        
        // 로그인 페이지로 이동
        if(admPath) {
          window.location = ctx + "/cmslogin.page";
        } else {
          window.location = ctx + "/login.page";
        }
      }
    },
    setUserType({ commit }, userType) {
      commit("setUserType", userType);
    },
    setMenu({ commit }, menu) {
      commit("setMenu", menu);
    },
    setPath({ commit }, path) {
      commit("setPath", path);
    },
    setPageAuth({ commit }, pageAuth) {
      commit("setPageAuth", pageAuth);
    },
    setStoreReset({commit}) {
      commit("setStoreReset");
    },
  },
});