/* eslint-disable */ // Auriz — Dashboard Analytics: gráficos de gastos e saldos por membro const DashboardAnalyticsScreen = ({ familyId, month, year }) => { const [spending, setSpending] = React.useState([]); const [balances, setBalances] = React.useState([]); const [history, setHistory] = React.useState([]); const [loading, setLoading] = React.useState(true); React.useEffect(() => { if (!familyId) return; setLoading(true); Promise.all([ DB.getMonthlySpending(familyId, month + 1, year), DB.getMemberBalances(familyId, month + 1, year), DB.getSpendingHistory(familyId, 6), ]).then(([s, b, h]) => { setSpending(s); setBalances(b); setHistory(h); }) .finally(() => setLoading(false)); }, [familyId, month, year]); if (loading) return ; const totalSpent = spending.reduce((s, c) => s + parseFloat(c.total_spent ?? 0), 0); const totalIncome = spending.reduce((s, c) => s + parseFloat(c.total_income ?? 0), 0); const monthHistory = {}; history.forEach(r => { const key = `${r.year}-${String(r.month).padStart(2, "0")}`; if (!monthHistory[key]) monthHistory[key] = { spent: 0, income: 0, month: r.month, year: r.year }; monthHistory[key].spent += parseFloat(r.total_spent ?? 0); monthHistory[key].income += parseFloat(r.total_income ?? 0); }); const monthSeries = Object.values(monthHistory) .sort((a, b) => a.year !== b.year ? a.year - b.year : a.month - b.month) .slice(-6); const maxMonth = Math.max(...monthSeries.map(m => Math.max(m.spent, m.income)), 1); return (
{/* KPIs */}
{[ { label: "Receita total", value: totalIncome, tone: "sage" }, { label: "Despesas totais", value: -totalSpent, tone: "terra" }, { label: "Saldo líquido", value: totalIncome - totalSpent, tone: totalIncome >= totalSpent ? "sage" : "terra" }, { label: "Categorias", value: spending.length, unit: "cat.", tone: "ink" }, ].map(kpi => (
{kpi.label}
{kpi.unit ?
{kpi.value}{kpi.unit}
: } ))}
{/* Gastos por categoria */}

Gastos por categoria

{MONTHS_PT[month]} {year}
{spending.filter(c => parseFloat(c.total_spent ?? 0) > 0).length === 0 ? ( ) : (
{spending .filter(c => parseFloat(c.total_spent ?? 0) > 0) .map(cat => { const pct = totalSpent > 0 ? (parseFloat(cat.total_spent) / totalSpent) * 100 : 0; return (
{cat.category_name} {pct.toFixed(1)}% R$ {parseFloat(cat.total_spent).toLocaleString("pt-BR", { minimumFractionDigits: 2 })}
); })}
)} {/* Saldo por membro */}

Saldo por membro

{MONTHS_PT[month]} {year}
{balances.length === 0 ? ( ) : (
{balances.map(b => { const net = parseFloat(b.net_balance ?? 0); return (
{b.member_name}
Renda: R$ {parseFloat(b.monthly_income).toLocaleString("pt-BR")}
= 0 ? "sage" : "terra"} />
Receita
+R$ {parseFloat(b.income ?? 0).toLocaleString("pt-BR", { minimumFractionDigits: 2 })}
Despesas
−R$ {(parseFloat(b.personal_expenses ?? 0) + parseFloat(b.shared_expenses_split ?? 0)).toLocaleString("pt-BR", { minimumFractionDigits: 2 })}
); })}
)}
{/* Histórico mensal */}

Evolução dos últimos meses

{monthSeries.length < 2 ? ( ) : (
{monthSeries.map(m => (
{MONTHS_PT[m.month - 1]?.slice(0, 3)} {m.year}
))}
Receita
Gasto
)}
); }; window.DashboardAnalyticsScreen = DashboardAnalyticsScreen;