[UI 개선] 서브메뉴 및 탭 바 컴포넌트 추가, AppHeader 및 기본 레이아웃 수정, API 호출 로직 개선

stores/permissions.ts

@@ -39,7 +39,7 @@ export const usePermissionsStore = defineStore(
         */
 
         // 임시 가데이터 사용
-        await new Promise(resolve => setTimeout(resolve, 500)); // 로딩 시뮬레이션
+        await new Promise(resolve => setTimeout(resolve, 3000)); // 로딩 시뮬레이션
 
         permissions.value = {
           resources: {

stores/tab.ts

@@ -1,6 +1,6 @@
 import { defineStore } from "pinia";
 
-interface Tab {
+export interface Tab {
   key: number; // 1~10
   label: string;
   to: string; // 페이지 라우트
@@ -46,7 +46,7 @@ export const useTabsStore = defineStore("tabs", {
       $router.push(`/${tab?.key}${tab?.to}`);
     },
 
-    // 활설 탭 제거
+    // 활성 탭 제거
     removeTab(key: number) {
       this.tabs = this.tabs.filter(t => t.key !== key);
       if (this.activeTab === key) {
@@ -58,6 +58,7 @@ export const useTabsStore = defineStore("tabs", {
 
     // 활성 탭 변경
     setActiveTab(key: number) {
+      console.log("tab.ts - setActiveTab", key);
       const { $router } = useNuxtApp();
       this.activeTab = key;
 
@@ -67,11 +68,12 @@ export const useTabsStore = defineStore("tabs", {
 
     // 탭 초기화
     resetTabs() {
-      const { $router } = useNuxtApp();
-
-      this.tabs = [defaultTab];
+      console.log("tab.ts - resetTabs");
+      this.tabs = [{ ...defaultTab }];
       this.activeTab = 1;
-      $router.push(defaultTab.to);
+      console.log("tab.ts - tabs:", this.tabs);
+      console.log("tab.ts - activeTab:", this.activeTab);
+      console.log("tab.ts - resetTabs 완료");
     },
   },
   persist: true,

stores/user.ts

@@ -9,7 +9,6 @@ export const useUserStore = defineStore(
       userId?: string;
       name?: string;
     } | null>(null);
-    const token = ref<string | null>(null);
 
     // 권한 스토어 참조
     const permissionsStore = usePermissionsStore();
@@ -48,37 +47,38 @@ export const useUserStore = defineStore(
       }
     };
 
-    const logout = () => {
-      user.value = null;
-      isLoggedIn.value = false;
+    const logout = async () => {
+      try {
+        const response = await useApi("/members/logout", {
+          method: "post",
+          loadingMessage: "로그아웃 처리중...",
+          handleError: false,
+          showAlert: false,
+        });
 
-      // 권한 데이터 초기화
-      permissionsStore.clearPermissions();
-      // 탭 초기화
-      tabsStore.resetTabs();
+        console.log("response:", response);
+      } catch (error) {
+        console.error(error);
+      } finally {
+        user.value = null;
+        isLoggedIn.value = false;
 
-      useApi("/members/logout", { method: "post" });
-    };
+        tabsStore.resetTabs();
+        permissionsStore.clearPermissions();
 
-    const setToken = (accessToken: string) => {
-      token.value = accessToken;
-    };
-
-    const getToken = () => {
-      return token;
+        // 로그인 페이지로 이동
+        await navigateTo("/login");
+      }
     };
 
     return {
       // 상태
       isLoggedIn,
       user,
-      token,
 
       // 액션
       login,
       logout,
-      setToken,
-      getToken,
     };
   },
   {