first commit

src/router/index.ts

@@ -0,0 +1,53 @@
+import { defineRouter } from '#q-app/wrappers';
+import {
+  createMemoryHistory,
+  createRouter,
+  createWebHashHistory,
+  createWebHistory,
+} from 'vue-router';
+import routes from './routes';
+import { useUserStore } from 'src/vueLib/login/userStore';
+
+/*
+ * 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, 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),
+  });
+
+  Router.beforeEach((to, from, next) => {
+    const userStore = useUserStore();
+
+    const isLoggedIn = userStore.isAuthenticated;
+    const isAdmin = userStore.user?.role === 'admin';
+
+    if (to.meta.requiresAuth && !isLoggedIn) {
+      next('/login');
+    } else if (to.meta.requiresAdmin && !isAdmin) {
+      next('/');
+    } else {
+      next();
+    }
+  });
+
+  return Router;
+});

src/router/routes.ts

@@ -0,0 +1,42 @@
+import type { RouteRecordRaw } from 'vue-router';
+
+const routes: RouteRecordRaw[] = [
+  {
+    path: '/',
+    component: () => import('layouts/MainLayout.vue'),
+    children: [
+      {
+        path: '',
+        component: () => import('pages/LoginPage.vue'),
+      },
+      {
+        path: '/login',
+        component: () => import('pages/LoginPage.vue'),
+      },
+      {
+        path: '/members',
+        component: () => import('pages/MembersTable.vue'),
+        meta: { requiresAuth: true, requiresAdmin: true },
+      },
+      {
+        path: '/settings',
+        component: () => import('pages/SettingsPage.vue'),
+        meta: { requiresAuth: true, requiresAdmin: true },
+      },
+      {
+        path: '/usersSettings',
+        component: () => import('pages/UserSettings.vue'),
+        meta: { requiresAuth: true, requiresAdmin: true },
+      },
+    ],
+  },
+
+  // Always leave this as last one,
+  // but you can also remove it
+  {
+    path: '/:catchAll(.*)*',
+    component: () => import('pages/ErrorNotFound.vue'),
+  },
+];
+
+export default routes;