107 lines
3.3 KiB
Vue
107 lines
3.3 KiB
Vue
<template>
|
|
<div class="h-full overflow-hidden flex flex-col">
|
|
<div class="flex flex-wrap items-center justify-between gap-4">
|
|
<h1 class="text-4xl font-bold text-primary-500">Heures</h1>
|
|
</div>
|
|
|
|
<HoursToolbar
|
|
v-model:selected-date="selectedDate"
|
|
v-model:view-mode="viewMode"
|
|
v-model:selected-site-ids="selectedSiteIds"
|
|
v-model:employee-filter="employeeFilter"
|
|
:is-admin="isAdmin"
|
|
:sites="sites"
|
|
:formatted-selected-date="formattedSelectedDate"
|
|
:shortcut-button-class="shortcutButtonClass"
|
|
@set-yesterday="setYesterday"
|
|
@set-today="setToday"
|
|
@set-tomorrow="setTomorrow"
|
|
@shift-date="shiftDate"
|
|
/>
|
|
|
|
<div v-if="isLoading" class="rounded-lg border border-neutral-200 bg-white p-6 text-md text-neutral-600">
|
|
Chargement...
|
|
</div>
|
|
|
|
<div v-else-if="employees.length === 0" class="rounded-lg border border-neutral-200 bg-white p-6 text-md text-neutral-600">
|
|
Aucun employé accessible.
|
|
</div>
|
|
|
|
<div v-else class="flex flex-1 min-h-0 flex-col gap-4">
|
|
<HoursDayView
|
|
v-if="viewMode === 'day'"
|
|
v-model:rows="rows"
|
|
:employees="visibleEmployees"
|
|
:is-admin="isAdmin"
|
|
:day-grid-cols="dayGridCols"
|
|
:contract-label="contractLabel"
|
|
:is-time-tracking="isTimeTracking"
|
|
:is-presence-tracking="isPresenceTracking"
|
|
:is-row-locked="isRowLocked"
|
|
:is-validation-pending="isValidationPending"
|
|
:on-toggle-validation="toggleValidation"
|
|
:get-row-metrics="getRowMetrics"
|
|
:format-minutes="formatMinutes"
|
|
/>
|
|
|
|
<HoursWeekView
|
|
v-else-if="isAdmin && viewMode === 'week'"
|
|
:is-week-loading="isWeekLoading"
|
|
:week-grid-cols="weekGridCols"
|
|
:weekly-summary="filteredWeeklySummary"
|
|
:week-day-headers="weekDayHeaders"
|
|
:format-minutes="formatMinutes"
|
|
/>
|
|
|
|
<div v-if="viewMode === 'day'" class="shrink-0 px-4 pt-4 flex justify-center">
|
|
<button
|
|
type="button"
|
|
class="rounded-lg bg-primary-500 px-6 py-2 text-md font-semibold text-white hover:bg-secondary-500"
|
|
:class="saveButtonClass"
|
|
:disabled="isSubmitting || visibleEmployees.length === 0"
|
|
@click="handleSave"
|
|
>
|
|
Enregistrer
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
const {
|
|
isAdmin,
|
|
viewMode,
|
|
selectedDate,
|
|
employeeFilter,
|
|
sites,
|
|
selectedSiteIds,
|
|
employees,
|
|
visibleEmployees,
|
|
rows,
|
|
filteredWeeklySummary,
|
|
isLoading,
|
|
isWeekLoading,
|
|
isSubmitting,
|
|
dayGridCols,
|
|
weekGridCols,
|
|
saveButtonClass,
|
|
formattedSelectedDate,
|
|
weekDayHeaders,
|
|
shortcutButtonClass,
|
|
setToday,
|
|
setYesterday,
|
|
setTomorrow,
|
|
shiftDate,
|
|
contractLabel,
|
|
isTimeTracking,
|
|
isPresenceTracking,
|
|
isRowLocked,
|
|
isValidationPending,
|
|
toggleValidation,
|
|
getRowMetrics,
|
|
formatMinutes,
|
|
handleSave
|
|
} = useHoursPage()
|
|
</script>
|