vợ bảo okeoke

src/routes/NotFound.vue

@@ -0,0 +1,12 @@
+<template>
+    <vue-head :input="{title: '404 - Page Not Found'}"/>
+    <div class="mx-auto text-center mt-20 flex flex-col items-center gap-4">
+        <h1>404 - Page Not Found</h1>
+        <p>The page you are looking for does not exist.</p>
+        <router-link class="btn btn-primary" to="/">Go back to Home</router-link>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { VueHead } from "@/components/VueHead";
+</script>

src/routes/index.ts

@@ -75,6 +75,11 @@ const routes: RouteData[] = [
             component: () => import("./add/Add.vue"),
           },
         ],
+      },
+      {
+        path: "/:pathMatch(.*)*",
+        name: "not-found",
+        component: () => import("./NotFound.vue"),
       }
     ],
   },
@@ -88,6 +93,7 @@ const router = createRouter({
 
 router.beforeEach((to, from, next) => {
   const auth = useAuthStore();
+  console.log("Call on server:", Math.random());
   if (to.matched.some((record) => record.meta.requiresAuth)) {
     if (!auth.user) {
       next({ name: "login" });