Hugging Face's logo

Spaces:
luisp33
/
23
Running

App Files Community
luisp33 commited on
Commit
5f1f056
·
verified ·
1 Parent(s): e47690b

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +497 -19
index.html CHANGED
@@ -1,19 +1,497 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="es">
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
6
+ <title>SEROJA OS - Sistema de Gestión de Setas con IA</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <script src="https://unpkg.com/htmx.org@1.9.6"></script>
9
+ <script src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js" defer></script>
10
+ <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
11
+ <script src="https://kit.fontawesome.com/a2e0b60d6f.js" crossorigin="anonymous"></script>
12
+ <style>
13
+ body {
14
+ font-family: 'Inter', sans-serif;
15
+ }
16
+ .sidebar-link {
17
+ @apply flex items-center p-3 rounded-lg text-gray-700 hover:bg-green-100 transition-all duration-200 cursor-pointer;
18
+ }
19
+ .sidebar-link.active {
20
+ @apply bg-emerald-600 text-white font-medium;
21
+ }
22
+ .btn-primary {
23
+ @apply bg-emerald-600 hover:bg-emerald-700 text-white px-4 py-2 rounded-lg transition font-medium;
24
+ }
25
+ .card {
26
+ @apply bg-white shadow-md border border-gray-100 p-5 rounded-lg;
27
+ }
28
+ .input-field {
29
+ @apply border border-gray-300 rounded-lg px-3 py-2 w-full focus:outline-none focus:ring-2 focus:ring-emerald-500;
30
+ }
31
+ .tab {
32
+ @apply px-4 py-2 text-sm font-medium text-gray-600 border-b-2 border-transparent cursor-pointer hover:text-emerald-600 transition;
33
+ }
34
+ .tab.active {
35
+ @apply text-emerald-600 border-emerald-600 border-b-2;
36
+ }
37
+ .badge {
38
+ @apply text-xs px-2 py-1 rounded-full font-medium;
39
+ }
40
+ .badge.success {
41
+ @apply bg-green-100 text-green-800;
42
+ }
43
+ .badge.warning {
44
+ @apply bg-yellow-100 text-yellow-800;
45
+ }
46
+ .badge.danger {
47
+ @apply bg-red-100 text-red-800;
48
+ }
49
+ .timeline-item {
50
+ @apply relative pl-8 pb-6 border-l-2 border-gray-200 last:border-l-0 last:pb-0;
51
+ }
52
+ .timeline-icon {
53
+ @apply absolute left-[-10px] top-0 w-5 h-5 rounded-full bg-emerald-500 flex items-center justify-center text-white text-xs;
54
+ }
55
+ </style>
56
+ </head>
57
+ <body class="bg-gray-50 text-gray-800">
58
+
59
+ <div x-data="{ sidebarOpen: true, currentTab: 'dashboard', user: 'Claude - Product Owner' }" class="flex h-screen overflow-hidden">
60
+
61
+ <!-- Sidebar -->
62
+ <div :class="sidebarOpen ? 'w-64' : 'w-16'" class="bg-white shadow-lg transition-all duration-300 flex-shrink-0 border-r border-gray-200">
63
+ <div class="p-4 flex items-center justify-between">
64
+ <div x-show="sidebarOpen" class="font-bold text-xl text-emerald-700 flex items-center gap-2">
65
+ <i class="fas fa-leaf text-emerald-600"></i>
66
+ <span>SEROJA OS</span>
67
+ </div>
68
+ <button @click="sidebarOpen = !sidebarOpen" class="text-gray-500 hover:text-emerald-600">
69
+ <i :class="sidebarOpen ? 'fa-chevron-left' : 'fa-chevron-right'" class="fas text-sm"></i>
70
+ </button>
71
+ </div>
72
+
73
+ <nav class="mt-6 px-2 space-y-1">
74
+ <a href="#" @click="currentTab = 'dashboard'" class="sidebar-link" :class="currentTab === 'dashboard' ? 'active' : ''">
75
+ <i class="fas fa-tachometer-alt mr-3"></i>
76
+ <span x-show="sidebarOpen">Dashboard</span>
77
+ </a>
78
+ <a href="#" @click="currentTab = 'operaciones'" class="sidebar-link" :class="currentTab === 'operaciones' ? 'active' : ''">
79
+ <i class="fas fa-truck-loading mr-3"></i>
80
+ <span x-show="sidebarOpen">Operaciones</span>
81
+ </a>
82
+ <a href="#" @click="currentTab = 'recolectores'" class="sidebar-link" :class="currentTab === 'recolectores' ? 'active' : ''">
83
+ <i class="fas fa-user-friends mr-3"></i>
84
+ <span x-show="sidebarOpen">Recolectores</span>
85
+ </a>
86
+ <a href="#" @click="currentTab = 'entradas'" class="sidebar-link" :class="currentTab === 'entradas' ? 'active' : ''">
87
+ <i class="fas fa-calendar-day mr-3"></i>
88
+ <span x-show="sidebarOpen">Entradas Diarias</span>
89
+ </a>
90
+ <a href="#" @click="currentTab = 'fabrica'" class="sidebar-link" :class="currentTab === 'fabrica' ? 'active' : ''">
91
+ <i class="fas fa-industry mr-3"></i>
92
+ <span x-show="sidebarOpen">Fábrica</span>
93
+ </a>
94
+ <a href="#" @click="currentTab = 'ia'" class="sidebar-link" :class="currentTab === 'ia' ? 'active' : ''">
95
+ <i class="fas fa-brain mr-3"></i>
96
+ <span x-show="sidebarOpen">IA & Memoria</span>
97
+ </a>
98
+ <a href="#" @click="currentTab = 'config'" class="sidebar-link" :class="currentTab === 'config' ? 'active' : ''">
99
+ <i class="fas fa-cog mr-3"></i>
100
+ <span x-show="sidebarOpen">Configuración</span>
101
+ </a>
102
+ </nav>
103
+ </div>
104
+
105
+ <!-- Main Content -->
106
+ <div class="flex-1 flex flex-col overflow-hidden">
107
+ <!-- Header -->
108
+ <header class="bg-white shadow-sm border-b border-gray-200 px-6 py-4 flex justify-between items-center">
109
+ <h1 class="text-xl font-semibold text-gray-800" x-text="currentTab === 'dashboard' ? 'Resumen Ejecutivo' :
110
+ currentTab === 'operaciones' ? 'Operaciones - Punto de Recogida' :
111
+ currentTab === 'recolectores' ? 'CRM de Recolectores Particulares' :
112
+ currentTab === 'entradas' ? 'Entradas Diarias y Trazabilidad' :
113
+ currentTab === 'fabrica' ? 'Fábrica - Recepción de Materias Primas' :
114
+ currentTab === 'ia' ? 'IA & Memoria: Milvus + Papr.ai' :
115
+ 'Configuración del Sistema'"></h1>
116
+ <div class="flex items-center gap-4">
117
+ <div class="relative">
118
+ <input type="text" placeholder="Buscar..." class="input-field w-64 text-sm" />
119
+ </div>
120
+ <div class="flex items-center gap-2">
121
+ <i class="fas fa-user-circle text-2xl text-gray-600"></i>
122
+ <span class="text-sm font-medium" x-text="user"></span>
123
+ </div>
124
+ </div>
125
+ </header>
126
+
127
+ <!-- Page Content -->
128
+ <main class="flex-1 overflow-y-auto p-6 bg-gray-50">
129
+
130
+ <!-- Dashboard -->
131
+ <div x-show="currentTab === 'dashboard'" x-cloak>
132
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-8">
133
+ <div class="card flex flex-col items-center text-center p-6">
134
+ <div class="text-4xl text-emerald-600 mb-2"><i class="fas fa-truck-loading"></i></div>
135
+ <h3 class="font-semibold text-gray-700">Entradas Hoy</h3>
136
+ <p class="text-3xl font-bold text-emerald-600 mt-2">12</p>
137
+ <p class="text-sm text-gray-500 mt-1">+3 vs ayer</p>
138
+ </div>
139
+ <div class="card flex flex-col items-center text-center p-6">
140
+ <div class="text-4xl text-blue-600 mb-2"><i class="fas fa-users"></i></div>
141
+ <h3 class="font-semibold text-gray-700">Recolectores Activos</h3>
142
+ <p class="text-3xl font-bold text-blue-600 mt-2">27</p>
143
+ </div>
144
+ <div class="card flex flex-col items-center text-center p-6">
145
+ <div class="text-4xl text-orange-600 mb-2"><i class="fas fa-boxes"></i></div>
146
+ <h3 class="font-semibold text-gray-700">Kg Recibidos</h3>
147
+ <p class="text-3xl font-bold text-orange-600 mt-2">1,240</p>
148
+ </div>
149
+ <div class="card flex flex-col items-center text-center p-6">
150
+ <div class="text-4xl text-purple-600 mb-2"><i class="fas fa-file-pdf"></i></div>
151
+ <h3 class="font-semibold text-gray-700">PDFs Generados</h3>
152
+ <p class="text-3xl font-bold text-purple-600 mt-2">12</p>
153
+ </div>
154
+ </div>
155
+
156
+ <div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
157
+ <div class="lg:col-span-2">
158
+ <div class="card">
159
+ <h2 class="text-lg font-semibold mb-4">Flujo de Datos IA + Memoria</h2>
160
+ <div class="bg-gray-900 text-green-400 p-4 rounded-lg text-sm font-mono overflow-x-auto">
161
+ <pre>
162
+ ┌──────────────────────┐
163
+ │ OCR / Voz / Manual │
164
+ └──────────┬───────────┘
165
+ ↓
166
+ ┌────────────────┐
167
+ │ SEROJA AI │
168
+ │ (Validación) │
169
+ └────────┬───────┘
170
+ ↓
171
+ ┌────────────────┐
172
+ │ PostgreSQL │ ←──────┐
173
+ │ (Verdad Transaccional) │
174
+ └────────┬───────┘ │
175
+ ↓ │
176
+ ┌────────────────┐ │
177
+ │ Milvus │ ◄──────┘
178
+ │ (Embeddings) │
179
+ └────────┬───────┘
180
+ ↓
181
+ ┌────────────────┐
182
+ │ Papr.ai │
183
+ │ (Knowledge Graph, Chat Memory)
184
+ └────────────────┘
185
+ </pre>
186
+ </div>
187
+ </div>
188
+ </div>
189
+ <div>
190
+ <div class="card">
191
+ <h2 class="text-lg font-semibold mb-4">IA Status</h2>
192
+ <ul class="space-y-3">
193
+ <li class="flex justify-between">
194
+ <span>OCR Pipeline</span>
195
+ <span class="badge success">Activo</span>
196
+ </li>
197
+ <li class="flex justify-between">
198
+ <span>Voz a Texto</span>
199
+ <span class="badge success">Activo</span>
200
+ </li>
201
+ <li class="flex justify-between">
202
+ <span>Papr.ai Sync</span>
203
+ <span class="badge warning">En cola</span>
204
+ </li>
205
+ <li class="flex justify-between">
206
+ <span>Milvus Index</span>
207
+ <span class="badge success">OK</span>
208
+ </li>
209
+ </ul>
210
+ </div>
211
+ </div>
212
+ </div>
213
+ </div>
214
+
215
+ <!-- Operaciones -->
216
+ <div x-show="currentTab === 'operaciones'" x-cloak>
217
+ <div class="card mb-6">
218
+ <h2 class="text-xl font-semibold mb-4">Nueva Entrada - Formulario</h2>
219
+ <form hx-post="/api/entradas" hx-target="#result" class="space-y-4">
220
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
221
+ <div>
222
+ <label class="block text-sm font-medium text-gray-700 mb-1">Fecha y Hora</label>
223
+ <input type="datetime-local" class="input-field" required />
224
+ </div>
225
+ <div>
226
+ <label class="block text-sm font-medium text-gray-700 mb-1">Recolector</label>
227
+ <select class="input-field">
228
+ <option>SP-01 - Juan García</option>
229
+ <option>SP-02 - Marta López</option>
230
+ <option>SP-03 - Carlos Ruiz</option>
231
+ </select>
232
+ </div>
233
+ </div>
234
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
235
+ <div>
236
+ <label class="block text-sm font-medium text-gray-700 mb-1">Especie</label>
237
+ <select class="input-field">
238
+ <option>Boletus edulis</option>
239
+ <option>Amanita caesarea (Huevo de Rey)</option>
240
+ <option>Cantharellus cibarius</option>
241
+ </select>
242
+ </div>
243
+ <div>
244
+ <label class="block text-sm font-medium text-gray-700 mb-1">Categoría</label>
245
+ <select class="input-field">
246
+ <option>1ª</option>
247
+ <option>2ª</option>
248
+ </select>
249
+ </div>
250
+ <div>
251
+ <label class="block text-sm font-medium text-gray-700 mb-1">Humedad (%)</label>
252
+ <input type="number" class="input-field" placeholder="75" />
253
+ </div>
254
+ </div>
255
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
256
+ <div>
257
+ <label class="block text-sm font-medium text-gray-700 mb-1">Peso Neto (kg)</label>
258
+ <input type="number" class="input-field" step="0.01" required />
259
+ </div>
260
+ <div>
261
+ <label class="block text-sm font-medium text-gray-700 mb-1">Limpieza</label>
262
+ <select class="input-field">
263
+ <option>Excelente</option>
264
+ <option>Buena</option>
265
+ <option>Regular</option>
266
+ </select>
267
+ </div>
268
+ </div>
269
+ <div>
270
+ <label class="block text-sm font-medium text-gray-700 mb-1">Observaciones</label>
271
+ <textarea class="input-field" rows="3"></textarea>
272
+ </div>
273
+ <div class="flex gap-2">
274
+ <button type="submit" class="btn-primary">Registrar Entrada</button>
275
+ <button type="button" class="btn-primary bg-gray-600 hover:bg-gray-700">Reset</button>
276
+ </div>
277
+ </form>
278
+ </div>
279
+
280
+ <div class="card">
281
+ <h2 class="text-lg font-semibold mb-4">Últimas Entradas</h2>
282
+ <div class="overflow-x-auto">
283
+ <table class="w-full text-sm">
284
+ <thead>
285
+ <tr class="text-left text-gray-600 border-b">
286
+ <th class="pb-2">Nº Entrada</th>
287
+ <th>Fecha</th>
288
+ <th>Recolector</th>
289
+ <th>Especie</th>
290
+ <th>Kg</th>
291
+ <th>Lote</th>
292
+ <th>Acciones</th>
293
+ </tr>
294
+ </thead>
295
+ <tbody>
296
+ <tr class="border-b hover:bg-gray-50">
297
+ <td class="py-2">ENT-20240405-001</td>
298
+ <td>05/04/2024 10:30</td>
299
+ <td>SP-01</td>
300
+ <td>Boletus</td>
301
+ <td>12.5</td>
302
+ <td>20240405-BOL</td>
303
+ <td>
304
+ <button class="text-emerald-600 hover:underline text-xs">PDF</button>
305
+ </td>
306
+ </tr>
307
+ </tbody>
308
+ </table>
309
+ </div>
310
+ </div>
311
+ </div>
312
+
313
+ <!-- Recolectores -->
314
+ <div x-show="currentTab === 'recolectores'" x-cloak>
315
+ <div class="card mb-6 flex justify-between items-center">
316
+ <h2 class="text-xl font-semibold">CRM de Recolectores Particulares</h2>
317
+ <button class="btn-primary">+ Nuevo Recolector</button>
318
+ </div>
319
+ <div class="card">
320
+ <div class="overflow-x-auto">
321
+ <table class="w-full text-sm">
322
+ <thead>
323
+ <tr class="text-left text-gray-600 border-b">
324
+ <th class="pb-2">ID ERP</th>
325
+ <th>Nombre</th>
326
+ <th>Contacto</th>
327
+ <th>Entregas Totales (kg)</th>
328
+ <th>Última Entrega</th>
329
+ <th>Estado</th>
330
+ </tr>
331
+ </thead>
332
+ <tbody>
333
+ <tr class="border-b hover:bg-gray-50">
334
+ <td class="py-2">SP-01</td>
335
+ <td>Juan García</td>
336
+ <td>600 123 456</td>
337
+ <td>240.5</td>
338
+ <td>05/04/2024</td>
339
+ <td><span class="badge success">Activo</span></td>
340
+ </tr>
341
+ <tr class="border-b hover:bg-gray-50">
342
+ <td class="py-2">SP-02</td>
343
+ <td>Marta López</td>
344
+ <td>611 234 567</td>
345
+ <td>180.0</td>
346
+ <td>04/04/2024</td>
347
+ <td><span class="badge success">Activo</span></td>
348
+ </tr>
349
+ </tbody>
350
+ </table>
351
+ </div>
352
+ </div>
353
+ </div>
354
+
355
+ <!-- Entradas Diarias -->
356
+ <div x-show="currentTab === 'entradas'" x-cloak>
357
+ <div class="card mb-6">
358
+ <div class="flex justify-between items-center mb-4">
359
+ <h2 class="text-xl font-semibold">Entradas Diarias - 05/04/2024</h2>
360
+ <button class="btn-primary">Generar Albarán PDF</button>
361
+ </div>
362
+ <div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
363
+ <div class="lg:col-span-2">
364
+ <div class="bg-white border border-gray-200 rounded-lg overflow-hidden">
365
+ <div class="border-b px-4 py-3 bg-gray-50 font-medium">Lotes de Entrada</div>
366
+ <div class="p-4 space-y-6">
367
+ <div>
368
+ <div class="font-medium text-gray-800 mb-2">Lote: 20240405-BOL (Boletus)</div>
369
+ <div class="ml-4 space-y-3">
370
+ <div class="timeline-item">
371
+ <div class="timeline-icon">1</div>
372
+ <div>
373
+ <div class="font-medium">Sublote: 20240405-JG</div>
374
+ <div class="text-sm text-gray-600">SP-01 - 12.5 kg (1ª)</div>
375
+ </div>
376
+ </div>
377
+ <div class="timeline-item">
378
+ <div class="timeline-icon">2</div>
379
+ <div>
380
+ <div class="font-medium">Sublote: 20240405-ML</div>
381
+ <div class="text-sm text-gray-600">SP-02 - 8.0 kg (1ª)</div>
382
+ </div>
383
+ </div>
384
+ </div>
385
+ </div>
386
+ </div>
387
+ </div>
388
+ </div>
389
+ <div>
390
+ <div class="card">
391
+ <h3 class="font-semibold mb-3">Totales del Día</h3>
392
+ <ul class="space-y-2 text-sm">
393
+ <li class="flex justify-between"><span>Boletus 1ª:</span> <span class="font-medium">20.5 kg</span></li>
394
+ <li class="flex justify-between"><span>Boletus 2ª:</span> <span class="font-medium">5.0 kg</span></li>
395
+ <li class="flex justify-between"><span>Huevo de Rey:</span> <span class="font-medium">12.0 kg</span></li>
396
+ <li class="border-t pt-2 flex justify-between font-bold"><span>Total:</span> <span>37.5 kg</span></li>
397
+ </ul>
398
+ </div>
399
+ </div>
400
+ </div>
401
+ </div>
402
+ </div>
403
+
404
+ <!-- Fábrica -->
405
+ <div x-show="currentTab === 'fabrica'" x-cloak>
406
+ <div class="card mb-6">
407
+ <h2 class="text-xl font-semibold mb-4">Recepción de Materias Primas</h2>
408
+ <div class="space-y-4">
409
+ <div class="p-4 border border-gray-200 rounded-lg">
410
+ <div class="font-medium text-gray-800">Proveedor: PUNTO DE RECOGIDA SETAEX</div>
411
+ <div class="text-sm text-gray-600">Transferido automáticamente del día anterior</div>
412
+ <div class="mt-2 text-xs text-gray-500">Lotes: 20240405-BOL, 20240405-HR</div>
413
+ </div>
414
+ <div class="p-4 border border-gray-200 rounded-lg">
415
+ <div class="font-medium text-gray-800">Proveedor: Autónomo REGP - A12345678</div>
416
+ <div class="text-sm text-gray-600">Entrada manual registrada a las 09:15</div>
417
+ <div class="mt-2 text-xs text-gray-500">Lote: 20240405-REGP01 - 15.0 kg Boletus</div>
418
+ </div>
419
+ </div>
420
+ </div>
421
+ </div>
422
+
423
+ <!-- IA & Memoria -->
424
+ <div x-show="currentTab === 'ia'" x-cloak>
425
+ <div class="card">
426
+ <h2 class="text-xl font-semibold mb-4">Arquitectura de IA y Memoria</h2>
427
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
428
+ <div class="p-4 bg-gray-900 text-green-400 rounded-lg font-mono text-xs">
429
+ <pre>
430
+ Milvus (Self-Hosted)
431
+ ├── Embeddings: Facturas OCR
432
+ ├── Embeddings: Historial Precios
433
+ ├── Embeddings: Documentos Lotes
434
+ └── RAG: Búsqueda por similitud
435
+ </pre>
436
+ </div>
437
+ <div class="p-4 bg-gray-900 text-blue-400 rounded-lg font-mono text-xs">
438
+ <pre>
439
+ Papr.ai (Managed)
440
+ ├── Document Intelligence → PDFs
441
+ ├── Chat Memory → Sesiones IA
442
+ ├── Knowledge Graphs → Recolectores↔Precios
443
+ └── Graph-Aware Retrieval
444
+ </pre>
445
+ </div>
446
+ </div>
447
+ <div class="mt-6 p-4 bg-blue-50 border border-blue-200 rounded-lg">
448
+ <h3 class="font-medium text-blue-800">Reglas de Extracción OCR</h3>
449
+ <ul class="text-sm text-blue-700 mt-2 space-y-1">
450
+ <li>• <strong>confidence_score:</strong> 0-1</li>
451
+ <li>• <strong>fields_extracted:</strong> JSON estructurado</li>
452
+ <li>• <strong>missing_fields:</strong> Lista de campos faltantes</li>
453
+ <li>• <strong>warnings:</strong> Lista de alertas</li>
454
+ <li>• <strong>suggested_actions:</strong> Sugerencias</li>
455
+ <li>• <strong>needs_human_review:</strong> boolean</li>
456
+ </ul>
457
+ </div>
458
+ </div>
459
+ </div>
460
+
461
+ <!-- Config -->
462
+ <div x-show="currentTab === 'config'" x-cloak>
463
+ <div class="card">
464
+ <h2 class="text-xl font-semibold mb-4">Configuración del Sistema</h2>
465
+ <div class="space-y-4">
466
+ <div class="p-4 border border-gray-200 rounded-lg">
467
+ <h3 class="font-medium">Reglas de Loteado</h3>
468
+ <table class="w-full text-sm mt-2">
469
+ <tr><td class="py-1 w-40">Nº Entrada:</td><td>ENT-YYYYMMDD-XXX</td></tr>
470
+ <tr><td>Lote:</td><td>YYYYMMDD-PROD</td></tr>
471
+ <tr><td>Sublote:</td><td>YYYYMMDD-I</td></tr>
472
+ </table>
473
+ </div>
474
+ <div class="p-4 border border-gray-200 rounded-lg">
475
+ <h3 class="font-medium">Permisos por Rol</h3>
476
+ <div class="grid grid-cols-2 gap-4 text-sm">
477
+ <div><strong>Admin:</strong> Todo</div>
478
+ <div><strong>Operaciones:</strong> Entradas, CRM</div>
479
+ <div><strong>Fábrica:</strong> Recepciones</div>
480
+ <div><strong>Auditoría:</strong> Solo lectura</div>
481
+ </div>
482
+ </div>
483
+ </div>
484
+ </div>
485
+ </div>
486
+
487
+ </main>
488
+ </div>
489
+ </div>
490
+
491
+ <script>
492
+ document.addEventListener('DOMContentLoaded', () => {
493
+ console.log("SEROJA OS - Sistema de Gestión con IA y Trazabilidad");
494
+ });
495
+ </script>
496
+ </body>
497
+ </html>