feat: tip wanneer er geen leerobject geselecteerd is in discussies
This commit is contained in:
parent
b193d47d42
commit
233d89b5bf
6 changed files with 51 additions and 25 deletions
|
@ -185,7 +185,7 @@
|
|||
</v-list-item>
|
||||
|
||||
<v-list-item
|
||||
to="/user/discussion"
|
||||
to="/discussion"
|
||||
link
|
||||
>
|
||||
<v-list-item-title class="menu_item">{{ t("discussions") }}</v-list-item-title>
|
||||
|
|
|
@ -127,5 +127,6 @@
|
|||
"question-input-placeholder": "Frage...",
|
||||
"answer-input-placeholder": "Antwort...",
|
||||
"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"
|
||||
}
|
||||
|
|
|
@ -127,6 +127,7 @@
|
|||
"question-input-placeholder": "question...",
|
||||
"answer-input-placeholder": "answer...",
|
||||
"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"
|
||||
|
||||
}
|
||||
|
|
|
@ -127,5 +127,6 @@
|
|||
"question-input-placeholder": "question...",
|
||||
"answer-input-placeholder": "réponse...",
|
||||
"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"
|
||||
}
|
||||
|
|
|
@ -127,5 +127,6 @@
|
|||
"question-input-placeholder": "vraag...",
|
||||
"answer-input-placeholder": "antwoord...",
|
||||
"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"
|
||||
}
|
||||
|
|
|
@ -4,44 +4,66 @@
|
|||
import { useGetAllLearningPaths } from "@/queries/learning-paths.ts";
|
||||
import UsingQueryResult from "@/components/UsingQueryResult.vue";
|
||||
import DiscussionSideBarElement from "@/components/DiscussionSideBarElement.vue";
|
||||
import { ref } from "vue";
|
||||
|
||||
const { t, locale } = useI18n();
|
||||
|
||||
const allLearningPathsResult = useGetAllLearningPaths(locale.value)
|
||||
|
||||
const navigationDrawerShown = ref(true);
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="d-flex flex-column h-100">
|
||||
<v-list-item>
|
||||
<template v-slot:title>
|
||||
<div class="title">{{t("discussions")}}</div>
|
||||
</template>
|
||||
</v-list-item>
|
||||
<v-divider></v-divider>
|
||||
<div>
|
||||
<using-query-result
|
||||
:query-result="allLearningPathsResult"
|
||||
v-slot="learningPaths: {data: LearningPath[]}">
|
||||
<DiscussionSideBarElement
|
||||
v-for="learningPath in learningPaths.data"
|
||||
:path="learningPath"
|
||||
:activeObjectId="'' as string"
|
||||
:key="learningPath.hruid"
|
||||
>
|
||||
</DiscussionSideBarElement>
|
||||
</using-query-result>
|
||||
<v-navigation-drawer
|
||||
v-model="navigationDrawerShown"
|
||||
:width="350"
|
||||
app
|
||||
>
|
||||
<div class="d-flex flex-column h-100">
|
||||
<v-list-item>
|
||||
<template v-slot:title>
|
||||
<div class="title">{{t("discussions")}}</div>
|
||||
</template>
|
||||
</v-list-item>
|
||||
<v-divider></v-divider>
|
||||
<div>
|
||||
<using-query-result
|
||||
:query-result="allLearningPathsResult"
|
||||
v-slot="learningPaths: {data: LearningPath[]}">
|
||||
<DiscussionSideBarElement
|
||||
v-for="learningPath in learningPaths.data"
|
||||
:path="learningPath"
|
||||
:activeObjectId="'' as string"
|
||||
:key="learningPath.hruid"
|
||||
>
|
||||
</DiscussionSideBarElement>
|
||||
</using-query-result>
|
||||
</div>
|
||||
</div>
|
||||
</v-navigation-drawer>
|
||||
<div>
|
||||
<p class="no-discussion-tip">{{t("no-discussion-tip")}}</p>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<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 {
|
||||
color: #0e6942;
|
||||
text-transform: uppercase;
|
||||
font-weight: bolder;
|
||||
padding-top: 2%;
|
||||
font-size: 50px;
|
||||
font-size: 36px;
|
||||
}
|
||||
.learning-path-title {
|
||||
white-space: normal;
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue