From 4ba12cbec83017822c7ae698906203e2a4c5c0f7 Mon Sep 17 00:00:00 2001 From: Reto Aebersold Date: Wed, 20 Sep 2023 15:32:21 +0200 Subject: [PATCH] Singe circle selection --- .../src/pages/cockpit/CockpitParentPage.vue | 10 +- .../pages/cockpit/CockpitUserCirclePage.vue | 2 +- .../pages/cockpit/CockpitUserProfilePage.vue | 2 +- .../assignmentsPage/AssignmentDetails.vue | 4 +- .../AttendanceCheckPage.vue | 2 +- .../cockpit/cockpitPage/CockpitDates.vue | 5 +- .../pages/cockpit/cockpitPage/CockpitPage.vue | 327 ++++++++---------- .../FeedbackSubmissionProgress.vue | 2 +- .../cockpitPage/SubmissionsOverview.vue | 6 +- client/src/services/assignmentService.ts | 4 +- client/src/stores/cockpit.ts | 115 +++--- 11 files changed, 242 insertions(+), 237 deletions(-) diff --git a/client/src/pages/cockpit/CockpitParentPage.vue b/client/src/pages/cockpit/CockpitParentPage.vue index 984f1c2d..a0f1663a 100644 --- a/client/src/pages/cockpit/CockpitParentPage.vue +++ b/client/src/pages/cockpit/CockpitParentPage.vue @@ -22,8 +22,8 @@ onMounted(async () => { log.debug("CockpitParentPage mounted", props.courseSlug); try { - await cockpitStore.loadCourseSessionUsers(courseSession.value.id); - cockpitStore.courseSessionUsers?.forEach((csu) => { + const members = await cockpitStore.loadCourseSessionMembers(courseSession.value.id); + members.forEach((csu) => { competenceStore.loadCompetenceProfilePage( props.courseSlug + "-competencenavi-competences", csu.user_id @@ -31,7 +31,11 @@ onMounted(async () => { learningPathStore.loadLearningPath(props.courseSlug + "-lp", csu.user_id); }); - learningPathStore.loadLearningPath(props.courseSlug + "-lp", useUserStore().id); + await learningPathStore.loadLearningPath( + props.courseSlug + "-lp", + useUserStore().id + ); + await cockpitStore.loadCircles(props.courseSlug, courseSession.value.id); } catch (error) { log.error(error); } diff --git a/client/src/pages/cockpit/CockpitUserCirclePage.vue b/client/src/pages/cockpit/CockpitUserCirclePage.vue index 4d3b922f..12d66b67 100644 --- a/client/src/pages/cockpit/CockpitUserCirclePage.vue +++ b/client/src/pages/cockpit/CockpitUserCirclePage.vue @@ -19,7 +19,7 @@ onMounted(async () => { }); const user = computed(() => { - return cockpitStore.courseSessionUsers?.find((csu) => csu.user_id === props.userId); + return cockpitStore.courseSessionMembers?.find((csu) => csu.user_id === props.userId); }); diff --git a/client/src/pages/cockpit/CockpitUserProfilePage.vue b/client/src/pages/cockpit/CockpitUserProfilePage.vue index 360350cf..d78609a6 100644 --- a/client/src/pages/cockpit/CockpitUserProfilePage.vue +++ b/client/src/pages/cockpit/CockpitUserProfilePage.vue @@ -28,7 +28,7 @@ const learningPath = computed(() => { }); const user = computed(() => { - return cockpitStore.courseSessionUsers?.find((csu) => csu.user_id === props.userId); + return cockpitStore.courseSessionMembers?.find((csu) => csu.user_id === props.userId); }); function setActiveClasses(isActive: boolean) { diff --git a/client/src/pages/cockpit/assignmentsPage/AssignmentDetails.vue b/client/src/pages/cockpit/assignmentsPage/AssignmentDetails.vue index d343d7c8..bd3d1b74 100644 --- a/client/src/pages/cockpit/assignmentsPage/AssignmentDetails.vue +++ b/client/src/pages/cockpit/assignmentsPage/AssignmentDetails.vue @@ -85,10 +85,10 @@ const assignmentDetail = computed(() => /> -
+
    { const dueDates = courseSession.value.due_dates.filter((dueDate) => { - return cockpitStore.selectedCircles.includes( - dueDate?.circle?.translation_key ?? "" + if (!cockpitStore.selectedCircle) return false; + return ( + cockpitStore.selectedCircle.translation_key == dueDate?.circle?.translation_key ); }); return dueDates.slice(0, 4); diff --git a/client/src/pages/cockpit/cockpitPage/CockpitPage.vue b/client/src/pages/cockpit/cockpitPage/CockpitPage.vue index 2ad8ebd2..c6a94f25 100644 --- a/client/src/pages/cockpit/cockpitPage/CockpitPage.vue +++ b/client/src/pages/cockpit/cockpitPage/CockpitPage.vue @@ -8,11 +8,10 @@ import SubmissionsOverview from "@/pages/cockpit/cockpitPage/SubmissionsOverview import { useCockpitStore } from "@/stores/cockpit"; import { useCompetenceStore } from "@/stores/competence"; import { useLearningPathStore } from "@/stores/learningPath"; -import { useUserStore } from "@/stores/user"; import groupBy from "lodash/groupBy"; import log from "loglevel"; -import { computed } from "vue"; import CockpitDates from "@/pages/cockpit/cockpitPage/CockpitDates.vue"; +import ItDropdownSelect from "@/components/ui/ItDropdownSelect.vue"; const props = defineProps<{ courseSlug: string; @@ -20,54 +19,19 @@ const props = defineProps<{ log.debug("CockpitIndexPage created", props.courseSlug); -const userStore = useUserStore(); const cockpitStore = useCockpitStore(); const competenceStore = useCompetenceStore(); const learningPathStore = useLearningPathStore(); const courseSession = useCurrentCourseSession(); function userCountStatusForCircle(userId: string, translationKey: string) { - const criteria = competenceStore.flatPerformanceCriteria( - userId, - cockpitStore.selectedCircles - ); + if (!cockpitStore.selectedCircle) return { FAIL: 0, SUCCESS: 0, UNKNOWN: 0 }; + const criteria = competenceStore.flatPerformanceCriteria(userId, [ + cockpitStore.selectedCircle.translation_key, + ]); const grouped = groupBy(criteria, "circle.translation_key"); - return competenceStore.calcStatusCount(grouped[translationKey] as []); } - -const circles = computed(() => { - const learningPathCircles = learningPathStore - .learningPathForUser(props.courseSlug, userStore.id) - ?.circles.map((c) => { - return { - id: c.id, - title: c.title, - slug: c.slug, - translation_key: c.translation_key, - }; - }); - - if (cockpitStore.cockpitSessionUser?.circles?.length) { - return cockpitStore.cockpitSessionUser.circles; - } else if (learningPathCircles) { - return learningPathCircles; - } else { - return []; - } -}); - -const selectedCirclesTitles = computed(() => { - return circles.value - .filter((c) => cockpitStore.selectedCircles.includes(c.translation_key)) - .map((c) => c.title) as string[]; -}); - -function setActiveClasses(translationKey: string) { - return cockpitStore.selectedCircles.indexOf(translationKey) > -1 - ? ["bg-blue-900", "text-white"] - : ["text-bg-900"]; -} diff --git a/client/src/pages/cockpit/cockpitPage/FeedbackSubmissionProgress.vue b/client/src/pages/cockpit/cockpitPage/FeedbackSubmissionProgress.vue index 05ed963f..78c16ff7 100644 --- a/client/src/pages/cockpit/cockpitPage/FeedbackSubmissionProgress.vue +++ b/client/src/pages/cockpit/cockpitPage/FeedbackSubmissionProgress.vue @@ -18,7 +18,7 @@ const cockpitStore = useCockpitStore(); const completeFeedbacks = ref(0); const numFeedbacks = computed(() => { - return cockpitStore.courseSessionUsers?.length ?? 0; + return cockpitStore.courseSessionMembers?.length ?? 0; }); onMounted(async () => { diff --git a/client/src/pages/cockpit/cockpitPage/SubmissionsOverview.vue b/client/src/pages/cockpit/cockpitPage/SubmissionsOverview.vue index b25263bd..93b5967a 100644 --- a/client/src/pages/cockpit/cockpitPage/SubmissionsOverview.vue +++ b/client/src/pages/cockpit/cockpitPage/SubmissionsOverview.vue @@ -27,7 +27,7 @@ interface Submittable { const props = defineProps<{ courseSession: CourseSession; - selectedCircles: string[]; + selectedCircle: number; }>(); log.debug("SubmissionsOverview created", props.courseSession.id); @@ -46,7 +46,7 @@ const submittables = computed(() => { return []; } return learningPath.circles - .filter((circle) => props.selectedCircles.includes(circle.title)) + .filter((circle) => props.selectedCircle == circle.id) .flatMap((circle) => { const learningContents = circle.flatLearningContents.filter( (lc) => @@ -128,7 +128,7 @@ const getIconName = (lc: LearningContent) => {