iterminate/battery-tracker-app
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add pagination, device detail unassign-all, and batch install with slot limit

Browse Source
This commit is contained in:
iterminate
2026-04-30 18:31:48 -05:00
parent 3b2029d3b8
commit 4ec7d22138
5 changed files with 200 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
templates/dashboard.html
+37 -4
View File
@@ -300,6 +300,13 @@
</tbody>
</table>
</div>
<div id="pagination-bar" style="display:flex;align-items:center;gap:0.75rem;margin-top:0.75rem;flex-wrap:wrap;">
<button id="prev-page" class="btn btn-sm btn-secondary" type="button"
onclick="currentPage--; applyPagination();" disabled>&#8592; Prev</button>
<span id="page-info" style="color:var(--text-muted);font-size:0.9rem;"></span>
<button id="next-page" class="btn btn-sm btn-secondary" type="button"
onclick="currentPage++; applyPagination();" disabled>Next &#8594;</button>
</div>
</form>
</div>
@@ -309,6 +316,8 @@ var selectAll = document.getElementById('select-all');
var toolbar = document.getElementById('bulk-toolbar');
var countEl = document.getElementById('selected-count');
var selectAllBtn = document.getElementById('select-all-btn');
var PAGE_SIZE = 50;
var currentPage = 1;
function visibleCbs() {
return Array.prototype.filter.call(
@@ -358,7 +367,7 @@ function applyFilters() {
document.getElementById('filter-reset').style.display = anyActive ? '' : 'none';
var rows = document.querySelectorAll('tbody tr[data-brand]');
var visible = 0;
var filtered = 0;
rows.forEach(function(row) {
var show = true;
if (status === 'active') {
@@ -370,12 +379,34 @@ function applyFilters() {
if (size && row.dataset.size !== size) show = false;
if (storage && row.dataset.storage !== storage) show = false;
if (text && row.textContent.toLowerCase().indexOf(text) === -1) show = false;
row.style.display = show ? '' : 'none';
if (show) visible++;
row.dataset.filteredOut = show ? '' : '1';
if (show) filtered++;
});
var fc = document.getElementById('filter-count');
fc.textContent = anyActive ? (visible + ' of ' + rows.length + ' shown') : '';
fc.textContent = anyActive ? (filtered + ' of ' + rows.length + ' shown') : '';
currentPage = 1;
applyPagination();
}
function applyPagination() {
var allRows = Array.from(document.querySelectorAll('tbody tr[data-brand]'));
var visible = allRows.filter(function(r) { return !r.dataset.filteredOut; });
var totalPages = Math.max(1, Math.ceil(visible.length / PAGE_SIZE));
if (currentPage > totalPages) currentPage = totalPages;
var start = (currentPage - 1) * PAGE_SIZE;
allRows.forEach(function(r) { r.style.display = 'none'; });
visible.slice(start, start + PAGE_SIZE).forEach(function(r) { r.style.display = ''; });
var info = document.getElementById('page-info');
var prev = document.getElementById('prev-page');
var next = document.getElementById('next-page');
if (info) info.textContent = visible.length > PAGE_SIZE
? 'Page ' + currentPage + ' of ' + totalPages : '';
if (prev) prev.disabled = currentPage <= 1;
if (next) next.disabled = currentPage >= totalPages;
updateToolbar();
}
@@ -514,6 +545,7 @@ document.querySelectorAll('th[data-sortable]').forEach(function(th) {
_captureOrder();
var tbody = document.querySelector('tbody');
_origOrder.forEach(function(r) { tbody.appendChild(r); });
applyPagination();
return;
}
ind.textContent = _sortDir === 1 ? ' \u25b2' : ' \u25bc';
@@ -534,6 +566,7 @@ document.querySelectorAll('th[data-sortable]').forEach(function(th) {
return av.localeCompare(bv) * _sortDir;
});
rows.forEach(function(r) { tbody.appendChild(r); });
applyPagination();
});
});