From 1000b5a030734e5ad1e29591a5cff8f19744e14b Mon Sep 17 00:00:00 2001
From: deyvisonwanderley <deyvison.wanderley@gmail.com>
Date: Fri, 5 Dec 2025 12:57:35 -0300
Subject: [PATCH] feat: add approval/rejection information and change history
 display in AprovarAusencias and AprovarFerias components for enhanced user
 feedback

---
 .../lib/components/AprovarAusencias.svelte    |  74 ++++++++
 .../src/lib/components/AprovarFerias.svelte   |  43 ++++-
 .../routes/(dashboard)/perfil/+page.svelte    | 169 +++++++++++++++++-
 .../controle-ponto/banco-horas/+page.svelte   |   2 +
 .../recursos-humanos/ferias/+page.svelte      |   4 -
 .../ti/painel-permissoes/+page.svelte         |  11 +-
 packages/backend/convex/ausencias.ts          |  79 +++++++-
 packages/backend/convex/ferias.ts             |  23 ++-
 packages/backend/convex/tables/ausencias.ts   |  11 +-
 9 files changed, 389 insertions(+), 27 deletions(-)

diff --git a/apps/web/src/lib/components/AprovarAusencias.svelte b/apps/web/src/lib/components/AprovarAusencias.svelte
index f58e22d..fd7279f 100644
--- a/apps/web/src/lib/components/AprovarAusencias.svelte
+++ b/apps/web/src/lib/components/AprovarAusencias.svelte
@@ -254,6 +254,80 @@
 				</div>
 			</div>
 
+			<!-- Informações de Aprovação/Reprovação -->
+			{#if solicitacao.status === 'aprovado'}
+				<div class="alert alert-success mb-6 shadow-lg">
+					<Check class="h-6 w-6 shrink-0 stroke-current" strokeWidth={2} />
+					<div class="flex-1">
+						<div class="font-bold">Aprovado</div>
+						{#if solicitacao.gestor}
+							<div class="text-sm mt-1">
+								Por: <strong>{solicitacao.gestor.nome}</strong>
+							</div>
+						{/if}
+						{#if solicitacao.dataAprovacao}
+							<div class="text-xs mt-1 opacity-80">
+								Em: {new Date(solicitacao.dataAprovacao).toLocaleString('pt-BR')}
+							</div>
+						{/if}
+					</div>
+				</div>
+			{/if}
+
+			{#if solicitacao.status === 'reprovado'}
+				<div class="alert alert-error mb-6 shadow-lg">
+					<XCircle class="h-6 w-6 shrink-0 stroke-current" strokeWidth={2} />
+					<div class="flex-1">
+						<div class="font-bold">Reprovado</div>
+						{#if solicitacao.gestor}
+							<div class="text-sm mt-1">
+								Por: <strong>{solicitacao.gestor.nome}</strong>
+							</div>
+						{/if}
+						{#if solicitacao.dataReprovacao}
+							<div class="text-xs mt-1 opacity-80">
+								Em: {new Date(solicitacao.dataReprovacao).toLocaleString('pt-BR')}
+							</div>
+						{/if}
+						{#if solicitacao.motivoReprovacao}
+							<div class="mt-2">
+								<div class="text-sm font-semibold">Motivo:</div>
+								<div class="text-sm">{solicitacao.motivoReprovacao}</div>
+							</div>
+						{/if}
+					</div>
+				</div>
+			{/if}
+
+			<!-- Histórico de Alterações -->
+			{#if solicitacao.historicoAlteracoes && solicitacao.historicoAlteracoes.length > 0}
+				<div class="mb-8">
+					<h3 class="text-primary mb-4 flex items-center gap-3 text-xl font-bold">
+						<div class="bg-primary/10 rounded-lg p-2">
+							<Clock class="text-primary h-6 w-6" strokeWidth={2} />
+						</div>
+						Histórico de Alterações
+					</h3>
+					<div class="card border-primary/10 bg-base-200/50 rounded-xl border-2 shadow-sm">
+						<div class="card-body p-5">
+							<div class="space-y-3">
+								{#each solicitacao.historicoAlteracoes as hist}
+									<div class="border-base-300 flex items-start gap-3 border-b pb-3 last:border-0 last:pb-0">
+										<Clock class="text-primary mt-0.5 h-4 w-4 shrink-0" strokeWidth={2} />
+										<div class="flex-1">
+											<div class="text-base-content text-sm font-semibold">{hist.acao}</div>
+											<div class="text-base-content/60 text-xs">
+												{new Date(hist.data).toLocaleString('pt-BR')}
+											</div>
+										</div>
+									</div>
+								{/each}
+							</div>
+						</div>
+					</div>
+				</div>
+			{/if}
+
 			<!-- Erro -->
 			{#if erro}
 				<div class="alert alert-error mb-6 shadow-lg">
diff --git a/apps/web/src/lib/components/AprovarFerias.svelte b/apps/web/src/lib/components/AprovarFerias.svelte
index a478e42..10231b0 100644
--- a/apps/web/src/lib/components/AprovarFerias.svelte
+++ b/apps/web/src/lib/components/AprovarFerias.svelte
@@ -410,13 +410,48 @@
 			{/if}
 		{/if}
 
+		<!-- Informações de Aprovação/Reprovação -->
+		{#if periodo.status === 'aprovado' || periodo.status === 'data_ajustada_aprovada' || periodo.status === 'EmFérias'}
+			<div class="alert alert-success mt-4">
+				<Check class="h-6 w-6 shrink-0 stroke-current" strokeWidth={2} />
+				<div class="flex-1">
+					<div class="font-bold">Aprovado</div>
+					{#if periodo.gestor}
+						<div class="text-sm mt-1">
+							Por: <strong>{periodo.gestor.nome}</strong>
+						</div>
+					{/if}
+					{#if periodo.dataAprovacao}
+						<div class="text-xs mt-1 opacity-80">
+							Em: {formatarData(periodo.dataAprovacao)}
+						</div>
+					{/if}
+				</div>
+			</div>
+		{/if}
+
 		<!-- Motivo Reprovação (se reprovado) -->
-		{#if periodo.status === 'reprovado' && periodo.motivoReprovacao}
+		{#if periodo.status === 'reprovado'}
 			<div class="alert alert-error mt-4">
 				<XCircle class="h-6 w-6 shrink-0 stroke-current" strokeWidth={2} />
-				<div>
-					<div class="font-bold">Motivo da Reprovação:</div>
-					<div class="text-sm">{periodo.motivoReprovacao}</div>
+				<div class="flex-1">
+					<div class="font-bold">Reprovado</div>
+					{#if periodo.gestor}
+						<div class="text-sm mt-1">
+							Por: <strong>{periodo.gestor.nome}</strong>
+						</div>
+					{/if}
+					{#if periodo.dataReprovacao}
+						<div class="text-xs mt-1 opacity-80">
+							Em: {formatarData(periodo.dataReprovacao)}
+						</div>
+					{/if}
+					{#if periodo.motivoReprovacao}
+						<div class="mt-2">
+							<div class="text-sm font-semibold">Motivo:</div>
+							<div class="text-sm">{periodo.motivoReprovacao}</div>
+						</div>
+					{/if}
 				</div>
 			</div>
 		{/if}
diff --git a/apps/web/src/routes/(dashboard)/perfil/+page.svelte b/apps/web/src/routes/(dashboard)/perfil/+page.svelte
index 5e41ee1..9df859e 100644
--- a/apps/web/src/routes/(dashboard)/perfil/+page.svelte
+++ b/apps/web/src/routes/(dashboard)/perfil/+page.svelte
@@ -62,10 +62,12 @@
 
 	type FuncionarioAtual = FunctionReturnType<typeof api.funcionarios.getCurrent>;
 	type TimeAtual = FunctionReturnType<typeof api.times.obterTimeFuncionario>;
+	type TimesSubordinados = FunctionReturnType<typeof api.times.listarSubordinadosDoGestorAtual>;
 	type MinhasSolicitacoes = FunctionReturnType<typeof api.ferias.listarMinhasSolicitacoes>;
 	type MinhasAusencias = FunctionReturnType<typeof api.ausencias.listarMinhasSolicitacoes>;
 	let funcionarioEstavel = $state<FuncionarioAtual | null>(null);
 	let meuTimeEstavel = $state<TimeAtual | null>(null);
+	let timesSubordinadosEstavel = $state<TimesSubordinados>([]);
 	let minhasSolicitacoesEstaveis = $state<MinhasSolicitacoes>([]);
 	let minhasAusenciasEstaveis = $state<MinhasAusencias>([]);
 
@@ -81,6 +83,8 @@
 	>('meu-perfil');
 
 	let periodoSelecionado = $state<Id<'ferias'> | null>(null);
+	let periodoHistoricoFerias = $state<Id<'ferias'> | null>(null);
+	let ausenciaHistorico = $state<Id<'solicitacoesAusencias'> | null>(null);
 
 	let mostrarModalFoto = $state(false);
 	let uploadandoFoto = $state(false);
@@ -261,6 +265,13 @@
 		}
 	});
 
+	$effect(() => {
+		if (timesSubordinadosQuery?.data && Array.isArray(timesSubordinadosQuery.data)) {
+			timesSubordinadosEstavel = timesSubordinadosQuery.data;
+		}
+		// Não limpar durante carregamento (quando undefined)
+	});
+
 	// Deriveds - agora apenas extraem dados, não criam queries
 	const funcionario = $derived(funcionarioEstavel);
 	const solicitacoesSubordinados = $derived.by(() => {
@@ -274,14 +285,14 @@
 	const meuTime = $derived(meuTimeEstavel);
 	const minhasSolicitacoes = $derived(minhasSolicitacoesEstaveis);
 	const minhasAusencias = $derived(minhasAusenciasEstaveis);
-	const timesSubordinados = $derived(timesSubordinadosQuery?.data || []);
-	const meusTimesGestor = $derived(timesSubordinados);
+	const timesSubordinados = $derived(timesSubordinadosEstavel);
+	const meusTimesGestor = $derived(timesSubordinadosEstavel);
 
 	const rolePermiteAprovacao = $derived(
 		currentUser?.data?.role?.nome === 'TI_MASTER' || currentUser?.data?.role?.nome === 'TI_ADMIN'
 	);
 
-	const ehGestor = $derived((timesSubordinados || []).length > 0 || rolePermiteAprovacao);
+	const ehGestor = $derived(timesSubordinadosEstavel.length > 0 || rolePermiteAprovacao);
 
 	// Estados estáveis para Meus Chamados
 	let chamadosEstaveis = $state<Array<Doc<'tickets'>>>([]);
@@ -1613,6 +1624,7 @@
 												<th class="text-base-content font-bold">Dias</th>
 												<th class="text-base-content font-bold">Status</th>
 												<th class="text-base-content font-bold">Solicitado em</th>
+												<th class="text-base-content text-center font-bold">Histórico</th>
 											</tr>
 										</thead>
 										<tbody>
@@ -1650,6 +1662,21 @@
 													<td class="text-base-content/60 text-xs font-medium"
 														>{new Date(periodo._creationTime).toLocaleDateString('pt-BR')}</td
 													>
+													<td class="text-center">
+														{#if periodo.historicoAlteracoes && periodo.historicoAlteracoes.length > 0}
+															<button
+																type="button"
+																class="btn btn-ghost btn-xs gap-1"
+																onclick={() => (periodoHistoricoFerias = periodo._id)}
+																title="Ver histórico"
+															>
+																<Clock class="h-4 w-4" strokeWidth={2} />
+																<span class="text-xs">({periodo.historicoAlteracoes.length})</span>
+															</button>
+														{:else}
+															<span class="text-base-content/30 text-xs">-</span>
+														{/if}
+													</td>
 												</tr>
 											{/each}
 										</tbody>
@@ -1809,6 +1836,7 @@
 												<th>Motivo</th>
 												<th>Status</th>
 												<th>Solicitado em</th>
+												<th class="text-center">Histórico</th>
 											</tr>
 										</thead>
 										<tbody>
@@ -1837,6 +1865,21 @@
 													<td class="text-xs"
 														>{new Date(ausencia.criadoEm).toLocaleDateString('pt-BR')}</td
 													>
+													<td class="text-center">
+														{#if ausencia.historicoAlteracoes && ausencia.historicoAlteracoes.length > 0}
+															<button
+																type="button"
+																class="btn btn-ghost btn-xs gap-1"
+																onclick={() => (ausenciaHistorico = ausencia._id)}
+																title="Ver histórico"
+															>
+																<Clock class="h-4 w-4" strokeWidth={2} />
+																<span class="text-xs">({ausencia.historicoAlteracoes.length})</span>
+															</button>
+														{:else}
+															<span class="text-base-content/30 text-xs">-</span>
+														{/if}
+													</td>
 												</tr>
 											{/each}
 										</tbody>
@@ -1890,6 +1933,7 @@
 											<th class="text-base-content font-bold">Período</th>
 											<th class="text-base-content font-bold">Dias</th>
 											<th class="text-base-content font-bold">Status</th>
+											<th class="text-base-content text-center font-bold">Histórico</th>
 											<th class="text-base-content text-center font-bold">Ações</th>
 										</tr>
 									</thead>
@@ -1947,6 +1991,21 @@
 														{getStatusTexto(periodo.status)}
 													</div>
 												</td>
+												<td class="text-center">
+													{#if periodo.historicoAlteracoes && periodo.historicoAlteracoes.length > 0}
+														<button
+															type="button"
+															class="btn btn-ghost btn-xs gap-1"
+															onclick={() => (periodoHistoricoFerias = periodo._id)}
+															title="Ver histórico"
+														>
+															<Clock class="h-4 w-4" strokeWidth={2} />
+															<span class="text-xs">({periodo.historicoAlteracoes.length})</span>
+														</button>
+													{:else}
+														<span class="text-base-content/30 text-xs">-</span>
+													{/if}
+												</td>
 												<td>
 													<div class="flex justify-center">
 														{#if periodo.status === 'aguardando_aprovacao'}
@@ -2021,6 +2080,7 @@
 											<th class="text-base-content font-bold">Período</th>
 											<th class="text-base-content font-bold">Dias</th>
 											<th class="text-base-content font-bold">Status</th>
+											<th class="text-base-content text-center font-bold">Histórico</th>
 											<th class="text-base-content text-center font-bold">Ações</th>
 										</tr>
 									</thead>
@@ -2081,6 +2141,21 @@
 														{getStatusTexto(ausencia.status)}
 													</div>
 												</td>
+												<td class="text-center">
+													{#if ausencia.historicoAlteracoes && ausencia.historicoAlteracoes.length > 0}
+														<button
+															type="button"
+															class="btn btn-ghost btn-xs gap-1"
+															onclick={() => (ausenciaHistorico = ausencia._id)}
+															title="Ver histórico"
+														>
+															<Clock class="h-4 w-4" strokeWidth={2} />
+															<span class="text-xs">({ausencia.historicoAlteracoes.length})</span>
+														</button>
+													{:else}
+														<span class="text-base-content/30 text-xs">-</span>
+													{/if}
+												</td>
 												<td>
 													<div class="flex justify-center">
 														{#if ausencia.status === 'aguardando_aprovacao'}
@@ -2563,6 +2638,94 @@
 	{/await}
 {/if}
 
+<!-- Modal Histórico de Férias -->
+{#if periodoHistoricoFerias}
+	{#await client.query(api.ferias.obterDetalhes, { feriasId: periodoHistoricoFerias }) then detalhes}
+		{#if detalhes && detalhes.historicoAlteracoes && detalhes.historicoAlteracoes.length > 0}
+			<dialog class="modal modal-open">
+				<div class="modal-box max-w-2xl">
+					<h3 class="mb-6 text-2xl font-bold">Histórico de Alterações</h3>
+					<div class="space-y-3">
+						{#each detalhes.historicoAlteracoes as hist}
+							<div class="border-base-300 flex items-start gap-3 border-b pb-3 last:border-0 last:pb-0">
+								<Clock class="text-primary mt-0.5 h-5 w-5 shrink-0" strokeWidth={2} />
+								<div class="flex-1">
+									<div class="text-base-content text-sm font-semibold">{hist.acao}</div>
+									<div class="text-base-content/60 mt-1 flex flex-col gap-0.5 text-xs">
+										<span>Por: <strong>{hist.usuarioNome || 'Usuário Desconhecido'}</strong></span>
+										<span>{new Date(hist.data).toLocaleString('pt-BR')}</span>
+									</div>
+								</div>
+							</div>
+						{/each}
+					</div>
+					<div class="modal-action">
+						<button
+							type="button"
+							class="btn"
+							onclick={() => (periodoHistoricoFerias = null)}
+						>
+							Fechar
+						</button>
+					</div>
+				</div>
+				<form method="dialog" class="modal-backdrop">
+					<button
+						type="button"
+						onclick={() => (periodoHistoricoFerias = null)}
+						aria-label="Fechar modal"
+					>
+						Fechar
+					</button>
+				</form>
+			</dialog>
+		{/if}
+	{/await}
+{/if}
+
+<!-- Modal Histórico de Ausências -->
+{#if ausenciaHistorico}
+	{@const ausenciaComHistorico = ausenciasFiltradas.find((a) => a._id === ausenciaHistorico) || ausenciasSubordinados.find((a) => a._id === ausenciaHistorico)}
+	{#if ausenciaComHistorico && ausenciaComHistorico.historicoAlteracoes && ausenciaComHistorico.historicoAlteracoes.length > 0}
+		<dialog class="modal modal-open">
+			<div class="modal-box max-w-2xl">
+				<h3 class="mb-6 text-2xl font-bold">Histórico de Alterações</h3>
+				<div class="space-y-3">
+					{#each ausenciaComHistorico.historicoAlteracoes as hist}
+						<div class="border-base-300 flex items-start gap-3 border-b pb-3 last:border-0 last:pb-0">
+							<Clock class="text-primary mt-0.5 h-5 w-5 shrink-0" strokeWidth={2} />
+							<div class="flex-1">
+								<div class="text-base-content text-sm font-semibold">{hist.acao}</div>
+								<div class="text-base-content/60 text-xs">
+									{new Date(hist.data).toLocaleString('pt-BR')}
+								</div>
+							</div>
+						</div>
+					{/each}
+				</div>
+				<div class="modal-action">
+					<button
+						type="button"
+						class="btn"
+						onclick={() => (ausenciaHistorico = null)}
+					>
+						Fechar
+					</button>
+				</div>
+			</div>
+			<form method="dialog" class="modal-backdrop">
+				<button
+					type="button"
+					onclick={() => (ausenciaHistorico = null)}
+					aria-label="Fechar modal"
+				>
+					Fechar
+				</button>
+			</form>
+		</dialog>
+	{/if}
+{/if}
+
 <style>
 	@keyframes gradient-shift {
 		0%,
diff --git a/apps/web/src/routes/(dashboard)/recursos-humanos/controle-ponto/banco-horas/+page.svelte b/apps/web/src/routes/(dashboard)/recursos-humanos/controle-ponto/banco-horas/+page.svelte
index 73d3013..10c5c50 100644
--- a/apps/web/src/routes/(dashboard)/recursos-humanos/controle-ponto/banco-horas/+page.svelte
+++ b/apps/web/src/routes/(dashboard)/recursos-humanos/controle-ponto/banco-horas/+page.svelte
@@ -389,3 +389,5 @@
 </div>
 
 
+
+
diff --git a/apps/web/src/routes/(dashboard)/recursos-humanos/ferias/+page.svelte b/apps/web/src/routes/(dashboard)/recursos-humanos/ferias/+page.svelte
index 6527f46..1273f06 100644
--- a/apps/web/src/routes/(dashboard)/recursos-humanos/ferias/+page.svelte
+++ b/apps/web/src/routes/(dashboard)/recursos-humanos/ferias/+page.svelte
@@ -2041,10 +2041,6 @@
 				<div class="stat bg-base-100 rounded-box border-error/30 border shadow-lg">
 					<div class="stat-figure text-error">
 						<X class="h-8 w-8" strokeWidth={2} />
-					</div>
-								d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z"
-							/>
-						</svg>
 					</div>
 					<div class="stat-title">Reprovadas</div>
 					<div class="stat-value text-error">{stats.reprovadas}</div>
diff --git a/apps/web/src/routes/(dashboard)/ti/painel-permissoes/+page.svelte b/apps/web/src/routes/(dashboard)/ti/painel-permissoes/+page.svelte
index de31d36..488c45d 100644
--- a/apps/web/src/routes/(dashboard)/ti/painel-permissoes/+page.svelte
+++ b/apps/web/src/routes/(dashboard)/ti/painel-permissoes/+page.svelte
@@ -427,12 +427,11 @@
 										onclick={() => toggleRecurso(roleId, item.recurso)}
 										disabled={salvando}
 									>
-										<span class="text-lg font-semibold">{item.recurso}</span>
-										<ChevronDown
-											class="h-5 w-5 transition-transform"
-											class:rotate-180={recursoExpandido}
-											strokeWidth={2}
-										/>
+									<span class="text-lg font-semibold">{item.recurso}</span>
+									<ChevronDown
+										class="h-5 w-5 transition-transform {recursoExpandido ? 'rotate-180' : ''}"
+										strokeWidth={2}
+									/>
 									</button>
 
 									<!-- Lista de ações (visível quando expandido) -->
diff --git a/packages/backend/convex/ausencias.ts b/packages/backend/convex/ausencias.ts
index d52c920..1a1ae5f 100644
--- a/packages/backend/convex/ausencias.ts
+++ b/packages/backend/convex/ausencias.ts
@@ -1,9 +1,10 @@
 import { v } from 'convex/values';
 import { mutation, query } from './_generated/server';
 import type { QueryCtx, MutationCtx } from './_generated/server';
-import { internal, api } from './_generated/api';
+import { api } from './_generated/api';
 import { Id, Doc } from './_generated/dataModel';
 import { parseLocalDate, formatarDataBR } from './utils/datas';
+import { getCurrentUserFunction } from './auth';
 
 // Query: Listar todas as solicitações (para RH)
 export const listarTodas = query({
@@ -185,6 +186,20 @@ export const obterDetalhes = query({
 			time = await ctx.db.get(membroTime.timeId);
 		}
 
+		// Enriquecer histórico com nomes dos usuários
+		let historicoComUsuarios = solicitacao.historicoAlteracoes;
+		if (historicoComUsuarios && historicoComUsuarios.length > 0) {
+			historicoComUsuarios = await Promise.all(
+				historicoComUsuarios.map(async (hist) => {
+					const usuario = await ctx.db.get(hist.usuarioId);
+					return {
+						...hist,
+						usuarioNome: usuario?.nome || 'Usuário Desconhecido'
+					};
+				})
+			);
+		}
+
 		return {
 			...solicitacao,
 			funcionario: funcionario
@@ -194,7 +209,8 @@ export const obterDetalhes = query({
 					}
 				: null,
 			gestor,
-			time
+			time,
+			historicoAlteracoes: historicoComUsuarios
 		};
 	}
 });
@@ -302,10 +318,12 @@ export const criarSolicitacao = mutation({
 
 		const dataInicio = parseLocalDate(args.dataInicio);
 		const dataFim = parseLocalDate(args.dataFim);
-		
+
 		// Criar data de hoje em UTC para comparação
 		const hoje = new Date();
-		const hojeUTC = new Date(Date.UTC(hoje.getUTCFullYear(), hoje.getUTCMonth(), hoje.getUTCDate(), 0, 0, 0, 0));
+		const hojeUTC = new Date(
+			Date.UTC(hoje.getUTCFullYear(), hoje.getUTCMonth(), hoje.getUTCDate(), 0, 0, 0, 0)
+		);
 
 		if (dataInicio < hojeUTC) {
 			throw new Error('A data de início não pode ser no passado');
@@ -320,6 +338,17 @@ export const criarSolicitacao = mutation({
 			throw new Error('Funcionário não encontrado');
 		}
 
+		// Buscar usuário que está criando (pode não ser o próprio funcionário)
+		const usuarioCriador = await getCurrentUserFunction(ctx);
+		const usuarioFuncionario = await ctx.db
+			.query('usuarios')
+			.withIndex('by_funcionarioId', (q) => q.eq('funcionarioId', args.funcionarioId))
+			.first();
+
+		// Usar o usuário autenticado se disponível, senão usar o usuário do funcionário ou gestor
+		const usuarioIdParaHistorico =
+			usuarioCriador?._id || usuarioFuncionario?._id || funcionario.gestorId;
+
 		// Verificar sobreposição com outras solicitações aprovadas ou pendentes
 		const solicitacoesExistentes = await ctx.db
 			.query('solicitacoesAusencias')
@@ -334,6 +363,17 @@ export const criarSolicitacao = mutation({
 			}
 		}
 
+		// Criar histórico inicial
+		const historicoInicial = usuarioIdParaHistorico
+			? [
+					{
+						data: Date.now(),
+						usuarioId: usuarioIdParaHistorico,
+						acao: 'Solicitação criada'
+					}
+				]
+			: [];
+
 		// Criar solicitação
 		const solicitacaoId = await ctx.db.insert('solicitacoesAusencias', {
 			funcionarioId: args.funcionarioId,
@@ -341,7 +381,8 @@ export const criarSolicitacao = mutation({
 			dataFim: args.dataFim,
 			motivo: args.motivo.trim(),
 			status: 'aguardando_aprovacao',
-			criadoEm: Date.now()
+			criadoEm: Date.now(),
+			historicoAlteracoes: historicoInicial
 		});
 
 		// Encontrar gestor do funcionário
@@ -482,11 +523,23 @@ export const aprovar = mutation({
 			throw new Error('Funcionário não encontrado');
 		}
 
+		// Buscar nome do gestor para o histórico
+		const gestorUsuario = await ctx.db.get(args.gestorId);
+		const nomeGestor = gestorUsuario?.nome || 'Gestor';
+
 		// Atualizar solicitação
 		await ctx.db.patch(args.solicitacaoId, {
 			status: 'aprovado',
 			gestorId: args.gestorId,
-			dataAprovacao: Date.now()
+			dataAprovacao: Date.now(),
+			historicoAlteracoes: [
+				...(solicitacao.historicoAlteracoes || []),
+				{
+					data: Date.now(),
+					usuarioId: args.gestorId,
+					acao: `Aprovado por ${nomeGestor}`
+				}
+			]
 		});
 
 		// Buscar usuário do funcionário
@@ -625,12 +678,24 @@ export const reprovar = mutation({
 			throw new Error('Funcionário não encontrado');
 		}
 
+		// Buscar nome do gestor para o histórico
+		const gestorUsuario = await ctx.db.get(args.gestorId);
+		const nomeGestor = gestorUsuario?.nome || 'Gestor';
+
 		// Atualizar solicitação
 		await ctx.db.patch(args.solicitacaoId, {
 			status: 'reprovado',
 			gestorId: args.gestorId,
 			dataReprovacao: Date.now(),
-			motivoReprovacao: args.motivoReprovacao.trim()
+			motivoReprovacao: args.motivoReprovacao.trim(),
+			historicoAlteracoes: [
+				...(solicitacao.historicoAlteracoes || []),
+				{
+					data: Date.now(),
+					usuarioId: args.gestorId,
+					acao: `Reprovado por ${nomeGestor}: ${args.motivoReprovacao.trim()}`
+				}
+			]
 		});
 
 		// Buscar usuário do funcionário
diff --git a/packages/backend/convex/ferias.ts b/packages/backend/convex/ferias.ts
index dce754b..77d26ff 100644
--- a/packages/backend/convex/ferias.ts
+++ b/packages/backend/convex/ferias.ts
@@ -290,6 +290,20 @@ export const obterDetalhes = query({
 			time = await ctx.db.get(membroTime.timeId);
 		}
 
+		// Enriquecer histórico com nomes dos usuários
+		let historicoComUsuarios = ferias.historicoAlteracoes;
+		if (historicoComUsuarios && historicoComUsuarios.length > 0) {
+			historicoComUsuarios = await Promise.all(
+				historicoComUsuarios.map(async (hist) => {
+					const usuario = await ctx.db.get(hist.usuarioId);
+					return {
+						...hist,
+						usuarioNome: usuario?.nome || 'Usuário Desconhecido'
+					};
+				})
+			);
+		}
+
 		return {
 			...ferias,
 			funcionario: funcionario
@@ -299,7 +313,8 @@ export const obterDetalhes = query({
 					}
 				: null,
 			gestor,
-			time
+			time,
+			historicoAlteracoes: historicoComUsuarios
 		};
 	}
 });
@@ -389,6 +404,10 @@ export const aprovar = mutation({
 
 		const funcionario = await ctx.db.get(registro.funcionarioId);
 
+		// Buscar nome do gestor para o histórico
+		const gestorUsuario = await ctx.db.get(args.gestorId);
+		const nomeGestor = gestorUsuario?.nome || 'Gestor';
+
 		// Atualizar o registro
 		await ctx.db.patch(registro._id, {
 			status: 'aprovado',
@@ -399,7 +418,7 @@ export const aprovar = mutation({
 				{
 					data: Date.now(),
 					usuarioId: args.gestorId,
-					acao: 'Aprovado'
+					acao: `Aprovado por ${nomeGestor}`
 				}
 			]
 		});
diff --git a/packages/backend/convex/tables/ausencias.ts b/packages/backend/convex/tables/ausencias.ts
index 94fc88a..07340cd 100644
--- a/packages/backend/convex/tables/ausencias.ts
+++ b/packages/backend/convex/tables/ausencias.ts
@@ -18,7 +18,16 @@ export const ausenciasTables = {
 		dataReprovacao: v.optional(v.number()),
 		motivoReprovacao: v.optional(v.string()),
 		observacao: v.optional(v.string()),
-		criadoEm: v.number()
+		criadoEm: v.number(),
+		historicoAlteracoes: v.optional(
+			v.array(
+				v.object({
+					data: v.number(),
+					usuarioId: v.id('usuarios'),
+					acao: v.string()
+				})
+			)
+		)
 	})
 		.index('by_funcionario', ['funcionarioId'])
 		.index('by_status', ['status'])