Add leeftijdfilter in directie page
Some checks failed
Build, Push & Deploy / Build & Push image (push) Failing after 55s
Build, Push & Deploy / Deploy naar VPS (push) Has been skipped
Build & Push / Build & Push image (push) Successful in 40s

This commit is contained in:
2026-02-28 11:00:55 +01:00
parent 6f7a35a262
commit db87ea447a

View File

@@ -301,6 +301,20 @@
<label>Zoeken</label> <label>Zoeken</label>
<input type="text" id="filterSearch" placeholder="Code of beschrijving..." oninput="applyFilters()"> <input type="text" id="filterSearch" placeholder="Code of beschrijving..." oninput="applyFilters()">
</div> </div>
<div class="filter-group" style="min-width:unset;">
<label>Leeftijd</label>
<div style="display:flex;flex-wrap:wrap;gap:.3rem;">
<label class="leeftijd-checkbox"><input type="checkbox" value="3-4" onchange="applyFilters()"><span>3-4</span></label>
<label class="leeftijd-checkbox"><input type="checkbox" value="4-5" onchange="applyFilters()"><span>4-5</span></label>
<label class="leeftijd-checkbox"><input type="checkbox" value="5-6" onchange="applyFilters()"><span>5-6</span></label>
<label class="leeftijd-checkbox"><input type="checkbox" value="6-7" onchange="applyFilters()"><span>6-7</span></label>
<label class="leeftijd-checkbox"><input type="checkbox" value="7-8" onchange="applyFilters()"><span>7-8</span></label>
<label class="leeftijd-checkbox"><input type="checkbox" value="8-9" onchange="applyFilters()"><span>8-9</span></label>
<label class="leeftijd-checkbox"><input type="checkbox" value="9-10" onchange="applyFilters()"><span>9-10</span></label>
<label class="leeftijd-checkbox"><input type="checkbox" value="10-11" onchange="applyFilters()"><span>10-11</span></label>
<label class="leeftijd-checkbox"><input type="checkbox" value="11-12" onchange="applyFilters()"><span>11-12</span></label>
</div>
</div>
</div> </div>
<div class="table-scroll"> <div class="table-scroll">
@@ -515,6 +529,7 @@ function applyFilters() {
const teacherFilter = document.getElementById('filterTeacher').value; const teacherFilter = document.getElementById('filterTeacher').value;
const statusFilter = document.getElementById('filterStatus').value; const statusFilter = document.getElementById('filterStatus').value;
const search = document.getElementById('filterSearch').value.toLowerCase(); const search = document.getElementById('filterSearch').value.toLowerCase();
const leeftijdFilter = [...document.querySelectorAll('.leeftijd-checkbox input:checked')].map(cb => cb.value);
const shownTeachers = teacherFilter === 'all' const shownTeachers = teacherFilter === 'all'
? overviewData.teachers ? overviewData.teachers
@@ -535,6 +550,7 @@ function applyFilters() {
shownVakken.forEach(vakId => { shownVakken.forEach(vakId => {
(allGoals[vakId] || []).forEach(goal => { (allGoals[vakId] || []).forEach(goal => {
if (search && !`${goal.goNr} ${goal.inhoud}`.toLowerCase().includes(search)) return; if (search && !`${goal.goNr} ${goal.inhoud}`.toLowerCase().includes(search)) return;
if (leeftijdFilter.length > 0 && !leeftijdFilter.some(l => (goal.leeftijden||[]).includes(l))) return;
const statussen = shownTeachers.map(t => { const statussen = shownTeachers.map(t => {
return overviewData.assessments_by_teacher[t.id]?.[vakId]?.[goal.id] || ''; return overviewData.assessments_by_teacher[t.id]?.[vakId]?.[goal.id] || '';