140 lines
3.9 KiB
JavaScript
140 lines
3.9 KiB
JavaScript
import { createRouter, createWebHistory } from 'vue-router'
|
|
import { useAuthStore } from '@s/useAuthStore';
|
|
|
|
|
|
// 초기 렌더링 속도를 위해 지연 로딩 사용
|
|
const routes = [
|
|
{
|
|
path: '/',
|
|
name: "Home",
|
|
component: () => import('@v/MainView.vue'),
|
|
// meta: { requiresAuth: true }
|
|
},
|
|
{
|
|
path: '/board',
|
|
component: () => import('@v/board/TheBoard.vue'),
|
|
children: [
|
|
{
|
|
path: '',
|
|
name: 'BoardList',
|
|
component: () => import('@v/board/BoardList.vue')
|
|
},
|
|
{
|
|
path: 'write',
|
|
component: () => import('@v/board/BoardWrite.vue')
|
|
},
|
|
{
|
|
path: ':id',
|
|
name: 'BoardDetail',
|
|
component: () => import('@v/board/BoardView.vue')
|
|
},
|
|
{
|
|
path: 'edit/:id',
|
|
name: 'BoardEdit',
|
|
component: () => import('@v/board/BoardEdit.vue')
|
|
}
|
|
]
|
|
},
|
|
{
|
|
path: '/wordDict',
|
|
component: () => import('@v/wordDict/wordDict.vue'),
|
|
},
|
|
{
|
|
path: '/login',
|
|
name: 'Login',
|
|
component: () => import('@v/user/TheLogin.vue'),
|
|
meta: { layout: 'NoLayout', requiresGuest: true },
|
|
},
|
|
{
|
|
path: '/register',
|
|
name: 'Register',
|
|
component: () => import('@v/user/TheRegister.vue'),
|
|
meta: { layout: 'NoLayout', requiresGuest: true },
|
|
},
|
|
{
|
|
path: '/pw',
|
|
name: 'Password',
|
|
component: () => import('@v/user/ThePassword.vue'),
|
|
meta: { layout: 'NoLayout', requiresGuest: true },
|
|
},
|
|
{
|
|
path: '/vacation',
|
|
component: () => import('@v/vacation/VacationManagement.vue'),
|
|
},
|
|
{
|
|
path: '/voteboard',
|
|
component: () => import('@v/voteboard/TheVoteBoard.vue'),
|
|
children: [
|
|
{
|
|
path: '',
|
|
component: () => import('@v/voteboard/voteBoardList.vue')
|
|
},
|
|
{
|
|
path: 'write',
|
|
component: () => import('@v/voteboard/voteboardWrite.vue')
|
|
},
|
|
|
|
]
|
|
},
|
|
{
|
|
path: '/projectlist',
|
|
component: () => import('@v/projectlist/TheProjectList.vue'),
|
|
},
|
|
{
|
|
path: '/commuters',
|
|
component: () => import('@v/commuters/TheCommuters.vue'),
|
|
},
|
|
{
|
|
path: '/sample',
|
|
component: () => import('@c/calendar/SampleCalendar.vue'),
|
|
},
|
|
{
|
|
path: "/:anything(.*)",
|
|
component: () => import('@v/ErrorPage.vue'),
|
|
}
|
|
];
|
|
|
|
const router = createRouter({
|
|
history: createWebHistory(import.meta.env.BASE_URL),
|
|
routes: routes,
|
|
})
|
|
|
|
router.beforeEach(async (to, from, next) => {
|
|
const authStore = useAuthStore();
|
|
await authStore.checkAuthStatus(); // 로그인 상태 확인
|
|
|
|
if (to.meta.requiresAuth && !authStore.isAuthenticated) {
|
|
// 로그인이 필요한 페이지인데 로그인되지 않은 경우 → 로그인 페이지로 이동
|
|
next({ name: 'Login' });
|
|
} else if (to.meta.requiresGuest && authStore.isAuthenticated) {
|
|
// 비로그인 사용자만 접근 가능한 페이지인데 로그인된 경우 → 홈으로 이동
|
|
next({ name: 'Home' });
|
|
} else {
|
|
next();
|
|
}
|
|
});
|
|
|
|
|
|
router.beforeEach(async (to, from, next) => {
|
|
const authStore = useAuthStore()
|
|
|
|
// 최초 앱 로드 시 인증 상태 체크
|
|
await authStore.checkAuthStatus()
|
|
|
|
// 현재 라우트에 인증이 필요한지 확인
|
|
const requiresAuth = to.meta.requiresAuth === true
|
|
|
|
if (requiresAuth && !authStore.isAuthenticated) {
|
|
// 인증되지 않은 사용자를 로그인 페이지로 리다이렉트
|
|
// 원래 가려던 페이지를 쿼리 파라미터로 전달
|
|
next({
|
|
name: 'Login',
|
|
query: { redirect: to.fullPath }
|
|
})
|
|
} else {
|
|
next()
|
|
}
|
|
})
|
|
|
|
export default router
|