Handle loading in absence-creation-dialog

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

@@ -41,6 +41,7 @@
       :persons="persons"
       :start-date="startDate"
       :end-date="endDate"
+      @loading="handleLoading"
     />
     </template>
     <template #actions>
@@ -74,6 +75,7 @@ import AbsenceCreationSummary from "./AbsenceCreationSummary.vue";
 import CreateButton from "aleksis.core/components/generic/buttons/CreateButton.vue";
 import CancelButton from "aleksis.core/components/generic/buttons/CancelButton.vue";
 import SaveButton from "aleksis.core/components/generic/buttons/SaveButton.vue";
+import loadingMixin from "aleksis.core/mixins/loadingMixin.js";
 import { createAbsences } from "./absenceCreation.graphql";
 
 export default {
@@ -86,11 +88,11 @@ export default {
     CancelButton,
     SaveButton,
   },
+  mixins: [loadingMixin],
   data() {
     return {
       popup: false,
       form: true,
-      loading: false,
       // TODO: All needed? Check if sensible defaults.
       persons: [],
       startDate: "",
@@ -105,6 +107,7 @@ export default {
       this.form = true;
     },
     confirm() {
+      this.handleLoading(true);
       this.$apollo.mutate( {
         mutation: createAbsences,
         variables: {
@@ -127,8 +130,10 @@ export default {
         .catch((error) => {
           popup = false;
           this.handleError(error);
+        })
+        .finally(() => {
+          this.handleLoading(false);
         });
-      // finally for loading
     },
   },
 };

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

@@ -11,7 +11,8 @@
     :elevated="false"
     disable-pagination
     hide-default-footer
-    >
+    @loading="handleLoading"
+  >
     <template #default="{ items }">
       <v-expansion-panels>
         <v-expansion-panel
@@ -67,6 +68,7 @@ import CRUDIterator from "aleksis.core/components/generic/CRUDIterator.vue";
 import SubjectChip from "aleksis.apps.cursus/components/SubjectChip.vue";
 import { lessonsForPersons } from "./absenceCreation.graphql";
 import { DateTime } from "luxon";
+import loadingMixin from "aleksis.core/mixins/loadingMixin.js";
 
 export default {
   name: "AbsenceCreationSummary",
@@ -74,6 +76,7 @@ export default {
     CRUDIterator,
     SubjectChip,
   },
+  mixins: [loadingMixin],
   props: {
     persons: {
       type: Array,