fix: menu transfert flottant hors tableau (position fixed via getBoundingClientRect)
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -66,6 +66,12 @@ html_navbar('mail');
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Menu transfert flottant (hors tableau) -->
|
||||
<div id="transfer-menu" style="display:none;position:fixed;z-index:9998;min-width:200px" class="card shadow border-0">
|
||||
<div class="card-header py-2 small fw-semibold text-muted"><i class="bi bi-share me-1"></i>Transférer vers…</div>
|
||||
<ul class="list-group list-group-flush" id="transfer-menu-list"></ul>
|
||||
</div>
|
||||
|
||||
<!-- Toast -->
|
||||
<div class="position-fixed bottom-0 end-0 p-3" style="z-index:9999">
|
||||
<div id="toast-el" class="toast align-items-center border-0" role="alert">
|
||||
@@ -92,23 +98,41 @@ function showToast(msg, type = 'success') {
|
||||
function buildTransferDropdown(sourceId, currentUsername) {
|
||||
const others = ALL_ACCOUNTS.filter(a => a.username !== currentUsername);
|
||||
if (!others.length) {
|
||||
return `<button class="btn btn-sm btn-outline-secondary" disabled title="Aucun autre compte disponible">
|
||||
<i class="bi bi-share"></i>
|
||||
</button>`;
|
||||
return `<button class="btn btn-sm btn-outline-secondary" disabled title="Aucun autre compte disponible"><i class="bi bi-share"></i></button>`;
|
||||
}
|
||||
const items = others.map(a =>
|
||||
`<li><a class="dropdown-item" href="#" onclick="doTransfer(event,${sourceId},${a.id},'${a.username}')">
|
||||
<i class="bi bi-arrow-right-circle me-1 text-primary"></i>${escHtml(a.username)}${a.display_name ? ' <span class="text-muted">— '+escHtml(a.display_name)+'</span>' : ''}
|
||||
</a></li>`
|
||||
).join('');
|
||||
return `<div class="btn-group">
|
||||
<button class="btn btn-sm btn-outline-primary dropdown-toggle" data-bs-toggle="dropdown" data-bs-strategy="fixed" title="Transférer vers…">
|
||||
<i class="bi bi-share"></i>
|
||||
</button>
|
||||
<ul class="dropdown-menu dropdown-menu-end shadow">${items}</ul>
|
||||
</div>`;
|
||||
return `<button class="btn btn-sm btn-outline-primary" title="Transférer vers…" onclick="openTransferMenu(event,${sourceId},'${currentUsername}')"><i class="bi bi-share"></i></button>`;
|
||||
}
|
||||
|
||||
function openTransferMenu(e, sourceId, currentUsername) {
|
||||
e.stopPropagation();
|
||||
const btn = e.currentTarget;
|
||||
const rect = btn.getBoundingClientRect();
|
||||
const menu = document.getElementById('transfer-menu');
|
||||
const list = document.getElementById('transfer-menu-list');
|
||||
const others = ALL_ACCOUNTS.filter(a => a.username !== currentUsername);
|
||||
|
||||
list.innerHTML = others.map(a =>
|
||||
`<li class="list-group-item list-group-item-action py-2 px-3" style="cursor:pointer"
|
||||
onclick="doTransfer(event,${sourceId},${a.id},'${escHtml(a.username)}')">
|
||||
<i class="bi bi-arrow-right-circle me-2 text-primary"></i>${escHtml(a.username)}
|
||||
${a.display_name ? '<span class="text-muted small"> — '+escHtml(a.display_name)+'</span>' : ''}
|
||||
</li>`
|
||||
).join('');
|
||||
|
||||
// Positionne sous le bouton, recadre si déborde à droite
|
||||
menu.style.display = 'block';
|
||||
const menuW = menu.offsetWidth;
|
||||
let left = rect.left;
|
||||
if (left + menuW > window.innerWidth - 8) left = window.innerWidth - menuW - 8;
|
||||
menu.style.top = (rect.bottom + 4) + 'px';
|
||||
menu.style.left = left + 'px';
|
||||
}
|
||||
|
||||
// Ferme le menu si on clique ailleurs
|
||||
document.addEventListener('click', () => {
|
||||
document.getElementById('transfer-menu').style.display = 'none';
|
||||
});
|
||||
|
||||
function doTransfer(e, sourceId, targetId, targetName) {
|
||||
e.preventDefault();
|
||||
const fd = new FormData();
|
||||
|
||||
Reference in New Issue
Block a user