feat: tip wanneer er geen leerobject geselecteerd is in discussies

This commit is contained in:
Timo De Meyst 2025-05-15 19:04:36 +02:00
parent b193d47d42
commit 233d89b5bf
6 changed files with 51 additions and 25 deletions

View file

@ -185,7 +185,7 @@
</v-list-item> </v-list-item>
<v-list-item <v-list-item
to="/user/discussion" to="/discussion"
link link
> >
<v-list-item-title class="menu_item">{{ t("discussions") }}</v-list-item-title> <v-list-item-title class="menu_item">{{ t("discussions") }}</v-list-item-title>

View file

@ -127,5 +127,6 @@
"question-input-placeholder": "Frage...", "question-input-placeholder": "Frage...",
"answer-input-placeholder": "Antwort...", "answer-input-placeholder": "Antwort...",
"answers-toggle-hide": "Antworten verstecken", "answers-toggle-hide": "Antworten verstecken",
"answers-toggle-show": "Antworten anzeigen" "answers-toggle-show": "Antworten anzeigen",
"no-discussion-tip": "Wählen Sie ein Lernobjekt aus, um dessen Fragen anzuzeigen"
} }

View file

@ -127,6 +127,7 @@
"question-input-placeholder": "question...", "question-input-placeholder": "question...",
"answer-input-placeholder": "answer...", "answer-input-placeholder": "answer...",
"answers-toggle-hide": "Hide answers", "answers-toggle-hide": "Hide answers",
"answers-toggle-show": "Show answers" "answers-toggle-show": "Show answers",
"no-discussion-tip": "Choose a learning object to view its questions"
} }

View file

@ -127,5 +127,6 @@
"question-input-placeholder": "question...", "question-input-placeholder": "question...",
"answer-input-placeholder": "réponse...", "answer-input-placeholder": "réponse...",
"answers-toggle-hide": "Masquer réponses", "answers-toggle-hide": "Masquer réponses",
"answers-toggle-show": "Afficher réponse" "answers-toggle-show": "Afficher réponse",
"no-discussion-tip": "Sélectionnez un objet d'apprentissage pour afficher les questions qui s'y rapportent"
} }

View file

@ -127,5 +127,6 @@
"question-input-placeholder": "vraag...", "question-input-placeholder": "vraag...",
"answer-input-placeholder": "antwoord...", "answer-input-placeholder": "antwoord...",
"answers-toggle-hide": "Verberg antwoorden", "answers-toggle-hide": "Verberg antwoorden",
"answers-toggle-show": "Toon antwoorden" "answers-toggle-show": "Toon antwoorden",
"no-discussion-tip": "Kies een leerobject om zijn vragen te bekijken"
} }

View file

@ -4,44 +4,66 @@
import { useGetAllLearningPaths } from "@/queries/learning-paths.ts"; import { useGetAllLearningPaths } from "@/queries/learning-paths.ts";
import UsingQueryResult from "@/components/UsingQueryResult.vue"; import UsingQueryResult from "@/components/UsingQueryResult.vue";
import DiscussionSideBarElement from "@/components/DiscussionSideBarElement.vue"; import DiscussionSideBarElement from "@/components/DiscussionSideBarElement.vue";
import { ref } from "vue";
const { t, locale } = useI18n(); const { t, locale } = useI18n();
const allLearningPathsResult = useGetAllLearningPaths(locale.value) const allLearningPathsResult = useGetAllLearningPaths(locale.value)
const navigationDrawerShown = ref(true);
</script> </script>
<template> <template>
<div class="d-flex flex-column h-100"> <v-navigation-drawer
<v-list-item> v-model="navigationDrawerShown"
<template v-slot:title> :width="350"
<div class="title">{{t("discussions")}}</div> app
</template> >
</v-list-item> <div class="d-flex flex-column h-100">
<v-divider></v-divider> <v-list-item>
<div> <template v-slot:title>
<using-query-result <div class="title">{{t("discussions")}}</div>
:query-result="allLearningPathsResult" </template>
v-slot="learningPaths: {data: LearningPath[]}"> </v-list-item>
<DiscussionSideBarElement <v-divider></v-divider>
v-for="learningPath in learningPaths.data" <div>
:path="learningPath" <using-query-result
:activeObjectId="'' as string" :query-result="allLearningPathsResult"
:key="learningPath.hruid" v-slot="learningPaths: {data: LearningPath[]}">
> <DiscussionSideBarElement
</DiscussionSideBarElement> v-for="learningPath in learningPaths.data"
</using-query-result> :path="learningPath"
:activeObjectId="'' as string"
:key="learningPath.hruid"
>
</DiscussionSideBarElement>
</using-query-result>
</div>
</div> </div>
</v-navigation-drawer>
<div>
<p class="no-discussion-tip">{{t("no-discussion-tip")}}</p>
</div> </div>
</template> </template>
<style scoped> <style scoped>
.no-discussion-tip {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
text-align: center;
font-size: 18px;
color: #666;
padding: 0 20px;
}
.title { .title {
color: #0e6942; color: #0e6942;
text-transform: uppercase; text-transform: uppercase;
font-weight: bolder; font-weight: bolder;
padding-top: 2%; padding-top: 2%;
font-size: 50px; font-size: 36px;
} }
.learning-path-title { .learning-path-title {
white-space: normal; white-space: normal;