chore(badges): tidy badge template form grouping and advanced cfg_json
This commit is contained in:
@@ -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)}>
|
||||
|
||||
Reference in New Issue
Block a user