feat: Ajout persistence des filtres sur page staff/payslips
This commit is contained in:
parent
64299cd9a5
commit
ab61fb1852
1 changed files with 55 additions and 12 deletions
|
|
@ -147,20 +147,45 @@ export default function PayslipsGrid({ initialData, activeOrgId }: { initialData
|
|||
// Selection state
|
||||
const [selectedPayslipIds, setSelectedPayslipIds] = useState<Set<string>>(new Set());
|
||||
|
||||
// filters / sorting / pagination
|
||||
const [q, setQ] = useState("");
|
||||
const [structureFilter, setStructureFilter] = useState<string | null>(null);
|
||||
const [typeFilter, setTypeFilter] = useState<string | null>(null);
|
||||
const [processedFilter, setProcessedFilter] = useState<string | null>(null);
|
||||
const [transferFilter, setTransferFilter] = useState<string | null>(null);
|
||||
const [aemFilter, setAemFilter] = useState<string | null>(null);
|
||||
const [periodFrom, setPeriodFrom] = useState<string | null>(null);
|
||||
const [periodTo, setPeriodTo] = useState<string | null>(null);
|
||||
const [sortField, setSortField] = useState<string>("period_start");
|
||||
const [sortOrder, setSortOrder] = useState<'asc'|'desc'>('desc');
|
||||
// Key for localStorage
|
||||
const FILTERS_STORAGE_KEY = 'staff-payslips-filters';
|
||||
|
||||
// Helper functions for localStorage
|
||||
const saveFiltersToStorage = (filters: any) => {
|
||||
try {
|
||||
localStorage.setItem(FILTERS_STORAGE_KEY, JSON.stringify(filters));
|
||||
} catch (error) {
|
||||
console.warn('Failed to save filters to localStorage:', error);
|
||||
}
|
||||
};
|
||||
|
||||
const loadFiltersFromStorage = () => {
|
||||
try {
|
||||
const saved = localStorage.getItem(FILTERS_STORAGE_KEY);
|
||||
return saved ? JSON.parse(saved) : null;
|
||||
} catch (error) {
|
||||
console.warn('Failed to load filters from localStorage:', error);
|
||||
return null;
|
||||
}
|
||||
};
|
||||
|
||||
// Load saved filters or use defaults
|
||||
const savedFilters = loadFiltersFromStorage();
|
||||
|
||||
// filters / sorting / pagination - with localStorage persistence
|
||||
const [q, setQ] = useState(savedFilters?.q || "");
|
||||
const [structureFilter, setStructureFilter] = useState<string | null>(savedFilters?.structureFilter || null);
|
||||
const [typeFilter, setTypeFilter] = useState<string | null>(savedFilters?.typeFilter || null);
|
||||
const [processedFilter, setProcessedFilter] = useState<string | null>(savedFilters?.processedFilter || null);
|
||||
const [transferFilter, setTransferFilter] = useState<string | null>(savedFilters?.transferFilter || null);
|
||||
const [aemFilter, setAemFilter] = useState<string | null>(savedFilters?.aemFilter || null);
|
||||
const [periodFrom, setPeriodFrom] = useState<string | null>(savedFilters?.periodFrom || null);
|
||||
const [periodTo, setPeriodTo] = useState<string | null>(savedFilters?.periodTo || null);
|
||||
const [sortField, setSortField] = useState<string>(savedFilters?.sortField || "period_start");
|
||||
const [sortOrder, setSortOrder] = useState<'asc'|'desc'>(savedFilters?.sortOrder || 'desc');
|
||||
const [page, setPage] = useState(0);
|
||||
const [limit, setLimit] = useState(50);
|
||||
const [showFilters, setShowFilters] = useState(false);
|
||||
const [showFilters, setShowFilters] = useState(savedFilters?.showFilters || false);
|
||||
const totalCountRef = useRef<number | null>(null);
|
||||
|
||||
// Selection helpers
|
||||
|
|
@ -200,6 +225,24 @@ export default function PayslipsGrid({ initialData, activeOrgId }: { initialData
|
|||
const [preselectedContractId, setPreselectedContractId] = useState<string | null>(null);
|
||||
const isFirstRender = useRef(true);
|
||||
|
||||
// Save filters to localStorage whenever they change
|
||||
useEffect(() => {
|
||||
const filters = {
|
||||
q,
|
||||
structureFilter,
|
||||
typeFilter,
|
||||
processedFilter,
|
||||
transferFilter,
|
||||
aemFilter,
|
||||
periodFrom,
|
||||
periodTo,
|
||||
sortField,
|
||||
sortOrder,
|
||||
showFilters
|
||||
};
|
||||
saveFiltersToStorage(filters);
|
||||
}, [q, structureFilter, typeFilter, processedFilter, transferFilter, aemFilter, periodFrom, periodTo, sortField, sortOrder, showFilters]);
|
||||
|
||||
// Fetch initial au montage du composant
|
||||
useEffect(() => {
|
||||
fetchServer(0);
|
||||
|
|
|
|||
Loading…
Reference in a new issue