josedario87
470ecef4f1
- 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
54 lines
1.5 KiB
Vue
54 lines
1.5 KiB
Vue
<script setup lang="ts">
|
|
const templates = useTemplates()
|
|
const queue = usePrintQueue()
|
|
|
|
function loadTemplate(id: string) {
|
|
const ops = templates.loadTemplate(id)
|
|
if (ops) {
|
|
queue.loadFromTemplate(ops)
|
|
}
|
|
}
|
|
|
|
function duplicateTemplate(id: string) {
|
|
templates.duplicateTemplate(id)
|
|
}
|
|
|
|
function deleteTemplate(id: string) {
|
|
templates.deleteTemplate(id)
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div>
|
|
<div class="flex items-center justify-between mb-4">
|
|
<h2 class="text-lg font-semibold text-gray-900 dark:text-white">
|
|
Templates guardados
|
|
</h2>
|
|
<UBadge v-if="templates.templates.value.length > 0" variant="subtle">
|
|
{{ templates.templates.value.length }}
|
|
</UBadge>
|
|
</div>
|
|
|
|
<div v-if="templates.templates.value.length === 0" class="text-center py-12">
|
|
<UIcon name="i-heroicons-document-duplicate" class="w-12 h-12 text-gray-400 dark:text-gray-600 mx-auto mb-3" />
|
|
<p class="text-gray-500 dark:text-gray-400 mb-2">
|
|
No hay templates guardados
|
|
</p>
|
|
<p class="text-sm text-gray-400 dark:text-gray-500">
|
|
Crea comandos en el constructor y guárdalos como template desde la cola
|
|
</p>
|
|
</div>
|
|
|
|
<div v-else class="grid gap-3 sm:grid-cols-2">
|
|
<TemplatesTemplateCard
|
|
v-for="template in templates.templates.value"
|
|
:key="template.id"
|
|
:template="template"
|
|
@load="loadTemplate"
|
|
@duplicate="duplicateTemplate"
|
|
@delete="deleteTemplate"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</template>
|