feat(pos): add kiosk mode, AI vision, AI part classification, public chatbot (#19 #25 #30 #29)

- Kiosk mode: fullscreen, wake lock, auto-login, context menu block, PWA/Capacitor detection - AI vision: camera photos analyzed by Gemma 3 27B vision model via OpenRouter - AI part classification: auto-suggest name/brand/category when entering part number - Public catalog chatbot: /api/chat endpoint with rate limiting, chat widget on catalog page Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-05 04:18:37 +00:00
parent 4cc2c66208
commit 5a88d7c7ff
13 changed files with 942 additions and 5 deletions
--- a/pos/blueprints/chat_bp.py
+++ b/pos/blueprints/chat_bp.py
@@ -38,8 +38,13 @@ def chat():
            except Exception:
                pass

-    # Call AI with inventory context
-    ai_response = ai_chat.chat(user_message, history, inventory_context=inventory_context)
+    # Check for image (base64) — use vision model if present
+    image_base64 = (body.get("image") or "").strip()
+
+    if image_base64:
+        ai_response = ai_chat.chat_with_image(user_message, image_base64, history, inventory_context=inventory_context)
+    else:
+        ai_response = ai_chat.chat(user_message, history, inventory_context=inventory_context)

    search_results = []
    vehicle_match = None
--- a/pos/services/ai_chat.py
+++ b/pos/services/ai_chat.py
@@ -148,6 +148,176 @@ def get_inventory_context(tenant_conn, branch_id=None):
        cur.close()


+VISION_MODEL = "google/gemma-3-27b-it:free"
+
+VISION_SYSTEM_PROMPT = """Eres un experto en identificación de autopartes. El usuario te envía una foto de una parte automotriz.
+Tu trabajo es:
+1. Identificar que parte es (nombre en español e inglés)
+2. Describir características visibles (material, desgaste, marca si es visible)
+3. Sugerir términos de búsqueda para encontrarla en un catálogo
+
+IMPORTANTE: Responde SIEMPRE en formato JSON válido con esta estructura:
+{
+  "message": "Descripción de la parte identificada en español",
+  "search_query": "término de búsqueda EN INGLÉS para el catálogo",
+  "vehicle": null
+}
+
+Ejemplos de partes comunes:
+- Pastillas/balatas de freno = "Brake Pad"
+- Disco de freno = "Brake Disc"
+- Filtro de aceite = "Oil Filter"
+- Bujía = "Spark Plug"
+- Amortiguador = "Shock Absorber"
+- Bomba de agua = "Water Pump"
+- Sensor de oxígeno = "Oxygen Sensor"
+"""
+
+
+def chat_with_image(user_message, image_base64, conversation_history=None, inventory_context=None):
+    """Send a message with an image to a vision-capable AI model.
+
+    Args:
+        user_message: The user's chat message.
+        image_base64: Base64-encoded image (with or without data URL prefix).
+        conversation_history: Previous messages in the conversation.
+        inventory_context: Optional inventory summary string.
+    """
+    _validate_model(VISION_MODEL)
+
+    system_content = VISION_SYSTEM_PROMPT
+    if inventory_context:
+        system_content = VISION_SYSTEM_PROMPT + "\n\n" + inventory_context
+
+    # Ensure proper data URL format
+    if image_base64 and not image_base64.startswith('data:'):
+        image_base64 = 'data:image/jpeg;base64,' + image_base64
+
+    messages = [{"role": "system", "content": system_content}]
+    if conversation_history:
+        # Only add text-only history messages
+        for h in conversation_history:
+            if isinstance(h.get('content'), str):
+                messages.append(h)
+
+    # Build multimodal user message
+    user_content = [
+        {"type": "image_url", "image_url": {"url": image_base64}},
+        {"type": "text", "text": user_message or "Identifica esta parte automotriz y sugiere términos de búsqueda."}
+    ]
+    messages.append({"role": "user", "content": user_content})
+
+    import time
+    max_retries = 3
+
+    for attempt in range(max_retries):
+        try:
+            resp = requests.post(
+                OPENROUTER_URL,
+                headers={
+                    "Authorization": f"Bearer {OPENROUTER_API_KEY}",
+                    "Content-Type": "application/json",
+                },
+                json={
+                    "model": VISION_MODEL,
+                    "messages": messages,
+                    "max_tokens": 500,
+                    "temperature": 0.3,
+                },
+                timeout=30,
+            )
+            if resp.status_code == 429:
+                wait = (attempt + 1) * 5
+                if attempt < max_retries - 1:
+                    time.sleep(wait)
+                    continue
+                return {"message": "El asistente esta ocupado. Intenta de nuevo en unos segundos.", "search_query": None, "vehicle": None}
+            resp.raise_for_status()
+            data = resp.json()
+            content = data["choices"][0]["message"]["content"]
+
+            try:
+                stripped = content.strip()
+                if stripped.startswith("```"):
+                    lines = stripped.split("\n")
+                    json_str = "\n".join(lines[1:-1])
+                    parsed = json.loads(json_str)
+                else:
+                    parsed = json.loads(stripped)
+                return parsed
+            except (json.JSONDecodeError, IndexError):
+                return {"message": content, "search_query": None, "vehicle": None}
+        except Exception as e:
+            if attempt < max_retries - 1:
+                continue
+            return {
+                "message": f"Error al analizar imagen: {str(e)}",
+                "search_query": None,
+                "vehicle": None,
+            }
+
+
+def classify_part(part_number):
+    """Ask AI to identify a part by its OEM number."""
+    _validate_model(MODEL)
+
+    prompt = (
+        f"Given auto part number '{part_number}', identify:\n"
+        f"1) What part it is (name in Spanish)\n"
+        f"2) Which brand makes it\n"
+        f"3) What vehicle it fits\n"
+        f"4) What category it belongs to (e.g. Frenos, Motor, Suspensión, Eléctrico, Filtros, Transmisión)\n"
+        f"Respond ONLY in valid JSON: {{\"name\": \"...\", \"brand\": \"...\", \"vehicle\": \"...\", \"category\": \"...\"}}"
+    )
+
+    messages = [
+        {"role": "system", "content": "Eres un experto en autopartes. Responde SOLO en JSON válido, sin texto adicional."},
+        {"role": "user", "content": prompt}
+    ]
+
+    import time
+    max_retries = 3
+
+    for attempt in range(max_retries):
+        try:
+            resp = requests.post(
+                OPENROUTER_URL,
+                headers={
+                    "Authorization": f"Bearer {OPENROUTER_API_KEY}",
+                    "Content-Type": "application/json",
+                },
+                json={
+                    "model": MODEL,
+                    "messages": messages,
+                    "max_tokens": 300,
+                    "temperature": 0.2,
+                },
+                timeout=15,
+            )
+            if resp.status_code == 429:
+                wait = (attempt + 1) * 5
+                if attempt < max_retries - 1:
+                    time.sleep(wait)
+                    continue
+                return {"name": None, "brand": None, "vehicle": None, "category": None}
+            resp.raise_for_status()
+            data = resp.json()
+            content = data["choices"][0]["message"]["content"]
+
+            stripped = content.strip()
+            if stripped.startswith("```"):
+                lines = stripped.split("\n")
+                json_str = "\n".join(lines[1:-1])
+                parsed = json.loads(json_str)
+            else:
+                parsed = json.loads(stripped)
+            return parsed
+        except Exception:
+            if attempt < max_retries - 1:
+                continue
+            return {"name": None, "brand": None, "vehicle": None, "category": None}
+
+
 def chat(user_message, conversation_history=None, inventory_context=None):
    """Send a message to the AI and get a response with search suggestions.

--- a/pos/static/js/chat.js
+++ b/pos/static/js/chat.js
@@ -200,8 +200,9 @@
      container.insertBefore(div, typing);
      scrollToBottom();

-      // Send to AI as a text description (vision model placeholder)
-      const photoPrompt = 'El usuario envio una foto de una parte automotriz. Describe que parte podria ser y sugiere busquedas.';
+      // Send image to AI vision model for real analysis
+      var imageData = ev.target.result;  // full data URL
+      var photoPrompt = 'Identifica esta parte automotriz y sugiere terminos de busqueda.';
      history.push({ role: 'user', content: photoPrompt });
      if (history.length > 20) history.splice(0, 2);

@@ -209,7 +210,7 @@
      document.getElementById('chatSend').disabled = true;
      showTyping(true);

-      const token = getToken();
+      var token = getToken();
      fetch('/pos/api/chat', {
        method: 'POST',
        headers: {
@@ -218,6 +219,7 @@
        },
        body: JSON.stringify({
          message: photoPrompt,
+          image: imageData,
          history: history.slice(-10)
        })
      })
--- a/pos/static/js/config.js
+++ b/pos/static/js/config.js
@@ -499,6 +499,21 @@ const Config = (() => {
        // Bind UI events
        bindEvents();

+        // Kiosk mode toggle
+        var kioskToggle = document.getElementById('cfg-kiosk-mode');
+        if (kioskToggle && window.NexusKiosk) {
+            kioskToggle.checked = window.NexusKiosk.isEnabled();
+            kioskToggle.addEventListener('change', function () {
+                if (this.checked) {
+                    window.NexusKiosk.enable();
+                    toast('Modo Kiosko activado');
+                } else {
+                    window.NexusKiosk.disable();
+                    toast('Modo Kiosko desactivado');
+                }
+            });
+        }
+
        // Load real data in parallel
        loadBranches();
        loadEmployees();
--- a/pos/static/js/inventory.js
+++ b/pos/static/js/inventory.js
@@ -121,7 +121,48 @@

    function showCreateModal() {
        document.getElementById('createModal').classList.add('is-open');
+        // Attach AI classification on part number blur
+        var pnInput = document.getElementById('newPartNumber');
+        if (pnInput && !pnInput._classifyBound) {
+            pnInput._classifyBound = true;
+            pnInput.addEventListener('blur', function () {
+                var pn = this.value.trim();
+                if (pn.length < 3) return;
+                var nameInput = document.getElementById('newName');
+                // Only auto-classify if name is still empty
+                if (nameInput && nameInput.value.trim()) return;
+                classifyPartNumber(pn);
+            });
+        }
    }
+
+    function classifyPartNumber(partNumber) {
+        var resultEl = document.getElementById('createResult');
+        resultEl.innerHTML = '<span style="color:var(--color-text-muted);">Consultando IA...</span>';
+        apiFetch(API + '/classify/' + encodeURIComponent(partNumber)).then(function (data) {
+            if (!data) return;
+            if (data.name) {
+                document.getElementById('newName').value = data.name;
+            }
+            if (data.brand) {
+                document.getElementById('newBrand').value = data.brand;
+            }
+            // Show suggestion label
+            var parts = [];
+            if (data.name) parts.push(data.name);
+            if (data.brand) parts.push(data.brand);
+            if (data.vehicle) parts.push(data.vehicle);
+            if (data.category) parts.push(data.category);
+            if (parts.length > 0) {
+                resultEl.innerHTML = '<span style="color:var(--color-accent);font-size:var(--text-caption);">Sugerido por IA: ' + esc(parts.join(' | ')) + '</span>';
+            } else {
+                resultEl.innerHTML = '<span style="color:var(--color-text-muted);font-size:var(--text-caption);">IA no pudo identificar este numero de parte</span>';
+            }
+        }).catch(function () {
+            resultEl.innerHTML = '';
+        });
+    }
+
    function closeCreateModal() {
        document.getElementById('createModal').classList.remove('is-open');
        document.getElementById('createResult').innerHTML = '';
--- a/pos/static/js/kiosk.js
+++ b/pos/static/js/kiosk.js
@@ -0,0 +1,168 @@
+// /home/Autopartes/pos/static/js/kiosk.js
+// Kiosk mode for Nexus POS — fullscreen, wake lock, auto-login, no right-click
+
+(function () {
+  'use strict';
+
+  var STORAGE_KEY = 'pos_kiosk_mode';
+
+  // ─── Detection ───
+  function isPWA() {
+    return window.matchMedia('(display-mode: standalone)').matches
+      || window.navigator.standalone === true;
+  }
+
+  function isCapacitor() {
+    return typeof window.Capacitor !== 'undefined' && window.Capacitor.isNativePlatform && window.Capacitor.isNativePlatform();
+  }
+
+  function isKioskEnabled() {
+    // Enabled if explicitly set in localStorage, or if running as PWA/Capacitor
+    var pref = localStorage.getItem(STORAGE_KEY);
+    if (pref === 'true') return true;
+    if (pref === 'false') return false;
+    // Auto-detect
+    return isPWA() || isCapacitor();
+  }
+
+  // ─── Fullscreen ───
+  var fullscreenRequested = false;
+
+  function requestFullscreen() {
+    if (fullscreenRequested) return;
+    var el = document.documentElement;
+    var fn = el.requestFullscreen || el.webkitRequestFullscreen || el.mozRequestFullScreen || el.msRequestFullscreen;
+    if (fn) {
+      fn.call(el).catch(function () { /* user may have denied */ });
+      fullscreenRequested = true;
+    }
+  }
+
+  // ─── Wake Lock ───
+  var wakeLock = null;
+
+  async function acquireWakeLock() {
+    if (!('wakeLock' in navigator)) return;
+    try {
+      wakeLock = await navigator.wakeLock.request('screen');
+      wakeLock.addEventListener('release', function () {
+        wakeLock = null;
+      });
+    } catch (e) {
+      // Wake lock may fail if tab not visible
+    }
+  }
+
+  function releaseWakeLock() {
+    if (wakeLock) {
+      wakeLock.release();
+      wakeLock = null;
+    }
+  }
+
+  // Re-acquire wake lock when page becomes visible again
+  document.addEventListener('visibilitychange', function () {
+    if (document.visibilityState === 'visible' && isKioskEnabled() && !wakeLock) {
+      acquireWakeLock();
+    }
+  });
+
+  // ─── Auto-login ───
+  function tryAutoLogin() {
+    var token = localStorage.getItem('pos_token');
+    if (!token) return;
+
+    // Check if we are on the login page
+    var isLoginPage = window.location.pathname.indexOf('/pos/login') !== -1;
+    if (!isLoginPage) return;
+
+    // Validate token by trying to decode expiry (JWT is base64)
+    try {
+      var parts = token.split('.');
+      if (parts.length !== 3) return;
+      var payload = JSON.parse(atob(parts[1].replace(/-/g, '+').replace(/_/g, '/')));
+      var exp = payload.exp;
+      if (exp && (exp * 1000) > Date.now()) {
+        // Token still valid — skip login
+        window.location.href = '/pos/';
+      }
+    } catch (e) {
+      // Invalid token, stay on login
+    }
+  }
+
+  // ─── Activate kiosk mode ───
+  function activate() {
+    // Prevent navigation away
+    window.addEventListener('beforeunload', function (e) {
+      if (isKioskEnabled()) {
+        e.preventDefault();
+        e.returnValue = '';
+      }
+    });
+
+    // Disable context menu
+    document.addEventListener('contextmenu', function (e) {
+      if (isKioskEnabled()) {
+        e.preventDefault();
+      }
+    });
+
+    // Request fullscreen on first user interaction
+    var interactionEvents = ['click', 'touchstart', 'keydown'];
+    function onFirstInteraction() {
+      if (isKioskEnabled()) {
+        requestFullscreen();
+        acquireWakeLock();
+      }
+      interactionEvents.forEach(function (evt) {
+        document.removeEventListener(evt, onFirstInteraction);
+      });
+    }
+    interactionEvents.forEach(function (evt) {
+      document.addEventListener(evt, onFirstInteraction, { once: false });
+    });
+
+    // Auto-login if on login page
+    tryAutoLogin();
+  }
+
+  // ─── Public API ───
+  window.NexusKiosk = {
+    isEnabled: isKioskEnabled,
+    isPWA: isPWA,
+    isCapacitor: isCapacitor,
+    enable: function () {
+      localStorage.setItem(STORAGE_KEY, 'true');
+      requestFullscreen();
+      acquireWakeLock();
+    },
+    disable: function () {
+      localStorage.setItem(STORAGE_KEY, 'false');
+      releaseWakeLock();
+      if (document.fullscreenElement) {
+        document.exitFullscreen().catch(function () {});
+      }
+    },
+    toggle: function () {
+      if (isKioskEnabled()) {
+        window.NexusKiosk.disable();
+      } else {
+        window.NexusKiosk.enable();
+      }
+      return isKioskEnabled();
+    }
+  };
+
+  // ─── Init ───
+  if (isKioskEnabled()) {
+    activate();
+  }
+
+  // Also activate if preference changes (e.g. toggled from config)
+  window.addEventListener('storage', function (e) {
+    if (e.key === STORAGE_KEY && e.newValue === 'true') {
+      activate();
+    }
+  });
+})();
--- a/pos/templates/config.html
+++ b/pos/templates/config.html
@@ -1699,6 +1699,16 @@
                <span class="toggle__slider"></span>
              </label>
            </div>
+            <div class="toggle-row">
+              <div class="toggle-row__info">
+                <span class="toggle-row__label">Modo Kiosko</span>
+                <span class="toggle-row__desc">Pantalla completa, bloqueo de pantalla activa, sin menú contextual (ideal para tablet/mostrador)</span>
+              </div>
+              <label class="toggle">
+                <input type="checkbox" id="cfg-kiosk-mode" />
+                <span class="toggle__slider"></span>
+              </label>
+            </div>
          </div>
        </div>

@@ -1917,6 +1927,7 @@
  <script src="/pos/static/js/i18n.js"></script>
  <script src="/pos/static/js/app-init.js"></script>
  <script src="/pos/static/js/sidebar.js"></script>
+  <script src="/pos/static/js/kiosk.js"></script>
  <script src="/pos/static/js/config.js"></script>
  <script src="/pos/static/js/sync-engine.js"></script>
  <script>if('serviceWorker' in navigator){navigator.serviceWorker.register('/pos/sw.js',{scope:'/pos/'});}</script>
--- a/pos/templates/login.html
+++ b/pos/templates/login.html
@@ -1361,6 +1361,7 @@

  </script>

+  <script src="/pos/static/js/kiosk.js"></script>
  <script src="/pos/static/js/sync-engine.js"></script>
  <script>if('serviceWorker' in navigator){navigator.serviceWorker.register('/pos/sw.js',{scope:'/pos/'});}</script>

--- a/pos/templates/pos.html
+++ b/pos/templates/pos.html
@@ -1480,6 +1480,7 @@
       JAVASCRIPT
       ================================================================ -->
  <script src="/pos/static/js/i18n.js"></script>
+  <script src="/pos/static/js/kiosk.js"></script>
  <script src="/pos/static/js/app-init.js"></script>
  <script src="/pos/static/js/push.js"></script>
  <script src="/pos/static/js/printer.js"></script>