fix: Update event settings forms for Svelte 5 reactivity

Corrected event settings components to use Svelte 5 bindable props for two-way data binding. This ensures that changes in child form components (ae_comp__event_settings_form.svelte, ae_comp__event_settings_pres_mgmt_form.svelte) are reactively reflected in the parent page (settings/+page.svelte) and properly handled during save operations.
This commit is contained in:
Scott Idem
2025-11-18 19:23:33 -05:00
parent f7d1f304fe
commit 74140f41db
3 changed files with 10 additions and 14 deletions

View File

@@ -50,7 +50,7 @@
<div>
<h2 class="h2">General Config (cfg_json)</h2>
<Ae_comp_event_settings_form
cfg_json={event_obj.cfg_json}
bind:cfg_json={event_obj.cfg_json}
on:save={(e) => handle_save('cfg_json', e.detail)}
/>
</div>
@@ -58,7 +58,7 @@
<div>
<h2 class="h2">Presentation Management (mod_pres_mgmt_json)</h2>
<Ae_comp_event_settings_pres_mgmt_form
mod_pres_mgmt_json={event_obj.mod_pres_mgmt_json}
bind:mod_pres_mgmt_json={event_obj.mod_pres_mgmt_json}
on:save={(e) => handle_save('mod_pres_mgmt_json', e.detail)}
/>
</div>

View File

@@ -6,14 +6,12 @@
cfg_json: key_val;
}
let { cfg_json }: Props = $props();
let local_cfg_json = $state(cfg_json);
let { cfg_json = $bindable() }: Props = $props();
const dispatch = createEventDispatcher();
function save() {
dispatch('save', local_cfg_json);
dispatch('save', cfg_json);
}
</script>
@@ -21,13 +19,13 @@
<div>
<label class="label">
<span>Short Name</span>
<input type="text" class="input" bind:value={local_cfg_json.short_name} />
<input type="text" class="input" bind:value={cfg_json.short_name} />
</label>
</div>
<div>
<label class="label">
<span>Medium Name</span>
<input type="text" class="input" bind:value={local_cfg_json.med_name} />
<input type="text" class="input" bind:value={cfg_json.med_name} />
</label>
</div>
<button class="btn preset-tonal-primary" on:click={save}>Save</button>

View File

@@ -6,21 +6,19 @@
mod_pres_mgmt_json: key_val;
}
let { mod_pres_mgmt_json }: Props = $props();
let local_mod_pres_mgmt_json = $state(mod_pres_mgmt_json);
let { mod_pres_mgmt_json = $bindable() }: Props = $props();
const dispatch = createEventDispatcher();
function save() {
dispatch('save', local_mod_pres_mgmt_json);
dispatch('save', mod_pres_mgmt_json);
}
</script>
<div class="space-y-4">
<div>
<label class="label">
<input type="checkbox" class="checkbox" bind:checked={local_mod_pres_mgmt_json.lock_config} />
<input type="checkbox" class="checkbox" bind:checked={mod_pres_mgmt_json.lock_config} />
<span>Lock Config</span>
</label>
</div>
@@ -29,7 +27,7 @@
<input
type="checkbox"
class="checkbox"
bind:checked={local_mod_pres_mgmt_json.hide__location_code}
bind:checked={mod_pres_mgmt_json.hide__location_code}
/>
<span>Hide Location Code</span>
</label>