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

Add query url and clickable navigation to SelfEvaluation

This commit is contained in:
Daniel Egger 2023-05-09 18:17:31 +02:00
parent 04b179aa52
commit eb3db902b9
1 changed files with 14 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
client/src/pages/learningPath/selfEvaluationPage/SelfEvaluation.vue
View File

@ -8,37 +8,36 @@ import LearningContentContainer from "@/pages/learningPath/learningContentPage/L
import LearningContentMultiLayout from "@/pages/learningPath/learningContentPage/layouts/LearningContentMultiLayout.vue"; import LearningContentMultiLayout from "@/pages/learningPath/learningContentPage/layouts/LearningContentMultiLayout.vue";
import { useCourseSessionsStore } from "@/stores/courseSessions"; import { useCourseSessionsStore } from "@/stores/courseSessions";
import eventBus from "@/utils/eventBus"; import eventBus from "@/utils/eventBus";
import { computed, onUnmounted, reactive } from "vue"; import { useRouteQuery } from "@vueuse/router";
import { computed, onUnmounted } from "vue";
log.debug("LearningContent.vue setup"); log.debug("LearningContent.vue setup");
const circleStore = useCircleStore(); const circleStore = useCircleStore();
const courseSession = useCourseSessionsStore(); const courseSession = useCourseSessionsStore();
const state = reactive({ const questionIndex = useRouteQuery("step", "0", { transform: Number, mode: "push" });
questionIndex: 0,
});
const props = defineProps<{ const props = defineProps<{
learningUnit: LearningUnit; learningUnit: LearningUnit;
}>(); }>();
const questions = computed(() => props.learningUnit?.children); const questions = computed(() => props.learningUnit?.children);
const currentQuestion = computed(() => questions.value[state.questionIndex]); const currentQuestion = computed(() => questions.value[questionIndex.value]);
const showPreviousButton = computed(() => state.questionIndex != 0); const showPreviousButton = computed(() => questionIndex.value != 0);
const showNextButton = computed( const showNextButton = computed(
() => state.questionIndex + 1 < questions.value?.length && questions.value?.length > 1 () => questionIndex.value + 1 < questions.value?.length && questions.value?.length > 1
); );
const showExitButton = computed( const showExitButton = computed(
() => () =>
questions.value?.length === 1 || questions.value?.length === state.questionIndex + 1 questions.value?.length === 1 || questions.value?.length === questionIndex.value + 1
); );
function handleContinue() { function handleContinue() {
log.debug("handleContinue"); log.debug("handleContinue");
if (state.questionIndex + 1 < questions.value.length) { if (questionIndex.value + 1 < questions.value.length) {
log.debug("increment questionIndex", state.questionIndex); log.debug("increment questionIndex", questionIndex.value);
state.questionIndex += 1; questionIndex.value += 1;
} else { } else {
log.debug("continue to next learning content"); log.debug("continue to next learning content");
circleStore.continueFromSelfEvaluation(props.learningUnit); circleStore.continueFromSelfEvaluation(props.learningUnit);
@ -47,8 +46,8 @@ function handleContinue() {
function handleBack() { function handleBack() {
log.debug("handleBack"); log.debug("handleBack");
if (state.questionIndex > 0 && state.questionIndex < questions.value.length) { if (questionIndex.value > 0 && questionIndex.value < questions.value.length) {
state.questionIndex -= 1; questionIndex.value -= 1;
} }
} }
@ -69,7 +68,7 @@ onUnmounted(() => {
@exit="circleStore.closeSelfEvaluation(props.learningUnit)" @exit="circleStore.closeSelfEvaluation(props.learningUnit)"
> >
<LearningContentMultiLayout <LearningContentMultiLayout
:current-step="state.questionIndex" :current-step="questionIndex"
:subtitle="$t('selfEvaluation.title')" :subtitle="$t('selfEvaluation.title')"
:title="$t('selfEvaluation.title', { title: learningUnit.title })" :title="$t('selfEvaluation.title', { title: learningUnit.title })"
learning-content-type="learningmodule" learning-content-type="learningmodule"
@ -78,6 +77,7 @@ onUnmounted(() => {
:show-exit-button="showExitButton" :show-exit-button="showExitButton"
:show-start-button="false" :show-start-button="false"
:show-previous-button="showPreviousButton" :show-previous-button="showPreviousButton"
:base-url="props.learningUnit.evaluate_url"
@previous="handleBack()" @previous="handleBack()"
@next="handleContinue()" @next="handleContinue()"
> >