Compare commits
3 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
fe6a0e8fc9 | ||
| c10c774ac8 | |||
| 4b847eb1a2 |
@@ -1,2 +1,2 @@
|
||||
parameters:
|
||||
app.version: '0.1.4'
|
||||
app.version: '0.1.5'
|
||||
|
||||
@@ -1,16 +1,16 @@
|
||||
<template>
|
||||
<div class="max-h-[80vh] overflow-auto rounded-lg border border-neutral-200 bg-white">
|
||||
<div class="h-full min-h-0 overflow-auto rounded-lg border border-neutral-200 bg-white">
|
||||
<div class="min-w-[900px]">
|
||||
<div class="grid" :style="gridStyle">
|
||||
<div
|
||||
class="sticky left-0 z-20 border-b border-neutral-200 bg-tertiary-500 px-4 py-3 text-md font-semibold text-neutral-700"
|
||||
class="sticky left-0 top-0 z-30 border-b border-neutral-200 bg-tertiary-500 px-4 py-3 text-md font-semibold text-neutral-700"
|
||||
>
|
||||
Employés
|
||||
</div>
|
||||
<div
|
||||
v-for="day in daysInMonth"
|
||||
:key="day.date"
|
||||
class="border-b border-neutral-200 bg-tertiary-500 px-2 py-3 text-center text-xs font-semibold text-neutral-700"
|
||||
class="sticky top-0 z-20 border-b border-neutral-200 bg-tertiary-500 px-2 py-3 text-center text-xs font-semibold text-neutral-700"
|
||||
>
|
||||
<div>{{ day.label }}</div>
|
||||
<div class="text-[10px] text-neutral-500">{{ day.weekday }}</div>
|
||||
|
||||
@@ -1,9 +1,10 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="h-full flex flex-col overflow-hidden">
|
||||
<div class="flex flex-wrap items-center justify-between gap-4">
|
||||
<h1 class="text-4xl font-bold text-primary-500">Calendrier des absences</h1>
|
||||
</div>
|
||||
<div class="flex items-center justify-between py-6">
|
||||
<div class="py-6">
|
||||
<div class="flex items-center justify-between gap-4">
|
||||
<div class="flex items-center gap-4">
|
||||
<div class="flex flex-wrap items-center gap-4 rounded-md border border-neutral-300 px-3 py-2">
|
||||
<div v-for="site in sites" :key="site.id" class="flex items-center gap-2">
|
||||
@@ -52,7 +53,17 @@
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-3 flex items-center gap-4">
|
||||
<input
|
||||
v-model="employeeFilter"
|
||||
type="text"
|
||||
placeholder="Chercher un employé (nom ou prénom)"
|
||||
class="h-10 w-full max-w-md rounded-md border border-neutral-300 bg-white px-3 text-md text-neutral-900"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex-1 min-h-0">
|
||||
<CalendarGrid
|
||||
:days-in-month="daysInMonth"
|
||||
:visible-employees="visibleEmployees"
|
||||
@@ -63,6 +74,7 @@
|
||||
:is-holiday-date="isHolidayDate"
|
||||
@cell-click="openCreate"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<AbsenceFormDrawer
|
||||
v-model="isDrawerOpen"
|
||||
@@ -139,10 +151,18 @@ const sortedEmployees = computed(() => {
|
||||
})
|
||||
|
||||
// Employés visibles selon le filtre de sites.
|
||||
const employeeFilter = ref('')
|
||||
|
||||
const visibleEmployees = computed(() => {
|
||||
if (selectedSiteIds.value.length === 0) return []
|
||||
const filter = employeeFilter.value.trim().toLowerCase()
|
||||
return sortedEmployees.value.filter((employee) => {
|
||||
return employee.site?.id && selectedSiteIds.value.includes(employee.site.id)
|
||||
const siteOk = employee.site?.id && selectedSiteIds.value.includes(employee.site.id)
|
||||
if (!siteOk) return false
|
||||
if (!filter) return true
|
||||
const first = employee.firstName?.toLowerCase() ?? ''
|
||||
const last = employee.lastName?.toLowerCase() ?? ''
|
||||
return first.includes(filter) || last.includes(filter)
|
||||
})
|
||||
})
|
||||
// Données de référence et absences du mois affiché.
|
||||
|
||||
Reference in New Issue
Block a user