2026-03-05 17:00:32 +03:00

111 lines
2.8 KiB
Vue

<template>
<div>
<div
class="modal fade"
:class="{ show: show, 'd-block': show }"
tabindex="-1"
role="dialog"
aria-labelledby="planningNewRequestModalLabel"
:aria-hidden="!show"
>
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 id="planningNewRequestModalLabel" class="modal-title">
Nouvelle demande
</h5>
<button
type="button"
class="btn-close"
aria-label="Close"
@click="$emit('close')"
></button>
</div>
<div class="modal-body">
<p v-if="!creationType" class="text-sm text-muted mb-3">
Choisissez le type à créer :
</p>
<p v-else class="text-sm text-muted mb-3">
{{ creationTypeTitle }}
</p>
<planning-creation-type-selector
v-if="!creationType"
@select-type="$emit('select-type', $event)"
/>
<planning-leave-request-form
v-else-if="creationType === 'leave'"
:form="leaveForm"
:collaborators="collaborators"
@update:form="$emit('update:leave-form', $event)"
@submit="$emit('submit-leave')"
@back="$emit('reset-type')"
/>
<planning-event-form
v-else-if="creationType === 'event'"
:form="eventForm"
@update:form="$emit('update:event-form', $event)"
@submit="$emit('submit-event')"
@back="$emit('reset-type')"
/>
</div>
</div>
</div>
</div>
<div
v-if="show"
class="modal-backdrop fade show"
@click="$emit('close')"
></div>
</div>
</template>
<script setup>
import PlanningCreationTypeSelector from "@/components/molecules/Planning/PlanningCreationTypeSelector.vue";
import PlanningLeaveRequestForm from "@/components/molecules/Planning/PlanningLeaveRequestForm.vue";
import PlanningEventForm from "@/components/molecules/Planning/PlanningEventForm.vue";
import { defineProps, defineEmits } from "vue";
defineProps({
show: {
type: Boolean,
default: false,
},
creationType: {
type: String,
default: "",
},
creationTypeTitle: {
type: String,
default: "Nouvelle demande",
},
collaborators: {
type: Array,
default: () => [],
},
leaveForm: {
type: Object,
required: true,
},
eventForm: {
type: Object,
required: true,
},
});
defineEmits([
"close",
"select-type",
"reset-type",
"submit-leave",
"submit-event",
"update:leave-form",
"update:event-form",
]);
</script>