feat: champ de recherche dossiers dans la sidebar du viewer
Filtrage côté client en temps réel par nom de dossier ou document. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -77,6 +77,25 @@
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* Search */
|
||||
.sidebar-search {
|
||||
padding: 0.75rem 1rem 0.5rem;
|
||||
border-bottom: 1px solid #1e293b;
|
||||
}
|
||||
.sidebar-search input {
|
||||
width: 100%;
|
||||
padding: 0.45rem 0.6rem;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #334155;
|
||||
background: #1e293b;
|
||||
color: #e2e8f0;
|
||||
font-size: 0.8rem;
|
||||
outline: none;
|
||||
transition: border-color 0.15s;
|
||||
}
|
||||
.sidebar-search input::placeholder { color: #475569; }
|
||||
.sidebar-search input:focus { border-color: #3b82f6; }
|
||||
|
||||
/* Admin section */
|
||||
.sidebar-admin {
|
||||
padding: 1rem;
|
||||
@@ -224,6 +243,9 @@
|
||||
<h1>T2A Viewer</h1>
|
||||
<p>Visualisation CIM-10</p>
|
||||
</div>
|
||||
<div class="sidebar-search">
|
||||
<input type="text" id="sidebar-search" placeholder="Rechercher un dossier…" autocomplete="off">
|
||||
</div>
|
||||
<nav class="sidebar-nav" id="sidebar-nav">
|
||||
{% block sidebar %}{% endblock %}
|
||||
</nav>
|
||||
@@ -300,6 +322,45 @@
|
||||
|
||||
loadModels();
|
||||
})();
|
||||
|
||||
// Sidebar search filter
|
||||
(function() {
|
||||
const input = document.getElementById('sidebar-search');
|
||||
const nav = document.getElementById('sidebar-nav');
|
||||
if (!input || !nav) return;
|
||||
|
||||
input.addEventListener('input', function() {
|
||||
const q = this.value.toLowerCase().trim();
|
||||
const groups = nav.querySelectorAll('.group-title');
|
||||
|
||||
groups.forEach(function(groupEl) {
|
||||
// Collect all sibling links until next group-title
|
||||
const links = [];
|
||||
let next = groupEl.nextElementSibling;
|
||||
while (next && !next.classList.contains('group-title')) {
|
||||
if (next.tagName === 'A') links.push(next);
|
||||
next = next.nextElementSibling;
|
||||
}
|
||||
|
||||
if (!q) {
|
||||
groupEl.style.display = '';
|
||||
links.forEach(function(a) { a.style.display = ''; });
|
||||
return;
|
||||
}
|
||||
|
||||
const groupMatch = groupEl.textContent.toLowerCase().includes(q);
|
||||
let anyLinkMatch = false;
|
||||
|
||||
links.forEach(function(a) {
|
||||
const match = groupMatch || a.textContent.toLowerCase().includes(q);
|
||||
a.style.display = match ? '' : 'none';
|
||||
if (match) anyLinkMatch = true;
|
||||
});
|
||||
|
||||
groupEl.style.display = (groupMatch || anyLinkMatch) ? '' : 'none';
|
||||
});
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
{% block scripts %}{% endblock %}
|
||||
</body>
|
||||
|
||||
Reference in New Issue
Block a user