Scott.Idem/OSIT-AE-App-Svelte
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Changes. Work on new review page searching.

Browse Source
This commit is contained in:
Scott Idem
2024-03-06 20:39:38 -05:00
parent aa712284ce
commit b020ded01c
11 changed files with 848 additions and 182 deletions
Download Patch File Download Diff File Expand all files Collapse all files

154
src/lib/ae_events_stores.ts Normal file
View File

@@ -0,0 +1,154 @@
import { localStorageStore } from '@skeletonlabs/skeleton';
import { writable } from 'svelte/store';
import type { Writable } from 'svelte/store';
import type { key_val } from '$lib/ae_stores';
/* *** BEGIN *** Initialize events_local_data_struct */
// Longer-term app data. This should be stored to *local* storage.
// Updated 2024-03-06
let events_local_data_struct: key_val = {
'ver': '2024-03-06_17',
// Shared
'name': 'Aether - Events (SvelteKit 2.x Svelte 4.x)',
'title': `OSIT's Æ Events - Dev SvelteKit`, // Æ
'ds': {},
'events_cfg_json': {},
'default__event_id': null, // OSIT Demo pjrcghqwert
'default__location_id': null,
'default__session_id': null,
// all, disabled, enabled
'qry__enabled': 'enabled',
// all, hidden, not_hidden
'qry__hidden': 'not_hidden',
'qry__limit': 20,
'qry__offset': 0,
// Badge Printing
'badges': {
'show_element__cfg': true,
'show_element__cfg_detail': false,
'show_element__access_type': true,
'theme_mode': 'dark',
'theme_name': 'wintry',
'classes__form': 'border border-surface-200 p-4 space-y-4 rounded-container-token',
},
// Lead Retrievals (Exhibit)
// Presentation Management (Distributing)
// Speakers Management (Collection)
'speakers': {
'default__session_id': null, // Assign to new presenters by default
status__submit: null, // 'saving', 'created', 'updated'
},
// other
}
console.log(`AE Stores - App Events Local Storage Data:`, events_local_data_struct);
// This works, but does not uses local storage:
// export let ae_loc = writable(events_local_data_struct);
// This works and uses *local* storage:
export let events_loc: Writable<key_val> = localStorageStore('ae_ events_loc', events_local_data_struct);
// console.log(`AE Stores - App Local Storage Data:`, get(ae_loc));
/* *** BEGIN *** Initialize events_session_data_struct */
// Temporary app data. This should be stored to session storage.
// Updated 2024-03-06
let events_session_data_struct: key_val = {
'ver': '2024-03-06_17',
// Shared
'ds': {
'submit_status': null,
},
'ds_loaded': {
},
// Badge Printing
'badges': {
'status_qry__search': null,
},
// Lead Retrievals (Exhibit)
// Presentation Management (Distributing)
// Speakers Management (Collection)
// other
};
console.log(`AE Stores - App Events Session Storage Data:`, events_session_data_struct);
export let events_sess = writable(events_session_data_struct);
/* *** BEGIN *** Initialize ae_events_slct */
// Updated 2024-03-06
let events_slct_obj_template: key_val = {
// Top level
'event_id': null,
'event_obj': {},
'event_obj_li': [],
// Sub-level event_
'abstract_id': null,
'abstract_obj': {},
'abstract_obj_li': [],
'badge_id': null,
'badge_obj': {},
'badge_obj_li': [],
'badge_template_id': null,
'badge_template_obj': {},
'badge_template_obj_li': [],
'device_id': null,
'device_obj': {},
'device_obj_li': [],
'exhibit_id': null,
'exhibit_obj': {},
'exhibit_obj_li': [],
// Rename these to badge_tracking_*?
'exhibit_tracking_id': null,
'exhibit_tracking_obj': {},
'exhibit_tracking_obj_li': [],
'file_id': null,
'file_obj': {},
'file_obj_li': [],
'location_id': null,
'location_obj': {},
'location_obj_li': [],
'person_id': null,
'person_obj': {},
'person_obj_li': [],
'presentation_id': null,
'presentation_obj': {},
'presentation_obj_li': [],
'presenter_id': null,
'presenter_obj': {},
'presenter_obj_li': [],
'session_id': null,
'session_obj': {},
'session_obj_li': [],
};
// console.log(`AE Stores - Selected Events Objects:`, events_slct_obj_template);
// This works, but does not uses local storage:
// export let slct = writable(events_slct_obj_template);
// This works and uses *local* storage:
export let events_slct: Writable<key_val> = localStorageStore('ae_events_slct', events_slct_obj_template);
/* *** BEGIN *** Initialize ae_events_trigger */
// Updated 2024-03-06
export let events_trigger: any = writable(null);
// console.log(`AE Stores - Selected Trigger:`, ae_events_trigger);

4
src/lib/ae_stores.ts
View File

@@ -36,8 +36,8 @@ export type key_val = {
// *** BEGIN *** Longer-term app data. This should be stored to local storage.
export let ae_app_local_data_struct: key_val = {
'ver': '2024-03-04_10',
'name': 'Aether App SvelteKit Template',
'ver': '2024-03-06_18',
'name': 'Aether - App Hub (SvelteKit 2.x Svelte 4.x)',
'theme': 'light',
'iframe': false,
'title': `OSIT's Æ - Dev SvelteKit`, // &AElig;

3
src/lib/element_data_store.svelte
View File

@@ -9,10 +9,11 @@ import { ae_util } from '$lib/ae_utils';
import type { key_val } from '$lib/ae_stores';
export let ds_code: string;
export let ds_name: string;
export let ds_name: null|string = null;
export let ds_type: string = 'text';
export let for_type: null|string;
export let for_id: null|string;
console.log(`ae_e_data_store ${ds_code} for_type=${for_type} for_id=${for_id}`);
export let store: string = 'local';
export let display: string = 'block';

6
src/routes/+layout.ts
View File

@@ -244,7 +244,7 @@ export async function load({ params, url }) { // params, route, url
data_struct['ae_ds'] = ds_code_li;
console.log(`root layout.ts finally load...`);
console.log(`ae_root +layout.ts loaded inital DS`);
return true;
});
@@ -294,10 +294,12 @@ export async function load({ params, url }) { // params, route, url
// }
// data_struct['ae_loc'] = loading_results;
console.log(`ae_root +layout.ts load after DS loading?`);
return data_struct;
}
console.log(`ae_root layout.ts load is finally finished`);
// Currently we should never make it to this point! 2024-03-06
console.log(`ae_root +layout.ts load function end`);
return data_struct;
}

76
src/routes/events_badges/+layout.svelte
View File

@@ -2,6 +2,82 @@
/** @type {import('./$types').LayoutData} */
export let data;
import { goto } from '$app/navigation';
import type { Writable } from 'svelte/store';
import { localStorageStore } from '@skeletonlabs/skeleton';
import type { key_val } from '$lib/ae_stores';
// import { ae_util } from '$lib/ae_utils';
import { api } from '$lib/api';
import { ae_loc, ae_sess, ae_api, slct } from '$lib/ae_stores';
import { events_loc, events_slct, events_trigger } from '$lib/ae_events_stores';
// import Element_data_store from '$lib/element_data_store.svelte';
// let ae_slct_loc: Writable<key_val> = localStorageStore(`ae_slct__event_id`, ds_code_obj);
// console.log(`ae_ Data Store ${ds_code} = `, $ae_slct_loc);
let ae_promises: key_val = {};
if (data.url.searchParams.get('event_id')) {
$events_slct.event_id = data.url.searchParams.get('event_id');
}
if ($events_slct.event_id) {
$events_trigger = 'load__event_obj';
}
// Updated 2024-03-06
$: if ($events_trigger == 'load__event_obj' && $events_slct.event_id) {
console.log(`$events_slct.event_id=${$events_slct.event_id}`);
$events_trigger = null;
let load_obj_results = handle_load_ae_obj_id__event({event_id: $events_slct.event_id, try_cache: false})
.then(function (load_obj_results) {
if (load_obj_results) {
console.log(`load_obj_results=`, load_obj_results);
} else {
console.log('No results returned.');
}
});
$events_slct.event_obj = load_obj_results;
console.log(`load_obj_results=`, load_obj_results);
}
// Updated 2024-03-06
async function handle_load_ae_obj_id__event({event_id, try_cache=false}) {
console.log(`*** handle_load_ae_obj_id__event() *** event_id=${event_id}`);
let params = {};
// $events_sess.badges.status_load__event_obj = 'loading';
ae_promises.load__event_obj = await api.get_ae_obj_id_crud({
api_cfg: $ae_api,
obj_type: 'event',
obj_id: event_id, // NOTE: This is the FQDN, not normally the ID.
use_alt_table: false, // NOTE: This will use the table_name_alt value instead of the table_name value in the API config.
use_alt_base: false, // NOTE: This will use the base_name_alt value instead of the base_name value in the API config.
params: params,
log_lvl: 0
})
.then(function (event_obj_get_result) {
if (event_obj_get_result) {
return event_obj_get_result;
} else {
console.log('No results returned.');
return null;
}
})
.catch(function (error) {
console.log('No results returned or failed.', error);
});
return ae_promises.load__event_obj;
}
</script>

33
src/routes/events_badges/+layout.ts
View File

@@ -1,31 +1,40 @@
/** @type {import('./$types').LayoutLoad} */
import { get } from 'svelte/store';
// import { get } from 'svelte/store';
import { api } from '$lib/api';
import { ae_loc, ae_sess, ae_api, slct, slct_trigger } from '$lib/ae_stores';
import type { key_val } from '$lib/ae_stores';
// import { api } from '$lib/api';
// import { ae_loc, ae_sess, ae_api, slct, slct_trigger } from '$lib/ae_stores';
// import { ae_events_loc, ae_events_sess, ae_events_triggers, ae_events_badges_loc, ae_events_badges_sess, ae_events_badges_triggers } from '$lib/ae_events_stores';
// import { ae_events_loc, ae_events_slct, ae_events_trigger } from '$lib/ae_events_stores';
// import type { key_val } from '$lib/ae_stores';
export async function load({ params, parent, url }) { // route
// console.log(`Svelte Events Badges layout.ts data = params:`, params);
// console.log(`Svelte Events Badges layout.ts data = route:`, route);
// console.log(`Svelte Events Badges layout.ts data = url:`, url);
// console.log(`ae_events_badges +layout.ts data.params:`, params);
// console.log(`ae_events_badges +layout.ts data.route:`, route);
// console.log(`ae_events_badges +layout.ts data.url:`, url);
// const { ae_init, root_layout_ts } = await parent();
let data = await parent();
console.log(`Svelte Events Badges layout.ts data = data:`, data);
// console.log(`ae_events_badges +layout.ts data:`, data);
if (data.ae_loc.account_id) {
console.log(`ae_events_badges +layout.ts data = data.ae_loc:`, data.ae_loc);
} else {
console.log(`ae_events_badges +layout.ts data = data.ae_loc:`, data.ae_loc);
}
data.ae_events_badges_layout_ts = true;
let submenu = {
main: {name: 'Main', href: '/events_badges', access: false},
manage: {name: 'Manage', href: '/events_badges/manage', access: 'administrator', disable: true},
review: {name: 'Review', href: '/events_badges/review', access: false},
print: {name: 'Print', href: '/events_badges/print', access: 'trusted', disable: true},
manage: {name: 'Manage', href: '/events_badges/manage', access: 'administrator', disable: true, hide: true},
review: {name: 'Review', href: '/events_badges/review', access: false, disable: false, hide: false},
print: {name: 'Print', href: '/events_badges/print', access: 'trusted', disable: false, hide: false},
view: {name: 'View', href: '/events_badges/view', access: 'trusted', hide: true}, // event_badge_id
// new: {name: 'New', href: '/events_badges/new'},
test: {name: 'Test', href: '/sponsorships'},
// sponsorships: {name: 'Sponsorships', href: '/sponsorships', disable: true, hide: true},
};
data.submenu = submenu

25
src/routes/events_badges/+page.svelte
View File

@@ -1,18 +1,28 @@
<script lang="ts">
export let data;
// console.log(`ae_ Svelte Events Badges +page data:`, data);
console.log(`ae_events_badges +page data:`, data);
console.log(`ae_events_badges Data Params:`, data.url.searchParams.get('event_id'));
import { onMount } from 'svelte';
import { api } from '$lib/api';
import { ae_loc, ae_sess, ae_api, slct, slct_trigger } from '$lib/ae_stores';
import { events_loc, events_slct, events_trigger } from '$lib/ae_events_stores';
import { ae_util } from '$lib/ae_utils';
import Element_data_store from '$lib/element_data_store.svelte';
if (data.url.searchParams.get('event_id')) {
$events_slct.event_id = data.url.searchParams.get('event_id');
}
onMount(() => {
console.log('Events Badges: +page.svelte');
console.log('ae_ slct:', $slct);
let href_url = window.location.href;
// console.log(href_url);
@@ -20,11 +30,11 @@ onMount(() => {
// console.log(`$ae_loc.href_url = `, $ae_loc.href_url);
// $slct_trigger = 'msg_parent';
ae_util.handle_url_and_message('event_id', $slct.event_id);
ae_util.handle_url_and_message('event_badge_id', $slct.event_badge_id);
// if ($slct.event_badge_id) {
ae_util.handle_url_and_message('event_id', $events_slct.event_id);
ae_util.handle_url_and_message('badge_id', $events_slct.badge_id);
// if ($events_slct.badge_id) {
// console.log(`Got an ID. Let's show the modal!`);
// modalStore.trigger(modal_edit__event_badge_obj);
// modalStore.trigger(modal_edit__badge_obj);
// }
});
</script>
@@ -38,17 +48,18 @@ onMount(() => {
ds_code="events__badges__overview"
ds_type="html"
for_type="event"
for_id={$slct.event_id}
for_id={$events_slct.event_id}
display="block"
class_li="variant-ghost-surface p-2"
/>
<a href="/{$events_slct.event_id}">Event ID {$events_slct.event_id}</a>
<Element_data_store
ds_code="events__badges__example"
ds_type="html"
for_type="event"
for_id={$slct.event_id}
for_id={$events_slct.event_id}
ds_name="Default: Events Badges Example"
store="local"
display="block"

142
src/routes/events_badges/review/+layout.ts Normal file
View File

@@ -0,0 +1,142 @@
/** @type {import('./$types').LayoutLoad} */
import { get } from 'svelte/store';
import type { key_val } from '$lib/ae_stores';
// import { ae_util } from '$lib/ae_utils';
// import { api } from '$lib/api';
import { ae_loc, ae_sess, ae_api, slct, slct_trigger } from '$lib/ae_stores';
// import { events_loc, events_slct, events_trigger } from '$lib/ae_events_stores';
export async function load({ params, parent, url }) { // route
console.log(`ae_events_badges [slug] +layout.ts data.params:`, params);
// console.log(`ae_events_badges [slug] +layout.ts data.route:`, route);
// console.log(`ae_events_badges [slug] +layout.ts data.url:`, url);
let data = await parent();
console.log(`Svelte Events Badges [slug] +layout.ts data = data:`, data);
let ae_loc_tmp = get(ae_loc);
console.log(`ae_loc = `, ae_loc_tmp);
let ds_code_li: null|key_val = ae_loc_tmp.ds;
console.log(`ae_ ds_code_li = `, ds_code_li);
let ds_code: null|string = null;
let ds_type: null|string = null;
let data_struct = {
ae_init: ae_loc_tmp,
params: params,
sections: [
{ slug: 'new', title: 'New Event Badge' },
{ slug: 'manage', title: 'Manage' },
{ slug: 'test', title: 'Test' },
],
url: url,
};
let loading_results = null;
ds_code = 'hub__page__events_badges__create_info';
ds_type = 'text';
// loading_results = await handle_get_data_store_obj_w_code({ code: ds_code })
// .then( function (ds_hub_page_events_create_info_results) {
// if (ds_hub_page_events_create_info_results) {
// console.log(`ae_ hub__page__events_badges__create_info = `, ds_hub_page_events_create_info_results);
// // let ae_loc_tmp = get(ae_loc);
// ds_code_li[ds_code] = ds_hub_page_events_create_info_results;
// // ae_loc.set(ae_loc_tmp);
// // console.log(`ae_loc = `, get(ae_loc));
// }
// })
// .finally(function () {
// console.log(`ae_ ds_code_li = `, ds_code_li);
// ae_loc_tmp = {
// ...ae_loc_tmp,
// 'ds': ds_code_li,
// }
// console.log(`ae_loc_tmp = `, ae_loc_tmp);
// ae_loc.set(ae_loc_tmp);
// console.log(`ae_loc = `, get(ae_loc));
// });
// loading_results = await api.get_data_store_obj_w_code({
// api_cfg: get(ae_api),
// data_store_code: ds_code,
// data_type: ds_type,
// log_lvl: 0
// })
// .then( function (ds_results) {
// if (ds_results) {
// console.log(`ae_ Data Store ${ds_code} = `, ds_results);
// // let ae_loc_tmp = get(ae_loc);
// ds_code_li[ds_code] = ds_results.text;
// // ae_loc.set(ae_loc_tmp);
// // console.log(`ae_loc = `, get(ae_loc));
// }
// })
// .finally(function () {
// console.log(`ae_ ds_code_li = `, ds_code_li);
// ae_loc_tmp = {
// ...ae_loc_tmp,
// 'ds': ds_code_li,
// }
// console.log(`ae_loc_tmp = `, ae_loc_tmp);
// ae_loc.set(ae_loc_tmp);
// console.log(`ae_loc = `, get(ae_loc));
// });
return data_struct;
}
// async function handle_get_data_store_obj_w_code({ code=null, data_type='text' }) {
// console.log(`*** handle_get_data_store_obj_w_code() *** code=${code}`);
// if (!code) {
// console.log('No code provided.');
// return;
// }
// let data_store_obj_get_promise = api.get_data_store_obj_w_code({
// api_cfg: get(ae_api),
// data_store_code: code,
// data_type: data_type,
// log_lvl: 0
// })
// .then(function (get_data_store_result) {
// let return_this = null;
// if (get_data_store_result) {
// if (data_type == 'text') {
// // console.log(get_data_store_result.text);
// return_this = get_data_store_result.text;
// } else if (data_type == 'json') {
// // console.log(get_data_store_result.json);
// return_this = get_data_store_result.json;
// }
// } else {
// console.log('No results returned.');
// return_this = null;
// }
// return return_this;
// })
// .catch(function (error) {
// console.log('No results returned or failed.', error);
// });
// return data_store_obj_get_promise;
// }

425
src/routes/events_badges/review/+page.svelte Normal file
View File

@@ -0,0 +1,425 @@
<script lang="ts">
export let data;
console.log(`ae_events_badges [slug] +page data:`, data);
import { onMount } from 'svelte';
// https://github.com/skeletonlabs/skeleton/blob/master/packages/skeleton/src/lib/utilities/Modal/types.ts
// To retrieve the store, getModalStore must be invoked at the top level of your component!
// import { getDrawerStore, getModalStore } from '@skeletonlabs/skeleton';
// import type {
// DrawerSettings,
// ModalSettings,
// ModalComponent,
// ModalStore
// } from '@skeletonlabs/skeleton';
// const modalStore = getModalStore();
import type { key_val } from '$lib/ae_stores';
import { ae_util } from '$lib/ae_utils';
import { api } from '$lib/api';
import { ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$lib/ae_stores';
import { events_loc, events_sess, events_slct, events_trigger } from '$lib/ae_events_stores';
// import Edit_modal_event_badge from '../10_edit_modal__event_badge_obj.svelte';
let ae_promises: key_val = {};
let load_obj_li_results: Promise<any>|key_val;
// Editing
// const modalComponentEditEventPresenterObj: ModalComponent = { ref: Edit_modal_event_badge, props: {container_class_li: 'w-full p-4 space-y-4 card'} };
// const modal_edit__event_badge: ModalSettings = {
// type: 'component',
// component: modalComponentEditEventPresenterObj,
// title: 'Edit Badge Submission',
// position: '', // default is "items-center"
// response: (r: boolean | undefined) => handle_modal_close(r)
// };
// This function waits for the response from one of the modals. Do stuff when the modal is closed.
function handle_modal_close(response: boolean | undefined) {
console.log('Modal closed. Response:', response);
ae_util.handle_url_and_message('event_badge_id', null);
// We want to keep these values in case they want to re-open the modal. Do NOT clear.
// $events_slct.event_badge_id = null;
// $events_slct.event_badge_obj = null;
}
if ($events_trigger == 'msg_parent' && $events_slct.event_id) {
console.log(`Message parent with event_id ${$events_slct.event_id}`);
$events_trigger = null
let message = {'event_id': $events_slct.event_id};
window.parent.postMessage(message, "*");
// console.log('Message sent to parent (iframe):', message);
}
$ae_loc.hostname = data.url.hostname;
$ae_loc.site_domain = data.url.origin;
// We don't want the edit or view to show up by default. Maybe if we see an object ID param in the URL, we can show a modal.
$events_loc.show_edit__event_badge_obj = false;
$events_loc.show_view__event_badge_obj = false;
let ae_event_badge_get_promise: Promise<any>;
let ae_event_obj_get_promise;
// Load the AE Obj with ID based on the URL param.
if (data.url.searchParams.get('event_id')) {
console.log(`Got an event_id: ${data.url.searchParams.get('event_id')}`);
$events_slct.event_id = data.url.searchParams.get('event_id');
}
if ($events_slct.event_id) {
console.log('Selected Event ID:', $events_slct.event_id);
$events_trigger = 'load__event_badge_obj_li';
// $events_trigger = 'load__event_obj';
}
onMount(() => {
console.log('Events Badges [New/Edit]: +page.svelte');
// console.log(`$ae_loc = `, $ae_loc);
let url = window.location.href;
// console.log(url);
$ae_loc.href_url = url;
// console.log(`$ae_loc.href_url = `, $ae_loc.href_url);
// ae_util.handle_url_and_message('event_badge_id', $events_slct.event_badge_id);
// if ($events_slct.event_badge_id) {
// console.log(`Got an ID. Let's show the modal!`);
// modalStore.trigger(modal_edit__event_badge);
// } else {
// console.log(`No ID. Nothing to show.`);
// }
});
// console.log(`$ae_loc = `, $ae_loc);
// $ae_loc.href_url = url;
// console.log(`$ae_loc.href_url = `, $ae_loc.href_url);
$: if ($events_trigger == 'load__event_obj' && $events_slct.event_id) {
console.log('Selected Event ID:', $events_slct.event_id);
$events_trigger = null;
handle_load_ae_obj_id__event({event_id: $events_slct.event_id, try_cache: false});
}
async function handle_load_ae_obj_id__event({event_id, try_cache=false}) {
console.log(`*** handle_load_ae_obj_id__event() *** event_id=${event_id}`);
let params = {};
// $events_sess.status_load__event_id = 'loading';
ae_event_obj_get_promise = api.get_ae_obj_id_crud({
api_cfg: $ae_api,
obj_type: 'event',
obj_id: event_id,
use_alt_table: false, // NOTE: This will use the table_name_alt value instead of the table_name value in the API config.
use_alt_base: false, // NOTE: This will use the base_name_alt value instead of the base_name value in the API config.
params: params,
log_lvl: 0
})
.then(function (event_obj_get_result) {
if (event_obj_get_result) {
$events_slct.event_obj = event_obj_get_result;
console.log(`event object:`, $events_slct.event_obj);
}
// Auto show the selected event_badge ID
// Is this pushState needed here?
// Set the URL param "event_id" to the current event_badge ID.
// const url = new URL(location);
// url.searchParams.set('event_id', $events_slct.event_id);
// history.pushState({}, '', url);
// Is this postMessage needed here?
// let message = {'event_id': $events_slct.event_id};
// window.parent.postMessage(message, "*");
// modalStore.trigger(modal_view__event_obj);
})
.catch(function (error) {
console.log('No results returned or failed.', error);
});
return ae_event_obj_get_promise;
}
// Load the Event Presenter Obj with ID based on the URL param.
// $events_slct.event_badge_id = data.url.searchParams.get('ae_id');
$events_slct.event_badge_id = data.url.searchParams.get('event_badge_id');
if ($events_slct.event_badge_id) {
console.log('Selected Event Presenter ID:', $events_slct.event_badge_id);
$events_trigger = 'load__event_badge';
// $events_loc.show_edit__event_badge_obj = true;
// $events_trigger = 'show_edit__event_badge';
}
$: if ($events_trigger == 'load__event_badge' && $events_slct.event_badge_id) {
console.log('Selected Event Presenter ID:', $events_slct.event_badge_id);
$events_trigger = null;
handle_load_ae_obj_id__event_badge({event_badge_id: $events_slct.event_badge_id, try_cache: false});
// modalStore.trigger(modal_edit__event_badge);
// $events_trigger = 'show_edit__event_badge';
}
async function handle_load_ae_obj_id__event_badge({event_badge_id, try_cache=false}) {
console.log(`*** handle_load_ae_obj_id__event_badge() *** event_badge_id=${event_badge_id}`);
let params = {};
// $ae_loc.hub.event_badge_id_status_qry__search = 'loading';
ae_event_badge_get_promise = api.get_ae_obj_id_crud({
api_cfg: $ae_api,
obj_type: 'event_badge',
obj_id: event_badge_id,
use_alt_table: false, // NOTE: This will use the table_name_alt value instead of the table_name value in the API config.
use_alt_base: false, // NOTE: This will use the base_name_alt value instead of the base_name value in the API config.
params: params,
log_lvl: 0
})
.then(function (event_badge_get_result) {
if (event_badge_get_result) {
$events_slct.event_badge_obj = event_badge_get_result;
console.log(`event_badge object:`, $events_slct.event_badge);
}
// Auto show the selected event_badge ID
// Is this pushState needed here?
// Set the URL param "event_badge_id" to the current event_badge ID.
// const url = new URL(location);
// url.searchParams.set('event_badge_id', $events_slct.event_badge_id);
// history.pushState({}, '', url);
// Is this postMessage needed here?
// let message = {'event_badge_id': $events_slct.event_badge_id};
// window.parent.postMessage(message, "*");
})
.catch(function (error) {
console.log('No results returned or failed.', error);
});
return ae_event_badge_get_promise;
}
// Updated 2024-03-06 late
$: if ($events_trigger == 'load__event_badge_obj_li' && $events_slct.event_id) {
console.log(`$events_slct.event_id=${$events_slct.event_id}`);
$events_trigger = null;
load_obj_li_results = handle_load_ae_obj_li__badge({event_id: $events_slct.event_id, try_cache: false})
.then(function (load_obj_li_results) {
if (load_obj_li_results) {
console.log(`load_obj_li_results=`, load_obj_li_results);
} else {
console.log('No results returned.');
}
// return load_obj_li_results;
console.log(`load_obj_li_results=`, load_obj_li_results);
$events_slct.badge_obj_li = load_obj_li_results;
});
}
// Updated 2024-03-06
async function handle_load_ae_obj_li__badge({event_id, try_cache=true}) {
console.log(`*** handle_load_ae_obj_li__badge() *** event_id=${event_id}`);
let enabled = $events_loc.qry_enabled;
let hidden = $events_loc.qry__hidden;
let limit = $events_loc.qry__limit;
let offset = $events_loc.qry__offset;
if ($ae_loc.trusted_access) {
// enabled = 'all';
hidden = 'all';
limit = 30;
}
let params = {};
let params_json: key_val = {};
// console.log('params_json:', params_json);
// console.log(params_json);
$events_sess.badges.status_qry__search = 'loading';
ae_promises.load__event_badge_obj_li = await api.get_ae_obj_li_for_obj_id_crud({
api_cfg: $ae_api,
obj_type: 'event_badge',
for_obj_type: 'event',
for_obj_id: event_id,
use_alt_table: false, // NOTE: This will use the table_name_alt value instead of the table_name value in the API config.
use_alt_base: false, // NOTE: This will use the base_name_alt value instead of the base_name value in the API config.
enabled: enabled,
hidden: hidden,
order_by_li: {'priority': 'DESC', 'sort': 'DESC', 'updated_on': 'DESC', 'created_on': 'DESC'},
// order_by_li: {'priority': 'DESC', 'sort': 'DESC', 'created_on': 'DESC', 'updated_on': 'DESC'},
limit: limit,
offset: offset,
params_json: params_json,
params: params,
log_lvl: 0
})
.then(function (badge_obj_li_get_result) {
if (badge_obj_li_get_result) {
// $slct.badge_obj_li = badge_obj_li_get_result;
return badge_obj_li_get_result;
} else {
// $slct.badge_obj_li = [];
return [];
}
})
.catch(function (error) {
console.log('No results returned or failed.', error);
});
// .finally(function () {
// $events_sess.badges.status_qry__search = 'done';
// // console.log('Sponsorship list:', $slct.badge_obj_li);
// });
return ae_promises.load__event_badge_obj_li;
}
</script>
<section
class="ae_events_badges_review md:container h-full mx-auto"
>
{#if $ae_loc.ds.hub__page__events_badges__create_info_header}
{@html $ae_loc.ds.hub__page__events_badges__create_info_header}
{:else}
<header>
<h1 class="h2">Badge Review - Search</h1>
</header>
{/if}
<!-- <section class="btn btn-group"> -->
<button
class="btn variant-ghost-primary w-96"
on:click={() => {
$events_trigger = 'load__event_badge_obj_li';
$events_trigger = $events_trigger;
// handle_badge_search('event_id', null);
// modalStore.trigger(modal_edit__event_badge);
// $events_trigger = 'load__event_badge';
// $events_loc.show_edit__event_badge_obj = true;
// modalStore.trigger(modal_edit__event_badge);
}}
>
<span class="fas fa-search mx-1"></span>
Search
</button>
{#await load_obj_li_results}
<div class="modal-loading">
<span class="fas fa-spinner fa-spin"></span>
<span class="loading-text">
Loading...
</span>
</div>
{:then load_obj_li_results}
{#if load_obj_li_results}
<span class="fas fa-check text-green-500"></span>
<span class="saved-text">
Loaded
</span>
{/if}
{/await}
{#if $events_slct.badge_obj_li && $events_slct.badge_obj_li.length}
<h2 class="h3">Results:</h2>
<table class="table">
<thead>
<tr>
<th>Badge</th>
<!-- The email should only be the first 3 chars and then @domain name. -->
<th>Email</th>
<th>Affiliations</th>
</tr>
</thead>
<tbody>
{#each $events_slct.badge_obj_li as badge_obj}
<tr>
<td>
<button
class="btn variant-ghost-secondary w-96"
on:click={() => {
ae_util.handle_url_and_message('event_badge_id', badge_obj.event_badge_id_random);
// modalStore.trigger(modal_edit__event_badge);
// $events_trigger = 'load__event_badge';
// $events_trigger = 'show_edit__event_badge';
// $events_loc.show_edit__event_badge_obj = true;
// modalStore.trigger(modal_edit__event_badge);
}}
>
<span class="fas fa-id-badge mx-1"></span>
Badge: {badge_obj.full_name}
</button>
</td>
<td>
<!-- The email should only be the first 3 chars and then @domain name. -->
<!-- Example: original: scott.idem@oneskyit.com obscured: sco...@oneskyit.com -->
<span class="fas fa-envelope mx-1"></span>
{badge_obj.email ? badge_obj.email.replace(/^(.{3}).*@/, '$1...@') : ''}
</td>
<td>
<span class="fas fa-users mx-1"></span>
{badge_obj.affiliations}
</td>
</tr>
{/each}
</tbody>
</table>
{:else}
<div class="alert alert-info">
No badges found.
</div>
{/if}
{#if $ae_loc.ds.hub__page__events_badges__create_info}
{@html $ae_loc.ds.hub__page__events_badges__create_info}
{:else}
<section>
<div class="alert alert-info">
More information goes here.
</div>
</section>
{/if}
</section>

8
src/routes/sponsorships/+layout.ts
View File

@@ -8,13 +8,13 @@ import type { key_val } from '$lib/ae_stores';
export async function load({ params, parent, url }) { // route
// console.log(`Svelte Sponsorships layout.ts data = params:`, params);
// console.log(`Svelte Sponsorships layout.ts data = route:`, route);
// console.log(`Svelte Sponsorships layout.ts data = url:`, url);
// console.log(`Svelte Sponsorships +layout.ts data.params:`, params);
// console.log(`Svelte Sponsorships +layout.ts data.route:`, route);
// console.log(`Svelte Sponsorships +layout.ts data.url:`, url);
// const { ae_init, root_layout_ts } = await parent();
let data = await parent();
console.log(`Svelte Sponsorships layout.ts data = data:`, data);
// console.log(`ae_events_badges +layout.ts data:`, data);
data.ae_sponsorships_layout_ts = true;

154
src/routes/sponsorships/hold 10_edit_modal__sponsorship_obj.svelte
View File

@@ -1,154 +0,0 @@
<script lang="ts">
import type { SvelteComponent } from 'svelte';
import { createEventDispatcher, onMount } from 'svelte';
// const dispatch = createEventDispatcher();
// import { localStorageStore } from '@skeletonlabs/skeleton';
// import type { Writable } from 'svelte/store';
// const store_current_tab: Writable<string> = localStorageStore('store_current_tab', 'start');
let store_current_tab: string = 'start';
// console.log(`store_current_tab:`, $store_current_tab);
// Stores
import { getModalStore, FileDropzone, TabGroup, Tab, TabAnchor } from '@skeletonlabs/skeleton';
import { ae_util } from '$lib/ae_utils';
import { api } from '$lib/api';
import { ae_loc, ae_sess, ae_api, slct, slct_trigger } from '$lib/ae_stores';
type key_val = {
[key: string]: any;
};
// Props
/** Exposes parent props to this component. */
export let parent: SvelteComponent;
// const modalStore = getModalStore();
onMount(() => {
console.log('** Component Mounted: ** Edit Modal - Sponsorship Obj');
});
// // Form Data
// const formData = {
// name: 'Jane Doe',
// tel: '214-555-1234',
// email: 'jdoe@email.com'
// };
// const form_data = $slct.sponsorship_obj;
// We've created a custom submit function to pass the response and close the modal.
// function onFormSubmit(): void {
// if ($modalStore[0].response) $modalStore[0].response(formData);
// modalStore.close();
// }
// let tab_set = $store_current_tab;
let tab_set = store_current_tab;
$ae_loc.mod.sponsorships.disable_submit__sponsorship_obj = false;
let placeholder_li: key_val = {
file_logo_primary: '-- No File Selected --',
file_logo_secondary: '-- No File Selected --',
file_media_promo_video: '-- No File Selected --',
};
let ae_promises_init: key_val = {};
let ae_promises: key_val = {};
// let ae_promises.api_create__sponsorship_obj: Promise<any>;
if ($slct.sponsorship_id && $slct.sponsorship_obj) {
console.log(`Sponsorship ID selected: ${$slct.sponsorship_id}`);
console.log(`Sponsorship object selected:`, $slct.sponsorship_obj);
// $slct_trigger = 'load__sponsorship_obj';
} else {
$slct.sponsorship_id = null;
$slct.sponsorship_obj = {
sponsorship_cfg_id_random: $ae_loc.mod.sponsorships.sponsorship_cfg_id,
name: null,
description: null,
poc_person_id: null,
logo_li_json: null,
media_li_json: null,
social_li_json: null,
guest_li_json: null,
level_num: null,
level_str: null,
amount: null,
paid: null,
enable: null,
};
}
// Base Classes
const cBase = 'card p-4 w-modal-wide shadow-xl space-y-4 ae_modal_scrollfix';
// const cBase = 'bg-surface-100-800-token w-screen h-screen';
// const cBase = 'card h-screen';
// const cBase = 'card p-4 w-modal-wide h-screen shadow-xl space-y-4';
const cHeader = 'text-2xl font-bold';
const cForm = 'border border-surface-200 p-4 space-y-4 rounded-container-token';
</script>
<!-- @component This is the Sponsorships modal edit form. -->
<!-- {#if $modalStore[0]} -->
<section class="modal-example-form {cBase}">
<!-- <header class={cHeader}>{$modalStore[0].title ?? '-- No Title --'}</header> -->
<header class={cHeader}>Start/Edit Sponsorship</header>
here....
<!-- </form> -->
<!-- prettier-ignore -->
<footer class="modal-footer {parent.regionFooter}">
{#if $slct.sponsorship_id}
<!-- {#if $ae_loc.administrator_access} -->
<button
on:click={() => {
// if (!confirm('Are you sure you want to delete this sponsorship?')) {return false;}
// handle_delete_sponsorship_obj({sponsorship_id: $slct.sponsorship_id, method: 'delete'});
// $slct.sponsorship_id = null;
// $slct.sponsorship_obj = {};
}}
class="btn {parent.buttonNegative}"
title="Delete record permanently"
>
<span class="fas fa-minus mx-1"></span> Delete
</button>
<!-- {/if} -->
{/if}
<button class="btn {parent.buttonNeutral}" on:click={parent.onClose}>
<span class="fas fa-window-close mx-1"></span>
{parent.buttonTextCancel}
</button>
</footer>
</section>
<!-- {/if} -->
<style>
</style>