Smart/smartEnergyView-frontend
2
0
Fork 0
Code Issues 7 Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor GrossAnualChart and Dashboard components: improve data handling and filtering logic for better accuracy in displayed values

Browse Source
This commit is contained in:
Giuliano Paschoalino 2026-02-25 14:04:45 -03:00
parent adfb0bddd0
commit 5dd5a29a9c
2 changed files with 22 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
src/components/graph/grossAnualChart/GrossAnualChart.tsx
View File

@ -85,10 +85,16 @@ export function GrossAnualChart({ title, subtitle, dataProps = [], label, datase
color: '#255488', color: '#255488',
clip: false, clip: false,
formatter: (value, ctx) => { formatter: (value, ctx) => {
const percentage = (dataProps[ctx.dataIndex]?.econ_percentual * 100).toFixed(0) + "%"; if (value == null) return null
const result = `${spacement(parseInt(value).toLocaleString('pt-br'))}${percentage}\n${parseInt(value).toLocaleString('pt-br')}${spacement(parseInt(value).toLocaleString('pt-br'))}` const year = labels[ctx.dataIndex]
const estimatedEntry = dataProps.find((d) => String(d.ano) === String(year) && d.dad_estimado === true)
return value == null ? null : result const consolidatedEntry = dataProps.find((d) => String(d.ano) === String(year) && d.dad_estimado === false)
const topEntry = estimatedEntry || consolidatedEntry
if (!topEntry) return null
const totalValue = parseFloat(topEntry.economia_acumulada)
const percentage = (parseFloat(topEntry.econ_percentual) * 100).toFixed(0) + "%"
const formatted = parseInt(String(totalValue)).toLocaleString('pt-br')
return `${spacement(formatted)}${percentage}\n${formatted}${spacement(formatted)}`
}, },
anchor: 'end', anchor: 'end',
align: 'end', align: 'end',
@ -115,13 +121,15 @@ export function GrossAnualChart({ title, subtitle, dataProps = [], label, datase
// Build dataset arrays aligned to `labels` (years). This avoids index misalignment // Build dataset arrays aligned to `labels` (years). This avoids index misalignment
// when `dataProps` is not in the same order or has missing/extra items // when `dataProps` is not in the same order or has missing/extra items
const consolidatedData = labels.map((lbl) => { const consolidatedData = labels.map((lbl) => {
const hasEstimated = dataProps.some((d) => String(d.ano) === String(lbl) && d.dad_estimado === true)
if (hasEstimated) return null
const match = dataProps.find((d) => String(d.ano) === String(lbl) && d.dad_estimado === false) const match = dataProps.find((d) => String(d.ano) === String(lbl) && d.dad_estimado === false)
return match ? parseFloat(match.economia_acumulada) : null return match ? parseFloat(match.economia_acumulada) : null
}) })
const estimatedData = labels.map((lbl) => { const estimatedData = labels.map((lbl) => {
const match = dataProps.find((d) => String(d.ano) === String(lbl) && d.dad_estimado === true) const estimated = dataProps.find((d) => String(d.ano) === String(lbl) && d.dad_estimado === true)
return match ? parseFloat(match.economia_acumulada) : null return estimated ? parseFloat(estimated.economia_acumulada) : null
}) })
const data: any = { const data: any = {
@ -133,10 +141,11 @@ export function GrossAnualChart({ title, subtitle, dataProps = [], label, datase
// stacked: true, // stacked: true,
data: consolidatedData, data: consolidatedData,
datalabels: { datalabels: {
// backgroundColor: '#255488', display: (ctx) => {
// borderRadius: 8, const year = labels[ctx.dataIndex]
// opacity: .8, const hasEstimated = dataProps.some((d) => String(d.ano) === String(year) && d.dad_estimado === true)
display: (ctx) => ctx.dataIndex === 0, // Exibe apenas o primeiro return !hasEstimated
},
}, },
skipNull: true, skipNull: true,
borderRadius: 8, borderRadius: 8,
@ -146,7 +155,7 @@ export function GrossAnualChart({ title, subtitle, dataProps = [], label, datase
type: 'bar', type: 'bar',
label: 'Estimado', label: 'Estimado',
datalabels: { datalabels: {
// keep the previous behaviour of offsetting the second estimated bar if needed display: true,
}, },
data: estimatedData, data: estimatedData,
skipNull: true, skipNull: true,

4
src/pages/dashboard/index.tsx
View File

@ -104,10 +104,10 @@ export default function Dashboard({ grossAnualGraph, grossAnualYears, grossMensa
setLastConsolidatedYearAnual(lastYearAnual) setLastConsolidatedYearAnual(lastYearAnual)
if (lastYearAnual !== null) { if (lastYearAnual !== null) {
// Filter to show only last consolidated year and next 6 years (7 years total) const minYearAnual = Math.min(...grossAnualGraph.map((item) => parseInt(item.ano)))
const filteredAnualData = grossAnualGraph.filter((item) => { const filteredAnualData = grossAnualGraph.filter((item) => {
const year = parseInt(item.ano) const year = parseInt(item.ano)
return year >= lastYearAnual && year <= lastYearAnual + 6 return year >= minYearAnual && year <= minYearAnual + 6
}) })
setProcessedAnualData(filteredAnualData) setProcessedAnualData(filteredAnualData)
setProcessedAnualYears(filteredAnualData.map((value) => value.ano)) setProcessedAnualYears(filteredAnualData.map((value) => value.ano))