advanced stats filtering

This commit is contained in:
Dobromir Popov
2024-05-12 20:18:48 +03:00
parent ef694227c7
commit 8777dca8e5

View File

@ -16,6 +16,7 @@ function ContactsPage({ allPublishers }) {
const [selectedMonth, setSelectedMonth] = useState(currentMonth + 1);
const isMounted = useRef(false);
const [searchQuery, setSearchQuery] = useState('');
const [publisherType, setPublisherType] = useState('');
const [publishers, setPublishers] = useState(allPublishers);
@ -35,12 +36,47 @@ function ContactsPage({ allPublishers }) {
});
const [hideEmptyFields, setHideEmptyFields] = useState({
availability: false,
assignments: false,
availability: 'off', // 'on', 'off', 'onlyEmpty'
assignments: 'off', // 'on', 'off', 'onlyEmpty'
lastLogin: false,
notifiications: false
});
const availabilityRef = useRef(null);
const assignmentsRef = useRef(null);
useEffect(() => {
if (availabilityRef.current) {
availabilityRef.current.indeterminate = hideEmptyFields.availability === 'off';
}
}, [hideEmptyFields.availability]);
useEffect(() => {
if (assignmentsRef.current) {
assignmentsRef.current.indeterminate = hideEmptyFields.assignments === 'off';
}
}, [hideEmptyFields.assignments]);
const getCheckboxState = (field) => {
switch (hideEmptyFields[field]) {
case 'on':
return true;
case 'onlyEmpty':
return false;
default:
return undefined; // this will be used to set indeterminate
}
};
const getCheckboxTooltip = (field, label) => {
switch (hideEmptyFields[field]) {
case 'on':
return 'Само със ' + label;
case 'onlyEmpty':
return 'Само без ' + label;
default:
return 'Всички ' + label;
}
}
function handleSort(field) {
const order = sortField === field && sortOrder === 'asc' ? 'desc' : 'asc';
setSortField(field);
@ -54,8 +90,12 @@ function ContactsPage({ allPublishers }) {
publisher.email.toLowerCase().includes(searchQuery.toLowerCase()) ||
(publisher.phone?.toLowerCase().includes(searchQuery.toLowerCase())))
&& (publisherType ? publisher.type === publisherType : true)
&& (!hideEmptyFields.availability || publisher.currentMonthAvailabilityDaysCount > 0)
&& (!hideEmptyFields.assignments || publisher.currentMonthAssignments > 0)
// && (!hideEmptyFields.availability || publisher.currentMonthAvailabilityDaysCount > 0)
// && (!hideEmptyFields.assignments || publisher.currentMonthAssignments > 0)
&& (hideEmptyFields.availability === 'on' ? publisher.currentMonthAvailabilityDaysCount > 0 :
hideEmptyFields.availability === 'onlyEmpty' ? !publisher.currentMonthAvailabilityDaysCount || publisher.currentMonthAvailabilityDaysCount === 0 : true)
&& (hideEmptyFields.assignments === 'on' ? publisher.currentMonthAssignments > 0 :
hideEmptyFields.assignments === 'onlyEmpty' ? publisher.currentMonthAssignments === 0 : true)
&& (!hideEmptyFields.lastLogin || publisher.lastLogin)
&& (!hideEmptyFields.notifiications || publisher.isPushActive)
);
@ -155,9 +195,13 @@ function ContactsPage({ allPublishers }) {
</p>
<input
type="checkbox" className='ml-2'
checked={hideEmptyFields.availability}
onChange={() => setHideEmptyFields({ ...hideEmptyFields, availability: !hideEmptyFields.availability })}
title="Скрий редове без възможности"
ref={availabilityRef}
checked={getCheckboxState('availability') ?? false}
onChange={() => {
const newState = hideEmptyFields.availability === 'on' ? 'onlyEmpty' : (hideEmptyFields.availability === 'onlyEmpty' ? 'off' : 'on');
setHideEmptyFields({ ...hideEmptyFields, availability: newState });
}}
title={getCheckboxTooltip('availability', "възможности")}
/>
</th>
<th className="border-b font-medium p-4 pt-0 pb-3 cursor-pointer" >
@ -166,9 +210,13 @@ function ContactsPage({ allPublishers }) {
</p>
<input
type="checkbox" className='ml-2'
checked={hideEmptyFields.assignments}
onChange={() => setHideEmptyFields({ ...hideEmptyFields, assignments: !hideEmptyFields.assignments })}
title="Скрий редове без участия"
ref={assignmentsRef}
checked={getCheckboxState('assignments') ?? false}
onChange={() => {
const newState = hideEmptyFields.assignments === 'on' ? 'onlyEmpty' : (hideEmptyFields.assignments === 'onlyEmpty' ? 'off' : 'on');
setHideEmptyFields({ ...hideEmptyFields, assignments: newState });
}}
title={getCheckboxTooltip('assignments', "участия")}
/>
</th>
<th className="border-b font-medium p-4 pt-0 pb-3 cursor-pointer" >