From 2c207fcfbb9fc06856bf7883ebd550fb90e59e98 Mon Sep 17 00:00:00 2001 From: kdeterme Date: Fri, 11 Sep 2026 14:15:59 +0200 Subject: [PATCH] fix(calendar): stack member history modal on top of team daily modal --- .../calendar/interventions_calendar.js | 30 ++- .../interventions/interventions_calendar.html | 182 +++++++++--------- 2 files changed, 124 insertions(+), 88 deletions(-) diff --git a/loko/interventions/static/interventions/calendar/interventions_calendar.js b/loko/interventions/static/interventions/calendar/interventions_calendar.js index 05c417b..db93f3b 100644 --- a/loko/interventions/static/interventions/calendar/interventions_calendar.js +++ b/loko/interventions/static/interventions/calendar/interventions_calendar.js @@ -5220,7 +5220,12 @@ function openMemberHistoryModal(memberId) { if (spinner) spinner.classList.remove('d-none'); if (content) content.classList.add('d-none'); - + + const teamModalEl = document.getElementById('teamDailyMembersModal'); + if (teamModalEl && teamModalEl.classList.contains('show')) { + modalEl.style.zIndex = '1070'; + } + modal.show(); fetch(`/interventions/calendar/member/${memberId}/history/`, { @@ -5622,7 +5627,30 @@ document.addEventListener('click', function(e) { const _memberHistoryModalEl = document.getElementById('memberHistoryModal'); if (_memberHistoryModalEl) { + function ensureHistoryModalOnTop() { + const teamModalEl = document.getElementById('teamDailyMembersModal'); + if (teamModalEl && teamModalEl.classList.contains('show')) { + _memberHistoryModalEl.style.zIndex = '1070'; + const backdrops = document.querySelectorAll('.modal-backdrop'); + if (backdrops.length > 1) { + backdrops[backdrops.length - 1].classList.add('member-history-backdrop'); + backdrops[backdrops.length - 1].style.zIndex = '1065'; + } + } + } + + _memberHistoryModalEl.addEventListener('show.bs.modal', function () { + ensureHistoryModalOnTop(); + setTimeout(ensureHistoryModalOnTop, 0); + setTimeout(ensureHistoryModalOnTop, 50); + }); + + _memberHistoryModalEl.addEventListener('shown.bs.modal', function () { + ensureHistoryModalOnTop(); + }); + _memberHistoryModalEl.addEventListener('hidden.bs.modal', function () { + _memberHistoryModalEl.style.zIndex = ''; const teamModalEl = document.getElementById('teamDailyMembersModal'); if (teamModalEl && teamModalEl.classList.contains('show')) { document.body.classList.add('modal-open'); diff --git a/loko/interventions/templates/interventions/interventions_calendar.html b/loko/interventions/templates/interventions/interventions_calendar.html index e096fb1..290a584 100644 --- a/loko/interventions/templates/interventions/interventions_calendar.html +++ b/loko/interventions/templates/interventions/interventions_calendar.html @@ -234,6 +234,14 @@ border-color: #6c757d !important; color: white !important; } + + /* Ensure member history modal displays on top of other modals */ + #memberHistoryModal { + z-index: 1070 !important; + } + .modal-backdrop.member-history-backdrop { + z-index: 1065 !important; + } {% endblock head %} @@ -650,6 +658,93 @@ + + + - - - {% endblock content%} {% block script %}