Show correct links in navigation

This commit is contained in:
Christian Cueni 2022-08-03 14:16:41 +02:00
parent 7970cf6174
commit 13c691c3c9
1 changed files with 21 additions and 19 deletions

View File

@ -12,6 +12,7 @@ const route = useRoute()
const userStore = useUserStore(); const userStore = useUserStore();
const appStore = useAppStore(); const appStore = useAppStore();
const state = reactive({showMenu: false}); const state = reactive({showMenu: false});
const vbvUrl = 'http://www.vbv.ch';
function toggleNav() { function toggleNav() {
state.showMenu = !state.showMenu; state.showMenu = !state.showMenu;
@ -54,8 +55,8 @@ onMounted(() => {
" "
> >
<div class="flex items-center justify-between"> <div class="flex items-center justify-between">
<router-link <a
to="/" :href="vbvUrl"
class="flex"> class="flex">
<it-icon-vbv class="h-8 w-16 -mt-3 -ml-3"/> <it-icon-vbv class="h-8 w-16 -mt-3 -ml-3"/>
<div class=" <div class="
@ -69,7 +70,7 @@ onMounted(() => {
> >
myVBV myVBV
</div> </div>
</router-link> </a>
<!-- Mobile menu button --> <!-- Mobile menu button -->
<div @click="toggleNav" class="flex lg:hidden"> <div @click="toggleNav" class="flex lg:hidden">
@ -99,22 +100,7 @@ onMounted(() => {
lg:flex lg:space-y-0 lg:flex-row lg:items-center lg:space-x-10 lg:mt-0 lg:flex lg:space-y-0 lg:flex-row lg:items-center lg:space-x-10 lg:mt-0
" "
> >
<router-link
v-if="!inLearningPath()"
to="/"
class="nav-item"
:class="{'nav-item--active': route.path === '/'}"
>
Cockpit
</router-link>
<router-link
v-if="!inLearningPath()"
to="/shop"
class="nav-item"
:class="{'nav-item--active': menuActive('/shop')}"
>
Shop
</router-link>
<router-link <router-link
v-if="inLearningPath()" v-if="inLearningPath()"
@ -125,8 +111,24 @@ onMounted(() => {
Lernpfad Lernpfad
</router-link> </router-link>
<router-link
v-if="inLearningPath()"
to="/competences/"
class="nav-item"
:class="{'nav-item--active': menuActive('/competences/')}"
>
Kompetenzprofil
</router-link>
<hr class="text-white lg:hidden"> <hr class="text-white lg:hidden">
<div class="hidden lg:block flex-auto"></div> <div class="hidden lg:block flex-auto"></div>
<router-link
to="/shop"
class="nav-item"
:class="{'nav-item--active': menuActive('/shop')}"
>
Shop
</router-link>
<router-link <router-link
to="/mediacenter" to="/mediacenter"
class="nav-item" class="nav-item"