music-admin/app.vue

<script setup lang="ts">
import UpgradeToPro from '@/components/UpgradeToPro.vue'

const { isMobile } = useDevice()
if (isMobile)
  configStore.appContentLayoutNav = 'vertical'

// 인증 상태 관리
const token = useCookie('auth-token')
const userInfo = useCookie('user-info')

// 사용자 정보 상태
const currentUser = ref(null)

// 앱 초기화 시 사용자 정보 설정
onMounted(() => {
  if (userInfo.value) {
    try {
      currentUser.value = JSON.parse(userInfo.value)
    } catch (error) {
      console.error('사용자 정보 파싱 오류:', error)
      // 잘못된 사용자 정보가 있으면 삭제
      userInfo.value = null
      token.value = null
    }
  }
})

// 로그아웃 함수
const logout = () => {
  token.value = null
  userInfo.value = null
  currentUser.value = null
  navigateTo('/login')
}

// 전역으로 사용할 수 있도록 provide
provide('currentUser', currentUser)
provide('logout', logout)

// 라우터 가드 설정 (클라이언트 사이드에서만)
if (process.client) {
  const router = useRouter()
  
  // 라우트 변경 시 인증 체크
  router.beforeEach((to, from, next) => {
    // 로그인/회원가입 페이지는 인증 체크 제외
    if (to.path === '/login' || to.path === '/register') {
      // 이미 로그인된 사용자는 대시보드로 리다이렉션
      if (token.value) {
        next('/dashboard')
      } else {
        next()
      }
      return
    }

    // 토큰이 없으면 로그인 페이지로 리다이렉션
    if (!token.value) {
      next('/login')
      return
    }

    next()
  })
}
</script>

<template>
  <VApp>
    <NuxtLayout>
      <NuxtPage />
    </NuxtLayout>
    <UpgradeToPro />
  </VApp>
</template>