fix: correção de dados do filtro customizado
This commit is contained in:
parent
d60051d5dc
commit
bf38e52f72
|
|
@ -83,6 +83,7 @@ interface AnaliticoProps {
|
|||
interface ExcelFilterProps {
|
||||
column: GridColDef;
|
||||
data: any[];
|
||||
filteredData: any[]; // Dados filtrados para mostrar apenas valores disponíveis
|
||||
onFilterChange: (field: string, values: string[]) => void;
|
||||
onSortChange: (field: string, direction: 'asc' | 'desc' | null) => void;
|
||||
currentFilter?: string[];
|
||||
|
|
@ -92,6 +93,7 @@ interface ExcelFilterProps {
|
|||
const ExcelFilter: React.FC<ExcelFilterProps> = ({
|
||||
column,
|
||||
data,
|
||||
filteredData,
|
||||
onFilterChange,
|
||||
onSortChange,
|
||||
currentFilter = [],
|
||||
|
|
@ -102,9 +104,9 @@ const ExcelFilter: React.FC<ExcelFilterProps> = ({
|
|||
const [selectedValues, setSelectedValues] = React.useState<string[]>(currentFilter);
|
||||
const [selectAll, setSelectAll] = React.useState(false);
|
||||
|
||||
// Obter valores únicos da coluna
|
||||
// Obter valores únicos da coluna baseado nos dados filtrados
|
||||
const uniqueValues = React.useMemo(() => {
|
||||
const values = data
|
||||
const values = filteredData
|
||||
.map((row) => {
|
||||
const value = row[column.field];
|
||||
if (value === null || value === undefined) return "";
|
||||
|
|
@ -114,7 +116,7 @@ const ExcelFilter: React.FC<ExcelFilterProps> = ({
|
|||
.sort();
|
||||
|
||||
return values;
|
||||
}, [data, column.field]);
|
||||
}, [filteredData, column.field]);
|
||||
|
||||
// Filtrar valores baseado na busca
|
||||
const filteredValues = React.useMemo(() => {
|
||||
|
|
@ -401,6 +403,25 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
|
|||
fetchData();
|
||||
}, [fetchData]);
|
||||
|
||||
// Filtrar dados baseado nos filtros de coluna
|
||||
const filteredData = React.useMemo(() => {
|
||||
if (!data || data.length === 0) return data;
|
||||
|
||||
return data.filter((row) => {
|
||||
return Object.entries(columnFilters).every(([field, filterValues]) => {
|
||||
if (!filterValues || filterValues.length === 0) return true;
|
||||
|
||||
const cellValue = (row as any)[field];
|
||||
const stringValue = cellValue === null || cellValue === undefined ? "" : String(cellValue);
|
||||
|
||||
return filterValues.includes(stringValue);
|
||||
});
|
||||
}).map((row, index) => ({
|
||||
...row,
|
||||
id: `filtered-${row.id || row.recnum || index}` // Garantir ID único e estável
|
||||
}));
|
||||
}, [data, columnFilters]);
|
||||
|
||||
// Definir colunas do DataGridPro
|
||||
const columns = React.useMemo(() => {
|
||||
const baseColumns = [
|
||||
|
|
@ -611,6 +632,7 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
|
|||
<ExcelFilter
|
||||
column={col}
|
||||
data={data}
|
||||
filteredData={filteredData}
|
||||
onFilterChange={handleColumnFilterChange}
|
||||
onSortChange={handleColumnSortChange}
|
||||
currentFilter={columnFilters[col.field] || []}
|
||||
|
|
@ -620,26 +642,7 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
|
|||
</div>
|
||||
),
|
||||
}));
|
||||
}, [data, columnFilters, columnSorts, handleColumnFilterChange, handleColumnSortChange]);
|
||||
|
||||
// Filtrar dados baseado nos filtros de coluna
|
||||
const filteredData = React.useMemo(() => {
|
||||
if (!data || data.length === 0) return data;
|
||||
|
||||
return data.filter((row) => {
|
||||
return Object.entries(columnFilters).every(([field, filterValues]) => {
|
||||
if (!filterValues || filterValues.length === 0) return true;
|
||||
|
||||
const cellValue = (row as any)[field];
|
||||
const stringValue = cellValue === null || cellValue === undefined ? "" : String(cellValue);
|
||||
|
||||
return filterValues.includes(stringValue);
|
||||
});
|
||||
}).map((row, index) => ({
|
||||
...row,
|
||||
id: `filtered-${row.id || row.recnum || index}` // Garantir ID único e estável
|
||||
}));
|
||||
}, [data, columnFilters]);
|
||||
}, [data, filteredData, columnFilters, columnSorts, handleColumnFilterChange, handleColumnSortChange]);
|
||||
|
||||
// Ordenar dados baseado na ordenação de coluna
|
||||
const sortedAndFilteredData = React.useMemo(() => {
|
||||
|
|
@ -669,6 +672,43 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
|
|||
return sortedAndFilteredData.reduce((sum, item) => sum + (Number(item.valor) || 0), 0);
|
||||
}, [sortedAndFilteredData]);
|
||||
|
||||
// Limpar filtros de colunas que não têm mais valores disponíveis
|
||||
React.useEffect(() => {
|
||||
const updatedFilters = { ...columnFilters };
|
||||
let hasChanges = false;
|
||||
|
||||
Object.keys(columnFilters).forEach(field => {
|
||||
const currentFilterValues = columnFilters[field] || [];
|
||||
if (currentFilterValues.length === 0) return;
|
||||
|
||||
// Obter valores únicos disponíveis para esta coluna nos dados filtrados
|
||||
const availableValues = filteredData
|
||||
.map(row => {
|
||||
const value = (row as any)[field];
|
||||
return value === null || value === undefined ? "" : String(value);
|
||||
})
|
||||
.filter((value, index, self) => self.indexOf(value) === index && value !== "");
|
||||
|
||||
// Filtrar apenas os valores que ainda estão disponíveis
|
||||
const validFilterValues = currentFilterValues.filter(value =>
|
||||
availableValues.includes(value)
|
||||
);
|
||||
|
||||
if (validFilterValues.length !== currentFilterValues.length) {
|
||||
if (validFilterValues.length === 0) {
|
||||
delete updatedFilters[field];
|
||||
} else {
|
||||
updatedFilters[field] = validFilterValues;
|
||||
}
|
||||
hasChanges = true;
|
||||
}
|
||||
});
|
||||
|
||||
if (hasChanges) {
|
||||
setColumnFilters(updatedFilters);
|
||||
}
|
||||
}, [filteredData, columnFilters]);
|
||||
|
||||
// Exportação XLSX
|
||||
const exportToExcel = () => {
|
||||
if (sortedAndFilteredData.length === 0) return;
|
||||
|
|
|
|||
Loading…
Reference in New Issue