Explorar el Código

fix: correctly handle registration mode from header link

unknown hace 2 días
padre
commit
67ce64eb0d
Se han modificado 2 ficheros con 10 adiciones y 3 borrados
  1. 2 2
      src/components/Header.vue
  2. 8 1
      src/pages/Auth.vue

+ 2 - 2
src/components/Header.vue

@@ -60,7 +60,7 @@
             <Button variant="ghost" size="sm" :as="RouterLink" :to="`/${activeLang}/auth`" class="text-[13px] font-bold">
               {{ t("nav.logIn") }}
             </Button>
-            <Button variant="default" size="sm" :as="RouterLink" :to="`/${activeLang}/auth`" class="text-[13px] font-bold shadow-md">
+            <Button variant="default" size="sm" :as="RouterLink" :to="{ name: 'auth', params: { lang: activeLang }, query: { mode: 'register' } }" class="text-[13px] font-bold shadow-md">
               {{ t("nav.register") }}
             </Button>
           </template>
@@ -139,7 +139,7 @@
               <Button variant="ghost" class="justify-start" :as="RouterLink" :to="`/${activeLang}/auth`" @click="mobileOpen = false">
                 {{ t("nav.logIn") }}
               </Button>
-              <Button variant="default" :as="RouterLink" :to="`/${activeLang}/auth`" @click="mobileOpen = false">
+              <Button variant="default" :as="RouterLink" :to="{ name: 'auth', params: { lang: activeLang }, query: { mode: 'register' } }" @click="mobileOpen = false">
                 {{ t("nav.register") }}
               </Button>
             </template>

+ 8 - 1
src/pages/Auth.vue

@@ -207,7 +207,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, reactive, onMounted } from "vue";
+import { ref, reactive, onMounted, watch } from "vue";
 import { useRouter, useRoute } from "vue-router";
 import { useI18n } from "vue-i18n";
 import { toast } from "vue-sonner";
@@ -246,8 +246,15 @@ const formData = reactive({
 onMounted(async () => {
   const token = route.query.token as string;
   const verifyToken = route.query.verify_token as string;
+  const qMode = route.query.mode as AuthMode;
 
   if (token) { mode.value = "reset"; formData.token = token; }
+  if (qMode) { mode.value = qMode; }
+
+  // Watch for query changes if already on the page
+  watch(() => route.query.mode, (newMode) => {
+    if (newMode) mode.value = newMode as AuthMode;
+  });
   
   if (verifyToken) {
     isLoading.value = true;