lashman/zeroclock
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 3 Wiki Activity

feat: load invoice templates from JSON files via backend

Browse Source 
Templates are now loaded dynamically from data/templates/*.json
via the get_invoice_templates Tauri command instead of being
hardcoded in TypeScript. Preview and PDF renderer switch on
template.layout instead of template.id, allowing custom templates
to reuse built-in layouts with different colors.
This commit is contained in:
Your Name
2026-02-18 15:17:54 +02:00
parent 5680194ef4
commit edccc12c34
4 changed files with 51 additions and 327 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
src/components/InvoicePreview.vue
View File

@@ -39,7 +39,7 @@ void clientAddress
<!-- TEMPLATE 1: CLEAN -->
<!-- ================================================================ -->
<div
v-if="template.id === 'clean'"
v-if="template.layout === 'clean'"
:style="{
backgroundColor: c.background,
color: c.bodyText,
@@ -148,7 +148,7 @@ void clientAddress
<!-- TEMPLATE 2: PROFESSIONAL -->
<!-- ================================================================ -->
<div
v-else-if="template.id === 'professional'"
v-else-if="template.layout === 'professional'"
:style="{
backgroundColor: c.background,
color: c.bodyText,
@@ -246,7 +246,7 @@ void clientAddress
<!-- TEMPLATE 3: BOLD -->
<!-- ================================================================ -->
<div
v-else-if="template.id === 'bold'"
v-else-if="template.layout === 'bold'"
:style="{
backgroundColor: c.background,
color: c.bodyText,
@@ -348,7 +348,7 @@ void clientAddress
<!-- TEMPLATE 4: MINIMAL -->
<!-- ================================================================ -->
<div
v-else-if="template.id === 'minimal'"
v-else-if="template.layout === 'minimal'"
:style="{
backgroundColor: c.background,
color: c.bodyText,
@@ -444,7 +444,7 @@ void clientAddress
<!-- TEMPLATE 5: CLASSIC -->
<!-- ================================================================ -->
<div
v-else-if="template.id === 'classic'"
v-else-if="template.layout === 'classic'"
:style="{
backgroundColor: c.background,
color: c.bodyText,
@@ -536,7 +536,7 @@ void clientAddress
<!-- TEMPLATE 6: MODERN -->
<!-- ================================================================ -->
<div
v-else-if="template.id === 'modern'"
v-else-if="template.layout === 'modern'"
:style="{
backgroundColor: c.background,
color: c.bodyText,
@@ -636,7 +636,7 @@ void clientAddress
<!-- TEMPLATE 7: ELEGANT -->
<!-- ================================================================ -->
<div
v-else-if="template.id === 'elegant'"
v-else-if="template.layout === 'elegant'"
:style="{
backgroundColor: c.background,
color: c.bodyText,
@@ -756,7 +756,7 @@ void clientAddress
<!-- TEMPLATE 8: CREATIVE -->
<!-- ================================================================ -->
<div
v-else-if="template.id === 'creative'"
v-else-if="template.layout === 'creative'"
:style="{
backgroundColor: c.background,
color: c.bodyText,
@@ -859,7 +859,7 @@ void clientAddress
<!-- TEMPLATE 9: COMPACT -->
<!-- ================================================================ -->
<div
v-else-if="template.id === 'compact'"
v-else-if="template.layout === 'compact'"
:style="{
backgroundColor: c.background,
color: c.bodyText,
@@ -954,7 +954,7 @@ void clientAddress
<!-- TEMPLATE 10: DARK -->
<!-- ================================================================ -->
<div
v-else-if="template.id === 'dark'"
v-else-if="template.layout === 'dark'"
:style="{
backgroundColor: c.background,
color: c.bodyText,
@@ -1053,7 +1053,7 @@ void clientAddress
<!-- TEMPLATE 11: VIBRANT -->
<!-- ================================================================ -->
<div
v-else-if="template.id === 'vibrant'"
v-else-if="template.layout === 'vibrant'"
:style="{
backgroundColor: c.background,
color: c.bodyText,
@@ -1151,7 +1151,7 @@ void clientAddress
<!-- TEMPLATE 12: CORPORATE -->
<!-- ================================================================ -->
<div
v-else-if="template.id === 'corporate'"
v-else-if="template.layout === 'corporate'"
:style="{
backgroundColor: c.background,
color: c.bodyText,
@@ -1249,7 +1249,7 @@ void clientAddress
<!-- TEMPLATE 13: FRESH -->
<!-- ================================================================ -->
<div
v-else-if="template.id === 'fresh'"
v-else-if="template.layout === 'fresh'"
:style="{
backgroundColor: c.background,
color: c.bodyText,
@@ -1352,7 +1352,7 @@ void clientAddress
<!-- TEMPLATE 14: NATURAL -->
<!-- ================================================================ -->
<div
v-else-if="template.id === 'natural'"
v-else-if="template.layout === 'natural'"
:style="{
backgroundColor: c.background,
color: c.bodyText,
@@ -1452,7 +1452,7 @@ void clientAddress
<!-- TEMPLATE 15: STATEMENT -->
<!-- ================================================================ -->
<div
v-else-if="template.id === 'statement'"
v-else-if="template.layout === 'statement'"
:style="{
backgroundColor: c.background,
color: c.bodyText,