feat: migration to Svelte 5
This commit is contained in:
Scott Idem
@@ -1,4 +1,6 @@
|
||||
<script lang="ts">
|
||||
import { run, preventDefault } from 'svelte/legacy';
|
||||
|
||||
import { onMount } from 'svelte';
|
||||
|
||||
import { api } from '$lib/api/api';
|
||||
@@ -6,42 +8,25 @@
|
||||
import { ae_util } from '$lib/ae_utils/ae_utils';
|
||||
import type { key_val } from '$lib/stores/ae_stores';
|
||||
|
||||
export let expire_minutes: number = 10;
|
||||
export let mount_reload_sec: number = 0;
|
||||
|
||||
export let ds_code: string;
|
||||
export let ds_name: null | string = null;
|
||||
export let ds_type: string = 'text';
|
||||
export let for_type: null | string = null;
|
||||
export let for_id: null | string = null;
|
||||
console.log(
|
||||
`ae_e_data_store ${ds_code} for_type=${for_type} for_id=${for_id} account_id=${$ae_loc.account_id}`
|
||||
);
|
||||
|
||||
// export let store: string = 'local';
|
||||
export let display: string = 'block'; // Avoid; Use class list instead
|
||||
export let class_li: string = ''; // : string[] = [];
|
||||
export let try_cache: boolean = true;
|
||||
|
||||
|
||||
export let hide: boolean = false; // Hide the entire element
|
||||
export let show_edit: boolean = false;
|
||||
export let show_edit_btn: boolean = true;
|
||||
export let show_view: boolean = true;
|
||||
// export let show_delete_btn: boolean = false;
|
||||
|
||||
|
||||
export let ds_loaded: boolean = false;
|
||||
|
||||
export let debug: boolean = false;
|
||||
|
||||
let ae_promises: key_val = {}; // Promise<any>;
|
||||
let ds_get_results: Promise<any> | key_val;
|
||||
let ds_get_results: Promise<any> | key_val = $state();
|
||||
let ds_loading_status: string = 'starting...';
|
||||
let ds_submit_results: Promise<any> | key_val;
|
||||
let ds_submit_results: Promise<any> | key_val = $state();
|
||||
|
||||
let val_json: key_val;
|
||||
let val_html: key_val;
|
||||
let val_md: key_val;
|
||||
export let val_sql: null | key_val = null;
|
||||
let val_text: string;
|
||||
|
||||
let ds_code_obj = {
|
||||
@@ -63,7 +48,7 @@
|
||||
chk_account_id: null
|
||||
};
|
||||
|
||||
let ae_ds_tmp: key_val;
|
||||
let ae_ds_tmp: key_val = $state();
|
||||
if (browser && localStorage.getItem(`ae_ds__${ds_code}`)) {
|
||||
ae_ds_tmp = JSON.parse(localStorage.getItem(`ae_ds__${ds_code}`));
|
||||
} else {
|
||||
@@ -84,13 +69,54 @@
|
||||
$ae_sess.ds.create_status = null;
|
||||
$ae_sess.ds.update_status = null;
|
||||
|
||||
let trigger: null | string = null;
|
||||
let trigger: null | string = $state(null);
|
||||
|
||||
// $: if (ae_ds_tmp) {
|
||||
// console.log(`ae_e_data_store ae_ds_loc = `, ae_ds_tmp);
|
||||
// }
|
||||
|
||||
import { browser } from '$app/environment';
|
||||
interface Props {
|
||||
expire_minutes?: number;
|
||||
mount_reload_sec?: number;
|
||||
ds_code: string;
|
||||
ds_name?: null | string;
|
||||
ds_type?: string;
|
||||
for_type?: null | string;
|
||||
for_id?: null | string;
|
||||
// export let store: string = 'local';
|
||||
display?: string; // Avoid; Use class list instead
|
||||
class_li?: string; // : string[] = [];
|
||||
try_cache?: boolean;
|
||||
hide?: boolean; // Hide the entire element
|
||||
show_edit?: boolean;
|
||||
show_edit_btn?: boolean;
|
||||
show_view?: boolean;
|
||||
// export let show_delete_btn: boolean = false;
|
||||
ds_loaded?: boolean;
|
||||
debug?: boolean;
|
||||
val_sql?: null | key_val;
|
||||
}
|
||||
|
||||
let {
|
||||
expire_minutes = 10,
|
||||
mount_reload_sec = 0,
|
||||
ds_code,
|
||||
ds_name = null,
|
||||
ds_type = 'text',
|
||||
for_type = null,
|
||||
for_id = null,
|
||||
display = 'block',
|
||||
class_li = '',
|
||||
try_cache = true,
|
||||
hide = false,
|
||||
show_edit = $bindable(false),
|
||||
show_edit_btn = true,
|
||||
show_view = $bindable(true),
|
||||
ds_loaded = $bindable(false),
|
||||
debug = false,
|
||||
val_sql = $bindable(null)
|
||||
}: Props = $props();
|
||||
|
||||
let ae_ds_loc_test: any;
|
||||
if (browser) {
|
||||
@@ -152,24 +178,6 @@
|
||||
}
|
||||
});
|
||||
|
||||
// let ds_code_li = {}; //: key_val; // = ae_loc_tmp.ds;
|
||||
// console.log(`ae_ ds_code_li = `, ds_code_li);
|
||||
|
||||
$: if (trigger == 'load__ds__code' && ds_code && ds_type) {
|
||||
console.log(
|
||||
`ae_e_data_store: ae_ load__ds__code: ${ds_code} ds_type=${ds_type} for_type=${for_type} for_id=${for_id} ${try_cache}`
|
||||
);
|
||||
|
||||
trigger = null;
|
||||
|
||||
load_data_store({
|
||||
code: ds_code,
|
||||
type: ds_type,
|
||||
for_type: for_type,
|
||||
for_id: for_id,
|
||||
try_cache: try_cache
|
||||
});
|
||||
}
|
||||
|
||||
async function load_data_store({
|
||||
code,
|
||||
@@ -476,6 +484,26 @@
|
||||
|
||||
return ae_promises.update__data_store_obj;
|
||||
}
|
||||
// let ds_code_li = {}; //: key_val; // = ae_loc_tmp.ds;
|
||||
// console.log(`ae_ ds_code_li = `, ds_code_li);
|
||||
|
||||
run(() => {
|
||||
if (trigger == 'load__ds__code' && ds_code && ds_type) {
|
||||
console.log(
|
||||
`ae_e_data_store: ae_ load__ds__code: ${ds_code} ds_type=${ds_type} for_type=${for_type} for_id=${for_id} ${try_cache}`
|
||||
);
|
||||
|
||||
trigger = null;
|
||||
|
||||
load_data_store({
|
||||
code: ds_code,
|
||||
type: ds_type,
|
||||
for_type: for_type,
|
||||
for_id: for_id,
|
||||
try_cache: try_cache
|
||||
});
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<div class="ae__elem__data_store relative {class_li}" class:hide>
|
||||
@@ -503,7 +531,7 @@
|
||||
<section class="edit z-50">
|
||||
<form
|
||||
class="ae__elem__data_store__form"
|
||||
on:submit|preventDefault={handle_submit_form}
|
||||
onsubmit={preventDefault(handle_submit_form)}
|
||||
>
|
||||
<input type="hidden" name="ds_id_random" value={ae_ds_tmp.id} />
|
||||
|
||||
@@ -637,7 +665,7 @@
|
||||
<button
|
||||
type="button"
|
||||
class="btn preset-tonal-warning"
|
||||
on:click={() => {
|
||||
onclick={() => {
|
||||
if (confirm('Are you sure you want to delete this data store?')) {
|
||||
trigger = 'delete__ds__code';
|
||||
// $slct_trigger = 'delete__ds__code';
|
||||
@@ -653,7 +681,7 @@
|
||||
<button
|
||||
type="button"
|
||||
class="btn preset-tonal-primary"
|
||||
on:click={() => {
|
||||
onclick={() => {
|
||||
show_edit = false;
|
||||
show_view = true;
|
||||
}}
|
||||
@@ -666,7 +694,7 @@
|
||||
type="submit"
|
||||
class="btn preset-tonal-primary"
|
||||
disabled={ds_submit_results instanceof Promise && !ds_submit_results}
|
||||
on:click={() => {
|
||||
onclick={() => {
|
||||
trigger = 'save__ds__code';
|
||||
// $slct_trigger = 'save__ds__code';
|
||||
}}
|
||||
@@ -740,7 +768,7 @@
|
||||
class="ae_btn_edit__ds btn hover:preset-tonal-warning text-xs absolute top-0 right-0 opacity-30 hover:opacity-100 transition delay-700 hover:delay-200 m-1 p-1"
|
||||
class:opacity-5={!$ae_loc.manager_access}
|
||||
class:hidden={!show_edit_btn || !$ae_loc.trusted_access}
|
||||
on:dblclick={() => {
|
||||
ondblclick={() => {
|
||||
trigger = 'load__ds__code';
|
||||
show_edit = true;
|
||||
show_view = false;
|
||||
|
||||
Reference in New Issue
Block a user