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

correccion del cambio modo oscuro involuntario
Merge branch 'main' into desarrollo_hector
2026-06-18 12:11:39 -06:00 · 2026-06-17 14:52:25 -06:00 · 2026-06-17 14:20:48 -06:00 · 2026-06-15 12:56:54 -06:00 · 2026-05-24 21:13:11 -07:00
8 changed files with 174 additions and 57 deletions
--- a/pos/static/css/catalog.css
+++ b/pos/static/css/catalog.css
@@ -88,7 +88,8 @@
    .breadcrumb__link:hover { color: var(--color-primary); }
    .breadcrumb__sep { color: var(--color-text-disabled); }
    .breadcrumb__current { color: var(--color-text-primary); font-weight: var(--font-weight-semibold); }
-
+    .breadcrumb__back { display: inline-flex; align-items: center; gap: 4px; padding: 2px 10px; background: transparent; border: 1px solid var(--color-border); border-radius: var(--radius-sm); color: var(--color-text-muted); font-size: var(--text-body-sm); cursor: pointer; transition: var(--transition-fast); }
+    .breadcrumb__back:hover { background: var(--color-primary-muted); color: var(--color-primary); }
    .header-actions { display: flex; align-items: center; gap: var(--space-3); }

    /* ── Catalog mode toggle (OEM / Local) ── */
@@ -362,13 +363,29 @@
    .bodega-table th { text-align: left; font-weight: var(--font-weight-semibold); color: var(--color-text-muted); font-size: var(--text-caption); text-transform: uppercase; letter-spacing: var(--tracking-wider); padding: var(--space-2) var(--space-2); border-bottom: 1px solid var(--color-border); }
    .bodega-table td { padding: var(--space-2); border-bottom: 1px solid var(--color-border); color: var(--color-text-primary); }

-    /* Alternatives list */
+/* Alternatives list */
    .alt-item { display: flex; align-items: center; justify-content: space-between; padding: var(--space-2) 0; border-bottom: 1px solid var(--color-border); }
    .alt-item:last-child { border-bottom: none; }
    .alt-item__pn { font-weight: var(--font-weight-semibold); color: var(--color-text-primary); font-size: var(--text-body-sm); }
    .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);
--- a/pos/static/js/brand-catalog.js
+++ b/pos/static/js/brand-catalog.js
@@ -51,7 +51,7 @@
        return;
      }
      this.el('brandCatalogOverlay').style.display = 'block';
-      document.body.style.overflow = 'hidden';
+      //document.body.style.overflow = 'hidden';
      this.loadBrands();
    },

@@ -60,7 +60,7 @@
      document.body.style.overflow = '';
      this.reset();
    },
-
+    
    reset: function() {
      this.state = 'brands';
      this.nav = { brand: null, brandId: null, model: null, modelId: null, year: null, yearId: null, engine: null, myeId: null, category: null, categoryId: null };
--- a/pos/static/js/catalog.js
+++ b/pos/static/js/catalog.js
@@ -276,7 +276,20 @@
        if (nav.nxPartType) parts.push({ label: nav.nxPartType.name, action: null });
        else if (nav.partType) parts.push({ label: nav.partType.name, action: null });

+        //Botón para retroceder
+        var backAction = null;
+        if (parts.length > 1) {
+            var prev = parts[parts.length - 2];
+            backAction = prev ? prev.action : 'loadBrands';
+        }
+
        var html = '';
+        //Botón para retroceder
+        if (backAction) {
+            html += '<button class="breadcrumb__back" data-bc-action="' + backAction + '">&#8592; Atr&aacute;s</button>';
+            html += '<span class="breadcrumb__sep" aria-hidden="true">|</span>';
+        }
+        //--------
        for (var i = 0; i < parts.length; i++) {
            if (i > 0) html += '<span class="breadcrumb__sep" aria-hidden="true">/</span>';
            if (i < parts.length - 1 && parts[i].action) {
@@ -303,6 +316,7 @@
                else if (action === 'loadNxPartTypes') { resetNavFrom('part_types'); loadNexpartPartTypes(); }
            });
        });
+
    }

    function resetNav() {
@@ -1258,10 +1272,8 @@
                html += '</div>';
            }

-            // Compatibilities — deduplicate by (make, model, year, engine)
+// 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) {
@@ -1270,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');
@@ -1788,20 +1847,22 @@
        });
    }

+
    function vsYearChanged() {
        var yearId = vsYear.value;
-        vsBrand.innerHTML = '<option value="">Marca...</option>';
-        vsModel.innerHTML = '<option value="">Modelo...</option>';
-        vsEngine.innerHTML = '<option value="">Motor...</option>';
-        vsBrand.disabled = true;
-        vsModel.disabled = true;
-        vsEngine.disabled = true;
-        vsClear.style.display = yearId ? '' : 'none';
+        vsClear.style.display = (yearId || vsBrand.value || vsModel.value) ? '' : 'none';

-        if (!yearId) return;
-
-        // Load brands filtered by year
+        // Resetear marca solo si no hay nada seleccionado en ella
        vsBrand.disabled = false;
+        vsEngine.innerHTML = '<option value="">Motor...</option>';
+        vsEngine.disabled = true;
+
+        if (!yearId) {
+            //carga todo
+            vsLoadAllBrands();
+            return;
+        }
+        // Filtrar marcas por año
        apiFetch(API + '/brands?year_id=' + yearId + '&mode=' + catalogMode).then(function (data) {
            var brands = data.data || data;
            if (!brands) return;
@@ -1809,21 +1870,39 @@
                brands.map(function (b) {
                    return '<option value="' + b.id_brand + '">' + esc(b.name_brand) + '</option>';
                }).join('');
+            // si hay marca seleccionada despliega modelos
+            if (vsBrand.value) vsBrandChanged();
+        });
+    }
+    function vsLoadAllBrands() {
+        apiFetch(API + '/brands?mode=' + catalogMode).then(function (data) {
+            var brands = data.data || data;
+            if (!brands) return;
+            var current = vsBrand.value;
+            vsBrand.innerHTML = '<option value="">Marca...</option>' +
+                brands.map(function (b) {
+                    return '<option value="' + b.id_brand + '">' + esc(b.name_brand) + '</option>';
+                }).join('');
+            if (current) vsBrand.value = current;
        });
    }

    function vsBrandChanged() {
        var brandId = vsBrand.value;
        var yearId = vsYear.value;
+        vsClear.style.display = (yearId || brandId) ? '' : 'none';
+
        vsModel.innerHTML = '<option value="">Modelo...</option>';
        vsEngine.innerHTML = '<option value="">Motor...</option>';
-        vsModel.disabled = true;
+        vsModel.disabled = false;  // cambio
        vsEngine.disabled = true;

-        if (!brandId) return;
+        if (!brandId) {
+            vsModel.disabled = true;
+            return;
+        }

-        // Load models filtered by brand AND year
-        vsModel.disabled = false;
+        // Cargar modelos con o sin año
        apiFetch(API + '/models?brand_id=' + brandId + (yearId ? '&year_id=' + yearId : '')).then(function (data) {
            var models = data.data || data;
            if (!models) return;
@@ -1831,32 +1910,53 @@
                models.map(function (m) {
                    return '<option value="' + m.id_model + '">' + esc(m.display_name || m.name_model) + '</option>';
                }).join('');
+            // si hay modelo seleccionado despliega año
+            if (vsModel.value) vsModelChanged();
        });
    }

+
    function vsModelChanged() {
        var modelId = vsModel.value;
        var yearVal = vsYear.value;
+
        vsEngine.innerHTML = '<option value="">Motor...</option>';
        vsEngine.disabled = true;

-        if (!modelId || !yearVal) return;
+        if (!modelId) return;

-        vsEngine.disabled = false;
-        apiFetch(API + '/engines?model_id=' + modelId + '&year_id=' + yearVal).then(function (data) {
-            var engines = data.data || data;
-            if (!engines) return;
-            vsEngine.innerHTML = '<option value="">Motor...</option>' +
-                engines.map(function (e) {
-                    var label = e.name_engine + (e.trim_level ? ' (' + e.trim_level + ')' : '');
-                    return '<option value="' + e.id_mye + '">' + esc(label) + '</option>';
-                }).join('');
-            // If only 1 engine, auto-select
-            if (engines.length === 1) {
-                vsEngine.value = engines[0].id_mye;
-                vsEngineChanged();
-            }
-        });
+        // Si hay año carga motores
+        if (yearVal) {
+            vsEngine.disabled = false;
+            apiFetch(API + '/engines?model_id=' + modelId + '&year_id=' + yearVal).then(function (data) {
+                var engines = data.data || data;
+                if (!engines) return;
+                vsEngine.innerHTML = '<option value="">Motor...</option>' +
+                    engines.map(function (e) {
+                        var label = e.name_engine + (e.trim_level ? ' (' + e.trim_level + ')' : '');
+                        return '<option value="' + e.id_mye + '">' + esc(label) + '</option>';
+                    }).join('');
+                if (engines.length === 1) {
+                    vsEngine.value = engines[0].id_mye;
+                    vsEngineChanged();
+                }
+            });
+        } else {
+            // Sin año
+            var brandId = vsBrand.value;
+            if (!brandId) return;
+            nav.brand = { id: parseInt(brandId), name: vsBrand.options[vsBrand.selectedIndex].text };
+            nav.model = { id: parseInt(modelId), name: vsModel.options[vsModel.selectedIndex].text };
+            nav.year = null;
+            nav.engine = null;
+            nav.level = 'categories';
+            pushNavState();
+            loadCategoriesForMode();
+            setTimeout(function () {
+                var body = document.getElementById('pageBody');
+                if (body) body.scrollIntoView({ behavior: 'smooth', block: 'start' });
+            }, 300);
+        }
    }

    function vsEngineChanged() {
--- a/pos/static/js/config.js
+++ b/pos/static/js/config.js
@@ -57,7 +57,7 @@ const Config = (() => {
    // -------------------------------------------------------------------------
    function setTheme(theme) {
        document.documentElement.setAttribute('data-theme', theme);
-        try { localStorage.setItem('nexus-theme', theme); } catch(e) {}
+        try { localStorage.setItem('pos_theme', theme); } catch(e) {}

        document.querySelectorAll('.theme-btn').forEach(function(btn) {
            btn.classList.toggle('is-active', btn.dataset.themeTarget === theme);
@@ -802,7 +802,7 @@ const Config = (() => {

        // Restore theme
        try {
-            var saved = localStorage.getItem('nexus-theme');
+            var saved = localStorage.getItem('pos_theme');
            if (saved === 'industrial' || saved === 'modern') {
                setTheme(saved);
            }
--- a/pos/static/js/dashboard.js
+++ b/pos/static/js/dashboard.js
@@ -48,7 +48,7 @@ const Dashboard = (() => {
    // -------------------------------------------------------------------------
    function setTheme(theme) {
        document.documentElement.setAttribute('data-theme', theme);
-        try { localStorage.setItem('nexus-theme', theme); } catch(e) {}
+        try { localStorage.setItem('pos_theme', theme); } catch(e) {}
        const btnInd = document.getElementById('btn-industrial');
        const btnMod = document.getElementById('btn-modern');
        if (btnInd) btnInd.classList.toggle('active', theme === 'industrial');
@@ -689,7 +689,7 @@ const Dashboard = (() => {

        // Restore theme
        try {
-            const saved = localStorage.getItem('nexus-theme');
+            const saved = localStorage.getItem('pos_theme');
            if (saved === 'industrial' || saved === 'modern') {
                setTheme(saved);
            }
--- a/pos/static/js/reports.js
+++ b/pos/static/js/reports.js
@@ -61,7 +61,7 @@ const Reports = (() => {
    // -------------------------------------------------------------------------
    function setTheme(theme) {
        document.documentElement.setAttribute('data-theme', theme);
-        try { localStorage.setItem('nexus-theme', theme); } catch(e) {}
+        try { localStorage.setItem('pos_theme', theme); } catch(e) {}
        var btnInd = document.getElementById('btn-industrial');
        var btnMod = document.getElementById('btn-modern');
        if (btnInd) btnInd.classList.toggle('is-active', theme === 'industrial');
@@ -745,7 +745,7 @@ const Reports = (() => {

        // Restore theme
        try {
-            var saved = localStorage.getItem('nexus-theme') || 'industrial';
+            var saved = localStorage.getItem('pos_theme') || 'industrial';
            setTheme(saved);
        } catch(e) {}

--- a/pos/templates/catalog.html
+++ b/pos/templates/catalog.html
@@ -145,14 +145,14 @@
          <div class="vs-arrow">›</div>
          <div class="vs-group">
            <label class="vs-label">Marca</label>
-            <select class="vs-select" id="vsBrand" disabled onchange="CatalogApp.vsBrandChanged()">
+            <select class="vs-select" id="vsBrand"  onchange="CatalogApp.vsBrandChanged()">
              <option value="">Seleccionar...</option>
            </select>
          </div>
          <div class="vs-arrow">›</div>
          <div class="vs-group">
            <label class="vs-label">Modelo</label>
-            <select class="vs-select" id="vsModel" disabled onchange="CatalogApp.vsModelChanged()">
+            <select class="vs-select" id="vsModel"  onchange="CatalogApp.vsModelChanged()">
              <option value="">Seleccionar...</option>
            </select>
          </div>
@@ -302,7 +302,7 @@
  </div>

  <!-- Brand Catalog Overlay (full-screen overlay for brand-first browsing) -->
-  <div id="brandCatalogOverlay" style="display:none;position:fixed;top:0;left:0;right:0;bottom:0;z-index:9000;background:var(--color-bg-base);overflow:auto;padding:var(--space-4);">
+  <div id="brandCatalogOverlay" style="display:none;position:relative;top:0;left:0;right:0;bottom:0;background:var(--color-bg-base);overflow:auto;padding:var(--space-4);">
    <div style="max-width:1200px;margin:0 auto;">
      <div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-4);">
        <h2 style="margin:0;font-family:var(--font-heading);font-size:var(--text-h3);">Catalogo por Marca</h2>
--- a/pos/templates/inventory.html
+++ b/pos/templates/inventory.html
@@ -644,13 +644,13 @@
      });

      // Persist preference
-      try { localStorage.setItem('nexus-theme', theme); } catch(e) {}
+      try { localStorage.setItem('pos_theme', theme); } catch(e) {}
    }

    // Restore on load
    (function() {
      var saved;
-      try { saved = localStorage.getItem('nexus-theme'); } catch(e) {}
+      try { saved = localStorage.getItem('pos_theme'); } catch(e) {}
      if (saved === 'industrial' || saved === 'modern') {
        setTheme(saved);
      }
Author	SHA1	Message	Date
otamegane2	6b80add102	Mejora, ahora los intercambios estan paginados para que no sea una lista larga, muestran de 15 en 15 los intermcambios	2026-06-18 12:11:39 -06:00
otamegane2	ad04572305	correccion del cambio modo oscuro involuntario	2026-06-17 14:52:25 -06:00
otamegane2	ee7e1d49e5	Merge branch 'main' into desarrollo_hector	2026-06-17 14:20:48 -06:00
otamegane2	49bbc37117	Merge branch 'main' into desarrollo_hector	2026-06-15 12:56:54 -06:00
otamegane2	71f3b1cdec	se hacen modificaciones de catalogo a peticion de observaciones de carlos 24052026	2026-05-24 21:13:11 -07:00