popov/mwitnessing
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

implement stats null filters in column headers

Browse Source
This commit is contained in:
Dobromir Popov
2024-05-12 17:25:35 +03:00
parent 8e69e3b933
commit 163e1e1167
1 changed files with 42 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
pages/cart/publishers/stats.tsx
View File

@ -13,7 +13,7 @@ import { set } from 'date-fns';
function ContactsPage({ allPublishers }) {
const currentMonth = new Date().getMonth();
const [selectedMonth, setSelectedMonth] = useState("");
const [selectedMonth, setSelectedMonth] = useState(currentMonth + 1);
const isMounted = useRef(false);
const [searchQuery, setSearchQuery] = useState('');
@ -33,9 +33,12 @@ function ContactsPage({ allPublishers }) {
index: monthIndex + 1
};
});
const datesOn15th = Array.from({ length: 7 }, (_, i) => new Date(new Date().getFullYear(), new Date().getMonth() - 3 + i, 15))
.map(date => date.toISOString().split('T')[0]);
const [hideEmptyFields, setHideEmptyFields] = useState({
availability: false,
assignments: false,
lastLogin: false
});
function handleSort(field) {
const order = sortField === field && sortOrder === 'asc' ? 'desc' : 'asc';
@ -48,8 +51,11 @@ function ContactsPage({ allPublishers }) {
(publisher.firstName.toLowerCase().includes(searchQuery.toLowerCase()) ||
publisher.lastName.toLowerCase().includes(searchQuery.toLowerCase()) ||
publisher.email.toLowerCase().includes(searchQuery.toLowerCase()) ||
(publisher.phone?.toLowerCase().includes(searchQuery.toLowerCase()))) &&
(publisherType ? publisher.type === publisherType : true)
(publisher.phone?.toLowerCase().includes(searchQuery.toLowerCase())))
&& (publisherType ? publisher.type === publisherType : true)
&& (!hideEmptyFields.availability || publisher.currentMonthAvailabilityDaysCount > 0)
&& (!hideEmptyFields.assignments || publisher.currentMonthAssignments > 0)
&& (!hideEmptyFields.lastLogin || publisher.lastLogin)
);
if (sortField) {
@ -68,7 +74,7 @@ function ContactsPage({ allPublishers }) {
}
setFilteredPublishers(filtered);
setPubWithAssignmentsCount(filtered.filter(publisher => publisher.currentMonthAvailabilityHoursCount && publisher.currentMonthAvailabilityHoursCount > 0).length);
}, [searchQuery, publisherType, sortField, sortOrder, allPublishers]);
}, [searchQuery, publisherType, sortField, sortOrder, allPublishers, hideEmptyFields]);
useEffect(() => {
if (isMounted.current) {
@ -141,14 +147,38 @@ function ContactsPage({ allPublishers }) {
<th className="border-b font-medium p-4 pl-8 pt-0 pb-3 cursor-pointer" onClick={() => handleSort('name')}>
Име{renderSortArrow('name')}
</th>
<th className="border-b font-medium p-4 pt-0 pb-3 cursor-pointer" onClick={() => handleSort('currentMonthAvailabilityDaysCount')}>
Възможности{renderSortArrow('currentMonthAvailabilityDaysCount')}
<th className="border-b font-medium p-4 pt-0 pb-3 cursor-pointer" >
<p className="inline-block" onClick={() => handleSort('currentMonthAvailabilityDaysCount')}>
Възможности{renderSortArrow('currentMonthAvailabilityDaysCount')}
</p>
<input
type="checkbox" className='ml-2'
checked={hideEmptyFields.availability}
onChange={() => setHideEmptyFields({ ...hideEmptyFields, availability: !hideEmptyFields.availability })}
title="Скрий редове без възможности"
/>
</th>
<th className="border-b font-medium p-4 pt-0 pb-3 cursor-pointer" onClick={() => handleSort('currentMonthAssignments')}>
Участия{renderSortArrow('currentMonthAssignments')}
<th className="border-b font-medium p-4 pt-0 pb-3 cursor-pointer" >
<p className="inline-block" onClick={() => handleSort('currentMonthAssignments')}>
Участия{renderSortArrow('currentMonthAssignments')}
</p>
<input
type="checkbox" className='ml-2'
checked={hideEmptyFields.assignments}
onChange={() => setHideEmptyFields({ ...hideEmptyFields, assignments: !hideEmptyFields.assignments })}
title="Скрий редове без участия"
/>
</th>
<th className="border-b font-medium p-4 pt-0 pb-3 cursor-pointer" onClick={() => handleSort('lastLogin')}>
Последно влизане{renderSortArrow('lastLogin')}
<th className="border-b font-medium p-4 pt-0 pb-3 cursor-pointer" >
<p className="inline-block" onClick={() => handleSort('lastLogin')}>
Последно влизане{renderSortArrow('lastLogin')}
</p>
<input
type="checkbox" className='ml-2'
checked={hideEmptyFields.lastLogin}
onChange={() => setHideEmptyFields({ ...hideEmptyFields, lastLogin: !hideEmptyFields.lastLogin })}
title="Скрий редове без последно влизане"
/>
</th>
</tr>
</thead>