diff --git a/aleksis/apps/alsijil/frontend/components/coursebook/absences/AbsenceCreationDialog.vue b/aleksis/apps/alsijil/frontend/components/coursebook/absences/AbsenceCreationDialog.vue index d203ad680dcae02fda4fc736e2099845c8f5ce3b..4dfa4327275d7b90c029c78942b7179205e2bae0 100644 --- a/aleksis/apps/alsijil/frontend/components/coursebook/absences/AbsenceCreationDialog.vue +++ b/aleksis/apps/alsijil/frontend/components/coursebook/absences/AbsenceCreationDialog.vue @@ -93,6 +93,7 @@ import SecondaryActionButton from "aleksis.core/components/generic/buttons/Secon import loadingMixin from "aleksis.core/mixins/loadingMixin.js"; import permissionsMixin from "aleksis.core/mixins/permissions.js"; import mutateMixin from "aleksis.core/mixins/mutateMixin.js"; +import { DateTime } from "luxon"; import { createAbsencesForPersons } from "./absenceCreation.graphql"; @@ -122,6 +123,7 @@ export default { }, mounted() { this.addPermissions(["alsijil.view_register_absence_rule"]); + this.clearForm(); }, methods: { cancel() { @@ -131,8 +133,8 @@ export default { }, clearForm() { this.persons = []; - this.startDate = ""; - this.endDate = ""; + this.startDate = DateTime.now().startOf("day").toISO({ suppressSeconds: true }); + this.endDate = DateTime.now().endOf("day").toISO({ suppressSeconds: true }); this.comment = ""; this.absenceReason = ""; }, @@ -142,8 +144,8 @@ export default { createAbsencesForPersons, { persons: this.persons.map((p) => p.id), - start: this.startDate, - end: this.endDate, + start: this.$toUTCISO(this.$parseISODate(this.startDate)), + end: this.$toUTCISO(this.$parseISODate(this.endDate)), comment: this.comment, reason: this.absenceReason, }, diff --git a/aleksis/apps/alsijil/frontend/components/coursebook/absences/AbsenceCreationForm.vue b/aleksis/apps/alsijil/frontend/components/coursebook/absences/AbsenceCreationForm.vue index 559824bdf4cb8bb214d1be3acebba38c08c836cd..b856abcec12e81d27a3f431079130ef04addc31a 100644 --- a/aleksis/apps/alsijil/frontend/components/coursebook/absences/AbsenceCreationForm.vue +++ b/aleksis/apps/alsijil/frontend/components/coursebook/absences/AbsenceCreationForm.vue @@ -26,9 +26,10 @@ <v-row> <v-col cols="12" :sm="6" class="pl-0"> <div aria-required="true"> - <date-field + <date-time-field :label="$t('forms.labels.start')" - :max="endDate" + :max-date="endDate" + :max-time="maxStartTime" :rules="$rules().required.build()" :value="startDate" @input="$emit('start-date', $event)" @@ -37,9 +38,10 @@ </v-col> <v-col cols="12" :sm="6" class="pr-0"> <div aria-required="true"> - <date-field + <date-time-field :label="$t('forms.labels.end')" - :min="startDate" + :min-date="startDate" + :min-time="minEndTime" :rules="$rules().required.build()" :value="endDate" @input="$emit('end-date', $event)" @@ -69,15 +71,16 @@ <script> import AbsenceReasonGroupSelect from "aleksis.apps.kolego/components/AbsenceReasonGroupSelect.vue"; -import DateField from "aleksis.core/components/generic/forms/DateField.vue"; +import DateTimeField from "aleksis.core/components/generic/forms/DateTimeField.vue"; import { persons } from "./absenceCreation.graphql"; import formRulesMixin from "aleksis.core/mixins/formRulesMixin.js"; +import { DateTime } from "luxon"; export default { name: "AbsenceCreationForm", components: { AbsenceReasonGroupSelect, - DateField, + DateTimeField, }, mixins: [formRulesMixin], emits: [ @@ -113,5 +116,25 @@ export default { required: true, }, }, + computed: { + maxStartTime() { + // Only if on the same day + const start = DateTime.fromISO(this.startDate); + const end = DateTime.fromISO(this.endDate); + + if (start.day !== end.day) return; + + return end.minus({ minutes: 5, }).toFormat("HH:mm"); + }, + minEndTime() { + // Only if on the same day + const start = DateTime.fromISO(this.startDate); + const end = DateTime.fromISO(this.endDate); + + if (start.day !== end.day) return; + + return start.plus({ minutes: 5, }).toFormat("HH:mm"); + }, + }, }; </script>