Files
sgse-app/apps/web/src/lib/components/ponto/SaldoDiarioBadge.svelte

37 lines
744 B
Svelte

<script lang="ts">
interface Props {
saldo?: {
saldoMinutos: number;
horas: number;
minutos: number;
positivo: boolean;
} | null;
size?: 'sm' | 'md' | 'lg';
}
const { saldo, size = 'md' }: Props = $props();
function formatarSaldo(saldo: NonNullable<Props['saldo']>): string {
const sinal = saldo.positivo ? '+' : '-';
return `${sinal}${saldo.horas}h ${saldo.minutos}min`;
}
const sizeClasses = {
sm: 'badge-sm',
md: 'badge-lg',
lg: 'badge-xl'
};
</script>
{#if saldo}
<span
class="badge font-semibold shadow-sm {sizeClasses[size]} {saldo.positivo
? 'badge-success'
: 'badge-error'}"
>
{formatarSaldo(saldo)}
</span>
{:else}
<span class="badge badge-ghost {sizeClasses[size]}">-</span>
{/if}