refactor(ui): Rediseño completo de UI con Nuxt UI 4

- Nuevo layout responsivo mobile-first con tabs inferiores - Sidebar colapsable en desktop con cola de impresión - Sistema de templates reutilizables con localStorage - Soporte Dark/Light mode con UColorModeButton - Composables usePrintQueue y useTemplates para estado global - Componentes modulares: CommandBuilder, QuickActions, PrintQueue, QueueItem - Navegación por tabs: Constructor | Cola | Templates
2025-11-24 17:46:20 -06:00
parent f3c13b356b
commit 470ecef4f1
39 changed files with 16114 additions and 1856 deletions
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -0,0 +1,121 @@
+// https://nuxt.com/docs/api/configuration/nuxt-config
+export default defineNuxtConfig({
+  compatibilityDate: '2025-07-15',
+  devtools: { enabled: true },
+
+  modules: [
+    '@nuxt/ui',
+    '@vite-pwa/nuxt'
+  ],
+
+  css: ['~/assets/css/main.css'],
+
+  colorMode: {
+    classSuffix: '',
+    preference: 'dark',
+    fallback: 'dark'
+  },
+
+  runtimeConfig: {
+    // Variables privadas del servidor (no expuestas al cliente)
+    printerHost: process.env.PRINTER_HOST || '192.168.87.147',
+    printerDeviceId: process.env.PRINTER_DEVICE_ID || 'matricial2',
+    printerTimeoutMs: process.env.PRINTER_TIMEOUT_MS || '60000',
+
+    public: {
+      // Variables públicas (expuestas al cliente)
+      authentikUrl: process.env.NUXT_PUBLIC_AUTHENTIK_URL || 'https://authentik.nucleoriofrio.com',
+      authEnabled: process.env.NUXT_PUBLIC_AUTH_ENABLED === 'true'
+    }
+  },
+
+  pwa: {
+    registerType: 'autoUpdate',
+    includeAssets: ['favicon.ico', 'apple-touch-icon.png', 'icon.svg', 'offline.html'],
+    manifest: {
+      name: 'PrinterCentral - Control de Impresoras Epson',
+      short_name: 'PrinterCentral',
+      description: 'Aplicación para controlar impresoras Epson ePOS vía protocolo SOAP/XML',
+      theme_color: '#1a1a1a',
+      background_color: '#0a0a0a',
+      display: 'standalone',
+      display_override: ['window-controls-overlay'],
+      orientation: 'portrait',
+      scope: '/',
+      start_url: '/',
+      icons: [
+        {
+          src: '/icon-192x192.png',
+          sizes: '192x192',
+          type: 'image/png',
+          purpose: 'any'
+        },
+        {
+          src: '/icon-512x512.png',
+          sizes: '512x512',
+          type: 'image/png',
+          purpose: 'any'
+        },
+        {
+          src: '/icon-512x512-maskable.png',
+          sizes: '512x512',
+          type: 'image/png',
+          purpose: 'maskable'
+        }
+      ]
+    },
+    workbox: {
+      navigateFallback: '/offline.html',
+      navigateFallbackDenylist: [/^\/api\//],
+      globPatterns: ['**/*.{js,css,html,png,svg,ico,json,jpeg}'],
+      cleanupOutdatedCaches: true,
+      runtimeCaching: [
+        {
+          // API calls siempre van a la red
+          urlPattern: ({ url }) => url.pathname.startsWith('/api/'),
+          handler: 'NetworkOnly'
+        },
+        {
+          // Páginas con NetworkFirst
+          urlPattern: ({ url, request }) => {
+            return request.destination === 'document' ||
+                   request.mode === 'navigate' ||
+                   url.pathname === '/'
+          },
+          handler: 'NetworkFirst',
+          options: {
+            cacheName: 'pages-cache',
+            networkTimeoutSeconds: 3,
+            expiration: {
+              maxEntries: 50,
+              maxAgeSeconds: 60 * 60 * 24 * 7 // 7 días
+            },
+            cacheableResponse: {
+              statuses: [0, 200]
+            }
+          }
+        },
+        {
+          // Assets estáticos con CacheFirst
+          urlPattern: ({ url, request }) => {
+            return request.destination === 'image' ||
+                   request.destination === 'style' ||
+                   request.destination === 'script'
+          },
+          handler: 'CacheFirst',
+          options: {
+            cacheName: 'assets-cache',
+            expiration: {
+              maxEntries: 100,
+              maxAgeSeconds: 60 * 60 * 24 * 30 // 30 días
+            }
+          }
+        }
+      ]
+    },
+    devOptions: {
+      enabled: true,
+      type: 'module'
+    }
+  }
+})