From 3bb75c56158cecf9c4ffa780975c2c83bffc4169 Mon Sep 17 00:00:00 2001
From: Konrad du Plessis <konradzar@gmail.com>
Date: Tue, 24 Mar 2026 22:57:14 +0200
Subject: [PATCH] Replace loan checkbox with 3-option dropdown on pending table

Loans filter now offers: All Workers / With loans only / Without loans.
Replaces the simpler exclude-only checkbox for more flexibility.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 core/templates/core/payroll_dashboard.html | 20 +++++++++++++-------
 1 file changed, 13 insertions(+), 7 deletions(-)

diff --git a/core/templates/core/payroll_dashboard.html b/core/templates/core/payroll_dashboard.html
index 60312f5..0cc8987 100644
--- a/core/templates/core/payroll_dashboard.html
+++ b/core/templates/core/payroll_dashboard.html
@@ -233,9 +233,13 @@
             <input type="checkbox" class="form-check-input" id="pendingOverdueOnly">
             <label class="form-check-label text-muted small" for="pendingOverdueOnly">Overdue only</label>
         </div>
-        <div class="form-check mb-0">
-            <input type="checkbox" class="form-check-input" id="pendingExcludeLoans">
-            <label class="form-check-label text-muted small" for="pendingExcludeLoans">Exclude workers with loans</label>
+        <div class="d-flex align-items-center gap-2">
+            <label class="text-muted small mb-0" for="pendingLoanFilter">Loans:</label>
+            <select id="pendingLoanFilter" class="form-select form-select-sm" style="width: auto;">
+                <option value="">All Workers</option>
+                <option value="with">With loans only</option>
+                <option value="without">Without loans</option>
+            </select>
         </div>
     </div>
 
@@ -802,25 +806,27 @@ document.addEventListener('DOMContentLoaded', function() {
     var pendingTable = document.getElementById('pendingTable');
     var pendingTeamFilter = document.getElementById('pendingTeamFilter');
     var pendingOverdueOnly = document.getElementById('pendingOverdueOnly');
-    var pendingExcludeLoans = document.getElementById('pendingExcludeLoans');
+    var pendingLoanFilter = document.getElementById('pendingLoanFilter');
 
     if (pendingTable && pendingTeamFilter) {
         function applyPendingFilters() {
             var team = pendingTeamFilter.value;
             var overdueOnly = pendingOverdueOnly ? pendingOverdueOnly.checked : false;
-            var excludeLoans = pendingExcludeLoans ? pendingExcludeLoans.checked : false;
+            var loanMode = pendingLoanFilter ? pendingLoanFilter.value : '';
             var rows = pendingTable.querySelectorAll('tbody tr[data-team]');
             for (var i = 0; i < rows.length; i++) {
                 var row = rows[i];
                 var teamMatch = !team || row.dataset.team === team;
                 var overdueMatch = !overdueOnly || row.dataset.overdue === 'true';
-                var loanMatch = !excludeLoans || row.dataset.hasLoan !== 'true';
+                var loanMatch = !loanMode
+                    || (loanMode === 'with' && row.dataset.hasLoan === 'true')
+                    || (loanMode === 'without' && row.dataset.hasLoan !== 'true');
                 row.style.display = (teamMatch && overdueMatch && loanMatch) ? '' : 'none';
             }
         }
         pendingTeamFilter.addEventListener('change', applyPendingFilters);
         if (pendingOverdueOnly) pendingOverdueOnly.addEventListener('change', applyPendingFilters);
-        if (pendingExcludeLoans) pendingExcludeLoans.addEventListener('change', applyPendingFilters);
+        if (pendingLoanFilter) pendingLoanFilter.addEventListener('change', applyPendingFilters);
     }
 
     // =================================================================