KPI's na lista de beneficiários

This commit is contained in:
Duarte
2026-06-07 20:28:08 +01:00
parent 8c2b9cb4a0
commit ac75e55f50
3 changed files with 53 additions and 1 deletions
BIN
View File
Binary file not shown.
+18 -1
View File
@@ -1,6 +1,6 @@
import { db } from '$lib/server/db';
import * as schema from '$lib/server/db/schema';
import { asc, eq, or, like } from 'drizzle-orm';
import { asc, eq, or, like, sql } from 'drizzle-orm';
import type { PageServerLoad } from './$types';
export const load: PageServerLoad = async ({ url }) => {
@@ -8,6 +8,19 @@ export const load: PageServerLoad = async ({ url }) => {
const status = url.searchParams.get('status') || '';
try {
const totalFamiliesResult = db
.select({ count: sql<number>`count(*)` })
.from(schema.beneficiaries)
.where(eq(schema.beneficiaries.isParent, true))
.get();
const totalFamilies = totalFamiliesResult?.count ?? 0;
const totalBeneficiariesResult = db
.select({ count: sql<number>`count(*)` })
.from(schema.beneficiaries)
.get();
const totalBeneficiaries = totalBeneficiariesResult?.count ?? 0;
let query = db
.select()
.from(schema.beneficiaries)
@@ -33,6 +46,8 @@ export const load: PageServerLoad = async ({ url }) => {
return {
beneficiaries: list,
totalFamilies,
totalBeneficiaries,
search,
status: status || 'todos'
};
@@ -40,6 +55,8 @@ export const load: PageServerLoad = async ({ url }) => {
console.error('Error loading beneficiaries:', err);
return {
beneficiaries: [],
totalFamilies: 0,
totalBeneficiaries: 0,
search,
status: status || 'todos',
error: 'Erro ao carregar a lista de beneficiários.'
@@ -113,6 +113,41 @@
</div>
</div>
<!-- Indicadores/Estatísticas -->
<div class="row g-3 mb-4">
<div class="col-12 col-sm-6">
<div class="card border-0 shadow-sm rounded-4 p-3 bg-white h-100 d-flex flex-row align-items-center gap-3">
<div class="stats-icon rounded-3 p-3 d-flex align-items-center justify-content-center" style="background-color: rgba(44, 86, 46, 0.1); color: #2c562e; width: 60px; height: 60px; flex-shrink: 0;">
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor" class="bi bi-house-door-fill" viewBox="0 0 16 16">
<path d="M6.5 14.5v-3.507c0-.31.25-.56.56-.56h2c.31 0 .56.25.56.56v3.507c0 .31-.25.56-.56.56H7.06a.56.56 0 0 1-.56-.56"/>
<path d="M13 2.5V6l-2-2V2.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5z"/>
<path d="M8 .757 1.01 6.855a.5.5 0 0 0-.01.768l.66.583a.5.5 0 0 0 .702-.055L8 2.501l5.64 5.65a.5.5 0 0 0 .702.054l.66-.583a.5.5 0 0 0-.01-.767L8 .757z"/>
</svg>
</div>
<div>
<span class="text-secondary small fw-semibold d-block text-uppercase" style="letter-spacing: 0.05em; font-size: 0.75rem;">Famílias</span>
<span class="fs-2 fw-bold text-dark lh-1">{data.totalFamilies}</span>
<span class="text-muted small d-block mt-1" style="font-size: 0.75rem;">Número de famílias (IsParent=true)</span>
</div>
</div>
</div>
<div class="col-12 col-sm-6">
<div class="card border-0 shadow-sm rounded-4 p-3 bg-white h-100 d-flex flex-row align-items-center gap-3">
<div class="stats-icon rounded-3 p-3 d-flex align-items-center justify-content-center" style="background-color: rgba(252, 181, 21, 0.15); color: #b78104; width: 60px; height: 60px; flex-shrink: 0;">
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor" class="bi bi-people-fill" viewBox="0 0 16 16">
<path d="M7 14s-1 0-1-1 1-4 5-4 5 3 5 4-1 1-1 1zm4-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6m-5.784 6A2.24 2.24 0 0 1 5 13c0-1.355.68-2.75 1.936-3.72A6.3 6.3 0 0 0 5 9c-4 0-5 3-5 4s1 1 1 1zM4.5 8a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5"/>
</svg>
</div>
<div>
<span class="text-secondary small fw-semibold d-block text-uppercase" style="letter-spacing: 0.05em; font-size: 0.75rem;">Total de Beneficiários</span>
<span class="fs-2 fw-bold text-dark lh-1">{data.totalBeneficiaries}</span>
<span class="text-muted small d-block mt-1" style="font-size: 0.75rem;">Todos os registos na base de dados</span>
</div>
</div>
</div>
</div>
<div class="card border-0 shadow-sm rounded-4 p-3 mb-4 bg-white">
<form method="GET" class="row g-3 align-items-end">
<div class="col-md-6 col-lg-7">