ramon
/
vbv
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add navigation button to go back to the Dashboard

This commit is contained in:
Ramon Wenger 2024-10-24 11:18:57 +02:00
parent f2a422157f
commit 69efd0de2d
2 changed files with 20 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
client/src/components/header/HomeNavigation.vue
View File

@ -1,12 +1,22 @@
<script setup lang="ts"> <script setup lang="ts">
import { useRouteLookups } from "@/utils/route";
import { useTranslation } from "i18next-vue"; import { useTranslation } from "i18next-vue";
const { isInCourse } = useRouteLookups();
const { t } = useTranslation(); const { t } = useTranslation();
</script> </script>
<template> <template>
<div class="hidden flex-shrink-0 items-center lg:flex"> <div class="flex flex-shrink-0 items-center">
<div class="flex items-center"> <template v-if="isInCourse">
<div class="flex items-center">
<router-link to="/" class="flex items-center border-r border-white pr-3">
<it-icon-arrow-left />
<span class="hidden text-slate-500 lg:inline">Dashboard</span>
</router-link>
</div>
</template>
<template v-else>
<router-link to="/" class="flex"> <router-link to="/" class="flex">
<it-icon-vbv class="-ml-3 -mt-6 mr-3 h-8 w-16" /> <it-icon-vbv class="-ml-3 -mt-6 mr-3 h-8 w-16" />
</router-link> </router-link>
@ -15,6 +25,6 @@ const { t } = useTranslation();
{{ t("general.title") }} {{ t("general.title") }}
</div> </div>
</router-link> </router-link>
</div> </template>
</div> </div>
</template> </template>

7
client/src/utils/route.ts
View File

@ -1,3 +1,4 @@
import { computed, ref } from "vue";
import { useRoute } from "vue-router"; import { useRoute } from "vue-router";
export function useRouteLookups() { export function useRouteLookups() {
@ -7,11 +8,15 @@ export function useRouteLookups() {
return route.path.startsWith("/course/"); return route.path.startsWith("/course/");
} }
const isInCourse = computed(() => inCourse());
function inCockpit() { function inCockpit() {
const regex = new RegExp("/course/[^/]+/cockpit($|/)"); const regex = new RegExp("/course/[^/]+/cockpit($|/)");
return regex.test(route.path); return regex.test(route.path);
} }
const isInCockpit = computed(() => inCockpit());
function inLearningPath() { function inLearningPath() {
const regex = new RegExp("/course/[^/]+/learn($|/)"); const regex = new RegExp("/course/[^/]+/learn($|/)");
return regex.test(route.path); return regex.test(route.path);
@ -39,7 +44,9 @@ export function useRouteLookups() {
return { return {
inMediaLibrary, inMediaLibrary,
isInCourse,
inCockpit, inCockpit,
isInCockpit,
inLearningPath, inLearningPath,
inCompetenceProfile, inCompetenceProfile,
inLearningMentor, inLearningMentor,