chore(badges): tidy badge template form grouping and advanced cfg_json

This commit is contained in:
Scott Idem
2026-04-08 13:29:11 -04:00
parent b02843e467
commit ef5c807c27

View File

@@ -252,82 +252,95 @@ function handle_cancel() {
<form onsubmit={prevent_default(handle_submit)} class="space-y-4 p-4">
<h3 class="h3">{template_id ? 'Edit' : 'Create New'} Badge Template</h3>
<label class="label">
<span>Template Name</span>
<input type="text" bind:value={name} class="input" required />
</label>
<section class="space-y-3">
<h4 class="font-semibold">General</h4>
<label class="label">
<span>Template Name</span>
<input type="text" bind:value={name} class="input" required />
</label>
<label class="label">
<span>Background Image Path (URL) — full-badge background, replaces header</span>
<input type="text" bind:value={background_image_path} class="input" />
</label>
{#if background_image_path}
<p class="text-xs text-amber-600 dark:text-amber-400">
⚠ When a background image is set, the header path and logo/text header are hidden on the badge front — the background image covers the full badge.
</p>
{/if}
</section>
<label class="label">
<span>Background Image Path (URL) — full-badge background, replaces header</span>
<input type="text" bind:value={background_image_path} class="input" />
</label>
{#if background_image_path}
<p class="text-xs text-amber-600 dark:text-amber-400">
⚠ When a background image is set, the header path and logo/text header are hidden on the badge front — the background image covers the full badge.
</p>
{/if}
<section class="space-y-3">
<h4 class="font-semibold">Header & Branding</h4>
<label class="label">
<span>Header Path (URL) — top banner image (used when no background image)</span>
<input type="text" bind:value={header_path} class="input" />
</label>
<label class="label">
<span>Logo Path (URL, if no Header Path)</span>
<input type="text" bind:value={logo_path} class="input" />
</label>
<label class="label">
<span>Header Row 1 Text (HTML allowed)</span>
<textarea bind:value={header_row_1} class="textarea" rows="2"
></textarea>
</label>
<label class="label">
<span>Header Row 2 Text (HTML allowed)</span>
<textarea bind:value={header_row_2} class="textarea" rows="2"
></textarea>
</label>
<label class="label">
<span>Secondary Header Path (URL, back of badge)</span>
<input type="text" bind:value={secondary_header_path} class="input" />
</label>
</section>
<label class="label">
<span>Header Path (URL) — top banner image (used when no background image)</span>
<input type="text" bind:value={header_path} class="input" />
</label>
<label class="label">
<span>Logo Path (URL, if no Header Path)</span>
<input type="text" bind:value={logo_path} class="input" />
</label>
<label class="label">
<span>Header Row 1 Text (HTML allowed)</span>
<textarea bind:value={header_row_1} class="textarea" rows="2"
></textarea>
</label>
<label class="label">
<span>Header Row 2 Text (HTML allowed)</span>
<textarea bind:value={header_row_2} class="textarea" rows="2"
></textarea>
</label>
<label class="label">
<span>Secondary Header Path (URL, back of badge)</span>
<input type="text" bind:value={secondary_header_path} class="input" />
</label>
<section class="space-y-3">
<h4 class="font-semibold">Footer</h4>
<label class="label">
<span>Footer Text (HTML allowed)</span>
<textarea bind:value={footer_text} class="textarea" rows="2"></textarea>
</label>
</section>
<label class="label">
<span>Footer Text (HTML allowed)</span>
<textarea bind:value={footer_text} class="textarea" rows="2"></textarea>
</label>
<section class="space-y-3">
<h4 class="font-semibold">QR & Wireless</h4>
<label class="label flex items-center gap-2">
<input type="checkbox" bind:checked={show_qr_front} class="checkbox" />
<span>Show QR Code on Front</span>
</label>
<label class="label flex items-center gap-2">
<input type="checkbox" bind:checked={show_qr_back} class="checkbox" />
<span>Show QR Code on Back</span>
</label>
<label class="label">
<span>Wireless SSID</span>
<input type="text" bind:value={wireless_ssid} class="input" />
</label>
<label class="label">
<span>Wireless Password</span>
<input type="text" bind:value={wireless_password} class="input" />
</label>
</section>
<label class="label flex items-center gap-2">
<input type="checkbox" bind:checked={show_qr_front} class="checkbox" />
<span>Show QR Code on Front</span>
</label>
<label class="label flex items-center gap-2">
<input type="checkbox" bind:checked={show_qr_back} class="checkbox" />
<span>Show QR Code on Back</span>
</label>
<label class="label">
<span>Wireless SSID</span>
<input type="text" bind:value={wireless_ssid} class="input" />
</label>
<label class="label">
<span>Wireless Password</span>
<input type="text" bind:value={wireless_password} class="input" />
</label>
<label class="label">
<span>Ticket 1 Text (HTML allowed)</span>
<textarea bind:value={ticket_1_text} class="textarea" rows="2"
></textarea>
</label>
<label class="label">
<span>Ticket 2 Text (HTML allowed)</span>
<textarea bind:value={ticket_2_text} class="textarea" rows="2"
></textarea>
</label>
<label class="label">
<span>Ticket 3 Text (HTML allowed)</span>
<textarea bind:value={ticket_3_text} class="textarea" rows="2"
></textarea>
</label>
<section class="space-y-3">
<h4 class="font-semibold">Tickets</h4>
<label class="label">
<span>Ticket 1 Text (HTML allowed)</span>
<textarea bind:value={ticket_1_text} class="textarea" rows="2"
></textarea>
</label>
<label class="label">
<span>Ticket 2 Text (HTML allowed)</span>
<textarea bind:value={ticket_2_text} class="textarea" rows="2"
></textarea>
</label>
<label class="label">
<span>Ticket 3 Text (HTML allowed)</span>
<textarea bind:value={ticket_3_text} class="textarea" rows="2"
></textarea>
</label>
</section>
<section class="border-t pt-3">
<button type="button" class="text-sm text-surface-500" onclick={() => (advanced_open = !advanced_open)}>