Refactor teacher select field

aleksis/apps/cursus/frontend/components/SubjectChip.vue

@@ -12,6 +12,11 @@ export default {
       required: false,
       default: false,
     },
+    prependIcon: {
+      type: String,
+      default: null,
+      required: false,
+    },
     appendIcon: {
       type: String,
       default: null,
@@ -28,6 +33,7 @@ export default {
     :color="subject.colourBg"
     :text-color="subject.colourFg"
   >
+    <v-icon left v-if="prependIcon">{{ prependIcon }}</v-icon>
     {{ shortName ? subject.shortName : subject.name }}
     <v-icon right v-if="appendIcon">{{ appendIcon }}</v-icon>
   </v-chip>

aleksis/apps/cursus/frontend/components/TeacherField.vue

+<script setup>
+import SubjectChip from "./SubjectChip.vue";
+</script>
+
 <template>
   <v-autocomplete
     v-bind="$attrs"
@@ -9,20 +13,25 @@
     :loading="$apollo.queries.persons.loading"
   >
     <template #item="data">
-      <template v-if="typeof data.item !== 'object'">
-        <v-list-item-content>{{ data.item }}</v-list-item-content>
-      </template>
-      <template v-else>
-        <v-list-item-action>
-          <v-checkbox v-model="data.attrs.inputValue" />
-        </v-list-item-action>
-        <v-list-item-content>
-          <v-list-item-title>{{ data.item.fullName }}</v-list-item-title>
-          <v-list-item-subtitle v-if="data.item.shortName">{{
-            data.item.shortName
-          }}</v-list-item-subtitle>
-        </v-list-item-content>
-      </template>
+      <v-list-item-action>
+        <v-checkbox v-model="data.attrs.inputValue" />
+      </v-list-item-action>
+      <v-list-item-content>
+        <v-list-item-title>{{ data.item.fullName }}</v-list-item-title>
+        <v-list-item-subtitle v-if="data.item.shortName">{{
+          data.item.shortName
+        }}
+        </v-list-item-subtitle>
+        <v-list-item-subtitle v-if="showSubjects && data.item.subjectsAsTeacher.length">
+          <subject-chip
+          v-for="subject in data.item.subjectsAsTeacher"
+          :subject="subject"
+          :prepend-icon="subject.id === prioritySubject.id ? '$success' : ''"
+          :short-name="true"
+          x-small
+          />
+        </v-list-item-subtitle>
+      </v-list-item-content>
     </template>
     <template #prepend-inner>
       <slot name="prepend-inner" />
@@ -44,27 +53,35 @@ export default {
     };
   },
   props: {
-    subject: {
+    showSubjects: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
+    prioritySubject: {
       type: Object,
-      required: true,
+      required: false,
+      default: null,
     },
   },
   computed: {
     teacherList() {
-      return [
-        {
-          header: this.$t("cursus.teacher.field.subject_teachers"),
-        },
-        ...this.persons.filter((person) =>
-          this.subject.teachers.find((teacher) => teacher.id === person.id),
-        ),
-        { divider: true },
-        { header: this.$t("cursus.teacher.field.all_teachers") },
-        ...this.persons.filter(
-          (person) =>
-            !this.subject.teachers.find((teacher) => teacher.id === person.id),
-        ),
-      ];
+      if (this.prioritySubject) {
+        let matching = [];
+        let nonMatching = [];
+
+        this.persons.forEach((p) => {
+          if (p.subjectsAsTeacher.some((s) => s.id === this.prioritySubject.id)) {
+            matching.push(p);
+          } else {
+            nonMatching.push(p);
+          }
+        });
+
+        return matching.concat(nonMatching);
+      } else {
+        return this.persons;
+      }
     },
   },
   apollo: {

aleksis/apps/cursus/frontend/components/helper.graphql

@@ -18,5 +18,12 @@ query gqlTeachers {
     id
     fullName
     shortName
+    subjectsAsTeacher {
+      id
+      name
+      shortName
+      colourFg
+      colourBg
+    }
   }
 }

aleksis/apps/cursus/frontend/messages/en.json

@@ -43,12 +43,6 @@
       },
       "timetable": "Timetable"
     },
-    "teacher": {
-      "field": {
-        "subject_teachers": "Teachers for subject",
-        "all_teachers": "All teachers"
-      }
-    },
     "errors": {
       "short_name_required": "Short name is required",
       "name_required": "Name is required",

aleksis/apps/cursus/schema.py

@@ -159,6 +159,22 @@ class CourseType(PermissionsTypeMixin, DjangoFilterMixin, DjangoObjectType):
         # return get_objects_for_user(info.context.user, "cursus.view_course", Course)
 
 
+class TeacherType(GraphQLPersonType):
+    class Meta:
+        model = Person
+
+    subjects_as_teacher = graphene.List(SubjectType)
+    courses_as_teacher = graphene.List(CourseType)
+
+    @staticmethod
+    def resolve_subjects_as_teacher(root, info, **kwargs):
+        return root.subjects_as_teacher.all()
+
+    @staticmethod
+    def resolve_courses_as_teacher(root, info, **kwargs):
+        return root.courses_as_teacher.all()
+
+
 class CourseBatchCreateMutation(DjangoBatchCreateMutation):
     class Meta:
         model = Course
@@ -215,7 +231,7 @@ class Query(graphene.ObjectType):
     school_grades = FilterOrderList(GraphQLGroupType)
     school_grades_by_term = FilterOrderList(GraphQLGroupType, school_term=graphene.ID())
 
-    teachers = FilterOrderList(GraphQLPersonType)
+    teachers = FilterOrderList(TeacherType)
 
     course_by_id = graphene.Field(CourseType, id=graphene.ID())
     courses_of_teacher = FilterOrderList(CourseType, teacher=graphene.ID())