Use AbsenceReasonGroupSelect to display absence reasons

aleksis/apps/alsijil/frontend/components/coursebook/absences/ManageStudentsDialog.vue

 <script>
+import AbsenceReasonGroupSelect from "aleksis.apps.kolego/components/AbsenceReasonGroupSelect.vue";
 import CancelButton from "aleksis.core/components/generic/buttons/CancelButton.vue";
 import MobileFullscreenDialog from "aleksis.core/components/generic/dialogs/MobileFullscreenDialog.vue";
 import documentationPartMixin from "../documentation/documentationPartMixin";
@@ -9,6 +10,7 @@ export default {
   name: "ManageStudentsDialog",
   extends: MobileFullscreenDialog,
   components: {
+    AbsenceReasonGroupSelect,
     CancelButton,
     LessonInformation,
     MobileFullscreenDialog,
@@ -28,6 +30,11 @@ export default {
       return this.documentation.participations;
     },
   },
+  methods: {
+    sendToServer(participation, field, value) {
+      console.log(participation, field, value);
+    }
+  },
 };
 </script>
 
@@ -96,9 +103,12 @@ export default {
             {{ item.person.fullName }}
           </v-card-title>
           <v-card-text>
-            <v-chip>TODO</v-chip>
-            <v-chip>TODO</v-chip>
-            <v-chip>TODO</v-chip>
+            <absence-reason-group-select
+              allow-empty
+              empty-value="present"
+              :value="item.absenceReason?.id || 'present'"
+              @input="sendToServer(item, 'absenceReason', $event)"
+            />
           </v-card-text>
         </template>
       </slide-iterator>