feat : ajout des frais kms + alignment du style de l'application
Some checks failed
Auto Tag Develop / tag (push) Has been cancelled
Some checks failed
Auto Tag Develop / tag (push) Has been cancelled
This commit is contained in:
@@ -1,13 +1,13 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="flex items-center justify-between pb-12">
|
||||
<div class="h-full flex flex-col overflow-hidden">
|
||||
<div class="flex items-center justify-between pb-6">
|
||||
<h1 class="text-4xl font-bold text-primary-500">Types d'absence</h1>
|
||||
<button
|
||||
type="button"
|
||||
class="rounded-lg bg-primary-500 px-4 py-2 text-md font-semibold text-white hover:bg-secondary-500"
|
||||
@click="openCreate"
|
||||
>
|
||||
Ajouter un type
|
||||
+ Ajouter un type
|
||||
</button>
|
||||
</div>
|
||||
|
||||
@@ -18,33 +18,33 @@
|
||||
Aucun type pour le moment.
|
||||
</div>
|
||||
|
||||
<div v-else class="overflow-hidden rounded-lg border border-neutral-200 bg-white">
|
||||
<div class="grid grid-cols-[120px_160px_1fr_220px_200px] gap-4 border-b border-neutral-200 bg-tertiary-500 px-6 py-3 text-md font-semibold text-neutral-700">
|
||||
<span class="text-left">Code</span>
|
||||
<span class="text-left">Libellé</span>
|
||||
<span class="text-left">Couleur</span>
|
||||
<span class="text-left">Compte en heures</span>
|
||||
<span class="text-right">Actions</span>
|
||||
<div v-else class="min-h-0 overflow-auto rounded-md bg-white">
|
||||
<div class="grid grid-cols-4 gap-4 border border-black bg-tertiary-500 px-6 py-3 text-[20px] font-semibold text-black rounded-t-md sticky top-0 z-10">
|
||||
<span>Code</span>
|
||||
<span>Libellé</span>
|
||||
<span>Couleur</span>
|
||||
<span>Compte en heures</span>
|
||||
</div>
|
||||
<div v-if="isLoading" class="px-6 py-4 text-md text-neutral-500">
|
||||
Chargement...
|
||||
</div>
|
||||
<div v-else>
|
||||
<div v-else class="border-x border-b border-primary-500 rounded-b-md">
|
||||
<div
|
||||
v-for="type in absenceTypes"
|
||||
:key="type.id"
|
||||
class="grid grid-cols-[120px_160px_1fr_220px_200px] items-center gap-4 border-b border-neutral-100 px-6 py-3 text-md text-neutral-800 last:border-b-0"
|
||||
class="grid grid-cols-4 items-center gap-4 border-b border-primary-500 px-6 py-3 text-md font-bold text-primary-500 last:border-b-0 cursor-pointer hover:bg-tertiary-500"
|
||||
@click="openEdit(type)"
|
||||
>
|
||||
<span class="font-semibold text-left">{{ type.code }}</span>
|
||||
<span class="text-left">{{ type.label }}</span>
|
||||
<div class="flex items-center gap-2 justify-start">
|
||||
<span>{{ type.code }}</span>
|
||||
<span>{{ type.label }}</span>
|
||||
<div class="flex items-center gap-2">
|
||||
<span
|
||||
class="inline-block h-3 w-3 rounded-full"
|
||||
:style="{ backgroundColor: type.color }"
|
||||
/>
|
||||
<span class="text-md uppercase text-neutral-500">{{ type.color }}</span>
|
||||
</div>
|
||||
<div class="text-left">
|
||||
<div>
|
||||
<span
|
||||
class="inline-flex rounded-md px-2 py-1 text-sm font-semibold"
|
||||
:class="type.countAsWorkedHours ? 'bg-emerald-100 text-emerald-700' : 'bg-neutral-100 text-neutral-700'"
|
||||
@@ -52,22 +52,6 @@
|
||||
{{ type.countAsWorkedHours ? 'Oui' : 'Non' }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="flex items-center justify-end gap-2">
|
||||
<button
|
||||
type="button"
|
||||
class="rounded-md border border-neutral-200 px-2 py-1 text-md font-semibold text-neutral-700 hover:bg-neutral-100"
|
||||
@click="openEdit(type)"
|
||||
>
|
||||
Modifier
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="rounded-md border border-red-200 px-2 py-1 text-md font-semibold text-red-600 hover:bg-red-50"
|
||||
@click="confirmDelete(type)"
|
||||
>
|
||||
Supprimer
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -145,20 +129,29 @@
|
||||
La couleur est obligatoire.
|
||||
</p>
|
||||
</div>
|
||||
<div class="flex justify-end gap-3 pt-2">
|
||||
<div v-if="editingType" class="grid grid-cols-2 gap-3 pt-2">
|
||||
<button
|
||||
type="button"
|
||||
class="rounded-lg border border-neutral-200 px-4 py-2 text-md font-semibold text-neutral-700 hover:bg-neutral-100"
|
||||
@click="closeDrawer"
|
||||
class="flex items-center justify-center rounded-md bg-red-500 px-4 py-2 text-md font-semibold text-white hover:bg-red-600"
|
||||
@click="confirmDelete(editingType)"
|
||||
>
|
||||
Annuler
|
||||
Supprimer
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="rounded-lg bg-primary-500 px-4 py-2 text-md font-semibold text-white hover:bg-secondary-500"
|
||||
class="flex items-center justify-center rounded-md bg-primary-500 px-4 py-2 text-md font-semibold text-white hover:bg-secondary-500"
|
||||
:class="submitButtonClass"
|
||||
>
|
||||
Enregistrer
|
||||
Modifier
|
||||
</button>
|
||||
</div>
|
||||
<div v-else class="flex justify-center pt-2">
|
||||
<button
|
||||
type="submit"
|
||||
class="flex w-[200px] items-center justify-center gap-2 rounded-md bg-primary-500 px-4 py-2 text-md font-semibold text-white hover:bg-secondary-500"
|
||||
:class="submitButtonClass"
|
||||
>
|
||||
+ Ajouter
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
Reference in New Issue
Block a user