This commit is contained in:
Louis Mazin 2026-09-20 05:04:49 +02:00
parent 7211393f93
commit 549d6941a9

View File

@ -13,6 +13,7 @@ import {
import { Label } from '@/components/ui/label';
import { Button } from '@/components/ui/button';
import { Input } from '@/components/ui/input';
import {
Alert,
AlertDescription,
@ -60,9 +61,11 @@ const getTodayValue = () => {
const date = new Date();
const year = date.getFullYear();
const month = String(
date.getMonth() + 1,
).padStart(2, '0');
const day = String(
date.getDate(),
).padStart(2, '0');
@ -462,23 +465,14 @@ const TimePicker = ({
const touch = event.touches[0];
const currentY = touch.clientY;
// Distance parcourue depuis le dernier mouvement
const deltaY =
touchState.current.lastY - currentY;
touchState.current.lastY = currentY;
// On accumule le déplacement
touchState.current.accumulated +=
deltaY;
/*
* Distance nécessaire pour changer
* d'une unité.
*
* Plus petit = plus sensible
* Plus grand = plus lent
*/
const pixelsPerUnit = 18;
const steps = Math.trunc(
@ -490,7 +484,6 @@ const TimePicker = ({
return;
}
// On retire uniquement les unités déjà consommées
touchState.current.accumulated -=
steps * pixelsPerUnit;
@ -556,7 +549,6 @@ const TimePicker = ({
</div>
<div className="relative flex h-[144px] gap-2 overflow-hidden">
{/* Sélection centrale */}
<div className="pointer-events-none absolute inset-x-0 top-1/2 z-10 h-9 -translate-y-1/2 rounded-md border bg-muted/50" />
{/* HEURES */}
@ -680,6 +672,7 @@ const TimePicker = ({
);
};
/* =========================================================
PAGE
========================================================= */
@ -2461,16 +2454,20 @@ const TimeClockPage = () => {
getScanConflictConfig();
return (
<Card className="flex h-full min-h-0 w-full flex-col overflow-visible">
<Card className="page-container page-layout flex h-full min-h-0 w-full flex-col overflow-hidden">
<CardHeader className="border-b">
<CardHeader className="shrink-0 border-b">
<CardTitle>
Pointage
</CardTitle>
</CardHeader>
<CardContent className="flex min-h-0 flex-1 flex-col overflow-visible lg:overflow-hidden">
{/* IMPORTANT :
flex + flex-col + min-h-0 permettent à la grille
de récupérer la hauteur restante sur desktop.
Mobile garde le scroll global. */}
<CardContent className="flex min-h-0 flex-1 flex-col overflow-y-auto lg:overflow-hidden">
{/* =========================
ALERTES
@ -2479,7 +2476,7 @@ const TimeClockPage = () => {
{error && (
<Alert
variant="destructive"
className="mb-4"
className="mb-4 shrink-0"
>
<AlertDescription>
{error}
@ -2489,7 +2486,7 @@ const TimeClockPage = () => {
{cameraPermissionError && (
<div className="mb-4 flex flex-col gap-2 sm:flex-row sm:items-center">
<div className="mb-4 flex shrink-0 flex-col gap-2 sm:flex-row sm:items-center">
<Button
type="button"
variant="secondary"
@ -2515,7 +2512,7 @@ const TimeClockPage = () => {
{scanMessage && (
<Alert
variant="success"
className="mb-4"
className="mb-4 shrink-0"
>
<AlertDescription>
{scanMessage}
@ -2661,7 +2658,7 @@ const TimeClockPage = () => {
startScanner
}
variant="default"
className="mb-6 w-full lg:hidden"
className="mb-6 w-full shrink-0 lg:hidden"
>
Pointer
</Button>
@ -2711,13 +2708,13 @@ const TimeClockPage = () => {
GESTION + HISTORIQUE
====================================================== */}
<div className="grid w-full min-h-0 grid-cols-1 gap-6 overflow-visible lg:flex-1 lg:grid-cols-2 lg:overflow-hidden">
<div className="grid w-full min-h-0 grid-cols-1 gap-6 lg:flex-1 lg:grid-cols-2">
{/* =================================================
COLONNE GAUCHE
================================================== */}
<div className="flex min-w-0 flex-col lg:h-full">
<div className="flex min-w-0 flex-col lg:h-full lg:min-h-0">
{isAdmin && (
<Card className="lg:h-full">
@ -3176,9 +3173,9 @@ const TimeClockPage = () => {
HISTORIQUE
================================================== */}
<div className="flex min-w-0 min-h-0 flex-col lg:h-full">
<div className="flex min-w-0 flex-col lg:h-full lg:min-h-0">
<Card className="flex h-auto max-h-[60vh] min-h-0 flex-col overflow-hidden lg:h-full lg:max-h-none">
<Card className="flex h-auto min-h-0 flex-col overflow-hidden lg:h-full lg:flex-1">
<CardHeader className="shrink-0 border-b">
<CardTitle>
@ -3191,7 +3188,11 @@ const TimeClockPage = () => {
</CardHeader>
<CardContent className="min-h-0 flex-1 overflow-y-auto">
{/* DESKTOP : SEUL CETTE ZONE SCROLLE
MOBILE : LE SCROLL EST GÉRÉ PAR LE CARD
PRINCIPAL */}
<CardContent className="min-h-0 flex-1 overflow-visible lg:overflow-y-auto">
{loading ? (
<p>
@ -3373,7 +3374,7 @@ const TimeClockPage = () => {
)} au ${formatDate(
entry.end_date,
)} ?`
: 'Êtes-vous sûr de vouloir supprimer ce pointage ?'
: 'Êtes-vous sûr de vouloir supprimer le pointage ?'
}
onConfirm={() =>
handleDeleteEntry(
@ -3422,5 +3423,4 @@ const TimeClockPage = () => {
);
};
export default TimeClockPage;