- Templates ahora se guardan en servidor (data/templates.json) disponibles para todos - API CRUD para templates: GET/POST /api/templates, GET/PUT/DELETE /api/templates/[id] - Constructor de comandos rediseñado con tabs: Texto, Feed, Cortar, Pulse, QR, Barcode - Cada tipo de comando tiene su formulario específico con campos relevantes - Eliminado QuickActions (integrado en tabs del constructor) - Mejorada UI de lista de impresoras con renderizado condicional - Agregado data/ a .gitignore (datos de runtime)
77 lines
2.3 KiB
Vue
77 lines
2.3 KiB
Vue
<script setup lang="ts">
|
|
const templates = useTemplates()
|
|
const queue = usePrintQueue()
|
|
const toast = useToast()
|
|
|
|
// Cargar templates al montar
|
|
onMounted(() => {
|
|
templates.fetchTemplates()
|
|
})
|
|
|
|
function loadTemplate(id: string) {
|
|
const ops = templates.loadTemplate(id)
|
|
if (ops) {
|
|
queue.loadFromTemplate(ops)
|
|
toast.add({ title: 'Template cargado en la cola', color: 'success' })
|
|
}
|
|
}
|
|
|
|
async function duplicateTemplate(id: string) {
|
|
const result = await templates.duplicateTemplate(id)
|
|
if (result) {
|
|
toast.add({ title: 'Template duplicado', color: 'success' })
|
|
} else {
|
|
toast.add({ title: 'Error al duplicar template', color: 'error' })
|
|
}
|
|
}
|
|
|
|
async function deleteTemplate(id: string) {
|
|
if (!confirm('¿Eliminar este template?')) return
|
|
|
|
const result = await templates.deleteTemplate(id)
|
|
if (result) {
|
|
toast.add({ title: 'Template eliminado', color: 'success' })
|
|
} else {
|
|
toast.add({ title: 'Error al eliminar template', color: 'error' })
|
|
}
|
|
}
|
|
</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.loading.value" class="flex justify-center py-12">
|
|
<UIcon name="i-heroicons-arrow-path" class="w-8 h-8 animate-spin text-gray-400" />
|
|
</div>
|
|
|
|
<div v-else-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>
|