SESP/sgse-app
2
0
Fork 0
Code Issues 3 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat: add UserAvatar component to display employee profile pictures in various HR pages, enhancing visual representation of employee data

Browse Source
This commit is contained in:
deyvisonwanderley
2025-12-01 22:13:01 -03:00
parent c19c8c859e
commit 95c3b48ae6
6 changed files with 178 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
apps/web/src/routes/(dashboard)/recursos-humanos/controle-ponto/homologacao/+page.svelte
View File

@@ -6,6 +6,7 @@
import type { Id } from '@sgse-app/backend/convex/_generated/dataModel';
import { formatarHoraPonto, getTipoRegistroLabel } from '$lib/utils/ponto';
import { toast } from 'svelte-sonner';
import UserAvatar from '$lib/components/chat/UserAvatar.svelte';
const client = useConvexClient();
@@ -156,7 +157,7 @@
// Lista de funcionários do time
const funcionarios = $derived.by(() => {
const funcs: Array<{ _id: Id<'funcionarios'>; nome: string; matricula?: string }> = [];
const funcs: Array<{ _id: Id<'funcionarios'>; nome: string; matricula?: string; fotoPerfilUrl?: string | null }> = [];
for (const time of subordinados) {
for (const membro of time.membros) {
if (membro.funcionario && !funcs.find((f) => f._id === membro.funcionario._id)) {
@@ -164,6 +165,7 @@
_id: membro.funcionario._id,
nome: membro.funcionario.nome,
matricula: membro.funcionario.matricula,
fotoPerfilUrl: membro.funcionario.fotoPerfilUrl,
});
}
}
@@ -873,13 +875,21 @@
</td>
{#if !funcionarioSelecionado}
<td>
{homologacao.funcionario?.nome || '-'}
{#if homologacao.funcionario?.matricula}
<br />
<span class="text-xs text-base-content/70">
Mat: {homologacao.funcionario.matricula}
</span>
{/if}
<div class="flex items-center gap-3">
<UserAvatar
fotoPerfilUrl={homologacao.fotoPerfilUrl}
nome={homologacao.funcionario?.nome || 'Funcionário'}
size="sm"
/>
<div>
<div class="font-medium">{homologacao.funcionario?.nome || '-'}</div>
{#if homologacao.funcionario?.matricula}
<span class="text-xs text-base-content/70">
Mat: {homologacao.funcionario.matricula}
</span>
{/if}
</div>
</div>
</td>
{/if}
<td>
@@ -980,14 +990,22 @@
})}
</div>
<div>
<span class="font-medium">Funcionário:</span>{' '}
{homologacaoSelecionada.funcionario?.nome || '-'}
{#if homologacaoSelecionada.funcionario?.matricula}
<br />
<span class="text-xs text-base-content/70">
Mat: {homologacaoSelecionada.funcionario.matricula}
</span>
{/if}
<span class="font-medium">Funcionário:</span>
<div class="flex items-center gap-3 mt-2">
<UserAvatar
fotoPerfilUrl={homologacaoSelecionada.fotoPerfilUrl}
nome={homologacaoSelecionada.funcionario?.nome || 'Funcionário'}
size="sm"
/>
<div>
<div class="font-medium">{homologacaoSelecionada.funcionario?.nome || '-'}</div>
{#if homologacaoSelecionada.funcionario?.matricula}
<span class="text-xs text-base-content/70">
Mat: {homologacaoSelecionada.funcionario.matricula}
</span>
{/if}
</div>
</div>
</div>
<div>
<span class="font-medium">Gestor:</span>{' '}