diff --git a/src/app/DRE/teste.tsx b/src/app/DRE/teste.tsx index 84475f2..f748a49 100644 --- a/src/app/DRE/teste.tsx +++ b/src/app/DRE/teste.tsx @@ -56,6 +56,7 @@ interface HierarchicalRow { percentuaisPorMes?: Record; percentualTotal?: number; isCalculado?: boolean; + entidades?: string; } // Componente memoizado para linhas da tabela @@ -250,6 +251,19 @@ export default function Teste() { }); const [linhaSelecionada, setLinhaSelecionada] = useState(null); const [isAllExpanded, setIsAllExpanded] = useState(false); + + // Refs para sincronizar scroll vertical entre coluna fixa e valores + const descricaoScrollRef = React.useRef(null); + const valoresScrollRef = React.useRef(null); + + // Função para sincronizar scroll vertical + const syncScroll = (source: 'descricao' | 'valores') => { + if (source === 'descricao' && descricaoScrollRef.current && valoresScrollRef.current) { + valoresScrollRef.current.scrollTop = descricaoScrollRef.current.scrollTop; + } else if (source === 'valores' && descricaoScrollRef.current && valoresScrollRef.current) { + descricaoScrollRef.current.scrollTop = valoresScrollRef.current.scrollTop; + } + }; useEffect(() => { // Carregar períodos disponíveis da API @@ -726,6 +740,7 @@ export default function Teste() { 'Conta': row.conta || '', 'Código Centro': row.codigo_centro_custo || '', 'Código Conta': row.codigo_conta || '', + 'Entidade': row.entidades || '', 'Total': row.total || 0, }; @@ -756,6 +771,7 @@ export default function Teste() { { wch: 35 }, // Conta { wch: 15 }, // Código Centro { wch: 12 }, // Código Conta + { wch: 20 }, // Entidade { wch: 15 }, // Total ]; @@ -1019,6 +1035,7 @@ export default function Teste() { valoresPorMes: valoresContaPorMes, percentuaisPorMes: calcularPercentuaisPorMes(valoresContaPorMes, grupo), percentualTotal: calcularPercentualTotal(totalConta, grupo), + entidades: contaItems[0]?.entidades || "", }); // Agrupar por centro de custo dentro da conta @@ -1057,6 +1074,7 @@ export default function Teste() { valoresPorMes: valoresCentroPorMes, percentuaisPorMes: calcularPercentuaisPorMes(valoresCentroPorMes, grupo), percentualTotal: calcularPercentualTotal(totalCentro, grupo), + entidades: centroItems[0]?.entidades || "", }); }); }); @@ -1098,6 +1116,7 @@ export default function Teste() { valoresPorMes: valoresCentroPorMes, percentuaisPorMes: calcularPercentuaisPorMes(valoresCentroPorMes, grupo), percentualTotal: calcularPercentualTotal(totalCentro, grupo), + entidades: centroItems[0]?.entidades || "", }); // Agrupar por conta dentro do centro de custo @@ -1136,6 +1155,7 @@ export default function Teste() { valoresPorMes: valoresContaPorMes, percentuaisPorMes: calcularPercentuaisPorMes(valoresContaPorMes, grupo), percentualTotal: calcularPercentualTotal(totalConta, grupo), + entidades: contaItems[0]?.entidades || "", }); }); }); @@ -2782,55 +2802,175 @@ export default function Teste() { {/* Table Container */} {filtrosAplicados && !loading && !error && (
- {/* Scroll Container - Apenas um container com scroll */} -
- {/* Table */} - - {/* Table Header */} - - - - {mesesDisponiveis.map((mes) => ( - - + + + {/* Table Body */} + + {hierarchicalData.map((row, index) => ( + + {/* Colunas de valores por mês */} + {mesesDisponiveis.map((mes) => ( + + + + + ))} + + {/* Coluna Total */} + + + {/* Coluna Percentual Total */} + + + ))} + +
- Descrição - - {mes} + {/* Container com coluna fixa e scroll horizontal */} +
+ {/* Coluna fixa - Descrição */} +
+ {/* Header fixo da descrição */} +
+
+ Descrição +
+
+ {/* Corpo da descrição com scroll vertical */} +
syncScroll('descricao')} + > + {hierarchicalData.map((row, index) => ( +
+
+
+ {renderCellContent(row)} +
+
+
+ ))} +
+
+ + {/* Parte com scroll - Valores */} +
+
syncScroll('valores')} + > + + {/* Table Header */} + + + {mesesDisponiveis.map((mes) => ( + + + + + ))} + - - ))} - - - - - - {/* Table Body */} - - {hierarchicalData.map((row, index) => ( - - ))} - -
+ {mes} + + % + + Total % - Total - - % -
+
handleRowClick(row, mes)} + title={ + row.valoresPorMes && row.valoresPorMes[mes] + ? formatCurrency(row.valoresPorMes[mes]) + : "-" + } + > + {row.valoresPorMes && row.valoresPorMes[mes] + ? (() => { + const { formatted, isNegative } = + formatCurrencyWithColor(row.valoresPorMes[mes]); + return ( + + {formatted} + + ); + })() + : "-"} + handleRowClick(row, mes)} + title={ + row.percentuaisPorMes && + row.percentuaisPorMes[mes] !== undefined + ? `${row.percentuaisPorMes[mes].toFixed(1)}%` + : "-" + } + > + {row.percentuaisPorMes && + row.percentuaisPorMes[mes] !== undefined + ? `${row.percentuaisPorMes[mes].toFixed(1)}%` + : "-"} + handleRowClick(row)} + title={row.total ? formatCurrency(row.total) : "-"} + > + {(() => { + const { formatted, isNegative } = formatCurrencyWithColor( + row.total! + ); + return ( + + {formatted} + + ); + })()} + handleRowClick(row)} + title={ + row.percentualTotal !== undefined + ? `${row.percentualTotal.toFixed(1)}%` + : "-" + } + > + {row.percentualTotal !== undefined + ? `${row.percentualTotal.toFixed(1)}%` + : "-"} +
+
+
)}