fix: adicionados as colunas

This commit is contained in:
Alessandro Gonçaalves 2025-10-20 18:45:09 -03:00
parent 4d566696e2
commit e160f66eb3
1 changed files with 82 additions and 50 deletions

View File

@ -110,18 +110,9 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
const columns = React.useMemo( const columns = React.useMemo(
() => [ () => [
{
accessorKey: "data_competencia",
header: "Data Comp.",
filterFn: "advancedText",
cell: ({ getValue }: { getValue: () => string }) => {
const value = getValue();
return new Date(value).toLocaleDateString("pt-BR");
},
},
{ {
accessorKey: "data_vencimento", accessorKey: "data_vencimento",
header: "Data Venc.", header: "Data de Vencimento",
filterFn: "advancedText", filterFn: "advancedText",
cell: ({ getValue }: { getValue: () => string }) => { cell: ({ getValue }: { getValue: () => string }) => {
const value = getValue(); const value = getValue();
@ -130,37 +121,47 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
}, },
{ {
accessorKey: "data_caixa", accessorKey: "data_caixa",
header: "Data Caixa", header: "Data de Caixa",
filterFn: "advancedText", filterFn: "advancedText",
cell: ({ getValue }: { getValue: () => string }) => { cell: ({ getValue }: { getValue: () => string }) => {
const value = getValue(); const value = getValue();
return new Date(value).toLocaleDateString("pt-BR"); return new Date(value).toLocaleDateString("pt-BR");
}, },
}, },
{
accessorKey: "entidade",
header: "Entidade",
filterFn: "advancedText",
cell: () => "-",
},
{ {
accessorKey: "codigo_fornecedor", accessorKey: "codigo_fornecedor",
header: "Cód. Fornec.", header: "Código do Fornecedor",
filterFn: "advancedText", filterFn: "advancedText",
}, },
{ {
accessorKey: "nome_fornecedor", accessorKey: "nome_fornecedor",
header: "Fornecedor", header: "Nome do Fornecedor",
filterFn: "advancedText", filterFn: "advancedText",
}, },
{ {
accessorKey: "codigo_centrocusto", accessorKey: "codigo_centrocusto",
header: "Cód. Centro", header: "Centro de Custo",
filterFn: "advancedText", filterFn: "advancedText",
}, },
{ {
accessorKey: "codigo_conta", accessorKey: "codigo_conta",
header: "Cód. Conta", header: "Código da Conta",
filterFn: "advancedText", filterFn: "advancedText",
}, },
{ accessorKey: "conta", header: "Conta", filterFn: "advancedText" }, {
accessorKey: "conta",
header: "Nome da Conta",
filterFn: "advancedText"
},
{ {
accessorKey: "valor", accessorKey: "valor",
header: "Valor", header: "Valor Realizado",
filterFn: "advancedText", filterFn: "advancedText",
cell: ({ getValue }: { getValue: () => number }) => { cell: ({ getValue }: { getValue: () => number }) => {
const value = getValue(); const value = getValue();
@ -176,6 +177,24 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
); );
}, },
}, },
{
accessorKey: "valor_previsto",
header: "Valor Previsto",
filterFn: "advancedText",
cell: () => "-",
},
{
accessorKey: "valor_confirmado",
header: "Valor Confirmado",
filterFn: "advancedText",
cell: () => "-",
},
{
accessorKey: "valor_pago",
header: "Valor Pago",
filterFn: "advancedText",
cell: () => "-",
},
{ {
accessorKey: "historico", accessorKey: "historico",
header: "Histórico", header: "Histórico",
@ -186,7 +205,12 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
header: "Histórico 2", header: "Histórico 2",
filterFn: "advancedText", filterFn: "advancedText",
}, },
{ accessorKey: "recnum", header: "Recnum", filterFn: "advancedText" }, {
accessorKey: "numero_lancamento",
header: "Número do Lançamento",
filterFn: "advancedText",
cell: () => "-",
},
], ],
[] []
); );
@ -444,27 +468,32 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
{/* Table Container */} {/* Table Container */}
<div className="bg-white rounded-xl shadow-lg border border-gray-200 overflow-x-auto"> <div className="bg-white rounded-xl shadow-lg border border-gray-200 overflow-x-auto">
<div className="min-w-[1200px]"> <div className="min-w-[2670px]">
{/* Table Header */} {/* Table Header */}
<div className="bg-gradient-to-r from-blue-50 to-indigo-50 border-b border-gray-200 sticky top-0 z-20"> <div className="bg-gradient-to-r from-blue-50 to-indigo-50 border-b border-gray-200 sticky top-0 z-20">
<div className="grid grid-cols-12 gap-4 px-4 py-3 text-xs font-semibold text-gray-700 uppercase tracking-wide"> <div className="flex items-center px-4 py-3 text-xs font-semibold text-gray-700 uppercase tracking-wide">
<div className="col-span-1">Data Comp.</div> <div className="w-[140px] whitespace-nowrap">Data de Vencimento</div>
<div className="col-span-1">Data Venc.</div> <div className="w-[120px] whitespace-nowrap">Data de Caixa</div>
<div className="col-span-1">Data Caixa</div> <div className="w-[100px] whitespace-nowrap">Entidade</div>
<div className="col-span-1">Cód. Fornec.</div> <div className="w-[160px] whitespace-nowrap">Código do Fornecedor</div>
<div className="col-span-2">Fornecedor</div> <div className="w-[220px] whitespace-nowrap">Nome do Fornecedor</div>
<div className="col-span-1">Cód. Centro</div> <div className="w-[140px] whitespace-nowrap">Centro de Custo</div>
<div className="col-span-1">Cód. Conta</div> <div className="w-[130px] whitespace-nowrap">Código da Conta</div>
<div className="col-span-1">Conta</div> <div className="w-[160px] whitespace-nowrap">Nome da Conta</div>
<div className="col-span-2 text-right">Valor</div> <div className="w-[130px] whitespace-nowrap text-right">Valor Realizado</div>
<div className="col-span-1">Recnum</div> <div className="w-[120px] whitespace-nowrap text-right">Valor Previsto</div>
<div className="w-[130px] whitespace-nowrap text-right">Valor Confirmado</div>
<div className="w-[110px] whitespace-nowrap text-right">Valor Pago</div>
<div className="w-[200px] whitespace-nowrap">Histórico</div>
<div className="w-[200px] whitespace-nowrap">Histórico 2</div>
<div className="w-[50px] whitespace-nowrap">Número do Lançamento</div>
</div> </div>
</div> </div>
{/* Table Body */} {/* Table Body */}
<div <div
ref={parentRef} ref={parentRef}
className="max-h-[500px] overflow-auto scrollbar-thin scrollbar-thumb-gray-300 scrollbar-track-gray-100 hover:scrollbar-thumb-gray-400" className="max-h-[250px] overflow-auto scrollbar-thin scrollbar-thumb-gray-300 scrollbar-track-gray-100 hover:scrollbar-thumb-gray-400"
style={{ style={{
scrollbarWidth: "thin", scrollbarWidth: "thin",
scrollbarColor: "#cbd5e0 #f7fafc", scrollbarColor: "#cbd5e0 #f7fafc",
@ -508,47 +537,43 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
return ( return (
<div <div
key={row.id} key={row.id}
className="absolute top-0 left-0 w-full grid grid-cols-12 gap-4 px-4 py-3 text-sm border-b border-gray-100 hover:bg-gray-50 transition-colors" className="absolute top-0 left-0 w-full flex items-center px-4 py-3 text-sm border-b border-gray-100 hover:bg-gray-50 transition-colors"
style={{ transform: `translateY(${virtualRow.start}px)` }} style={{ transform: `translateY(${virtualRow.start}px)` }}
> >
<div className="col-span-1 text-gray-600"> <div className="w-[140px] text-gray-600 whitespace-nowrap">
{new Date(
row.original.data_competencia
).toLocaleDateString("pt-BR")}
</div>
<div className="col-span-1 text-gray-600">
{new Date( {new Date(
row.original.data_vencimento row.original.data_vencimento
).toLocaleDateString("pt-BR")} ).toLocaleDateString("pt-BR")}
</div> </div>
<div className="col-span-1 text-gray-600"> <div className="w-[120px] text-gray-600 whitespace-nowrap">
{new Date(row.original.data_caixa).toLocaleDateString( {new Date(row.original.data_caixa).toLocaleDateString(
"pt-BR" "pt-BR"
)} )}
</div> </div>
<div className="col-span-1 font-medium text-gray-900"> <div className="w-[100px] text-gray-500 whitespace-nowrap">-</div>
<div className="w-[160px] font-medium text-gray-900 whitespace-nowrap">
{row.original.codigo_fornecedor} {row.original.codigo_fornecedor}
</div> </div>
<div <div
className="col-span-2 text-gray-700 truncate" className="w-[220px] text-gray-700 truncate"
title={row.original.nome_fornecedor} title={row.original.nome_fornecedor}
> >
{row.original.nome_fornecedor} {row.original.nome_fornecedor}
</div> </div>
<div className="col-span-1 text-gray-600"> <div className="w-[140px] text-gray-600 whitespace-nowrap">
{row.original.codigo_centrocusto} {row.original.codigo_centrocusto}
</div> </div>
<div className="col-span-1 text-gray-600"> <div className="w-[130px] text-gray-600 whitespace-nowrap">
{row.original.codigo_conta} {row.original.codigo_conta}
</div> </div>
<div <div
className="col-span-1 text-gray-700 truncate" className="w-[160px] text-gray-700 truncate"
title={row.original.conta} title={row.original.conta}
> >
{row.original.conta} {row.original.conta}
</div> </div>
<div <div
className={`col-span-2 text-right font-semibold whitespace-nowrap ${ className={`w-[130px] text-right font-semibold whitespace-nowrap ${
row.original.valor < 0 row.original.valor < 0
? "text-red-600" ? "text-red-600"
: "text-gray-900" : "text-gray-900"
@ -559,9 +584,16 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
currency: "BRL", currency: "BRL",
}).format(row.original.valor)} }).format(row.original.valor)}
</div> </div>
<div className="col-span-1 text-gray-500"> <div className="w-[120px] text-gray-500 text-right whitespace-nowrap">-</div>
{row.original.recnum} <div className="w-[130px] text-gray-500 text-right whitespace-nowrap">-</div>
<div className="w-[110px] text-gray-500 text-right whitespace-nowrap">-</div>
<div className="w-[200px] text-gray-700 truncate" title={row.original.historico}>
{row.original.historico}
</div> </div>
<div className="w-[200px] text-gray-700 truncate" title={row.original.historico2}>
{row.original.historico2}
</div>
<div className="w-[50px] text-gray-500 whitespace-nowrap">-</div>
</div> </div>
); );
})} })}