62 lines
1.8 KiB
Vue
62 lines
1.8 KiB
Vue
<template>
|
|
<form class="d-grid gap-2" @submit.prevent="$emit('submit')">
|
|
<div>
|
|
<label class="form-label">Employé</label>
|
|
<select :value="form.employee" class="form-select" @change="updateField('employee', $event.target.value)">
|
|
<option value="" disabled>Choisir un employé</option>
|
|
<option v-for="collab in collaborators" :key="collab.id" :value="collab.name">
|
|
{{ collab.name }}
|
|
</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="row g-2">
|
|
<div class="col-6">
|
|
<label class="form-label">Du</label>
|
|
<soft-input :model-value="form.startDate" type="date" @update:model-value="updateField('startDate', $event)" />
|
|
</div>
|
|
<div class="col-6">
|
|
<label class="form-label">Au</label>
|
|
<soft-input :model-value="form.endDate" type="date" @update:model-value="updateField('endDate', $event)" />
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<label class="form-label">Motif</label>
|
|
<soft-input
|
|
:model-value="form.reason"
|
|
placeholder="Congé annuel"
|
|
@update:model-value="updateField('reason', $event)"
|
|
/>
|
|
</div>
|
|
|
|
<div class="d-flex gap-2 justify-content-end pt-2">
|
|
<soft-button color="secondary" variant="outline" @click="$emit('back')">Retour</soft-button>
|
|
<soft-button color="warning" variant="gradient" type="submit">Enregistrer</soft-button>
|
|
</div>
|
|
</form>
|
|
</template>
|
|
|
|
<script setup>
|
|
import SoftButton from "@/components/SoftButton.vue";
|
|
import SoftInput from "@/components/SoftInput.vue";
|
|
import { defineEmits, defineProps } from "vue";
|
|
defineProps({
|
|
form: {
|
|
type: Object,
|
|
required: true,
|
|
},
|
|
collaborators: {
|
|
type: Array,
|
|
default: () => [],
|
|
},
|
|
});
|
|
|
|
const emit = defineEmits(["update:form", "submit", "back"]);
|
|
|
|
const updateField = (field, value) => {
|
|
emit("update:form", { field, value });
|
|
};
|
|
</script>
|
|
|