feat: wizard uk
This commit is contained in:
Reto Aebersold
Christian Cueni
parent
a39b105780
commit
c4418676fb
|
|
@ -0,0 +1,19 @@
|
||||||
|
<script setup lang="ts">
|
||||||
|
import ItNavigationProgress from "@/components/ui/ItNavigationProgress.vue";
|
||||||
|
|
||||||
|
const props = defineProps<{
|
||||||
|
step: number;
|
||||||
|
}>();
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div class="flex flex-1 flex-col">
|
||||||
|
<div class="flex-grow p-16">
|
||||||
|
<ItNavigationProgress :steps="3" :current-step="props.step" />
|
||||||
|
<slot name="content"></slot>
|
||||||
|
</div>
|
||||||
|
<div class="flex justify-end border border-t px-6 py-4">
|
||||||
|
<slot name="footer"></slot>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
@ -0,0 +1,104 @@
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { SUPPORT_LOCALES } from "@/i18nextWrapper";
|
||||||
|
import { Menu, MenuButton, MenuItem, MenuItems } from "@headlessui/vue";
|
||||||
|
import type { AvailableLanguages } from "@/stores/user";
|
||||||
|
import { useUserStore } from "@/stores/user";
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
courseName: String,
|
||||||
|
});
|
||||||
|
|
||||||
|
const userStore = useUserStore();
|
||||||
|
|
||||||
|
async function changeLocale(language: AvailableLanguages) {
|
||||||
|
userStore.setUserLanguages(language);
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<template>
|
||||||
|
<div
|
||||||
|
class="flex flex-col items-center justify-between space-y-8 bg-blue-900 p-8 lg:w-1/3"
|
||||||
|
>
|
||||||
|
<div class="flex w-full items-center justify-between">
|
||||||
|
<div class="flex justify-center">
|
||||||
|
<div class="h-8 w-16">
|
||||||
|
<it-icon-vbv class="-ml-3 -mt-6 mr-3 h-8 w-16" />
|
||||||
|
</div>
|
||||||
|
<div class="ml-1 border-l border-white pl-3 text-2xl text-white">
|
||||||
|
{{ $t("general.title") }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<Menu as="div" class="relative block text-left">
|
||||||
|
<div class="text-white">
|
||||||
|
<MenuButton class="text-white">
|
||||||
|
<it-icon-globe class="relative top-[2px] h-4 w-4" />
|
||||||
|
<span class="ml-2 inline">
|
||||||
|
{{ $t(`language.${userStore.language}`) }}
|
||||||
|
</span>
|
||||||
|
</MenuButton>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<transition
|
||||||
|
enter-active-class="transition ease-out duration-100"
|
||||||
|
enter-from-class="transform opacity-0 scale-95"
|
||||||
|
enter-to-class="transform opacity-100 scale-100"
|
||||||
|
leave-active-class="transition ease-in duration-75"
|
||||||
|
leave-from-class="transform opacity-100 scale-100"
|
||||||
|
leave-to-class="transform opacity-0 scale-95"
|
||||||
|
>
|
||||||
|
<MenuItems
|
||||||
|
class="absolute right-0 z-10 mt-2 w-56 origin-top-right bg-white shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none"
|
||||||
|
>
|
||||||
|
<MenuItem
|
||||||
|
v-for="locale in SUPPORT_LOCALES"
|
||||||
|
:key="locale"
|
||||||
|
v-slot="{ active }"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
:class="[
|
||||||
|
active ? 'bg-gray-200 text-gray-900' : 'text-gray-800',
|
||||||
|
'block w-full px-4 py-2 text-left',
|
||||||
|
]"
|
||||||
|
:data-cy="`language-selector-${locale}`"
|
||||||
|
@click="changeLocale(locale)"
|
||||||
|
>
|
||||||
|
{{ $t(`language.${locale}`) }}
|
||||||
|
</button>
|
||||||
|
</MenuItem>
|
||||||
|
</MenuItems>
|
||||||
|
</transition>
|
||||||
|
</Menu>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="max-w-xs text-white">
|
||||||
|
<img
|
||||||
|
src="/static/images/mood_uk.jpg"
|
||||||
|
class="aspect-square rounded-full object-cover"
|
||||||
|
alt=""
|
||||||
|
/>
|
||||||
|
<h3 class="mt-8 text-center">{{ props.courseName }}</h3>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="flex items-center gap-x-2 text-sm text-white">
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
fill="none"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
stroke-width="1.5"
|
||||||
|
stroke="currentColor"
|
||||||
|
class="h-10 w-10 fill-none"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
d="M9.879 7.519c1.171-1.025 3.071-1.025 4.242 0 1.172 1.025 1.172 2.687 0 3.712-.203.179-.43.326-.67.442-.745.361-1.45.999-1.45 1.827v.75M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-9 5.25h.008v.008H12v-.008z"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
<div>
|
||||||
|
Hast du Fragen? Schau dir unsere
|
||||||
|
<a class="underline" href="#">FAQ</a>
|
||||||
|
an oder kontaktiere uns:
|
||||||
|
<a class="underline" href="mailto:help@vbv.ch">help@vbv.ch</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
@ -1,121 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import ItNavigationProgress from "@/components/ui/ItNavigationProgress.vue";
|
|
||||||
import { SUPPORT_LOCALES } from "@/i18nextWrapper";
|
|
||||||
import { Menu, MenuButton, MenuItem, MenuItems } from "@headlessui/vue";
|
|
||||||
import type { AvailableLanguages } from "@/stores/user";
|
|
||||||
import { useUserStore } from "@/stores/user";
|
|
||||||
|
|
||||||
const userStore = useUserStore();
|
|
||||||
|
|
||||||
async function changeLocale(language: AvailableLanguages) {
|
|
||||||
userStore.setUserLanguages(language);
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div class="flex flex-col lg:flex-row">
|
|
||||||
<div
|
|
||||||
class="flex flex-col items-center justify-between space-y-8 bg-blue-900 p-8 lg:w-1/3"
|
|
||||||
>
|
|
||||||
<div class="flex w-full items-center justify-between">
|
|
||||||
<div class="flex justify-center">
|
|
||||||
<div class="h-8 w-16">
|
|
||||||
<it-icon-vbv class="-ml-3 -mt-6 mr-3 h-8 w-16" />
|
|
||||||
</div>
|
|
||||||
<div class="ml-1 border-l border-white pl-3 text-2xl text-white">
|
|
||||||
{{ $t("general.title") }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<Menu as="div" class="relative block text-left">
|
|
||||||
<div class="text-white">
|
|
||||||
<MenuButton class="text-white">
|
|
||||||
<it-icon-globe class="relative top-[2px] h-4 w-4" />
|
|
||||||
<span class="ml-2 inline">
|
|
||||||
{{ $t(`language.${userStore.language}`) }}
|
|
||||||
</span>
|
|
||||||
</MenuButton>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<transition
|
|
||||||
enter-active-class="transition ease-out duration-100"
|
|
||||||
enter-from-class="transform opacity-0 scale-95"
|
|
||||||
enter-to-class="transform opacity-100 scale-100"
|
|
||||||
leave-active-class="transition ease-in duration-75"
|
|
||||||
leave-from-class="transform opacity-100 scale-100"
|
|
||||||
leave-to-class="transform opacity-0 scale-95"
|
|
||||||
>
|
|
||||||
<MenuItems
|
|
||||||
class="absolute right-0 z-10 mt-2 w-56 origin-top-right rounded-md bg-white shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none"
|
|
||||||
>
|
|
||||||
<div class="py-1">
|
|
||||||
<MenuItem
|
|
||||||
v-for="locale in SUPPORT_LOCALES"
|
|
||||||
:key="locale"
|
|
||||||
v-slot="{ active }"
|
|
||||||
>
|
|
||||||
<button
|
|
||||||
:class="[
|
|
||||||
active ? 'bg-gray-200 text-gray-900' : 'text-gray-700',
|
|
||||||
'block w-full px-4 py-2 text-left',
|
|
||||||
]"
|
|
||||||
:data-cy="`language-selector-${locale}`"
|
|
||||||
@click="changeLocale(locale)"
|
|
||||||
>
|
|
||||||
{{ $t(`language.${locale}`) }}
|
|
||||||
</button>
|
|
||||||
</MenuItem>
|
|
||||||
</div>
|
|
||||||
</MenuItems>
|
|
||||||
</transition>
|
|
||||||
</Menu>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="max-w-xs text-white">
|
|
||||||
<img
|
|
||||||
src="/static/images/student.jpg"
|
|
||||||
class="aspect-square rounded-full object-cover"
|
|
||||||
alt=""
|
|
||||||
/>
|
|
||||||
<h3 class="mt-8 text-center">Überbetriebliche Kurse</h3>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="flex items-center gap-x-2 text-sm text-white">
|
|
||||||
<svg
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
fill="none"
|
|
||||||
viewBox="0 0 24 24"
|
|
||||||
stroke-width="1.5"
|
|
||||||
stroke="currentColor"
|
|
||||||
class="h-10 w-10 fill-none"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
d="M9.879 7.519c1.171-1.025 3.071-1.025 4.242 0 1.172 1.025 1.172 2.687 0 3.712-.203.179-.43.326-.67.442-.745.361-1.45.999-1.45 1.827v.75M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-9 5.25h.008v.008H12v-.008z"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
<div>
|
|
||||||
Hast du Fragen? Schau dir unsere
|
|
||||||
<a class="underline" href="#">FAQ</a>
|
|
||||||
an oder kontaktiere uns:
|
|
||||||
<a class="underline" href="mailto:help@vbv.ch">help@vbv.ch</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="flex flex-1 flex-col">
|
|
||||||
<div class="flex-grow p-16">
|
|
||||||
<ItNavigationProgress :steps="3" :current-step="0" />
|
|
||||||
<h2 class="my-10">Konto erstellen</h2>
|
|
||||||
<p class="mb-4">Damit du myVBV nutzen kannst, brauchst du ein Konto.</p>
|
|
||||||
<a href="#" class="btn-primary">Konto erstellen</a>
|
|
||||||
|
|
||||||
<p class="mb-4 mt-12">Hast du schon ein Konto?</p>
|
|
||||||
<a href="#" class="btn-secondary">Anmelden</a>
|
|
||||||
</div>
|
|
||||||
<div class="flex justify-end border border-t px-6 py-4">
|
|
||||||
<a href="#" class="btn-blue">Weiter</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
@ -0,0 +1,31 @@
|
||||||
|
<script setup lang="ts">
|
||||||
|
import WizardPage from "@/components/onboarding/WizardPage.vue";
|
||||||
|
import { useUserStore } from "@/stores/user";
|
||||||
|
|
||||||
|
const userStore = useUserStore();
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<WizardPage :step="0.5">
|
||||||
|
<template #content>
|
||||||
|
<h2 class="my-10">Konto erstellen</h2>
|
||||||
|
|
||||||
|
<div class="mb-8 flex items-center space-x-4 border px-8 py-4">
|
||||||
|
<it-icon-check class="h-24 w-24 text-green-500" />
|
||||||
|
<p class="text-lg font-bold">
|
||||||
|
Du hast erfolgreich ein Konto für
|
||||||
|
<br />
|
||||||
|
{{ userStore.email }} erstellt.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<p class="text-lg font-bold">Mach nun weiter mit dem nächsten Schritt.</p>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<template #footer>
|
||||||
|
<router-link :to="{ name: 'accountProfile' }" class="btn-blue flex items-center">
|
||||||
|
Weiter
|
||||||
|
<it-icon-arrow-right class="it-icon ml-2 h-6 w-6" />
|
||||||
|
</router-link>
|
||||||
|
</template>
|
||||||
|
</WizardPage>
|
||||||
|
</template>
|
||||||
|
|
@ -0,0 +1,79 @@
|
||||||
|
<script setup lang="ts">
|
||||||
|
import WizardPage from "@/components/onboarding/WizardPage.vue";
|
||||||
|
import ItDropdownSelect from "@/components/ui/ItDropdownSelect.vue";
|
||||||
|
import { ref } from "vue";
|
||||||
|
|
||||||
|
const companies = [
|
||||||
|
{ id: 1, name: "Firma 1" },
|
||||||
|
{ id: 2, name: "Firma 2" },
|
||||||
|
{ id: 3, name: "Firma 3" },
|
||||||
|
];
|
||||||
|
|
||||||
|
const selectedCompany = ref(companies[0]);
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<WizardPage :step="1">
|
||||||
|
<template #content>
|
||||||
|
<h2 class="my-10">Profil ergänzen</h2>
|
||||||
|
|
||||||
|
<h3 class="mb-3">Gesellschaft</h3>
|
||||||
|
|
||||||
|
<p class="mb-6 max-w-md hyphens-none">
|
||||||
|
Wähle hier den Namen der Gesellschaft aus, in der du arbeitest. So können dich
|
||||||
|
andere Personen einfacher finden.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<ItDropdownSelect v-model="selectedCompany" :items="companies" />
|
||||||
|
|
||||||
|
<div class="mt-16 flex flex-col justify-between gap-12 lg:flex-row lg:gap-24">
|
||||||
|
<div>
|
||||||
|
<h3 class="mb-3">Profilbild</h3>
|
||||||
|
<p class="mb-6 max-w-md hyphens-none">
|
||||||
|
Lade ein Profilbild hoch, damit dich andere Personen auf den ersten Blick
|
||||||
|
erkennen.
|
||||||
|
</p>
|
||||||
|
<button class="btn-primary flex items-center">
|
||||||
|
Bild hochladen
|
||||||
|
<it-icon-upload class="it-icon ml-2 h-6 w-6" />
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
width="172"
|
||||||
|
height="172"
|
||||||
|
viewBox="0 0 172 172"
|
||||||
|
fill="none"
|
||||||
|
>
|
||||||
|
<mask
|
||||||
|
id="mask0"
|
||||||
|
style="mask-type: alpha"
|
||||||
|
maskUnits="userSpaceOnUse"
|
||||||
|
x="0"
|
||||||
|
y="0"
|
||||||
|
width="172"
|
||||||
|
height="172"
|
||||||
|
>
|
||||||
|
<circle cx="86" cy="86" r="86" fill="#E0E5EC" />
|
||||||
|
</mask>
|
||||||
|
<g mask="url(#mask0)">
|
||||||
|
<circle cx="86" cy="86" r="86" fill="#E0E5EC" />
|
||||||
|
<path
|
||||||
|
fill="#B1C1CA"
|
||||||
|
d="M101.584 105.423a1.793 1.793 0 0 0-1.57.572 1.834 1.834 0 0 0-.465 1.604c1.019 5.347 4.45 12.685 14.982 17.254 1.248.539 3.176.959 5.621 1.486 9.151 1.977 24.454 5.288 28.214 19.294a1.843 1.843 0 0 0 1.545 1.351 1.84 1.84 0 0 0 1.367-.366 1.846 1.846 0 0 0 .659-1.944c-4.347-16.177-21.685-19.928-31.002-21.941-2.157-.469-4.022-.871-4.934-1.269-6.33-2.743-10.418-6.815-12.19-12.117 17.585 1.305 25.547-5.69 25.898-6.008a1.843 1.843 0 0 0-.325-2.968c-10.148-5.79-10.148-25.795-10.148-33.33 0-21.067-14.21-37.768-32.428-38.03-.173-.006-.347-.01-.52-.011-18.483.103-33.524 16.823-33.524 37.275 0 7.534 0 27.543-10.149 33.329a1.856 1.856 0 0 0-.767 2.35c.121.276.309.519.546.707.51.394 11.773 9.001 25.632 6.387-1.853 5.081-5.886 8.99-12.031 11.657-.89.387-2.663.811-4.716 1.298-9.38 2.227-26.844 6.376-31.216 22.668a1.84 1.84 0 0 0 .185 1.4 1.85 1.85 0 0 0 3.386-.445c3.8-14.176 19.266-17.845 28.502-20.043 2.315-.549 4.143-.984 5.332-1.497 10.532-4.569 13.96-11.907 14.983-17.254a1.83 1.83 0 0 0-.588-1.723 1.833 1.833 0 0 0-1.78-.383c-9.996 3.142-19.232-1.18-23.269-3.577 9.642-8.061 9.642-26.614 9.642-34.874 0-18.427 13.391-33.495 29.987-33.595l.391.022c16.367.233 28.709 14.994 28.709 34.34 0 8.264 0 26.857 9.683 34.918-3.335 1.903-10.939 4.982-23.642 3.463Z"
|
||||||
|
/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<template #footer>
|
||||||
|
<button class="btn-blue flex items-center">
|
||||||
|
Weiter
|
||||||
|
<it-icon-arrow-right class="it-icon ml-2 h-6 w-6" />
|
||||||
|
</button>
|
||||||
|
</template>
|
||||||
|
</WizardPage>
|
||||||
|
</template>
|
||||||
|
|
@ -0,0 +1,23 @@
|
||||||
|
<script setup lang="ts">
|
||||||
|
import WizardPage from "@/components/onboarding/WizardPage.vue";
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<WizardPage :step="0">
|
||||||
|
<template #content>
|
||||||
|
<h2 class="my-10">Konto erstellen</h2>
|
||||||
|
<p class="mb-4">Damit du myVBV nutzen kannst, brauchst du ein Konto.</p>
|
||||||
|
<a href="#" class="btn-primary">Konto erstellen</a>
|
||||||
|
|
||||||
|
<p class="mb-4 mt-12">Hast du schon ein Konto?</p>
|
||||||
|
<a href="/sso/login/" class="btn-secondary">Anmelden</a>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<template #footer>
|
||||||
|
<button disabled class="btn-blue flex items-center">
|
||||||
|
Weiter
|
||||||
|
<it-icon-arrow-right class="it-icon ml-2 h-6 w-6" />
|
||||||
|
</button>
|
||||||
|
</template>
|
||||||
|
</WizardPage>
|
||||||
|
</template>
|
||||||
|
|
@ -0,0 +1,10 @@
|
||||||
|
<script setup lang="ts">
|
||||||
|
import WizardSidePanel from "@/components/onboarding/WizardSidePanel.vue";
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div class="flex flex-col lg:flex-row">
|
||||||
|
<WizardSidePanel course-name="Überbetriebliche Kurse" />
|
||||||
|
<router-view />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
import DashboardPage from "@/pages/dashboard/DashboardPage.vue";
|
|
||||||
import LoginPage from "@/pages/LoginPage.vue";
|
import LoginPage from "@/pages/LoginPage.vue";
|
||||||
|
import DashboardPage from "@/pages/dashboard/DashboardPage.vue";
|
||||||
import {
|
import {
|
||||||
handleCourseSessionAsQueryParam,
|
handleCourseSessionAsQueryParam,
|
||||||
handleCurrentCourseSession,
|
handleCurrentCourseSession,
|
||||||
|
|
@ -7,6 +7,7 @@ import {
|
||||||
updateLoggedIn,
|
updateLoggedIn,
|
||||||
} from "@/router/guards";
|
} from "@/router/guards";
|
||||||
import { addToHistory } from "@/router/history";
|
import { addToHistory } from "@/router/history";
|
||||||
|
import { checkUKProcess } from "@/router/onboarding";
|
||||||
import { createRouter, createWebHistory } from "vue-router";
|
import { createRouter, createWebHistory } from "vue-router";
|
||||||
|
|
||||||
const router = createRouter({
|
const router = createRouter({
|
||||||
|
|
@ -231,11 +232,33 @@ const router = createRouter({
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: "/onboarding/uk",
|
path: "/onboarding/uk",
|
||||||
component: () => import("@/pages/onboarding/OnboardUk.vue"),
|
props: true,
|
||||||
|
component: () => import("@/pages/onboarding/uk/WizardBase.vue"),
|
||||||
meta: {
|
meta: {
|
||||||
public: true,
|
public: true,
|
||||||
hideChrome: true,
|
hideChrome: true,
|
||||||
},
|
},
|
||||||
|
beforeEnter: checkUKProcess,
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
path: "account/create",
|
||||||
|
props: true,
|
||||||
|
component: () => import("@/pages/onboarding/uk/AccountSetup.vue"),
|
||||||
|
name: "accountCreate",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: "account/confirm",
|
||||||
|
props: true,
|
||||||
|
component: () => import("@/pages/onboarding/uk/AccountConfirm.vue"),
|
||||||
|
name: "accountConfirm",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: "account/profile",
|
||||||
|
props: true,
|
||||||
|
component: () => import("@/pages/onboarding/uk/AccountProfile.vue"),
|
||||||
|
name: "accountProfile",
|
||||||
|
},
|
||||||
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: "/styleguide",
|
path: "/styleguide",
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,25 @@
|
||||||
|
import { useUserStore } from "@/stores/user";
|
||||||
|
import type { NavigationGuardNext, RouteLocationNormalized } from "vue-router";
|
||||||
|
|
||||||
|
export async function checkUKProcess(
|
||||||
|
to: RouteLocationNormalized,
|
||||||
|
from: RouteLocationNormalized,
|
||||||
|
next: NavigationGuardNext
|
||||||
|
) {
|
||||||
|
const userStore = useUserStore();
|
||||||
|
|
||||||
|
// Guest
|
||||||
|
if (!userStore.loggedIn) {
|
||||||
|
if (to.name !== "accountCreate") {
|
||||||
|
return next({ name: "accountCreate" });
|
||||||
|
}
|
||||||
|
return next();
|
||||||
|
}
|
||||||
|
|
||||||
|
// Logged in
|
||||||
|
if (to.name === "accountCreate") {
|
||||||
|
return next({ name: "accountConfirm" });
|
||||||
|
}
|
||||||
|
|
||||||
|
return next();
|
||||||
|
}
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 121 KiB |
|
Before Width: | Height: | Size: 105 KiB After Width: | Height: | Size: 105 KiB |
Loading…
Reference in New Issue