Add region filter to persons page

client/src/pages/dashboard/DashboardDueDatesPage.vue

@@ -172,24 +172,6 @@ const circles = computed(() => {
 });
 const selectedCircle = ref<DropboxItem>(circles.value[0]);
 
-// async function loadCircleValues() {
-//   if (selectedCourse.value && selectedCourse.value.slug) {
-//     const learningPathQuery = useCourseData(selectedCourse.value.slug);
-//     await learningPathQuery.resultPromise;
-//     circles.value = [
-//       initialItemCircle,
-//       ...(learningPathQuery.circles.value ?? []).map((circle) => ({
-//         id: circle.id,
-//         name: circle.title,
-//       })),
-//     ];
-//   } else {
-//     circles.value = [initialItemCircle];
-//   }
-//
-//   selectedCircle.value = circles.value[0];
-// }
-
 const dueDateTypes = computed(() => {
   const types = _(dashboardDueDates.value)
     .map((dueDate) => {

client/src/pages/dashboard/DashboardPersonsPage.vue

@@ -25,7 +25,7 @@ const courses = computed(() => {
   return [
     {
       id: UNFILTERED,
-      name: t("a.Alle Lehrgänge"),
+      name: `${t("Lehrgang")}: ${t("a.Alle")}`,
     },
     ..._(dashboardPersons.value)
       .flatMap((person) => person.course_sessions)
@@ -37,11 +37,35 @@ const courses = computed(() => {
       .value(),
   ];
 });
-
 const selectedCourse = ref<MenuItem>(courses.value[0]);
 
+const regions = computed(() => {
+  let values = _(dashboardPersons.value)
+    .flatMap((person) => person.course_sessions)
+    .map((cs) => {
+      return Object.assign({}, cs, { name: cs.region, id: cs.region });
+    })
+    .uniqBy("id")
+    .orderBy("name")
+    .value();
+
+  // filter by selected course
+  if (selectedCourse.value.id !== UNFILTERED) {
+    values = values.filter((cs) => cs.course_id === selectedCourse.value.id);
+  }
+
+  return [
+    {
+      id: UNFILTERED,
+      name: `${t("Region")}: ${t("a.Alle")}`,
+    },
+    ...values,
+  ];
+});
+const selectedRegion = ref<MenuItem>(regions.value[0]);
+
 const courseSessions = computed(() => {
-  let sessions = _(dashboardPersons.value)
+  let values = _(dashboardPersons.value)
     .flatMap((person) => person.course_sessions)
     .map((cs) => {
       return Object.assign({}, cs, { name: cs.session_title, id: cs.id });
@@ -52,20 +76,43 @@ const courseSessions = computed(() => {
 
   // filter by selected course
   if (selectedCourse.value.id !== UNFILTERED) {
-    sessions = sessions.filter((cs) => cs.course_id === selectedCourse.value.id);
+    values = values.filter((cs) => cs.course_id === selectedCourse.value.id);
+  }
+  // filter by selected region
+  if (selectedRegion.value.id !== UNFILTERED) {
+    values = values.filter((cs) => cs.region === selectedRegion.value.id);
   }
 
   return [
     {
       id: UNFILTERED,
-      name: t("a.AlleDurchführungen"),
+      name: `${t("Durchführung")}: ${t("a.Alle")}`,
     },
-    ...sessions,
+    ...values,
   ];
 });
-
 const selectedSession = ref<MenuItem>(courseSessions.value[0]);
 
+const generations = computed(() => {
+  const values = _(dashboardPersons.value)
+    .flatMap((person) => person.course_sessions)
+    .map((cs) => {
+      return Object.assign({}, cs, { name: cs.generation, id: cs.generation });
+    })
+    .uniqBy("id")
+    .orderBy("name")
+    .value();
+
+  return [
+    {
+      id: UNFILTERED,
+      name: `${t("Generation")}: ${t("a.Alle")}`,
+    },
+    ...values,
+  ];
+});
+const selectedGeneration = ref<MenuItem>(generations.value[0]);
+
 const filteredPersons = computed(() => {
   return _.orderBy(
     dashboardPersons.value
@@ -82,13 +129,33 @@ const filteredPersons = computed(() => {
           return true;
         }
         return person.course_sessions.some((cs) => cs.id === selectedSession.value.id);
+      })
+      .filter((person) => {
+        if (selectedRegion.value.id === UNFILTERED) {
+          return true;
+        }
+        return person.course_sessions.some(
+          (cs) => cs.region === selectedRegion.value.id
+        );
+      })
+      .filter((person) => {
+        if (selectedGeneration.value.id === UNFILTERED) {
+          return true;
+        }
+        return person.course_sessions.some(
+          (cs) => cs.generation === selectedGeneration.value.id
+        );
       }),
     ["last_name", "first_name"]
   );
 });
 
 const filtersVisible = computed(() => {
-  return courses.value.length > 2 || courseSessions.value.length > 2;
+  return (
+    courses.value.length > 2 ||
+    courseSessions.value.length > 2 ||
+    regions.value.length > 2
+  );
 });
 
 function personRoleDisplayValue(personCourseSession: DashboardPersonCourseSessionType) {
@@ -111,6 +178,10 @@ function personRoleDisplayValue(personCourseSession: DashboardPersonCourseSessio
 }
 
 watch(selectedCourse, () => {
+  selectedRegion.value = regions.value[0];
+});
+
+watch(selectedRegion, () => {
   selectedSession.value = courseSessions.value[0];
 });
 </script>
@@ -139,18 +210,34 @@ watch(selectedCourse, () => {
             <ItDropdownSelect
               v-if="courses.length > 2"
               v-model="selectedCourse"
-              data-cy="session-select"
+              data-cy="select-course"
               :items="courses"
               borderless
             ></ItDropdownSelect>
 
+            <ItDropdownSelect
+              v-if="regions.length > 2"
+              v-model="selectedRegion"
+              data-cy="select-region"
+              :items="regions"
+              borderless
+            ></ItDropdownSelect>
+
             <ItDropdownSelect
               v-if="courseSessions.length > 2"
               v-model="selectedSession"
-              data-cy="session-select"
+              data-cy="select-session"
               :items="courseSessions"
               borderless
             ></ItDropdownSelect>
+
+            <ItDropdownSelect
+              v-if="generations.length > 2"
+              v-model="selectedGeneration"
+              data-cy="select-generation"
+              :items="generations"
+              borderless
+            ></ItDropdownSelect>
           </section>
           <div
             v-for="person in filteredPersons"

client/src/services/dashboard.ts

@@ -44,6 +44,8 @@ export type DashboardPersonCourseSessionType = {
   course_id: string;
   course_title: string;
   course_slug: string;
+  region: string;
+  generation: string;
   user_role: DashboardPersonRoleType;
   my_role: DashboardPersonRoleType;
   is_uk: boolean;

server/vbv_lernwelt/dashboard/views.py

@@ -126,6 +126,22 @@ def user_role(roles: Set[str]) -> str:
     return "LEARNING_MENTOR"
 
 
+def _create_course_session_dict(course_session_object, my_role, user_role):
+    return {
+        "id": str(course_session_object.id),
+        "session_title": course_session_object.title,
+        "course_id": str(course_session_object.course.id),
+        "course_title": course_session_object.course.title,
+        "course_slug": course_session_object.course.slug,
+        "region": course_session_object.region,
+        "generation": course_session_object.generation,
+        "my_role": my_role,
+        "user_role": user_role,
+        "is_uk": course_session_object.course.configuration.is_uk,
+        "is_vv": course_session_object.course.configuration.is_vv,
+    }
+
+
 @api_view(["GET"])
 def get_dashboard_persons(request):
     def create_user_dict(user_object):
@@ -138,19 +154,6 @@ def get_dashboard_persons(request):
             "avatar_url": user_object.avatar_url,
         }
 
-    def create_course_session_dict(course_session_object, user_role, my_role):
-        return {
-            "id": str(course_session_object.id),
-            "session_title": course_session_object.title,
-            "course_id": str(course_session_object.course.id),
-            "course_title": course_session_object.course.title,
-            "course_slug": course_session_object.course.slug,
-            "user_role": user_role,
-            "my_role": my_role,
-            "is_uk": course_session_object.course.configuration.is_uk,
-            "is_vv": course_session_object.course.configuration.is_vv,
-        }
-
     try:
         course_sessions = get_course_sessions_with_roles_for_user(request.user)
 
@@ -164,7 +167,7 @@ def get_dashboard_persons(request):
                 for csu in course_session_users:
                     person_data = create_user_dict(csu.user)
                     person_data["course_sessions"] = [
-                        create_course_session_dict(cs, csu.role, my_role)
+                        _create_course_session_dict(cs, my_role, csu.role)
                     ]
                     result_persons[csu.user.id] = person_data
 
@@ -176,8 +179,10 @@ def get_dashboard_persons(request):
                 ).first()
 
                 for participant in lm.participants.all():
-                    course_session_entry = create_course_session_dict(
+                    course_session_entry = _create_course_session_dict(
-                        cs, "LEARNING_MENTEE", "LEARNING_MENTOR"
+                        cs,
+                        "LEARNING_MENTOR",
+                        "LEARNING_MENTEE",
                     )
 
                     if participant.user.id not in result_persons:
@@ -196,8 +201,10 @@ def get_dashboard_persons(request):
         ).prefetch_related("mentor", "course_session")
         for mentor_relation in mentor_relation_qs:
             cs = mentor_relation.course_session
-            course_session_entry = create_course_session_dict(
+            course_session_entry = _create_course_session_dict(
-                cs, "LEARNING_MENTOR", "LEARNING_MENTEE"
+                cs,
+                "LEARNING_MENTEE",
+                "LEARNING_MENTOR",
             )
 
             if mentor_relation.mentor.id not in result_persons:
@@ -257,16 +264,9 @@ def get_dashboard_due_dates(request):
                 if course_session.id == due_date.course_session.id
             )
             if cs:
-                data["course_session"] = {
+                data["course_session"] = _create_course_session_dict(
-                    "id": str(cs.id),
+                    cs, my_role=user_role(cs.roles), user_role=""
-                    "session_title": cs.title,
+                )
-                    "course_id": str(cs.course.id),
-                    "course_title": cs.course.title,
-                    "course_slug": cs.course.slug,
-                    "my_role": user_role(cs.roles),
-                    "is_uk": cs.course.configuration.is_uk,
-                    "is_vv": cs.course.configuration.is_vv,
-                }
             result_due_dates.append(data)
 
         return Response(