routing inside url

This commit is contained in:
Julian Krauser 2024-09-01 19:19:48 +02:00
parent 2d0fb30558
commit 6247c385c3
15 changed files with 278 additions and 203 deletions

View file

@ -1,25 +1,30 @@
<template>
<div
<RouterLink
v-if="link"
class="cursor-pointer w-full flex flex-col md:flex-row items-center md:gap-2 justify-center p-1 md:rounded-full md:px-3 font-medium text-center text-base self-center"
:class="
activeNavigation == link.key
? 'text-primary md:bg-primary md:text-white'
: 'text-gray-700 hover:text-accent md:hover:bg-accent md:hover:text-white'
"
@click="setTopLevel(link.key, disableSubLink)"
:to="{ name: `admin-${link.key}-${!disableSubLink ? link.levelDefault : 'default'}` }"
class="cursor-pointer w-full flex items-center justify-center self-center"
>
{{ link.title }}
</div>
<p
class="cursor-pointer w-full flex flex-col md:flex-row items-center md:gap-2 justify-center p-1 md:rounded-full md:px-3 font-medium text-center text-base self-center"
:class="
activeNavigation == link.key
? 'text-primary md:bg-primary md:text-white'
: 'text-gray-700 hover:text-accent md:hover:bg-accent md:hover:text-white'
"
>
{{ link.title }}
</p>
</RouterLink>
</template>
<script setup lang="ts">
import { mapState, mapActions } from "pinia";
import { useNavigationStore, type topLevelNavigationModel } from "@/stores/admin/navigation";
import { mapState } from "pinia";
</script>
<script lang="ts">
import { defineComponent, type PropType } from "vue";
import { RouterLink } from "vue-router";
export default defineComponent({
props: {
link: {
@ -34,8 +39,5 @@ export default defineComponent({
computed: {
...mapState(useNavigationStore, ["activeNavigation"]),
},
methods: {
...mapActions(useNavigationStore, ["setTopLevel"]),
},
});
</script>