Newer
Older
<mobile-fullscreen-dialog v-model="popup" persistent :close-button="false">
<template #activator="activator">
color="secondary"
@click="popup = true"
:disabled="popup"
:class="{
'd-none': !checkPermission('alsijil.view_register_absence_rule'),
}"
i18n-key="alsijil.coursebook.absences.button"
</template>
<template #title>
<div>
{{ $t("alsijil.coursebook.absences.title") }}
</div>
<span v-if="!form" class="px-2">·</span>
<div v-if="!form">
{{ $t("alsijil.coursebook.absences.summary") }}
</div>
</template>
<template #content>
<absence-creation-form
:persons="persons"
:start-date="startDate"
:end-date="endDate"
:comment="comment"
:absence-reason="absenceReason"
@valid="formValid = $event"
@persons="persons = $event"
@start-date="startDate = $event"
@end-date="endDate = $event"
@comment="comment = $event"
@absence-reason="absenceReason = $event"
:class="{
'd-none': !form,
}"
:persons="persons"
:start-date="startDate"
:end-date="endDate"
@loading="handleLoading"
/>
<template #actionsLeft>
<cancel-button @click="cancel" />
</template>
<template #actions>
<!-- secondary -->
<secondary-action-button
@click="form = true"
v-if="!form"
:disabled="loading"
i18n-key="actions.back"
>
<v-icon left>$prev</v-icon>
{{ $t("actions.back") }}
</secondary-action-button>
<!-- primary -->
<save-button
v-if="form"
@click="form = false"
:loading="loading"
>
{{ $t("actions.continue") }}
<v-icon right>$next</v-icon>
</save-button>
i18n-key="actions.confirm"
@click="confirm"
:loading="loading"
/>
</template>
</mobile-fullscreen-dialog>
</template>
<script>
import MobileFullscreenDialog from "aleksis.core/components/generic/dialogs/MobileFullscreenDialog.vue";
import AbsenceCreationForm from "./AbsenceCreationForm.vue";
import AbsenceCreationSummary from "./AbsenceCreationSummary.vue";
import FabButton from "aleksis.core/components/generic/buttons/FabButton.vue";
import CancelButton from "aleksis.core/components/generic/buttons/CancelButton.vue";
import SaveButton from "aleksis.core/components/generic/buttons/SaveButton.vue";
import SecondaryActionButton from "aleksis.core/components/generic/buttons/SecondaryActionButton.vue";
import loadingMixin from "aleksis.core/mixins/loadingMixin.js";

Jonathan Weth
committed
import permissionsMixin from "aleksis.core/mixins/permissions.js";
import mutateMixin from "aleksis.core/mixins/mutateMixin.js";
import { DateTime } from "luxon";

Jonathan Weth
committed
import { createAbsencesForPersons } from "./absenceCreation.graphql";
export default {
name: "AbsenceCreationDialog",
components: {
MobileFullscreenDialog,
AbsenceCreationForm,
AbsenceCreationSummary,
CancelButton,
SaveButton,
SecondaryActionButton,

Jonathan Weth
committed
mixins: [loadingMixin, mutateMixin, permissionsMixin],
data() {
return {
popup: false,
form: true,
persons: [],
startDate: "",
endDate: "",
comment: "",
mounted() {
this.addPermissions(["alsijil.view_register_absence_rule"]);
this.clearForm();
cancel() {
this.popup = false;
this.form = true;
this.clearForm();
clearForm() {
this.persons = [];
this.startDate = DateTime.now()
.startOf("day")
.toISO({ suppressSeconds: true });
this.endDate = DateTime.now()
.endOf("day")
.toISO({ suppressSeconds: true });
this.comment = "";
this.absenceReason = "";
},

Jonathan Weth
committed
this.mutate(
createAbsencesForPersons,
{
persons: this.persons.map((p) => p.id),
start: this.$toUTCISO(this.$parseISODate(this.startDate)),
end: this.$toUTCISO(this.$parseISODate(this.endDate)),

Jonathan Weth
committed
comment: this.comment,
reason: this.absenceReason,
},
(storedDocumentations, incomingStatuses) => {
const documentation = storedDocumentations.find(
(doc) => doc.id === this.documentation.id,
);
incomingStatuses.forEach((newStatus) => {
const participationStatus = documentation.participations.find(
(part) => part.id === newStatus.id,
);
participationStatus.absenceReason = newStatus.absenceReason;
participationStatus.isOptimistic = newStatus.isOptimistic;
});
return storedDocumentations;
},
);
this.$once("save", this.handleSave);
},
handleSave() {
this.cancel();
this.$toastSuccess(this.$t("alsijil.coursebook.absences.success"));