import { defineRouter } from '#q-app/wrappers'; import { createRouter, createMemoryHistory, createWebHistory, createWebHashHistory } from 'vue-router'; import routes from './routes'; import { useAuthStore } from 'stores/auth'; // Import the auth store /* * If not building with SSR mode, you can * directly export the Router instantiation; * * The function below can be async too; either use * async/await or return a Promise which resolves * with the Router instance. */ export default defineRouter(function({ store /* { store, ssrContext } */ }) { const createHistory = process.env.SERVER ? createMemoryHistory : (process.env.VUE_ROUTER_MODE === 'history' ? createWebHistory : createWebHashHistory); const Router = createRouter({ scrollBehavior: () => ({ left: 0, top: 0 }), routes, // Leave this as is and make changes in quasar.conf.js instead! // quasar.conf.js -> build -> vueRouterMode // quasar.conf.js -> build -> publicPath history: createHistory(process.env.VUE_ROUTER_BASE) }); // Navigation Guard using Pinia store Router.beforeEach(async(to, from, next) => { const authStore = useAuthStore(store); // Get store instance // Ensure auth status is checked, especially on first load or refresh // This check might be better placed in App.vue or a boot file if (!authStore.user && !authStore.loading) { // Check only if user is not loaded and not already loading try { await authStore.checkAuthStatus(); } catch (e) { // console.error('Initial auth check failed', e); // Decide how to handle initial check failure (e.g., proceed, redirect to error page) } } const requiresAuth = to.matched.some(record => record.meta.requiresAuth); const publicPages = ['/login', '/register']; const isPublicPage = publicPages.includes(to.path); const isAuthenticated = authStore.isAuthenticated; // Get status from store if (requiresAuth && !isAuthenticated) { next('/login'); } else if (isPublicPage && isAuthenticated) { next('/'); } else { next(); } }); return Router; });