consultoria-as/Autoparts-DB
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Mejora, ahora los intercambios estan paginados para que no sea una lista larga, muestran de 15 en 15 los intermcambios

Browse Source
This commit is contained in:
otamegane2
2026-06-18 12:11:39 -06:00
parent ad04572305
commit 6b80add102
2 changed files with 74 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
pos/static/css/catalog.css
View File

@@ -370,6 +370,22 @@
.alt-item__mfr { font-size: var(--text-caption); color: var(--color-text-muted); }
.alt-item__stock { font-size: var(--text-caption); }
/* Compatible vehicles pagination */
.compat-pager {
display: flex; align-items: center; justify-content: space-between;
gap: var(--space-2); margin-top: var(--space-4); padding-top: var(--space-3);
border-top: 1px solid var(--color-border);
}
.compat-pager__btn {
font-family: inherit; font-size: var(--text-caption); font-weight: var(--font-weight-semibold);
color: var(--color-text-primary); background: var(--color-surface-2);
border: 1px solid var(--color-border); border-radius: var(--radius-sm);
padding: var(--space-2) var(--space-3); cursor: pointer; white-space: nowrap;
}
.compat-pager__btn:hover:not(:disabled) { background: var(--color-surface-3, var(--color-surface-2)); }
.compat-pager__btn:disabled { opacity: 0.4; cursor: not-allowed; }
.compat-pager__info { font-size: var(--text-caption); color: var(--color-text-muted); text-align: center; flex: 1; }
/* Add to cart section */
.detail-footer {
padding: var(--space-4) var(--space-5); border-top: 1px solid var(--color-border);

67
pos/static/js/catalog.js
View File

@@ -1274,8 +1274,6 @@
// Compatibilities — deduplicate by (make, model, year, engine)
if (p.compatibilities && p.compatibilities.length) {
html += '<div class="detail-section">';
html += '<div class="detail-section__title">Vehiculos compatibles</div>';
var seenCompat = {};
var uniqCompat = [];
p.compatibilities.forEach(function(c) {
@@ -1284,22 +1282,69 @@
seenCompat[key] = true;
uniqCompat.push(c);
});
var currentMake = '';
uniqCompat.forEach(function(c) {
if (c.make !== currentMake) {
currentMake = c.make;
html += '<div style="font-weight:600;margin-top:8px;">' + esc(c.make) + '</div>';
}
html += '<div style="padding-left:12px;color:var(--color-text-muted);font-size:var(--text-body-sm);">' +
esc(c.model) + ' ' + c.year + ' ' + esc(c.engine || '') + '</div>';
});
html += '<div class="detail-section">';
html += '<div class="detail-section__title">Vehiculos compatibles</div>';
html += '<div id="compat-list"></div>';
html += '<div id="compat-pager" class="compat-pager"></div>';
html += '</div>';
compatFullList = uniqCompat;
} else {
compatFullList = [];
}
detailBody.innerHTML = html;
if (compatFullList.length) {
renderCompatPage(1);
}
});
}
// --- Pagination for "Vehiculos compatibles" ---
var compatFullList = [];
var compatPageSize = 15;
var compatCurrentPage = 1;
function renderCompatPage(page) {
var listEl = document.getElementById('compat-list');
var pagerEl = document.getElementById('compat-pager');
if (!listEl || !pagerEl) return;
var totalItems = compatFullList.length;
var totalPages = Math.max(1, Math.ceil(totalItems / compatPageSize));
page = Math.min(Math.max(1, page), totalPages);
compatCurrentPage = page;
var start = (page - 1) * compatPageSize;
var pageItems = compatFullList.slice(start, start + compatPageSize);
var listHtml = '';
var currentMake = '';
pageItems.forEach(function(c) {
if (c.make !== currentMake) {
currentMake = c.make;
listHtml += '<div style="font-weight:600;margin-top:8px;">' + esc(c.make) + '</div>';
}
listHtml += '<div style="padding-left:12px;color:var(--color-text-muted);font-size:var(--text-body-sm);">' +
esc(c.model) + ' ' + c.year + ' ' + esc(c.engine || '') + '</div>';
});
listEl.innerHTML = listHtml;
if (totalPages > 1) {
pagerEl.innerHTML =
'<button type="button" id="compat-prev" class="compat-pager__btn"' + (page <= 1 ? ' disabled' : '') + '>&lsaquo; Anterior</button>' +
'<span class="compat-pager__info">Pagina ' + page + ' de ' + totalPages + ' (' + totalItems + ' vehiculos)</span>' +
'<button type="button" id="compat-next" class="compat-pager__btn"' + (page >= totalPages ? ' disabled' : '') + '>Siguiente &rsaquo;</button>';
var prevBtn = document.getElementById('compat-prev');
var nextBtn = document.getElementById('compat-next');
if (prevBtn) prevBtn.addEventListener('click', function () { renderCompatPage(compatCurrentPage - 1); });
if (nextBtn) nextBtn.addEventListener('click', function () { renderCompatPage(compatCurrentPage + 1); });
} else {
pagerEl.innerHTML = '';
}
}
function closeDetail() {
detailPanel.classList.remove('is-open');
detailOverlay.classList.remove('is-visible');