Allow setting extra marks via multiple selection

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

@@ -12,11 +12,13 @@ import PersonalNotes from "../personal_notes/PersonalNotes.vue";
 import ExtraMarkChip from "../../extra_marks/ExtraMarkChip.vue";
 import TardinessChip from "./TardinessChip.vue";
 import TardinessField from "./TardinessField.vue";
+import ExtraMarkButtons from "../../extra_marks/ExtraMarkButtons.vue";
 
 export default {
   name: "ManageStudentsDialog",
   extends: MobileFullscreenDialog,
   components: {
+    ExtraMarkButtons,
     TardinessChip,
     ExtraMarkChip,
     AbsenceReasonChip,
@@ -57,9 +59,9 @@ export default {
     },
   },
   methods: {
-    handleMultipleAction(absenceReasonId) {
+    handleMultipleAction(field, id) {
       this.loadSelected = true;
-      this.sendToServer(this.selected, "absenceReason", absenceReasonId);
+      this.sendToServer(this.selected, field, id);
       this.$once("save", this.resetMultipleAction);
     },
     resetMultipleAction() {
@@ -209,12 +211,16 @@ export default {
     <template #actions>
       <v-scroll-y-reverse-transition>
         <div v-show="selected.length > 0" class="full-width">
+          <h4>{{ $t("alsijil.coursebook.participation_status") }}</h4>
           <absence-reason-buttons
+            class="mb-1"
             allow-empty
             empty-value="present"
             :custom-absence-reasons="absenceReasons"
-            @input="handleMultipleAction"
+            @input="handleMultipleAction('absenceReason', $event)"
           />
+          <h4>{{ $t("alsijil.extra_marks.title_plural") }}</h4>
+          <extra-mark-buttons @input="handleMultipleAction('extraMark', $event)" />
         </div>
       </v-scroll-y-reverse-transition>
     </template>

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

@@ -55,6 +55,7 @@
         "cancelled": "Lesson cancelled",
         "pending": "Lesson pending"
       },
+      "participation_status": "Participation Status",
       "summary": {
         "topic": {
           "label": "Topic",