Componenti

Extensions

Widget aggiuntivi — funnel, fatture, confronto periodi e Gantt semplificato.

I widget extensions sono visualizzazioni avanzate non legate a una specifica area di business: si combinano con widget di altre categorie per arricchire la dashboard. Tutti estendono BaseWidgetProps.

ComparisonWidget

Confronto tra due periodi con variazioni assolute e percentuali.

PropTipoDescrizione
titlestringTitolo del confronto
itemsComparisonItem[]Elementi confrontati con currentValue, previousValue, change, changePercent
currentPeriodLabelstringEtichetta periodo corrente (es. 'Questo mese')
previousPeriodLabelstringEtichetta periodo precedente
showAsBarsbooleanVisualizza come grafico a barre
showChangePercentbooleanMostra percentuali di variazione

FunnelWidget

Funnel di conversione con stage ordinati e tassi di conversione.

PropTipoDescrizione
titlestringTitolo
stagesFunnelStage[]Stage ordinati con value, percentage, color?
totalValuenumberValore in ingresso
conversionRatenumberTasso di conversione complessivo (%)
showPercentagesbooleanMostra percentuali per stage
showValuesbooleanMostra valori economici

GanttWidget

Diagramma Gantt semplificato con barre temporali, milestone e progresso.

PropTipoDescrizione
titlestringTitolo
tasksGanttTask[]Task con startDate, endDate, progress (0-100), dependencies?, isMilestone?
startDatestringData inizio periodo (ISO)
endDatestringData fine periodo (ISO)
showTodaybooleanMostra indicatore data odierna
maxTasksnumberNumero massimo task
<PzetaDashboard :config="{ widgets: [{
  id: 'gantt', type: WidgetType.GanttWidget, width: 12, height: 4,
  props: { tasks, startDate: '2025-05-01', endDate: '2025-08-31', showToday: true }
}] }" />

InvoicesWidget

Lista fatture con riepilogo per stato.

PropTipoDescrizione
invoicesInvoice[]Fatture con status (draft/sent/paid/overdue/cancelled)
summary{ total, paid, pending, overdue, draft }Conteggi per stato
totalAmountnumberImporto totale
pendingAmountnumberImporto da incassare
maxInvoicesnumberNumero massimo da mostrare
showOverdueOnlybooleanMostra solo scadute