From 69a66a6cab60c03ebf9ace41c5910881df7c4a97 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Alessandro=20Gon=C3=A7aalves?= Date: Tue, 21 Oct 2025 17:28:50 -0300 Subject: [PATCH] fix: ajuste nos filtros gerais --- package-lock.json | 31 +++++ package.json | 1 + src/app/DRE/teste.tsx | 206 ++++++++++++++++++++++++++------- src/components/ui/checkbox.tsx | 30 +++++ 4 files changed, 225 insertions(+), 43 deletions(-) create mode 100644 src/components/ui/checkbox.tsx diff --git a/package-lock.json b/package-lock.json index 7e99986..ec0efb7 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,6 +8,7 @@ "name": "dre-gerencial", "version": "0.1.0", "dependencies": { + "@radix-ui/react-checkbox": "^1.3.3", "@radix-ui/react-dialog": "^1.1.15", "@radix-ui/react-label": "^2.1.7", "@radix-ui/react-select": "^2.2.6", @@ -1536,6 +1537,36 @@ } } }, + "node_modules/@radix-ui/react-checkbox": { + "version": "1.3.3", + "resolved": "https://registry.npmjs.org/@radix-ui/react-checkbox/-/react-checkbox-1.3.3.tgz", + "integrity": "sha512-wBbpv+NQftHDdG86Qc0pIyXk5IR3tM8Vd0nWLKDcX8nNn4nXFOFwsKuqw2okA/1D/mpaAkmuyndrPJTYDNZtFw==", + "license": "MIT", + "dependencies": { + "@radix-ui/primitive": "1.1.3", + "@radix-ui/react-compose-refs": "1.1.2", + "@radix-ui/react-context": "1.1.2", + "@radix-ui/react-presence": "1.1.5", + "@radix-ui/react-primitive": "2.1.3", + "@radix-ui/react-use-controllable-state": "1.2.2", + "@radix-ui/react-use-previous": "1.1.1", + "@radix-ui/react-use-size": "1.1.1" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, "node_modules/@radix-ui/react-collection": { "version": "1.1.7", "resolved": "https://registry.npmjs.org/@radix-ui/react-collection/-/react-collection-1.1.7.tgz", diff --git a/package.json b/package.json index a5a9ebb..e9dd4d8 100644 --- a/package.json +++ b/package.json @@ -9,6 +9,7 @@ "lint": "eslint" }, "dependencies": { + "@radix-ui/react-checkbox": "^1.3.3", "@radix-ui/react-dialog": "^1.1.15", "@radix-ui/react-label": "^2.1.7", "@radix-ui/react-select": "^2.2.6", diff --git a/src/app/DRE/teste.tsx b/src/app/DRE/teste.tsx index f3fd760..82daec0 100644 --- a/src/app/DRE/teste.tsx +++ b/src/app/DRE/teste.tsx @@ -6,6 +6,7 @@ import AnaliticoComponent from "./analitico"; import { Button } from "@/components/ui/button"; import { Input } from "@/components/ui/input"; import { Label } from "@/components/ui/label"; +import { Checkbox } from "@/components/ui/checkbox"; import { Sheet, SheetContent, @@ -77,6 +78,10 @@ export default function Teste() { valorMax: "", buscaTextual: "" }); + + // Estados para multi-seleção + const [centrosCustoSelecionados, setCentrosCustoSelecionados] = useState([]); + const [contasSelecionadas, setContasSelecionadas] = useState([]); const [isFilterOpen, setIsFilterOpen] = useState(false); const [dadosFiltrados, setDadosFiltrados] = useState([]); const [filtrosAplicados, setFiltrosAplicados] = useState(false); @@ -144,6 +149,10 @@ export default function Teste() { const contasUnicas = [...new Set(dadosCompletos.map((item: DREItem) => item.conta))].sort() as string[]; setOpcoesContas(contasUnicas); + // Inicializar com todos os itens selecionados + setCentrosCustoSelecionados(centrosCustoUnicos); + setContasSelecionadas(contasUnicas); + } catch (error) { console.error("Erro ao carregar períodos:", error); } @@ -304,6 +313,43 @@ export default function Teste() { })); }; + // Funções para multi-seleção + const toggleCentroCusto = (centro: string) => { + setCentrosCustoSelecionados(prev => { + if (prev.includes(centro)) { + return prev.filter(c => c !== centro); + } else { + return [...prev, centro]; + } + }); + }; + + const toggleConta = (conta: string) => { + setContasSelecionadas(prev => { + if (prev.includes(conta)) { + return prev.filter(c => c !== conta); + } else { + return [...prev, conta]; + } + }); + }; + + const selecionarTodosCentros = () => { + setCentrosCustoSelecionados(opcoesCentrosCusto); + }; + + const limparCentros = () => { + setCentrosCustoSelecionados([]); + }; + + const selecionarTodasContas = () => { + setContasSelecionadas(opcoesContas); + }; + + const limparContas = () => { + setContasSelecionadas([]); + }; + const limparFiltros = () => { const agora = new Date(); const anoAtual = agora.getFullYear(); @@ -322,11 +368,18 @@ export default function Teste() { buscaTextual: "" }); + // Limpar multi-seleções + setCentrosCustoSelecionados([]); + setContasSelecionadas([]); + // Limpar dados da tabela setData([]); setDadosFiltrados([]); setFiltrosAplicados(false); setMesesDisponiveis([]); + + // Recarregar opções e selecionar todos novamente + carregarPeriodosDisponiveis(); }; const aplicarFiltros = async () => { @@ -372,17 +425,17 @@ export default function Teste() { ); } - // Filtro por centro de custo - if (filtros.centroCusto !== "Todos") { + // Filtro por centro de custo (multi-seleção) + if (centrosCustoSelecionados.length > 0) { dadosFiltrados = dadosFiltrados.filter((item: DREItem) => - item.centro_custo === filtros.centroCusto + centrosCustoSelecionados.includes(item.centro_custo) ); } - // Filtro por conta - if (filtros.conta !== "Todas") { + // Filtro por conta (multi-seleção) + if (contasSelecionadas.length > 0) { dadosFiltrados = dadosFiltrados.filter((item: DREItem) => - item.conta === filtros.conta + contasSelecionadas.includes(item.conta) ); } @@ -496,10 +549,10 @@ export default function Teste() { // Agrupar por grupo const grupos = data.reduce((acc, item) => { - if (!acc[item.grupo]) { - acc[item.grupo] = []; - } - acc[item.grupo].push(item); + if (!acc[item.grupo]) { + acc[item.grupo] = []; + } + acc[item.grupo].push(item); return acc; }, {} as Record); @@ -739,7 +792,8 @@ export default function Teste() { {row.grupo} {isCalculado && ( - ⚡ + // ⚡ + <> )} @@ -818,7 +872,7 @@ export default function Teste() { const hierarchicalData = buildHierarchicalData(); - return ( + return (
{/* Header Section */}
@@ -829,8 +883,8 @@ export default function Teste() {

Demonstração do Resultado do Exercício

-
+ {/* Botão de Filtro */} @@ -865,7 +919,7 @@ export default function Teste() { ))} - +
-
+ @@ -914,37 +968,103 @@ export default function Teste() { */} - {/* Centro de Custo + {/* Centro de Custo */}
- - -
*/} +
+ +
+ + +
+
+
+ {opcoesCentrosCusto.map(centro => ( +
+ toggleCentroCusto(centro)} + /> + +
+ ))} +
+ {centrosCustoSelecionados.length > 0 && ( +
+ {centrosCustoSelecionados.length} centro(s) selecionado(s) +
+ )} + - {/* Conta + {/* Conta */}
- - -
*/} +
+ +
+ + +
+
+
+ {opcoesContas.map(conta => ( +
+ toggleConta(conta)} + /> + +
+ ))} +
+ {contasSelecionadas.length > 0 && ( +
+ {contasSelecionadas.length} conta(s) selecionada(s) +
+ )} + {/* Valor
diff --git a/src/components/ui/checkbox.tsx b/src/components/ui/checkbox.tsx new file mode 100644 index 0000000..df61a13 --- /dev/null +++ b/src/components/ui/checkbox.tsx @@ -0,0 +1,30 @@ +"use client" + +import * as React from "react" +import * as CheckboxPrimitive from "@radix-ui/react-checkbox" +import { Check } from "lucide-react" + +import { cn } from "@/lib/utils" + +const Checkbox = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + + + + + +)) +Checkbox.displayName = CheckboxPrimitive.Root.displayName + +export { Checkbox }