vbv/client/src/pages/learningPath/selfEvaluationPage/SelfEvaluationSubmit.vue

99 lines
3.0 KiB
Vue

<script setup lang="ts">
import type { LearningUnit, LearningUnitPerformanceCriteria } from "@/types";
import { useLearningMentors } from "@/composables";
import { ref } from "vue";
import ItButton from "@/components/ui/ItButton.vue";
import NoMentorInformationPanel from "@/components/mentor/NoMentorInformationPanel.vue";
defineProps<{
learningUnit: LearningUnit;
criteria: LearningUnitPerformanceCriteria[];
}>();
const selectedLearningMentor = ref();
const learningMentors = useLearningMentors().learningMentors;
const onSubmitForMentorFeedback = async () => {
try {
console.log("submit for mentor feedback");
} catch (error) {
console.log("Could not submit assignment", error);
}
};
</script>
<template>
<div class="w-full pt-8">
<div class="w-full border border-gray-400">
<div class="m-6 space-y-6">
<h3 class="heading-3">
{{ $t("a.Selbsteinschätzung teilen") }}
</h3>
<div v-if="!learningMentors?.length">
<p>
{{
$t(
"a.Du kannst deine Selbsteinschätzung mit deiner Lernbegleitung teilen, damit sie eine Fremdeinschätzung vornimmt."
)
}}
</p>
<select v-model="selectedLearningMentor" data-cy="select-learning-mentor">
<option
v-for="learningMentor in learningMentors"
:key="learningMentor.id"
:value="learningMentor.mentor"
>
{{ learningMentor.mentor.first_name }}
{{ learningMentor.mentor.last_name }}
</option>
</select>
<ItButton
class="mt-6"
variant="primary"
size="large"
:disabled="!selectedLearningMentor"
data-cy="submit-assignment"
@click="onSubmitForMentorFeedback"
>
<p v-if="!selectedLearningMentor">
{{ $t("a.Selbsteinschätzung teilen") }}
</p>
<p v-else-if="learningMentors?.length == 0">
{{
$t("a.Selbsteinschätzung mit MENTOR_NAME teilen", {
MENTOR_NAME: selectedLearningMentor.first_name,
})
}}
</p>
</ItButton>
</div>
<div v-else>
<NoMentorInformationPanel />
</div>
</div>
</div>
</div>
<div
v-for="(pc, index) in criteria"
:key="pc.id"
class="flex flex-col space-y-4 border-t border-gray-400"
>
<div class="flex justify-between">
<b>{{ pc.title }}</b>
<router-link :to="`${learningUnit.evaluate_url}?step=${index}`" class="underline">
{{ $t("a.Bearbeiten") }}
</router-link>
</div>
<div v-if="pc.completion_status == 'SUCCESS'">
<it-icon-smiley-happy class="h-6 w-6" />
{{ $t("selfEvaluation.yes") }}
</div>
<div v-else>
<it-icon-smiley-thinking class="h-6 w-6" />
{{ $t("selfEvaluation.no") }}
</div>
</div>
</template>
<style scoped></style>