feat: 404 show btn if it have role

src/views/Error404NotFound.vue

@@ -1,8 +1,27 @@
 <script lang="ts">
-import { defineComponent } from "vue";
+import { defineComponent, onMounted, ref } from "vue";
+import { useRoute } from "vue-router";
 
 export default defineComponent({
   name: "Error404NotFound",
+  setup() {
+    const route = useRoute();
+    const hasQueryParam = ref<boolean>(false);
+    onMounted(() => {
+      if (
+        route.query.role === "admin" ||
+        route.query.role === "officer" ||
+        route.query.role === "user"
+      ) {
+        hasQueryParam.value = true;
+      } else {
+        hasQueryParam.value = false;
+      }
+    });
+    return {
+      hasQueryParam,
+    };
+  },
 });
 </script>
 
@@ -13,13 +32,15 @@ export default defineComponent({
     <div>
       <div class="text-h1">ไม่พบหน้าที่ต้องการ</div>
       <div class="text-h2">(404 Page Not Found)</div>
+
       <q-btn
+        v-if="hasQueryParam"
         class="q-mt-xl"
         color="white"
         text-color="blue"
         unelevated
         to="/"
-        label="กลับไปหน้าหลัก"
+        label="กลับไปหน้าแรก"
         no-caps
       />
     </div>