111 lines
3.3 KiB
Vue
111 lines
3.3 KiB
Vue
<script setup lang="ts">
|
|
import type { StatusCount, StatusCountKey } from "@/components/ui/ItProgress.vue";
|
|
import ItProgress from "@/components/ui/ItProgress.vue";
|
|
import { loadAssignmentCompletionStatusData } from "@/services/assignmentService";
|
|
import type {
|
|
AssignmentCompletionStatus,
|
|
CourseSession,
|
|
LearningContentAssignment,
|
|
LearningContentEdoniqTest,
|
|
} from "@/types";
|
|
import log from "loglevel";
|
|
import { computed, onMounted, reactive } from "vue";
|
|
import { stringifyParse } from "@/utils/utils";
|
|
|
|
const props = defineProps<{
|
|
courseSession: CourseSession;
|
|
learningContent: LearningContentAssignment | LearningContentEdoniqTest;
|
|
showTitle: boolean;
|
|
}>();
|
|
|
|
log.debug("AssignmentSubmissionProgress created", stringifyParse(props));
|
|
|
|
const state = reactive({
|
|
statusByUser: [] as {
|
|
userStatus: AssignmentCompletionStatus;
|
|
progressStatus: StatusCountKey;
|
|
userId: string;
|
|
}[],
|
|
submissionProgressStatusCount: {} as StatusCount,
|
|
gradingProgressStatusCount: {} as StatusCount,
|
|
});
|
|
|
|
onMounted(async () => {
|
|
const { assignmentSubmittedUsers, gradedUsers, total } =
|
|
await loadAssignmentCompletionStatusData(
|
|
props.learningContent.content_assignment.id,
|
|
props.courseSession.id,
|
|
props.learningContent.id
|
|
);
|
|
|
|
state.submissionProgressStatusCount = {
|
|
SUCCESS: assignmentSubmittedUsers.length,
|
|
UNKNOWN: total - assignmentSubmittedUsers.length,
|
|
FAIL: 0,
|
|
};
|
|
state.gradingProgressStatusCount = {
|
|
SUCCESS: gradedUsers.length,
|
|
UNKNOWN: total - gradedUsers.length,
|
|
FAIL: 0,
|
|
};
|
|
});
|
|
|
|
const doneCount = (status: StatusCount) => {
|
|
return status.SUCCESS || 0;
|
|
};
|
|
|
|
const totalCount = (status: StatusCount) => {
|
|
return doneCount(status) + status.UNKNOWN || 0;
|
|
};
|
|
|
|
const showEvaluationStatus = computed(() => {
|
|
return (
|
|
props.learningContent.content_assignment.assignment_type === "MANDATORY_CASEWORK" ||
|
|
props.learningContent.content_assignment.assignment_type === "VOLUNTARY_CASEWORK" ||
|
|
props.learningContent.content_assignment.assignment_type === "EDONIQ_TEST"
|
|
);
|
|
});
|
|
|
|
const showSubmissionStatus = computed(() => {
|
|
return (
|
|
props.learningContent.content_assignment.assignment_type === "PREP_ASSIGNMENT" ||
|
|
props.learningContent.content_assignment.assignment_type === "REFLECTION" ||
|
|
props.learningContent.content_assignment.assignment_type === "CONDITION_ACCEPTANCE"
|
|
);
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<div>
|
|
<div v-if="showTitle">
|
|
{{ props.learningContent.title }}
|
|
</div>
|
|
<ItProgress :status-count="state.submissionProgressStatusCount" />
|
|
<div class="text-gray-900">
|
|
<div v-if="showEvaluationStatus">
|
|
{{
|
|
$t("x von y Ergebnisse abgegeben", {
|
|
x: doneCount(state.submissionProgressStatusCount),
|
|
y: totalCount(state.submissionProgressStatusCount),
|
|
})
|
|
}}
|
|
<br />
|
|
{{
|
|
$t("x von y Bewertungen freigegeben", {
|
|
x: doneCount(state.gradingProgressStatusCount),
|
|
y: totalCount(state.gradingProgressStatusCount),
|
|
})
|
|
}}
|
|
</div>
|
|
<div v-else-if="showSubmissionStatus">
|
|
{{
|
|
$t("x von y abgeschlossen", {
|
|
x: doneCount(state.submissionProgressStatusCount),
|
|
y: totalCount(state.submissionProgressStatusCount),
|
|
})
|
|
}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|