From 00e18e79ec90422b974dd3a5a32de69b8091b9ea Mon Sep 17 00:00:00 2001
From: deyvisonwanderley <deyvison.wanderley@gmail.com>
Date: Sun, 23 Nov 2025 14:58:04 -0300
Subject: [PATCH] feat: add date range filters for employee time records in
 homologacao page

- Introduced date range filters for selecting start and end dates, defaulting to the last 30 days for improved user experience.
- Enhanced the UI layout to include form controls for selecting employees and date ranges, ensuring better accessibility and usability.
- Updated data handling logic to utilize the new date filters for querying employee time records.
---
 .../controle-ponto/homologacao/+page.svelte   | 65 +++++++++++++++----
 1 file changed, 51 insertions(+), 14 deletions(-)

diff --git a/apps/web/src/routes/(dashboard)/recursos-humanos/controle-ponto/homologacao/+page.svelte b/apps/web/src/routes/(dashboard)/recursos-humanos/controle-ponto/homologacao/+page.svelte
index dafe028..f4edcd4 100644
--- a/apps/web/src/routes/(dashboard)/recursos-humanos/controle-ponto/homologacao/+page.svelte
+++ b/apps/web/src/routes/(dashboard)/recursos-humanos/controle-ponto/homologacao/+page.svelte
@@ -18,6 +18,12 @@
 	let homologacaoParaExcluir = $state<Id<'homologacoesPonto'> | null>(null);
 	let mostrandoModalDetalhes = $state(false);
 	let mostrandoModalExcluir = $state(false);
+	
+	// Filtros de período
+	const hoje = new Date();
+	const trintaDiasAtras = new Date(Date.now() - 30 * 24 * 60 * 60 * 1000);
+	let dataInicioFiltro = $state(trintaDiasAtras.toISOString().split('T')[0]!);
+	let dataFimFiltro = $state(hoje.toISOString().split('T')[0]!);
 
 	// Monitorar mudanças em funcionarioSelecionado
 	$effect(() => {
@@ -116,8 +122,8 @@
 		}
 		return {
 			funcionarioId: funcionarioSelecionado as Id<'funcionarios'>,
-			dataInicio: new Date(Date.now() - 30 * 24 * 60 * 60 * 1000).toISOString().split('T')[0]!,
-			dataFim: new Date().toISOString().split('T')[0]!,
+			dataInicio: dataInicioFiltro,
+			dataFim: dataFimFiltro,
 		};
 	});
 
@@ -364,18 +370,49 @@
 	<div class="card bg-base-100 shadow-xl mb-6">
 		<div class="card-body">
 			<h2 class="card-title mb-4">Selecionar Funcionário</h2>
-		<select
-			class="select select-bordered w-full"
-			bind:value={funcionarioSelecionado}
-			disabled={modoEdicao}
-		>
-				<option value="">Selecione um funcionário</option>
-				{#each funcionarios as funcionario}
-					<option value={funcionario._id as string}>
-						{funcionario.nome} {funcionario.matricula ? `(${funcionario.matricula})` : ''}
-					</option>
-				{/each}
-			</select>
+			<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
+				<div class="form-control">
+					<label class="label">
+						<span class="label-text font-medium">Funcionário</span>
+					</label>
+					<select
+						class="select select-bordered w-full"
+						bind:value={funcionarioSelecionado}
+						disabled={modoEdicao}
+					>
+						<option value="">Selecione um funcionário</option>
+						{#each funcionarios as funcionario}
+							<option value={funcionario._id as string}>
+								{funcionario.nome} {funcionario.matricula ? `(${funcionario.matricula})` : ''}
+							</option>
+						{/each}
+					</select>
+				</div>
+				<div class="form-control">
+					<label class="label">
+						<span class="label-text font-medium">Data Início</span>
+					</label>
+					<input
+						type="date"
+						class="input input-bordered w-full"
+						bind:value={dataInicioFiltro}
+						disabled={modoEdicao}
+						max={dataFimFiltro}
+					/>
+				</div>
+				<div class="form-control">
+					<label class="label">
+						<span class="label-text font-medium">Data Fim</span>
+					</label>
+					<input
+						type="date"
+						class="input input-bordered w-full"
+						bind:value={dataFimFiltro}
+						disabled={modoEdicao}
+						min={dataInicioFiltro}
+					/>
+				</div>
+			</div>
 		</div>
 	</div>