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

Work on new core person list, view, and edit

Browse Source
This commit is contained in:
Scott Idem
2024-07-17 14:59:15 -04:00
parent ad1e42010a
commit 625169a321
14 changed files with 1360 additions and 89 deletions
Download Patch File Download Diff File Expand all files Collapse all files

117
src/routes/core/+layout.svelte Normal file
View File

@@ -0,0 +1,117 @@
<script lang="ts">
/** @type {import('./$types').LayoutData} */
export let data: any;
import { goto } from '$app/navigation';
import { onMount } from 'svelte';
// 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, events_trig_kv } from '$lib/ae_events_stores';
import { events_func } from '$lib/ae_events_functions';
// import Element_data_store from '$lib/element_data_store.svelte';
$events_loc.qry__enabled = 'enabled';
$events_loc.qry__hidden = 'not_hidden';
$events_loc.qry__limit = 15;
$events_loc.qry__offset = 0;
// Quickly save the data passed from the parent(s) to the Svelte stores, localStorage, and other.
$slct.account_id = data.account_id;
console.log(`$slct.account_id = `, $slct.account_id);
let ae_acct = data[$slct.account_id];
// console.log(`ae_acct = `, ae_acct);
$events_slct.event_id = ae_acct.slct.event_id;
$events_slct.event_obj = ae_acct.slct.event_obj;
$events_slct.event_obj_li = ae_acct.slct.event_obj_li;
let ae_promises: key_val = {};
onMount(() => {
console.log('Core - Root: +layout.svelte');
console.log($events_slct.event_obj_li);
});
// Updated 2024-06-25
// $: if ($events_trigger == 'load__event_session_obj_id' && $events_trig_kv['event_session_id']) {
// console.log(`load__event_session_obj_id() $events_slct.event_session_id=${$events_slct.event_session_id}`);
// $events_trigger = null;
// if ($events_slct.event_session_id) {
// $events_trig_kv['event_session_id'] = events_func.handle_load_ae_obj_id__event_session({
// api_cfg: $ae_api,
// event_session_id: $events_slct.event_session_id,
// log_lvl: 1
// })
// .then(function (load_results) {
// console.log(`ae_event_session_get_promise:`, load_results);
// });
// }
// }
</script>
<svelte:head>
<title>Core - {$events_loc.title ?? 'Æ loading...'}</title>
</svelte:head>
{#if $ae_loc.administrator_access && 1==3}
<section
class="submenu flex flex-row justify-center"
class:hidden={$ae_loc.iframe}
>
<span class="btn-group variant-soft-secondary px-4 py-2">
{#each Object.entries(data.submenu) as [key, item]}
<!-- <a href="/settings/{item.slug}">{item.title}</a> -->
<!-- class:hidden={!$ae_loc.trusted_access && item.access} -->
{#if item.disable}
<button
title={item.title}
class="hover:variant-ghost-secondary"
class:hidden={(!$ae_loc.trusted_access && item.access === 'trusted') || (!$ae_loc.administrator_access && item.access === 'administrator' || item.hide)}
disabled={item.disable}
on:click={() => {
// window.location(item.href);
// href={item.href}
// invalidateAll
goto(item.href, { });
}}
>
{item.name}
</button>
{:else}
<a
href={item.href}
title={item.title}
class="hover:variant-ghost-secondary"
class:hidden={(!$ae_loc.trusted_access && item.access === 'trusted') || (!$ae_loc.administrator_access && item.access === 'administrator' || item.hide)}
class:disabled={item.disable}
>
{item.name}
</a>
{/if}
{/each}
</span>
</section>
{/if}
<!-- <div class="container m-auto"> -->
<slot></slot>
<!-- </div> -->

63
src/routes/core/+layout.ts Normal file
View File

@@ -0,0 +1,63 @@
/** @type {import('./$types').LayoutLoad} */
console.log(`ae_core root +layout.ts start`);
// import { core_func } from '$lib/ae_core_functions';
export async function load({ parent }) {
let log_lvl = 0;
let data = await parent();
// console.log(`ae_events_pres_mgmt +layout.ts data:`, data);
// let account_id = data.account_id;
// if (!account_id) {
// console.log(`events_pres_mgmt +layout.ts: The account_id was not found in the data!!!`);
// return false;
// }
// let ae_acct = data[account_id];
// if (log_lvl) {
// console.log(`ae_acct = `, ae_acct);
// }
// // // Should we limit these to event.conference = true?
// // let load_event_obj_li = events_func.handle_load_ae_obj_li__event({
// // api_cfg: ae_acct.api,
// // account_id: account_id,
// // params: {enabled: 'enabled', qry__limit: 25},
// // try_cache: false,
// // log_lvl: 1
// // });
// // ae_acct.slct.event_obj_li = load_event_obj_li;
// let event_id = ae_acct.slct.event_id;
// if (!event_id) {
// console.log(`ERROR: events_pres_mgmt +layout.ts: The event_id was not found in the data!!!`);
// return false;
// }
// let load_event_obj = events_func.handle_load_ae_obj_id__event({
// api_cfg: ae_acct.api,
// event_id: event_id,
// try_cache: false
// });
// ae_acct.slct.event_obj = load_event_obj;
// let submenu = {
// main: {name: 'Main', href: '/events_pres_mgmt', access: false},
// // manage: {name: 'Manage', href: '/events_pres_mgmt/manage', access: 'administrator', disable: true, hide: true},
// locations: {name: 'Locations', href: '/events_pres_mgmt/locations', access: false, disable: false, hide: false},
// };
// data.submenu = submenu
// // WARNING: Precaution against shared data between sites and sessions.
// data[account_id] = ae_acct;
return data;
}
// export const prerender = false;
// export const prerender = true;

187
src/routes/core/+page.svelte Normal file
View File

@@ -0,0 +1,187 @@
<script lang="ts">
/** @type {import('./$types').PageData} */
export let data: any;
// console.log(`ae_core root +page.svelte data:`, data);
// import { onMount } from 'svelte';
import { goto, invalidate, pushState, replaceState } from '$app/navigation';
// import { clipboard, FileDropzone, getModalStore, localStorageStore, ProgressRadial, RadioGroup, RadioItem, TabGroup, Tab, TabAnchor } from '@skeletonlabs/skeleton';
import type { key_val } from '$lib/ae_stores';
// import { ae_util } from '$lib/ae_utils';
// import { api } from '$lib/api';
// import Element_ae_crud from '$lib/element_ae_crud.svelte';
// import Element_data_store from '$lib/element_data_store.svelte';
import Comp_person_obj_tbl from './ae_comp__person_obj_tbl.svelte';
// import Comp_event_session_obj_li from '../../ae_comp__event_session_obj_li.svelte';
// import { liveQuery } from "dexie";
import { core_func } from '$lib/ae_core_functions';
// import { db_core } from "$lib/db_core";
// import { db_events } from "$lib/db_events";
import { ae_snip, 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 { events_func } from '$lib/ae_events_functions';
// Quickly save the data passed from the parent(s) to the Svelte stores, localStorage, and other.
$slct.account_id = data.account_id;
console.log(`$slct.account_id = `, $slct.account_id);
let ae_acct = data[$slct.account_id];
console.log(`ae_acct = `, ae_acct);
let person_id_random_li: string[] = [];
// let load_obj_li_results: Promise<any>|key_val;
// let search_submit_results: Promise<any>|key_val;
// async function handle_load_ae_obj_li__person() {
// console.log(`handle_load_ae_obj_li__person()`);
// $ae_trig['load__person_obj_li'] = null;
// load_obj_li_results = core_func.handle_load_ae_obj_li__person({
// api_cfg: $ae_api,
// person_id_random_li: person_id_random_li,
// log_lvl: 1
// });
// return load_obj_li_results;
// }
</script>
<section class="ae_core md:container h-full mx-auto">
<h2 class="h3">&AElig; Core for {$ae_loc.account_name ?? 'Æ loading...'}</h2>
<button
type="button"
on:click={() => {
console.log('Edit the POC person for the session.');
let params = {
qry__limit: 300,
}
// $slct.person_obj_li = await core_func.handle_load_ae_obj_li__person({api_cfg: $ae_api, account_id: $slct.account_id, params: params});
let person_results = core_func.handle_load_ae_obj_li__person({
api_cfg: $ae_api,
account_id: $slct.account_id,
params: params,
log_lvl: 1
})
.then(function (load_results) {
console.log(`Loaded person_obj_li:`, load_results);
// We need to make this ready for the select option list. Convert the list to a key value pair with the person_id_random as the key. We also need to set the option text value to: full_name (primary_email)
if (load_results) {
$slct.person_id_random_li = load_results;
person_id_random_li = [];
let tmp_li = []; // This is to prevent the array from constantly updating and triggering the liveQuery.
for (let i = 0; i < $slct.person_id_random_li.length; i++) {
let person_obj = $slct.person_id_random_li[i];
let person_id_random = person_obj.person_id_random;
tmp_li.push(person_id_random);
}
person_id_random_li = tmp_li;
// $slct.person_id_random_li = load_results.map((person_obj) => person_obj.person_id_random);
// let person_obj_li = load_results;
// let person_obj_kv = {};
// person_obj_kv[''] = '-- Select a person --';
// person_obj_li.forEach((person_obj) => {
// let option_text = `${person_obj.full_name} (${person_obj.primary_email})`;
// person_obj_kv[person_obj.person_id_random] = option_text;
// });
// $slct.person_obj_kv = person_obj_kv;
}
// $slct.person_obj_kv = $slct.person_obj_kv;
// console.log(`$slct.person_obj_kv = `, $slct.person_obj_kv);
return load_results;
})
.finally(() => {
console.log(`person_id_random_li:`, person_id_random_li);
$ae_sess.person.show_report__person_li = true;
});
}}
class="btn btn-sm variant-soft-warning hover:variant-ghost-warning"
>
<span class="fas fa-user mx-1"></span>
List People
</button>
<button
type="button"
on:click={async () => {
console.log('Add Person');
let person_data = {
account_id_random: $slct.account_id,
// user_id_random: user_obj.user_id_random,
source_code: 'manual:SK',
given_name: 'New',
family_name: 'Person',
professional_title: 'Temp Prof Title',
affiliations: 'Temp Org',
primary_email: 'tmp+person@oneskyit.com',
// Random number between 100000 and 999999
passcode: Math.floor(Math.random() * 900000) + 100000,
enable: true,
}
let new_person_obj = await core_func.handle_create_ae_obj__person({
api_cfg: $ae_api,
// user_id: $ae_loc.user_id,
data_kv: person_data,
log_lvl: 1,
})
console.log('new_person_obj:', new_person_obj);
if (confirm(`Person created: ${new_person_obj.full_name} (${new_person_obj.primary_email})`)) {
// window.location.reload();
// invalidateAll();
// goto(`/core/person/${new_person_obj.person_id_random}`);
goto(`/core/person/${new_person_obj.person_id_random}`, { replaceState: true });
// pushState(`/core/person/${new_person_obj.person_id_random}`, { replace: true });
// replaceState(`/core/person/${new_person_obj.person_id_random}`);
}
}}
class:hidden={!$ae_loc.edit_mode}
class="btn btn-sm variant-soft-warning hover:variant-filled-warning"
>
<span class="fas fa-plus mx-1"></span>
Add Person
</button>
<!-- Show people for this account -->
{#if $ae_sess.person.show_report__person_li && person_id_random_li?.length > 0}
<div class="">
Count: {person_id_random_li?.length}
<Comp_person_obj_tbl
bind:person_id_random_li={person_id_random_li}
show_user_fields={$ae_loc.administrator_access}
>
</Comp_person_obj_tbl>
</div>
{/if}
</section>
<style lang="postcss">
</style>

0
src/routes/core/+page.ts Normal file
View File

125
src/routes/core/ae_comp__person_obj_tbl.svelte Normal file
View File

@@ -0,0 +1,125 @@
<script lang="ts">
// Imports
// import type { key_val } from '$lib/ae_stores';
import { ae_util } from '$lib/ae_utils';
import { liveQuery } from "dexie";
import { db_core } from "$lib/db_core";
import { ae_snip, ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$lib/ae_stores';
// import { core_func } from '$lib/ae_core_functions';
// import { events_loc, events_sess, events_slct, events_trigger, events_trig_kv } from '$lib/ae_events_stores';
// import { events_func } from '$lib/ae_events_functions';
// Exports
export let container_class_li: string|Array<string> = [];
export let person_id_random_li: Array<string> = [''];
export let allow_basic: boolean = false;
export let allow_moderator: boolean = false;
export let show_user_fields: boolean = false;
export let display_mode: string = 'default'; // 'default', 'compact', 'minimal', 'launcher'
// Variables
// Functions and Logic
// let lq__person_obj = liveQuery(
// () => db_core.person.get($events_slct.person_id)
// );
let lq_kv__person_obj_li = liveQuery(
() => db_core.person
.bulkGet(person_id_random_li)
);
</script>
<section class="ae_comp person_obj_tbl container {container_class_li}">
{#if person_id_random_li && $lq_kv__person_obj_li && $lq_kv__person_obj_li?.length > 0}
<div class="overflow-scroll">
<table
class="table-auto w-full table-striped table-hover"
>
<thead>
<tr>
<th class="px-4 py-2">Name ({$lq_kv__person_obj_li?.length}x)</th>
<th class="px-4 py-2">Email</th>
<th class="px-4 py-2">Affiliations</th>
{#if show_user_fields}
<th class="px-4 py-2">Username</th>
<th class="px-4 py-2">Access</th>
{/if}
<th class="px-4 py-2">Created/Updated</th>
</tr>
</thead>
<tbody>
{#each $lq_kv__person_obj_li as person_obj}
<tr
class:dim={person_obj?.hide}>
<td class="px-4 py-2">
<span class="fas fa-user"></span>
<a
href="/core/person/{person_obj?.person_id_random}"
class="text-blue-500 underline hover:text-blue-800"
>
{person_obj?.full_name}
</a>
</td>
<td class="px-4 py-2">
<span class="fas fa-envelope"></span>
<a
href="mailto:{person_obj?.primary_email}"
class="text-blue-500 underline hover:text-blue-800"
>
{person_obj?.primary_email}
</a>
</td>
<td class="px-4 py-2">
<span class="fas fa-building"></span>
{person_obj?.affiliations}
</td>
{#if show_user_fields}
<td class="px-4 py-2">
{#if person_obj?.user_id_random}
<span class="fas fa-user"></span>
<a
href="/core/user/{person_obj?.user_id_random}"
class="text-blue-500 underline hover:text-blue-800"
>
{person_obj?.username ?? '-- not set --'}
</a>
{:else}
{@html ae_snip.html__not_set}
{/if}
</td>
<td class="px-4 py-2">
{person_obj?.user_super ? 'Super' : ''}
{person_obj?.user_manager ? 'Manager' : ''}
{person_obj?.user_administrator ? 'Administrator' : ''}
</td>
{/if}
<td class="px-4 py-2">
{ae_util.iso_datetime_formatter(person_obj?.created_on, 'datetime_us_no_seconds')}
<br>
{ae_util.iso_datetime_formatter(person_obj?.updated_on, 'datetime_us_no_seconds')}
</td>
</tr>
{/each}
</tbody>
</table>
</div>
{/if}
</section>
<style>
.dim {
opacity: 0.5;
color: #999;
}
</style>

194
src/routes/core/person/[slug]/+page.svelte Normal file
View File

@@ -0,0 +1,194 @@
<script lang="ts">
/** @type {import('./$types').PageData} */
export let data: any;
// Imports
import type { key_val } from '$lib/ae_stores';
import { ae_util } from '$lib/ae_utils';
// import { api } from '$lib/api';
// import Element_ae_crud from '$lib/element_ae_crud.svelte';
import Element_data_store from '$lib/element_data_store.svelte';
// import Comp_event_session_obj_li from './ae_comp__event_session_obj_li.svelte';
import { liveQuery } from "dexie";
// import { core_func } from '$lib/ae_core_functions';
import { db_core } from "$lib/db_core";
// import { db_events } from "$lib/db_events";
import { ae_snip, ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$lib/ae_stores';
// import { events_loc, events_sess, slct, events_trigger } from '$lib/ae_events_stores';
// import { events_func } from '$lib/ae_events_functions';
// import Form_agree from './../../form_agree.svelte';
import Person_view from './../../person_view.svelte';
// Exports
// export let display_mode: string = 'default'; // 'default', 'compact', 'minimal', 'launcher'
// Variables
// Quickly save the data passed from the parent(s) to the Svelte stores, localStorage, and other.
$slct.account_id = data.account_id;
// console.log(`$slct.account_id = `, $slct.account_id);
let ae_acct = data[$slct.account_id];
// console.log(`ae_acct = `, ae_acct);
$ae_loc.url_origin = data.url.origin;
$slct.person_id = ae_acct.slct.person_id;
$slct.person_obj = ae_acct.slct.person_obj;
$ae_sess.person.show_edit__person = false;
let lq__person_obj = liveQuery(
() => db_core.person.get($slct.person_id)
);
$slct.lq__person_obj = lq__person_obj;
if (!$ae_loc.person) {
$ae_loc.person = {};
}
$ae_loc.person.show_content__person_page_help = false;
// Functions and Logic
</script>
<svelte:head>
<title>
Person: {ae_util.shorten_string({ string: $lq__person_obj?.full_name, max_length: 20, begin_length: 10, end_length: 4 })}
({$lq__person_obj?.person_id ?? 'loading...'}) - Core - {$ae_loc?.title}
</title>
</svelte:head>
<section
class="ae_core__person md:container h-full mx-auto flex flex-col space-y-4 pt-0 pb-8"
>
<div
class="core__person_view_menu {ae_snip.classes__core_menu}"
class:border-none={!$ae_loc.person.show_content__person_page_help}
>
<div>
<a href="/core" class="{ae_snip.classes__core_menu__button}">
<span class="fas fa-arrow-left mx-1"></span>
Back to Core
</a>
<button
type="button"
on:click={() => {
$ae_loc.person.show_content__person_page_help = !$ae_loc.person.show_content__person_page_help;
}}
class="{ae_snip.classes__core_menu__button}"
title="Help and information about the session search"
>
<span class="fas fa-question-circle mx-1"></span>
{#if $ae_loc.person.show_content__person_page_help}
Hide
{:else}
Show
{/if}
Help?
</button>
</div>
<Element_data_store
ds_code="events__core__person_page_help"
ds_name="Default: Core - Person Page Help"
ds_type="html"
for_type="event"
for_id={$slct.event_id}
class_li="bg-yellow-100 p-2 rounded-md border border-yellow-200"
show_edit={false}
show_edit_btn={true}
hide={!$ae_loc.person.show_content__person_page_help}
/>
<div>
<button
type="button"
on:click={() => {
$ae_loc.person.show_content__person_page_help = !$ae_loc.person.show_content__person_page_help;
}}
class="btn btn-sm mx-1 variant-ghost-error hover:variant-filled-error"
class:hidden={!$ae_loc.person.show_content__person_page_help}
title="Help and information about the session search"
>
<span class="fas fa-question-circle mx-1"></span>
{#if $ae_loc.person.show_content__person_page_help}
Hide
{:else}
Show
{/if}
Help?
</button>
</div>
</div>
{#if !$lq__person_obj}
<span class="fas fa-spinner fa-spin mx-1"></span>
<span>Loading...</span>
{:else}
<!-- {$lq__person_obj?.full_name} -->
{/if}
<!-- <hr class="w-full border border-gray-200" /> -->
<!-- {#await $slct.person_obj}
<span class="fas fa-spinner fa-spin text-xl text-blue-500"></span>
{:then result} -->
<Person_view
person_id={$slct.person_id}
/>
<!-- {:catch error}
<div class="text-red-800">
<span class="fas fa-exclamation-triangle text-xl"></span>
<span>Error: {error.message}</span>
</div>
{/await} -->
<!-- {$slct.person_id ?? 'Unknown ID'} -->
</section>
<style lang="postcss">
/* Use the div.ae_quick_modal_container to block background clicks when using the section.ae_quick_popover. */
div.ae_quick_modal_container {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 100;
background-color: hsla(0, 0%, 50%, .75);
/* padding: 1rem; */
/* border: solid thick red; */
}
/* The section.ae_quick_popover should be above the rest of the content and centered on the page. */
section.ae_quick_popover {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 100;
background-color: hsla(0, 0%, 97%, .97);
/* margin-top: 1rem;
margin-bottom: 2rem; */
/* padding: 1rem;
padding-top:4rem; */
/* padding-bottom: 4rem; */
border: solid thin hsla(0, 0%, 0%, .9);
border-radius: .5rem;
box-shadow: 0 0 1rem hsla(0, 0%, 0%, .5);
min-height: 30%;
/* max-height: 100vh; */
min-width: 80%;
/* overflow-y: auto; */
}
</style>

53
src/routes/core/person/[slug]/+page.ts Normal file
View File

@@ -0,0 +1,53 @@
/** @type {import('./$types').PageLoad} */
console.log(`ae_p_person [slug] +page.ts: start`);
import { core_func } from '$lib/ae_core_functions';
export async function load({ parent }) { // route
let log_lvl = 0;
// console.log(`ae_events_pres_mgmt_event +page.ts data.params:`, params);
// console.log(`ae_events_pres_mgmt_event +page.ts data.route:`, route);
// console.log(`ae_events_pres_mgmt_event +page.ts data.url:`, url);
let data = await parent();
// console.log(`ae_events_pres_mgmt_event +page.ts data:`, data);
data.log_lvl = log_lvl;
let account_id = data.account_id;
let ae_acct = data[account_id];
console.log(`ae_acct = `, ae_acct);
let person_id = data.params.slug;
if (!person_id) {
console.log(`ae_p_person [slug] +page.ts: The person_id was not found in the data.params.slug!!!`);
return false;
}
ae_acct.slct.person_id = person_id;
let load_person_obj = core_func.handle_load_ae_obj_id__person({api_cfg: ae_acct.api, person_id: person_id, try_cache: false});
ae_acct.slct.person_obj = await load_person_obj;
// let load_event_file_obj_li = await core_func.handle_load_ae_obj_li__event_file({
// api_cfg: ae_acct.api,
// for_obj_type: 'person',
// for_obj_id: person_id,
// params: {enabled: 'all', qry__limit: 50},
// try_cache: false
// })
// .then((event_file_obj_li) => {
// if (log_lvl) {
// console.log(`event_file_obj_li = `, event_file_obj_li);
// }
// return event_file_obj_li;
// });
// if (log_lvl) {
// console.log(`load_event_file_obj_li = `, load_event_file_obj_li);
// }
// ae_acct.slct.event_file_obj_li = load_event_file_obj_li;
// WARNING: Precaution against shared data between sites and presentations.
data[account_id] = ae_acct;
return data;
}

336
src/routes/core/person_view.svelte Normal file
View File

@@ -0,0 +1,336 @@
<script lang="ts">
console.log(`ae_core person_view.svelte`);
import { createEventDispatcher, onMount } from 'svelte';
// import { clipboard, FileDropzone } from '@skeletonlabs/skeleton';
import { liveQuery } from "dexie";
const dispatch = createEventDispatcher();
import type { key_val } from '$lib/ae_stores';
import { ae_util } from '$lib/ae_utils';
import { api } from '$lib/api';
import Element_ae_crud from '$lib/element_ae_crud.svelte';
// import Element_data_store from '$lib/element_data_store.svelte';
// import Element_manage_event_file_li from '$lib/element_manage_event_file_li.svelte';
import { core_func } from '$lib/ae_core_functions';
import { ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$lib/ae_stores';
import { db_core } from "$lib/db_core";
// import { db_events } from "$lib/db_events";
// import { events_loc, events_sess, events_slct, events_trigger } from '$lib/ae_events_stores';
// import { events_func } from '$lib/ae_events_functions';
// Exports
export let person_id: string;
export let display_mode: string = 'default'; // 'default', 'compact', 'minimal', 'launcher'
let ae_placeholder_li: key_val = {};
let ae_promises: key_val = {}; // Promise<any>;
let ae_tmp: key_val = {};
let ae_triggers: key_val = {};
console.log(`person_id:`, person_id);
let lq__person_obj = liveQuery(
async () => await db_core.person.get(person_id)
);
// ae_tmp.biography = null;
// $: if ($lq__person_obj?.biography && ae_tmp.biography === null) {
// ae_tmp.biography = JSON.parse(JSON.stringify($lq__person_obj.biography));
// }
// $events_slct.person_obj = $lq__person_obj;
// $events_sess.pres_mgmt.disable_submit__opt_out = false;
// let tmp_agree = false;
// let tmp_opt_out: key_val = {
// audio: false,
// video: false,
// transcription_and_publication: false,
// publication_in_app: false
// };
onMount(() => {
console.log('ae_core: person_view.svelte');
console.log(`person_id:`, person_id);
});
</script>
{#if $lq__person_obj}
<h2 class="h3">
Presenter Details for:<br>
<strong>
{$lq__person_obj.full_name}
</strong>
</h2>
<ul
class="space-y-2 px-4"
>
<li
class:hidden={!$ae_loc.trusted_access || !$ae_loc.edit_mode}
>
<Element_ae_crud
api_cfg={$ae_api}
object_type={'person'}
object_id={$lq__person_obj.person_id_random}
field_name={'external_id'}
field_type={'text'}
field_value={$lq__person_obj.external_id}
allow_null={false}
hide_edit_btn={!$ae_loc.trusted_access || !$ae_loc.edit_mode}
outline_element={false}
show_crud={false}
display_inline={false}
class_li={''}
on:ae_crud_updated={e => {
console.log(`ae_crud_updated:`, e.detail);
core_func.handle_load_ae_obj_id__person({api_cfg: $ae_api, person_id: $lq__person_obj?.person_id_random, log_lvl: 1})
.then(function (load_results) {
// Maybe reload page?
// window.location.reload();
});
}}
>
<span class="fas fa-id-card"></span>
External ID:
<span class="font-bold">
{$lq__person_obj.external_id ?? '-- external_id not set --'}
</span>
</Element_ae_crud>
</li>
<li
class:hidden={!$ae_loc.trusted_access || !$ae_loc.edit_mode}
>
<Element_ae_crud
api_cfg={$ae_api}
object_type={'person'}
object_id={$lq__person_obj.person_id_random}
field_name={'external_sys_id'}
field_type={'text'}
field_value={$lq__person_obj.external_sys_id}
allow_null={false}
hide_edit_btn={!$ae_loc.trusted_access || !$ae_loc.edit_mode}
outline_element={false}
show_crud={false}
display_inline={true}
class_li={''}
on:ae_crud_updated={e => {
console.log(`ae_crud_updated:`, e.detail);
core_func.handle_load_ae_obj_id__person({api_cfg: $ae_api, person_id: $lq__person_obj?.person_id_random, log_lvl: 1})
.then(function (load_results) {
// Maybe reload page?
// window.location.reload();
});
}}
>
<span class="fas fa-id-card"></span>
External System ID:
<span class="font-bold">
{$lq__person_obj.external_sys_id ?? '-- external_sys_id not set --'}
</span>
</Element_ae_crud>
</li>
<li>
<span class="fas fa-user"></span>
<Element_ae_crud
api_cfg={$ae_api}
object_type={'person'}
object_id={$lq__person_obj.person_id_random}
field_name={'given_name'}
field_type={'text'}
field_value={$lq__person_obj.given_name}
allow_null={false}
hide_edit_btn={!$ae_loc.trusted_access || !$ae_loc.edit_mode}
outline_element={false}
show_crud={false}
display_inline={true}
display_block_edit={false}
class_li={''}
on:ae_crud_updated={e => {
console.log(`ae_crud_updated:`, e.detail);
core_func.handle_load_ae_obj_id__person({api_cfg: $ae_api, person_id: $lq__person_obj.person_id_random, log_lvl: 1})
.then(function (load_results) {
// Maybe reload page?
// window.location.reload();
});
}}
>
<span class="font-bold">
{$lq__person_obj.given_name}
</span>
</Element_ae_crud>
<Element_ae_crud
api_cfg={$ae_api}
object_type={'person'}
object_id={$lq__person_obj.person_id_random}
field_name={'family_name'}
field_type={'text'}
field_value={$lq__person_obj.family_name}
allow_null={false}
hide_edit_btn={!$ae_loc.trusted_access || !$ae_loc.edit_mode}
outline_element={false}
show_crud={false}
display_inline={true}
class_li={''}
on:ae_crud_updated={e => {
console.log(`ae_crud_updated:`, e.detail);
core_func.handle_load_ae_obj_id__person({api_cfg: $ae_api, person_id: $lq__person_obj.person_id_random, log_lvl: 1})
.then(function (load_results) {
// Maybe reload page?
// window.location.reload();
});
}}
>
<span class="font-bold">
{$lq__person_obj.family_name}
</span>
</Element_ae_crud>
</li>
<li>
<Element_ae_crud
api_cfg={$ae_api}
object_type={'person'}
object_id={$lq__person_obj.person_id_random}
field_name={'primary_email'}
field_type={'email'}
field_value={$lq__person_obj.primary_email}
allow_null={false}
hide_edit_btn={!$ae_loc.trusted_access || !$ae_loc.edit_mode}
outline_element={false}
show_crud={false}
display_inline={true}
class_li={''}
on:ae_crud_updated={e => {
console.log(`ae_crud_updated:`, e.detail);
core_func.handle_load_ae_obj_id__person({api_cfg: $ae_api, person_id: $lq__person_obj.person_id_random, log_lvl: 1})
.then(function (load_results) {
// Maybe reload page?
// window.location.reload();
});
}}
>
<span class="fas fa-envelope"></span>
<span class="font-bold">
<a
href="mailto:{$lq__person_obj?.primary_email}"
class="text-blue-500 underline hover:text-blue-800"
title="Person's primary email address"
>
{$lq__person_obj.primary_email}
</a>
</span>
</Element_ae_crud>
</li>
<li>
<Element_ae_crud
api_cfg={$ae_api}
object_type={'person'}
object_id={$lq__person_obj.person_id_random}
field_name={'affiliations'}
field_type={'text'}
field_value={$lq__person_obj.affiliations}
allow_null={false}
hide_edit_btn={!$ae_loc.trusted_access || !$ae_loc.edit_mode}
outline_element={false}
show_crud={false}
display_inline={false}
class_li={''}
on:ae_crud_updated={e => {
console.log(`ae_crud_updated:`, e.detail);
core_func.handle_load_ae_obj_id__person({api_cfg: $ae_api, person_id: $lq__person_obj?.person_id_random, log_lvl: 1})
.then(function (load_results) {
// Maybe reload page?
// window.location.reload();
});
}}
>
<span class="fas fa-building"></span>
<span class="font-bold">
{$lq__person_obj.affiliations ?? '-- affiliations not set --'}
</span>
</Element_ae_crud>
</li>
<li>
<Element_ae_crud
api_cfg={$ae_api}
object_type={'person'}
object_id={$lq__person_obj.person_id_random}
field_name={'professional_title'}
field_type={'text'}
field_value={$lq__person_obj.professional_title}
allow_null={false}
hide_edit_btn={!$ae_loc.trusted_access || !$ae_loc.edit_mode}
outline_element={false}
show_crud={false}
display_inline={false}
class_li={''}
on:ae_crud_updated={e => {
console.log(`ae_crud_updated:`, e.detail);
core_func.handle_load_ae_obj_id__person({api_cfg: $ae_api, person_id: $lq__person_obj?.person_id_random, log_lvl: 1})
.then(function (load_results) {
// Maybe reload page?
// window.location.reload();
});
}}
>
<span class="fas fa-user-tag"></span>
<span class="font-bold">
{$lq__person_obj.professional_title && $lq__person_obj.professional_title.length ? $lq__person_obj.professional_title : '-- professional title not set --'}
</span>
</Element_ae_crud>
</li>
<li
>
<Element_ae_crud
api_cfg={$ae_api}
object_type={'person'}
object_id={$lq__person_obj.person_id_random}
field_name={'passcode'}
field_type={'text'}
field_value={$lq__person_obj.passcode}
allow_null={true}
hide_edit_btn={!$ae_loc.trusted_access || !$ae_loc.edit_mode}
outline_element={false}
show_crud={false}
display_inline={false}
class_li={''}
on:ae_crud_updated={e => {
console.log(`ae_crud_updated:`, e.detail);
core_func.handle_load_ae_obj_id__person({api_cfg: $ae_api, person_id: $lq__person_obj?.person_id_random, log_lvl: 1})
.then(function (load_results) {
// Maybe reload page?
// window.location.reload();
});
}}
>
<span class="fas fa-user-secret"></span>
Passcode:
<span
class="font-bold"
>
{$lq__person_obj.passcode ?? '-- passcode not set --'}
</span>
</Element_ae_crud>
</ul>
{/if}

106
src/routes/events_pres_mgmt/presenter_view.svelte
View File

@@ -82,7 +82,7 @@ $slct.person_obj_kv = {}; // This is intended for the POC lookup list when gener
// };
onMount(() => {
console.log('Events Session [slug]: presenter_view.svelte');
console.log('Events Pres Mgmt: presenter_view.svelte');
console.log(`event_presenter_id:`, event_presenter_id);
$slct_trigger = 'load__event_file_obj_li';
@@ -344,7 +344,7 @@ async function handle_delete__event_file({event_file_id}) {
</span>
<a
href="/events_pres_mgmt/session/{$lq__event_presenter_obj.event_session_id_random}"
class="text-blue-500 hover:underline"
class="text-blue-500 hover:text-blue-800 hover:underline"
title="ID: {$lq__event_presentation_obj?.event_session_id_random}"
>{$lq__event_presenter_obj.event_session_name}</a>
</h3>
@@ -388,6 +388,38 @@ async function handle_delete__event_file({event_file_id}) {
<ul
class="space-y-2 px-4"
>
<li
class:hidden={!$ae_loc.trusted_access && !$ae_loc.edit_mode}
>
<Element_ae_crud
api_cfg={$ae_api}
object_type={'event_presenter'}
object_id={$lq__event_presenter_obj.event_presenter_id_random}
field_name={'external_id'}
field_type={'text'}
field_value={$lq__event_presenter_obj.external_id}
allow_null={false}
hide_edit_btn={!$ae_loc.trusted_access || !$ae_loc.edit_mode}
outline_element={false}
show_crud={false}
display_inline={true}
display_block_edit={false}
class_li={''}
on:ae_crud_updated={e => {
console.log(`ae_crud_updated:`, e.detail);
events_func.handle_load_ae_obj_id__event_presenter({api_cfg: $ae_api, event_presenter_id: $lq__event_presenter_obj.event_presenter_id_random, log_lvl: 1})
.then(function (load_results) {
// Maybe reload page?
// window.location.reload();
});
}}
>
External ID:
<span class="font-bold">
{$lq__event_presenter_obj?.external_id ?? '-- not set --'}
</span>
</Element_ae_crud>
<li>
<span class="fas fa-user"></span>
<!-- {#if !$events_sess.pres_mgmt.show_edit__event_presenter_name}
@@ -396,6 +428,10 @@ async function handle_delete__event_file({event_file_id}) {
<!-- <div
hidden={!$events_sess.pres_mgmt.show_edit__event_presenter_name}
> -->
<!-- </div> -->
<!-- {/if} -->
<Element_ae_crud
api_cfg={$ae_api}
object_type={'event_presenter'}
@@ -451,19 +487,6 @@ async function handle_delete__event_file({event_file_id}) {
{$lq__event_presenter_obj.family_name}
</span>
</Element_ae_crud>
<!-- </div> -->
<!-- {/if} -->
<!-- <button
on:click={() => {
console.log('*** Edit button clicked ***');
$events_sess.pres_mgmt.show_edit__event_presenter_name = !$events_sess.pres_mgmt.show_edit__event_presenter_name;
}}
class="btn btn-sm variant-soft-warning hover:variant-ghost-warning"
>
<span class="fas fa-edit mx-1"></span>
Edit
</button> -->
</li>
<li
class:hidden={!$ae_loc.trusted_access && !$events_loc.auth__kv.presenter[$lq__event_presenter_obj.event_presenter_id_random] && !$events_loc.auth__kv.session[$lq__event_presenter_obj.event_session_id_random]}
@@ -495,7 +518,7 @@ async function handle_delete__event_file({event_file_id}) {
<span class="font-bold">
<a
href="mailto:{$lq__event_presenter_obj.email}"
class="text-blue-500"
class="text-blue-500 hover:text-blue-800 hover:underline"
title="Presenter's email address"
>{$lq__event_presenter_obj.email}</a>
</span>
@@ -531,7 +554,7 @@ async function handle_delete__event_file({event_file_id}) {
<span class="font-bold">
<a
href="mailto:{$lq__event_presenter_obj.person_primary_email}"
class="text-blue-500"
class="text-blue-500 underline hover:text-blue-800"
title="Person's primary email address"
>{$lq__event_presenter_obj.person_primary_email}</a>
</span>
@@ -874,7 +897,7 @@ async function handle_delete__event_file({event_file_id}) {
{/if}
<!-- A sync button to use the person record fields to update the event_presenter fields -->
{#if $ae_loc.administrator_access}
{#if $ae_loc.administrator_access && $lq__event_presenter_obj?.person_id_random}
<button
type="button"
on:click={() => {
@@ -912,6 +935,53 @@ async function handle_delete__event_file({event_file_id}) {
</button>
{/if}
{#if $ae_loc.administrator_access && !$lq__event_presenter_obj?.person_id_random}
<button
type="button"
on:click={async () => {
console.log('Add Person');
let person_data = {
account_id_random: $slct.account_id,
source_code: 'manual:SK',
external_id: $lq__event_presenter_obj?.external_id?? 'new_presenter',
// user_id_random: user_obj.user_id_random,
given_name: $lq__event_presenter_obj.given_name?? 'New',
family_name: $lq__event_presenter_obj?.family_name?? 'Presenter',
primary_email: $lq__event_presenter_obj?.email?? 'test+newpres@oneskyit.com',
code: $lq__event_presenter_obj?.code?? 'new_presenter',
// Random number between 100000 and 999999
passcode: Math.floor(Math.random() * 900000) + 100000,
professional_title: $lq__event_presenter_obj?.professional_title?? 'Presenter',
affiliations: $lq__event_presenter_obj?.affiliations?? '',
enable: true,
}
let new_person_obj = await core_func.handle_create_ae_obj__person({
api_cfg: $ae_api,
// user_id: $ae_loc.user_id,
data_kv: person_data,
log_lvl: 1,
})
console.log('new_person_obj:', new_person_obj);
// We then need to update the event_presenter with the new person_id.
events_func.handle_update_ae_obj__event_presenter({
api_cfg: $ae_api,
event_presenter_id: $lq__event_presenter_obj.event_presenter_id_random,
data_kv: {person_id_random: new_person_obj.person_id_random},
log_lvl: 1,
})
}}
class:hidden={!$ae_loc.edit_mode}
class="btn btn-sm variant-soft-warning hover:variant-filled-warning"
>
<span class="fas fa-plus mx-1"></span>
Add Person
</button>
{/if}
</li>
<!-- The presenters biography. There should be a character counter. -->