This commit is contained in:
cangui 2025-05-09 18:16:08 +02:00
parent c3ae311666
commit 8152bdb417

View File

@ -8,47 +8,41 @@
<section class="section"> <section class="section">
<h1 class="title is-4">💬 Historique des messages — Utilisateur #{{ .UserID }}</h1> <h1 class="title is-4">💬 Historique des messages — Utilisateur #{{ .UserID }}</h1>
<!-- Filtres JS --> <!-- Filtres -->
<div class="box mb-4"> <div class="box mb-4">
<h2 class="subtitle is-6">🔍 Filtres personnalisés</h2> <h2 class="subtitle is-6">🔍 Filtres personnalisés</h2>
<div class="columns is-multiline"> <div class="columns is-multiline">
<div class="column is-2"> <div class="column is-2">
<input type="text" class="input is-small" placeholder="📅 Date" <input type="text" class="input is-small" placeholder="📅 Date" onkeyup="filterTable(0, this.value)">
onkeyup="filterTable(0, this.value)">
</div> </div>
<div class="column is-2"> <div class="column is-2">
<input type="text" class="input is-small" placeholder="➡️ Direction" <input type="text" class="input is-small" placeholder="➡️ Direction" onkeyup="filterTable(1, this.value)">
onkeyup="filterTable(1, this.value)">
</div> </div>
<div class="column is-2"> <div class="column is-2">
<input type="text" class="input is-small" placeholder="📨 Expéditeur" <input type="text" class="input is-small" placeholder="📨 Expéditeur" onkeyup="filterTable(2, this.value)">
onkeyup="filterTable(2, this.value)">
</div> </div>
<div class="column is-2"> <div class="column is-2">
<input type="text" class="input is-small" placeholder="📦 Type" <input type="text" class="input is-small" placeholder="📦 Type" onkeyup="filterTable(3, this.value)">
onkeyup="filterTable(3, this.value)">
</div> </div>
<div class="column is-2"> <div class="column is-2">
<input type="text" class="input is-small" placeholder="💬 Contenu" <input type="text" class="input is-small" placeholder="💬 Contenu" onkeyup="filterTable(4, this.value)">
onkeyup="filterTable(4, this.value)">
</div> </div>
<div class="column is-2"> <div class="column is-2">
<input type="text" class="input is-small" placeholder="✅ Statut" <input type="text" class="input is-small" placeholder="✅ Statut" onkeyup="filterTable(5, this.value)">
onkeyup="filterTable(5, this.value)">
</div> </div>
</div> </div>
</div> </div>
<!-- Tableau HTMX --> <!-- Tableau -->
<table class="table is-fullwidth is-striped is-hoverable" id="conversationTable"> <table class="table is-fullwidth is-striped is-hoverable" id="conversationTable">
<thead> <thead>
<tr> <tr>
<th>Date</th> <th onclick="sortTable(0)">📅 Date</th>
<th>Direction</th> <th onclick="sortTable(1)">➡️ Direction</th>
<th>Expéditeur</th> <th onclick="sortTable(2)">📨 Expéditeur</th>
<th>Type</th> <th onclick="sortTable(3)">📦 Type</th>
<th>Contenu</th> <th onclick="sortTable(4)">💬 Contenu</th>
<th>Statut</th> <th onclick="sortTable(5)">Statut</th>
</tr> </tr>
</thead> </thead>
<tbody id="conversationRows" <tbody id="conversationRows"
@ -60,7 +54,6 @@
</table> </table>
<hr> <hr>
<h2 class="title is-5 mt-5">🧵 Conversation complète</h2> <h2 class="title is-5 mt-5">🧵 Conversation complète</h2>
<div id="threadViewer" class="box mt-3"></div> <div id="threadViewer" class="box mt-3"></div>
</section> </section>
@ -81,6 +74,24 @@ function filterTable(colIndex, filterValue) {
} }
} }
} }
</script>
function sortTable(colIndex) {
const table = document.getElementById("conversationTable");
const tbody = table.tBodies[0];
const rows = Array.from(tbody.querySelectorAll("tr"));
const isAscending = table.getAttribute("data-sort-dir") !== "asc";
table.setAttribute("data-sort-dir", isAscending ? "asc" : "desc");
rows.sort((a, b) => {
const cellA = a.children[colIndex].innerText.toLowerCase();
const cellB = b.children[colIndex].innerText.toLowerCase();
return isAscending
? cellA.localeCompare(cellB, 'fr', { numeric: true })
: cellB.localeCompare(cellA, 'fr', { numeric: true });
});
rows.forEach(row => tbody.appendChild(row));
}
</script>
{{ end }} {{ end }}