From f24f2373f9f126ee84bcd03a47d7775f7bb84bad Mon Sep 17 00:00:00 2001
From: josedario87 <jodarioel87@gmail.com>
Date: Fri, 21 Nov 2025 19:28:59 -0600
Subject: [PATCH] Agregar botones de prueba de API en frontend

- Botones simples para probar GET /api/lotes, /api/operaciones y trazabilidad
- Resultados se muestran en console.log del navegador
- Facilita debugging de la API desde el frontend
---
 nuxt4/app/app.vue | 65 +++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 65 insertions(+)

diff --git a/nuxt4/app/app.vue b/nuxt4/app/app.vue
index a746fa7..3e0d634 100644
--- a/nuxt4/app/app.vue
+++ b/nuxt4/app/app.vue
@@ -19,6 +19,24 @@
           </div>
         </div>
 
+        <!-- Botones de Prueba API -->
+        <UCard class="mb-4">
+          <div class="flex gap-2 flex-wrap">
+            <UButton @click="testGetLotes" color="primary">
+              Probar GET /api/lotes
+            </UButton>
+            <UButton @click="testGetOperaciones" color="primary">
+              Probar GET /api/operaciones
+            </UButton>
+            <UButton @click="testGetTrazabilidad" color="primary">
+              Probar Trazabilidad
+            </UButton>
+          </div>
+          <p class="text-sm text-gray-500 mt-2">
+            Los resultados se mostrarán en la consola del navegador (F12)
+          </p>
+        </UCard>
+
         <!-- Contenido principal -->
         <div v-if="isAuthenticated">
           <!-- Navegación por Tabs -->
@@ -171,6 +189,53 @@ const handleOperacionFormSuccess = () => {
   // Las tablas se recargarán automáticamente
 }
 
+// Funciones de prueba de API
+const testGetLotes = async () => {
+  console.log('=== Probando GET /api/lotes ===')
+  try {
+    const response = await fetch('/api/lotes')
+    const data = await response.json()
+    console.log('Status:', response.status)
+    console.log('Datos recibidos:', data)
+  } catch (error) {
+    console.error('Error:', error)
+  }
+}
+
+const testGetOperaciones = async () => {
+  console.log('=== Probando GET /api/operaciones ===')
+  try {
+    const response = await fetch('/api/operaciones')
+    const data = await response.json()
+    console.log('Status:', response.status)
+    console.log('Datos recibidos:', data)
+  } catch (error) {
+    console.error('Error:', error)
+  }
+}
+
+const testGetTrazabilidad = async () => {
+  console.log('=== Probando Trazabilidad ===')
+  try {
+    // Primero obtener lotes para tener un ID
+    const lotesResponse = await fetch('/api/lotes')
+    const lotesData = await lotesResponse.json()
+    console.log('Lotes disponibles:', lotesData)
+
+    if (lotesData.data && lotesData.data.length > 0) {
+      const primerLoteId = lotesData.data[0].id
+      console.log('Obteniendo trazabilidad para lote:', primerLoteId)
+
+      const trazResponse = await fetch(`/api/lotes/${primerLoteId}/trazabilidad`)
+      const trazData = await trazResponse.json()
+      console.log('Status:', trazResponse.status)
+      console.log('Trazabilidad:', trazData)
+    }
+  } catch (error) {
+    console.error('Error:', error)
+  }
+}
+
 // Watch para crear lote
 watch(showCreateLoteModal, (value) => {
   if (value) {