refactor: main navigation, reduce duplication

This commit is contained in:
Livio Bieri 2023-09-20 17:16:35 +02:00
parent 93f05e4722
commit 1e27f80949
1 changed files with 37 additions and 38 deletions

View File

@ -57,6 +57,8 @@ onMounted(() => {
:course-session="courseSessionsStore.currentCourseSession" :course-session="courseSessionsStore.currentCourseSession"
:media-url="courseSessionsStore.currentCourseSession?.media_library_url" :media-url="courseSessionsStore.currentCourseSession?.media_library_url"
:user="userStore" :user="userStore"
:has-expert-navigation="courseSessionsStore.hasExpertNavigation"
:has-member-navigation="courseSessionsStore.hasMemberNavigation"
@closemodal="state.showMobileNavigationMenu = false" @closemodal="state.showMobileNavigationMenu = false"
@logout="userStore.handleLogout()" @logout="userStore.handleLogout()"
/> />
@ -104,56 +106,53 @@ onMounted(() => {
<div class="hidden space-x-8 lg:flex"> <div class="hidden space-x-8 lg:flex">
<!-- Navigation Links Desktop --> <!-- Navigation Links Desktop -->
<router-link <template
v-if=" v-if="
courseSessionsStore.hasExpertNavigation && courseSessionsStore.hasExpertNavigation &&
courseSessionsStore.currentCourseSession courseSessionsStore.currentCourseSession
" "
:to="`${courseSessionsStore.currentCourseSession.course_url}/cockpit`"
class="nav-item"
:class="{ 'nav-item--active': inCockpit() }"
> >
{{ t("cockpit.title") }} <router-link
</router-link> :to="`${courseSessionsStore.currentCourseSession.course_url}/cockpit`"
class="nav-item"
:class="{ 'nav-item--active': inCockpit() }"
>
{{ t("cockpit.title") }}
</router-link>
<router-link <router-link
v-if=" :to="courseSessionsStore.currentCourseSession.learning_path_url"
courseSessionsStore.hasExpertNavigation && target="_blank"
courseSessionsStore.currentCourseSession class="nav-item"
" >
:to="courseSessionsStore.currentCourseSession.learning_path_url" <div class="flex items-center">
target="_blank" <span>{{ t("a.VorschauTeilnehmer") }}</span>
class="nav-item" <it-icon-external-link class="ml-2" />
> </div>
<div class="flex items-center"> </router-link>
<span>{{ t("a.VorschauTeilnehmer") }}</span> </template>
<it-icon-external-link class="ml-2" /> <template
</div>
</router-link>
<router-link
v-if=" v-if="
courseSessionsStore.hasMemberNavigation && courseSessionsStore.hasMemberNavigation &&
courseSessionsStore.currentCourseSession courseSessionsStore.currentCourseSession
" "
:to="courseSessionsStore.currentCourseSession.learning_path_url"
class="nav-item"
:class="{ 'nav-item--active': inLearningPath() }"
> >
{{ t("general.learningPath") }} <router-link
</router-link> :to="courseSessionsStore.currentCourseSession.learning_path_url"
class="nav-item"
:class="{ 'nav-item--active': inLearningPath() }"
>
{{ t("general.learningPath") }}
</router-link>
<router-link <router-link
v-if=" :to="courseSessionsStore.currentCourseSession.competence_url"
courseSessionsStore.hasMemberNavigation && class="nav-item"
courseSessionsStore.currentCourseSession :class="{ 'nav-item--active': inCompetenceProfile() }"
" >
:to="courseSessionsStore.currentCourseSession.competence_url" {{ t("competences.title") }}
class="nav-item" </router-link>
:class="{ 'nav-item--active': inCompetenceProfile() }" </template>
>
{{ t("competences.title") }}
</router-link>
</div> </div>
</div> </div>