tdpeuter/2025SELab2-project-Dwengo
tdpeuter/2025SELab2-project-Dwengo
1
Fork 0
Code Issues Releases 4 Packages 2 Wiki Activity

fix(frontend): Fouten door de merge van dev opgelost.

Browse source
This commit is contained in:
Gerald Schmittinger 2025-03-25 10:05:31 +01:00
parent 858f4c3694
commit 18616450cf
4 changed files with 97 additions and 105 deletions
Download patch file Download diff file Expand all files Collapse all files

6
frontend/src/App.vue
View file

@ -1,15 +1,11 @@
<script setup lang="ts"> <script setup lang="ts">
import auth from "@/services/auth/auth-service.ts"; import auth from "@/services/auth/auth-service.ts";
import MenuBar from "@/components/MenuBar.vue";
auth.loadUser(); auth.loadUser();
</script> </script>
<template> <template>
<v-app> <v-app>
<menu-bar></menu-bar> <router-view />
<v-main>
<router-view />
</v-main>
</v-app> </v-app>
</template> </template>

13
frontend/src/components/MenuBar.vue
View file

@ -296,7 +296,6 @@
</li> </li>
</div> </div>
</nav> </nav>
<router-view />
</main> </main>
</template> </template>
@ -352,16 +351,4 @@
nav a.router-link-active { nav a.router-link-active {
font-weight: bold; font-weight: bold;
} }
@media (max-width: 700px) {
.menu {
display: none;
}
}
@media (min-width: 701px) {
.menu_collapsed {
display: none;
}
}
</style> </style>

33
frontend/src/router/index.ts
View file

@ -110,23 +110,30 @@ const router = createRouter({
meta: { requiresAuth: true }, meta: { requiresAuth: true },
}, },
{ {
path: "/learningPath/search", path: "/learningPath",
name: "LearningPathSearchPage", component: MenuBar,
component: LearningPathSearchPage,
meta: { requiresAuth: false }
},
{
path: "/learningPath/:hruid/:language",
name: "LearningPath",
component: LearningPathPage,
props: true,
meta: { requiresAuth: false },
children: [ children: [
{ {
path: ":learningObjectHruid", path: "/search",
name: "LearningPathSearchPage",
component: LearningPathSearchPage,
meta: { requiresAuth: true }
},
{
path: "/:hruid/:language",
name: "LearningPath",
component: LearningPathPage, component: LearningPathPage,
props: true, props: true,
} meta: { requiresAuth: true },
children: [
{
path: ":learningObjectHruid",
component: LearningPathPage,
props: true,
meta: { requiresAuth: true }
}
]
},
] ]
}, },
{ {

150
frontend/src/views/learning-paths/LearningPathPage.vue
View file

@ -123,84 +123,86 @@
</script> </script>
<template> <template>
<using-remote-resource <v-main>
:resource="learningPathResource" <using-remote-resource
v-slot="learningPath: {data: LearningPath}" :resource="learningPathResource"
> v-slot="learningPath: {data: LearningPath}"
<v-navigation-drawer v-model="navigationDrawerShown"> >
<v-list-item <v-navigation-drawer v-model="navigationDrawerShown">
:title="learningPath.data.title" <v-list-item
:subtitle="learningPath.data.description" :title="learningPath.data.title"
></v-list-item> :subtitle="learningPath.data.description"
<v-list-item> ></v-list-item>
<template v-slot:subtitle> <v-list-item>
<p><v-icon :color="COLORS.notCompleted" :icon="ICONS.notCompleted"></v-icon> {{ t("legendNotCompletedYet") }}</p> <template v-slot:subtitle>
<p><v-icon :color="COLORS.completed" :icon="ICONS.completed"></v-icon> {{ t("legendCompleted") }}</p> <p><v-icon :color="COLORS.notCompleted" :icon="ICONS.notCompleted"></v-icon> {{ t("legendNotCompletedYet") }}</p>
<p><v-icon :color="COLORS.teacherExclusive" :icon="ICONS.teacherExclusive"></v-icon> {{ t("legendTeacherExclusive") }}</p> <p><v-icon :color="COLORS.completed" :icon="ICONS.completed"></v-icon> {{ t("legendCompleted") }}</p>
</template> <p><v-icon :color="COLORS.teacherExclusive" :icon="ICONS.teacherExclusive"></v-icon> {{ t("legendTeacherExclusive") }}</p>
</v-list-item> </template>
<v-divider></v-divider> </v-list-item>
<v-divider></v-divider>
<div v-if="props.learningObjectHruid"> <div v-if="props.learningObjectHruid">
<using-remote-resource <using-remote-resource
:resource="learningObjectListResource" :resource="learningObjectListResource"
v-slot="learningObjects: {data: LearningObject[]}" v-slot="learningObjects: {data: LearningObject[]}"
>
<v-list-item
link
:to="{path: node.key, query: route.query}"
:title="node.title"
:active="node.key === props.learningObjectHruid"
v-for="node in learningObjects.data"
> >
<template v-slot:prepend> <v-list-item
<v-icon link
:color="COLORS[getNavItemState(node)]" :to="{path: node.key, query: route.query}"
:icon="ICONS[getNavItemState(node)]"></v-icon> :title="node.title"
</template> :active="node.key === props.learningObjectHruid"
<template v-slot:append> v-for="node in learningObjects.data"
{{ node.estimatedTime }}' >
</template> <template v-slot:prepend>
</v-list-item> <v-icon
</using-remote-resource> :color="COLORS[getNavItemState(node)]"
:icon="ICONS[getNavItemState(node)]"></v-icon>
</template>
<template v-slot:append>
{{ node.estimatedTime }}'
</template>
</v-list-item>
</using-remote-resource>
</div>
</v-navigation-drawer>
<div class="control-bar-above-content">
<v-btn
:icon="navigationDrawerShown ? 'mdi-menu-open' : 'mdi-menu'"
class="navigation-drawer-toggle-button"
variant="plain"
@click="navigationDrawerShown = !navigationDrawerShown"></v-btn>
<div class="search-field-container">
<learning-path-search-field></learning-path-search-field>
</div>
</div> </div>
</v-navigation-drawer>
<div class="control-bar-above-content">
<v-btn
:icon="navigationDrawerShown ? 'mdi-menu-open' : 'mdi-menu'"
class="navigation-drawer-toggle-button"
variant="plain"
@click="navigationDrawerShown = !navigationDrawerShown"></v-btn>
<div class="search-field-container">
<learning-path-search-field></learning-path-search-field>
</div>
</div>
<learning-object-view <learning-object-view
:hruid="currentNode.learningobjectHruid" :hruid="currentNode.learningobjectHruid"
:language="currentNode.language" :language="currentNode.language"
:version="currentNode.version" :version="currentNode.version"
v-if="currentNode" v-if="currentNode"
></learning-object-view> ></learning-object-view>
<div class="navigation-buttons-container"> <div class="navigation-buttons-container">
<v-btn <v-btn
prepend-icon="mdi-chevron-left" prepend-icon="mdi-chevron-left"
variant="text" variant="text"
:disabled="!previousNode" :disabled="!previousNode"
:to="previousNode ? {path: previousNode.learningobjectHruid, query: route.query} : undefined" :to="previousNode ? {path: previousNode.learningobjectHruid, query: route.query} : undefined"
> >
{{ t("previous") }} {{ t("previous") }}
</v-btn> </v-btn>
<v-btn <v-btn
append-icon="mdi-chevron-right" append-icon="mdi-chevron-right"
variant="text" variant="text"
:disabled="!nextNode" :disabled="!nextNode"
:to="nextNode ? {path: nextNode.learningobjectHruid, query: route.query} : undefined" :to="nextNode ? {path: nextNode.learningobjectHruid, query: route.query} : undefined"
> >
{{ t("next") }} {{ t("next") }}
</v-btn> </v-btn>
</div> </div>
</using-remote-resource> </using-remote-resource>
</v-main>
</template> </template>
<style scoped> <style scoped>