feat: add keyboard navigation to member details and fix attendance count
Some checks failed
Deploy to K8s / deploy (push) Failing after 7s
Build and Push / build (push) Successful in 9s

- Users can now navigate between members in the details popup using Up/Down arrows.
- Fixed 0 attendance count in member popup by preserving count in reconciliation.
- Updated uv.lock following dependency changes.

Co-authored-by: Antigravity <antigravity@google.com>
This commit is contained in:
Jan Novak
2026-03-03 11:04:50 +01:00
parent 9ee2dd782d
commit 5bdc7a4566
3 changed files with 117 additions and 4 deletions

View File

@@ -595,8 +595,10 @@
<script>
const memberData = {{ member_data| safe }};
const sortedMonths = {{ raw_months| tojson }};
let currentMemberName = null;
function showMemberDetails(name) {
currentMemberName = name;
const data = memberData[name];
if (!data) return;
@@ -728,10 +730,44 @@
});
});
// Close on Esc
// Close on Esc and Navigate with Arrows
document.addEventListener('keydown', function (e) {
if (e.key === 'Escape') closeModal();
if (e.key === 'Escape') {
closeModal();
closeModal('qrModal');
}
const modal = document.getElementById('memberModal');
if (modal.classList.contains('active')) {
if (e.key === 'ArrowUp') {
e.preventDefault();
navigateMember(-1);
} else if (e.key === 'ArrowDown') {
e.preventDefault();
navigateMember(1);
}
}
});
function navigateMember(direction) {
const rows = Array.from(document.querySelectorAll('.member-row'));
const visibleRows = rows.filter(row => row.style.display !== 'none');
let currentIndex = visibleRows.findIndex(row => {
const nameNode = row.querySelector('.member-name');
const name = nameNode.childNodes[0].textContent.trim();
return name === currentMemberName;
});
if (currentIndex === -1) return;
let nextIndex = currentIndex + direction;
if (nextIndex >= 0 && nextIndex < visibleRows.length) {
const nextRow = visibleRows[nextIndex];
const nextName = nextRow.querySelector('.member-name').childNodes[0].textContent.trim();
showMemberDetails(nextName);
}
}
function showPayQR(name, amount, month) {
const account = "{{ bank_account }}";
const message = `${name} / ${month}`;