diff --git a/src/pages/sincronizar_productos_tryton.vue b/src/pages/sincronizar_productos_tryton.vue
index fcd74b0..d091ee5 100644
--- a/src/pages/sincronizar_productos_tryton.vue
+++ b/src/pages/sincronizar_productos_tryton.vue
@@ -1,37 +1,113 @@
 <template>
-  <v-container v-if="authStore.isAdmin" class="fill-height d-flex align-center justify-center">
-    <v-card class="pa-6" max-width="600" elevation="4">
-      <v-card-title class="text-h5 font-weight-bold text-center">
-        🔄 Sincronización de Productos
-      </v-card-title>
+  <v-container v-if="authStore.isAdmin" class="fill-height">
+    <v-row v-if="!result && !loading" justify="center">
+      <v-col cols="12" md="8">
+        <v-card class="pa-6" elevation="4">
+          <v-card-title class="text-h5 font-weight-bold text-center">
+            🔄 Sincronización de Productos
+          </v-card-title>
 
-      <v-card-text>
-        <p>
-          Esta acción sincronizará los <strong>productos</strong> desde el sistema
-          <strong>Tryton</strong> hacia la plataforma.
-        </p>
-        <v-alert type="warning" dense border="start" border-color="warning">
-          <strong>Advertencia:</strong> Este proceso podría tardar varios minutos
-          y reemplazar datos existentes en la plataforma.  
-          Asegúrese de que la información en Tryton esté actualizada antes de
-          continuar.
+          <v-card-text>
+            <p>
+              Esta acción sincronizará los <strong>productos</strong> desde el sistema
+              <strong>Tryton</strong> hacia la plataforma.
+            </p>
+            <v-alert type="warning" dense border="start" border-color="warning" class="mt-4">
+              <strong>Advertencia:</strong> Este proceso podría tardar varios minutos
+              y reemplazar datos existentes en la plataforma.  
+              Asegúrese de que la información en Tryton esté actualizada antes de
+              continuar.
+            </v-alert>
+            <p class="mt-4">
+              Durante la sincronización, no se podrán modificar productos en la
+              plataforma para evitar conflictos.
+            </p>
+          </v-card-text>
+
+          <v-card-actions class="justify-center">
+            <v-btn color="primary" @click="startSync">
+              Iniciar Sincronización
+            </v-btn>
+            <v-btn text @click="$router.push('/')">
+              Cancelar
+            </v-btn>
+          </v-card-actions>
+        </v-card>
+      </v-col>
+    </v-row>
+
+    <v-row v-else-if="loading" justify="center" align="center">
+      <v-col cols="12" class="text-center">
+        <v-progress-circular indeterminate color="primary" size="64"></v-progress-circular>
+        <p class="mt-4 text-h6">Sincronizando productos...</p>
+      </v-col>
+    </v-row>
+
+    <v-row v-else>
+      <v-col cols="12">
+        <v-alert type="success" variant="tonal" class="mb-4">
+          <strong>Sincronización completada</strong>
         </v-alert>
-        <p class="mt-4">
-          Durante la sincronización, no se podrán modificar productos en la
-          plataforma para evitar conflictos.
-        </p>
-      </v-card-text>
+      </v-col>
 
-      <v-card-actions class="justify-center">
-        <v-btn color="primary" @click="startSync">
-          Iniciar Sincronización
+      <v-col cols="12" md="6">
+        <v-card elevation="2">
+          <v-card-title class="bg-error text-white">❌ Fallidos ({{ result.failed_products?.length || 0 }})</v-card-title>
+          <v-card-text>
+            <v-data-table
+              :items="formatItems(result.failed_products)"
+              density="compact"
+              :headers="[{ title: 'ID', key: 'id' }]"
+            ></v-data-table>
+          </v-card-text>
+        </v-card>
+      </v-col>
+
+      <v-col cols="12" md="6">
+        <v-card elevation="2">
+          <v-card-title class="bg-success text-white">✅ Creados ({{ result.created_products?.length || 0 }})</v-card-title>
+          <v-card-text>
+            <v-data-table
+              :items="formatItems(result.created_products)"
+              density="compact"
+              :headers="[{ title: 'ID', key: 'id' }]"
+            ></v-data-table>
+          </v-card-text>
+        </v-card>
+      </v-col>
+
+      <v-col cols="12" md="6">
+        <v-card elevation="2">
+          <v-card-title class="bg-info text-white">🔄 Actualizados ({{ result.updated_products?.length || 0 }})</v-card-title>
+          <v-card-text>
+            <v-data-table
+              :items="formatItems(result.updated_products)"
+              density="compact"
+              :headers="[{ title: 'ID', key: 'id' }]"
+            ></v-data-table>
+          </v-card-text>
+        </v-card>
+      </v-col>
+
+      <v-col cols="12" md="6">
+        <v-card elevation="2">
+          <v-card-title class="bg-grey-lighten-1">⏭️ Sin cambios ({{ result.untouched_products?.length || 0 }})</v-card-title>
+          <v-card-text>
+            <v-data-table
+              :items="formatItems(result.untouched_products)"
+              density="compact"
+              :headers="[{ title: 'ID', key: 'id' }]"
+            ></v-data-table>
+          </v-card-text>
+        </v-card>
+      </v-col>
+
+      <v-col cols="12" class="text-center mt-4">
+        <v-btn color="primary" @click="$router.push('/')">
+          Volver al inicio
         </v-btn>
-        <v-btn text @click="$router.push('/')">
-          Cancelar
-        </v-btn>
-      </v-card-actions>
-    </v-card>
-    <v-data-table :items="productos_tryton"></v-data-table>
+      </v-col>
+    </v-row>
   </v-container>
 </template>
 
@@ -48,7 +124,8 @@
     data() {
       return {
         api: inject('api'),
-        productos_tryton: [{}],
+        loading: false,
+        result: null,
       }
     },
     mounted() {
@@ -57,8 +134,21 @@
       }
     },
     methods: {
+      formatItems(ids) {
+        if (!ids || ids.length === 0) return [];
+        return ids.map(id => ({ id }));
+      },
       startSync() {
-        this.productos_tryton = this.api.getProductsFromTryton()
+        this.loading = true;
+        this.api.getProductsFromTryton()
+          .then(response => {
+            this.result = response;
+            this.loading = false;
+          })
+          .catch(error => {
+            console.error('Error al sincronizar productos:', error);
+            this.loading = false;
+          });
       }
     }
   }