Wrapping up for the day. Lots of improvements. More menu options for location and device related.
This commit is contained in:
Scott Idem
@@ -104,7 +104,6 @@ onMount(() => {
|
||||
<span
|
||||
class="flex flex-row gap-1 items-center"
|
||||
>
|
||||
<!-- <span class="fas fa-calendar-day m-1"></span> -->
|
||||
<span class="fas fa-map-marked m-1"></span>
|
||||
Locations/Rooms
|
||||
<!-- Button to toggle between the regular location view and managing locations??? -->
|
||||
|
||||
@@ -27,6 +27,10 @@ if (log_lvl) {
|
||||
// let ae_tmp: key_val = {};
|
||||
// let ae_triggers: key_val = {};
|
||||
|
||||
if (!$events_loc.pres_mgmt?.location_kv) {
|
||||
$events_loc.pres_mgmt.location_kv = {};
|
||||
}
|
||||
|
||||
// Functions and Logic
|
||||
</script>
|
||||
|
||||
@@ -74,7 +78,7 @@ if (log_lvl) {
|
||||
class:hidden={!$lq__event_location_obj_li?.length}
|
||||
title="Locations: {$lq__event_location_obj_li?.length ?? 'None'}"
|
||||
>
|
||||
<span class="fas fa-chalkboard-teacher m-1"></span>
|
||||
<span class="fas fa-map-marked m-1"></span>
|
||||
{@html ($lq__event_location_obj_li?.length ? `${$lq__event_location_obj_li?.length}×` : '')}
|
||||
</span>
|
||||
|
||||
@@ -95,9 +99,12 @@ if (log_lvl) {
|
||||
{#each $lq__event_location_obj_li as event_location_obj}
|
||||
<li
|
||||
class="space-y-2 border border-gray-200 p-2 rounded-md"
|
||||
class:dim={event_location_obj?.hide}
|
||||
class:hidden={event_location_obj?.hide && !$ae_loc.edit_mode}
|
||||
>
|
||||
|
||||
<h4 class="h5 rounded-md p-2 bg-gray-200">
|
||||
<h4 class="h5 rounded-md p-2 bg-gray-200 flex flex-row gap-1 items-center justify-between">
|
||||
<span>
|
||||
<Element_ae_crud
|
||||
api_cfg={$ae_api}
|
||||
object_type={'event_location'}
|
||||
@@ -130,7 +137,7 @@ if (log_lvl) {
|
||||
"{event_location_obj?.name}"
|
||||
</Element_ae_crud>
|
||||
<!-- "{event_location_obj.name}" -->
|
||||
{#if event_location_obj?.code}
|
||||
{#if event_location_obj?.code && !$events_loc.pres_mgmt?.hide__location_code}
|
||||
<span class="text-sm text-gray-500 bg-yellow-100 p-1 rounded-md border border-yellow-200"
|
||||
title="Location code {event_location_obj?.code}"
|
||||
>
|
||||
@@ -138,114 +145,156 @@ if (log_lvl) {
|
||||
{event_location_obj?.code ?? ''}
|
||||
</span>
|
||||
{/if}
|
||||
</h4>
|
||||
</span>
|
||||
|
||||
<div
|
||||
class:hidden={!$events_loc.pres_mgmt.show_content__location_description}
|
||||
>
|
||||
<Element_ae_crud
|
||||
api_cfg={$ae_api}
|
||||
object_type={'event_location'}
|
||||
object_id={event_location_obj?.event_location_id_random}
|
||||
field_name={'description'}
|
||||
field_type={'textarea'}
|
||||
field_value={event_location_obj?.description}
|
||||
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={true}
|
||||
textarea_rows={15}
|
||||
class_li={''}
|
||||
on:ae_crud_updated={e => {
|
||||
console.log(`ae_crud_updated:`, e.detail);
|
||||
|
||||
events_func.load_ae_obj_id__event_location({api_cfg: $ae_api, event_location_id: event_location_obj.event_location_id_random, log_lvl: 1});
|
||||
}}
|
||||
>
|
||||
<strong class="text-sm">
|
||||
Description:
|
||||
</strong>
|
||||
|
||||
{#if event_location_obj?.description}
|
||||
<button
|
||||
type="button"
|
||||
on:click={() => {
|
||||
console.log('Show/Hide Description');
|
||||
if ($events_sess.pres_mgmt.show_content__location_description == event_location_obj.event_location_id_random) {
|
||||
$events_sess.pres_mgmt.show_content__location_description = null;
|
||||
|
||||
// Was testing with LiveQuery
|
||||
$events_slct.event_location_id = null;
|
||||
console.log('Show/Hide Location');
|
||||
if (!$events_loc.pres_mgmt.location_kv) {
|
||||
$events_loc.pres_mgmt.location_kv = {
|
||||
[event_location_obj.event_location_id]: {collapse: true}
|
||||
};
|
||||
} else if (!$events_loc.pres_mgmt.location_kv[event_location_obj.event_location_id]) {
|
||||
$events_loc.pres_mgmt.location_kv[event_location_obj.event_location_id] = {collapse: true};
|
||||
} else {
|
||||
$events_sess.pres_mgmt.show_content__location_description = event_location_obj.event_location_id_random;
|
||||
$events_loc.pres_mgmt.location_kv[event_location_obj.event_location_id].collapse = !$events_loc.pres_mgmt.location_kv[event_location_obj.event_location_id].collapse;
|
||||
|
||||
// Was testing with LiveQuery
|
||||
$events_slct.event_location_id = event_location_obj.event_location_id_random;
|
||||
}
|
||||
}}
|
||||
class="btn btn-sm variant-soft-surface hover:variant-filled-surface text-xs"
|
||||
class="btn btn-sm variant-ghost-surface hover:variant-filled-surface transition-all hover:transition-all *:hover:inline text-xs"
|
||||
class:variant-glass-warning={$events_loc.pres_mgmt?.location_kv[event_location_obj.event_location_id]?.collapse}
|
||||
>
|
||||
{#if $events_sess.pres_mgmt.show_content__location_description == event_location_obj.event_location_id_random}
|
||||
<span class="fas fa-eye-slash mx-1"></span>
|
||||
<span>Hide Description</span>
|
||||
{#if $events_loc.pres_mgmt.location_kv && $events_loc.pres_mgmt.location_kv[event_location_obj.event_location_id]?.collapse}
|
||||
<!-- <span class="fas fa-minus mx-1"></span> -->
|
||||
<span class="fas fa-chevron-up m-1"></span>
|
||||
<span
|
||||
class="hidden"
|
||||
>
|
||||
Show?</span>
|
||||
{:else}
|
||||
<span class="fas fa-eye mx-1"></span>
|
||||
<span>Show</span>
|
||||
<span class="fas fa-chevron-down m-1"></span>
|
||||
<!-- <span class="fas fa-plus mx-1"></span> -->
|
||||
<!-- <span>Location</span> -->
|
||||
{/if}
|
||||
</button>
|
||||
</h4>
|
||||
|
||||
<pre
|
||||
class="whitespace-pre-wrap p-2 bg-gray-100 rounded-md"
|
||||
class:hidden={$events_sess.pres_mgmt.show_content__location_description !== event_location_obj.event_location_id_random}
|
||||
>{event_location_obj.description}</pre>
|
||||
<div
|
||||
class:hidden={$events_loc.pres_mgmt.location_kv && $events_loc.pres_mgmt.location_kv[event_location_obj.event_location_id]?.collapse}
|
||||
>
|
||||
|
||||
{:else}
|
||||
{@html ae_snip.html__not_set}
|
||||
{/if}
|
||||
<!-- {:else}
|
||||
<div class="text-sm text-gray-500 bg-gray-100 p-1 rounded-md border border-gray-200"
|
||||
class:hidden={!$ae_loc.administrator_access}
|
||||
<div
|
||||
class:hidden={!$events_loc.pres_mgmt.show_content__location_description}
|
||||
>
|
||||
<span class="fas fa-exclamation-triangle mx-1"></span>
|
||||
No description provided.
|
||||
<Element_ae_crud
|
||||
api_cfg={$ae_api}
|
||||
object_type={'event_location'}
|
||||
object_id={event_location_obj?.event_location_id_random}
|
||||
field_name={'description'}
|
||||
field_type={'textarea'}
|
||||
field_value={event_location_obj?.description}
|
||||
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={true}
|
||||
textarea_rows={15}
|
||||
class_li={''}
|
||||
on:ae_crud_updated={e => {
|
||||
console.log(`ae_crud_updated:`, e.detail);
|
||||
|
||||
events_func.load_ae_obj_id__event_location({api_cfg: $ae_api, event_location_id: event_location_obj.event_location_id_random, log_lvl: 1});
|
||||
}}
|
||||
>
|
||||
<strong class="text-sm">
|
||||
Description:
|
||||
</strong>
|
||||
|
||||
{#if event_location_obj?.description}
|
||||
<button
|
||||
type="button"
|
||||
on:click={() => {
|
||||
console.log('Show/Hide Description');
|
||||
if ($events_sess.pres_mgmt.show_content__location_description == event_location_obj.event_location_id_random) {
|
||||
$events_sess.pres_mgmt.show_content__location_description = null;
|
||||
|
||||
// Was testing with LiveQuery
|
||||
$events_slct.event_location_id = null;
|
||||
} else {
|
||||
$events_sess.pres_mgmt.show_content__location_description = event_location_obj.event_location_id_random;
|
||||
|
||||
// Was testing with LiveQuery
|
||||
$events_slct.event_location_id = event_location_obj.event_location_id_random;
|
||||
}
|
||||
}}
|
||||
class="btn btn-sm variant-soft-surface hover:variant-filled-surface text-xs"
|
||||
>
|
||||
{#if $events_sess.pres_mgmt.show_content__location_description == event_location_obj.event_location_id_random}
|
||||
<span class="fas fa-eye-slash mx-1"></span>
|
||||
<span>Hide Description</span>
|
||||
{:else}
|
||||
<span class="fas fa-eye mx-1"></span>
|
||||
<span>Show</span>
|
||||
{/if}
|
||||
</button>
|
||||
|
||||
<pre
|
||||
class="whitespace-pre-wrap p-2 bg-gray-100 rounded-md"
|
||||
class:hidden={$events_sess.pres_mgmt.show_content__location_description !== event_location_obj.event_location_id_random}
|
||||
>{event_location_obj.description}</pre>
|
||||
|
||||
{:else}
|
||||
{@html ae_snip.html__not_set}
|
||||
{/if}
|
||||
<!-- {:else}
|
||||
<div class="text-sm text-gray-500 bg-gray-100 p-1 rounded-md border border-gray-200"
|
||||
class:hidden={!$ae_loc.administrator_access}
|
||||
>
|
||||
<span class="fas fa-exclamation-triangle mx-1"></span>
|
||||
No description provided.
|
||||
</div>
|
||||
{/if} -->
|
||||
</Element_ae_crud>
|
||||
</div>
|
||||
{/if} -->
|
||||
</Element_ae_crud>
|
||||
|
||||
{#if !$events_loc.pres_mgmt.show_content__location_devices_sessions || $events_loc.pres_mgmt.show_content__location_devices_sessions == 'default' || $events_loc.pres_mgmt.show_content__location_devices_sessions == 'sessions'}
|
||||
<!-- Show sessions for this location -->
|
||||
{#if event_location_obj?.event_location_id_random}
|
||||
<Comp_event_session_obj_li
|
||||
link_to_type={'event_location'}
|
||||
link_to_id={event_location_obj?.event_location_id_random}
|
||||
event_session_id_random_li={[]}
|
||||
log_lvl={log_lvl}
|
||||
>
|
||||
</Comp_event_session_obj_li>
|
||||
{/if}
|
||||
{:else if $events_loc.pres_mgmt.show_content__location_devices_sessions == 'devices'}
|
||||
<!-- Show devices for this location -->
|
||||
{#if event_location_obj?.event_location_id_random}
|
||||
<Comp_event_device_obj_li
|
||||
link_to_type={'event_location'}
|
||||
link_to_id={event_location_obj?.event_location_id_random}
|
||||
event_device_id_random_li={[]}
|
||||
log_lvl={log_lvl}
|
||||
>
|
||||
</Comp_event_device_obj_li>
|
||||
{/if}
|
||||
{/if}
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- Show files for this location -->
|
||||
<!-- <Element_manage_event_file_li_wrap
|
||||
link_to_type={'event_location'}
|
||||
link_to_id={event_location_obj?.event_location_id_random}
|
||||
allow_basic={$events_loc.trusted_access}
|
||||
allow_moderator={$events_loc.trusted_access}
|
||||
container_class_li={''}
|
||||
/> -->
|
||||
</div>
|
||||
|
||||
<!-- Show devices for this location -->
|
||||
{#if event_location_obj?.event_location_id_random}
|
||||
<Comp_event_device_obj_li
|
||||
link_to_type={'event_location'}
|
||||
link_to_id={event_location_obj?.event_location_id_random}
|
||||
event_device_id_random_li={[]}
|
||||
log_lvl={log_lvl}
|
||||
>
|
||||
</Comp_event_device_obj_li>
|
||||
{/if}
|
||||
|
||||
<!-- Show sessions for this location -->
|
||||
<!-- {#if event_location_obj?.event_location_id_random}
|
||||
<Comp_event_session_obj_li
|
||||
link_to_type={'event_location'}
|
||||
link_to_id={event_location_obj?.event_location_id_random}
|
||||
event_session_id_random_li={[]}
|
||||
log_lvl={log_lvl}
|
||||
>
|
||||
</Comp_event_session_obj_li>
|
||||
{/if} -->
|
||||
|
||||
|
||||
<!-- Show files for this location -->
|
||||
<!-- <Element_manage_event_file_li_wrap
|
||||
link_to_type={'event_location'}
|
||||
link_to_id={event_location_obj?.event_location_id_random}
|
||||
allow_basic={$events_loc.trusted_access}
|
||||
allow_moderator={$events_loc.trusted_access}
|
||||
container_class_li={''}
|
||||
/> -->
|
||||
</li>
|
||||
{/each}
|
||||
</ul>
|
||||
|
||||
@@ -9,13 +9,14 @@ import { events_func } from '$lib/ae_events_functions';
|
||||
|
||||
import Element_ae_crud from '$lib/element_ae_crud.svelte';
|
||||
import Element_data_store from '$lib/element_data_store_v2.svelte';
|
||||
import Comp__events_menu_nav from './../../ae_comp__events_menu_nav.svelte';
|
||||
|
||||
// export let event_location_id: string;
|
||||
export let lq__event_obj: any;
|
||||
// export let lq__auth__event_presenter_obj: any;
|
||||
|
||||
let ae_tmp: key_val = {};
|
||||
let ae_triggers: key_val = {};
|
||||
// let ae_tmp: key_val = {};
|
||||
// let ae_triggers: key_val = {};
|
||||
|
||||
</script>
|
||||
|
||||
@@ -30,18 +31,18 @@ let ae_triggers: key_val = {};
|
||||
<div
|
||||
class="flex flex-row flex-wrap gap-1 items-center justify-around w-full">
|
||||
|
||||
<span
|
||||
class="ae_menu__navigation_options flex flex-row items-center justify-around"
|
||||
>
|
||||
<a href="/events/{$lq__event_obj?.event_id}" class="{ae_snip.classes__events_pres_mgmt_menu__button}">
|
||||
<span class="fas fa-arrow-left m-1"></span>
|
||||
Back to Session Search
|
||||
</a>
|
||||
</span>
|
||||
<Comp__events_menu_nav
|
||||
hide={!$ae_loc.authenticated_access}
|
||||
event_id={$lq__event_obj?.event_id}
|
||||
ae_core={$ae_loc.administrator_access}
|
||||
events__reports={$ae_loc.trusted_access}
|
||||
events__session_search={$events_slct.event_id}
|
||||
/>
|
||||
|
||||
<span
|
||||
class="ae_menu__object_options flex flex-row items-center justify-around"
|
||||
>
|
||||
<!-- Button to toggle between showing and not showing the extended options menu -->
|
||||
<button
|
||||
type="button"
|
||||
on:click={() => {
|
||||
@@ -93,11 +94,97 @@ let ae_triggers: key_val = {};
|
||||
|
||||
<!-- BEGIN: The expanded menu area for information and options -->
|
||||
<div
|
||||
class="flex flex-row items-center justify-around w-full bg-blue-100 hover:bg-blue-200 border border-blue-200 hover:border-blue-400 p-2 rounded-md"
|
||||
class="flex flex-row items-center justify-around w-full bg-blue-100 hover:bg-blue-200 border border-blue-200 hover:border-blue-400 p-2 rounded-md transition-all duration-1000 ease-in-out overflow-hidden"
|
||||
class:hidden={$events_loc.pres_mgmt.show_menu__location != 'options'}
|
||||
>
|
||||
|
||||
Not much here yet...
|
||||
<div
|
||||
class="flex flex-row flex-wrap gap-1 items-center justify-center w-full"
|
||||
>
|
||||
<!-- Show the session list or device list -->
|
||||
<button
|
||||
type="button"
|
||||
on:click={() => {
|
||||
if ($events_loc.pres_mgmt.show_content__location_devices_sessions == 'sessions') {
|
||||
$events_loc.pres_mgmt.show_content__location_devices_sessions = 'devices';
|
||||
} else {
|
||||
$events_loc.pres_mgmt.show_content__location_devices_sessions = 'sessions';
|
||||
}
|
||||
}}
|
||||
class="btn btn-sm"
|
||||
class:variant-ghost-success={$events_loc.pres_mgmt?.show_content__location_devices_sessions== 'sessions'}
|
||||
class:variant-ghost-warning={$events_loc.pres_mgmt?.show_content__location_devices_sessions== 'devices'}
|
||||
title="Show the session list or device list."
|
||||
>
|
||||
{#if $events_loc.pres_mgmt.show_content__location_devices_sessions == 'sessions'}
|
||||
<span class="fas fa-toggle-on m-1"></span>
|
||||
Session List
|
||||
{:else}
|
||||
<span class="fas fa-toggle-off m-1"></span>
|
||||
Device List
|
||||
{/if}
|
||||
</button>
|
||||
|
||||
<!-- Show or hide the device code -->
|
||||
<button
|
||||
type="button"
|
||||
on:click={() => {
|
||||
$events_loc.pres_mgmt.hide__device_code = !$events_loc.pres_mgmt.hide__device_code;
|
||||
}}
|
||||
class="btn btn-sm"
|
||||
class:variant-ghost-success={!$events_loc.pres_mgmt?.hide__device_code}
|
||||
class:variant-ghost-warning={$events_loc.pres_mgmt?.hide__device_code}
|
||||
title="Show or hide the device code."
|
||||
>
|
||||
{#if !$events_loc.pres_mgmt.hide__device_code}
|
||||
<span class="fas fa-toggle-on m-1"></span>
|
||||
Device Code
|
||||
{:else}
|
||||
<span class="fas fa-toggle-off m-1"></span>
|
||||
Device Code
|
||||
{/if}
|
||||
</button>
|
||||
|
||||
<!-- Show or hide the location code -->
|
||||
<button
|
||||
type="button"
|
||||
on:click={() => {
|
||||
$events_loc.pres_mgmt.hide__location_code = !$events_loc.pres_mgmt.hide__location_code;
|
||||
}}
|
||||
class="btn btn-sm"
|
||||
class:variant-ghost-success={!$events_loc.pres_mgmt?.hide__location_code}
|
||||
class:variant-ghost-warning={$events_loc.pres_mgmt?.hide__location_code}
|
||||
title="Show or hide the location code."
|
||||
>
|
||||
{#if !$events_loc.pres_mgmt.hide__location_code}
|
||||
<span class="fas fa-toggle-on m-1"></span>
|
||||
Location Code
|
||||
{:else}
|
||||
<span class="fas fa-toggle-off m-1"></span>
|
||||
Location Code
|
||||
{/if}
|
||||
</button>
|
||||
|
||||
<!-- Show or hide the session code -->
|
||||
<button
|
||||
type="button"
|
||||
on:click={() => {
|
||||
$events_loc.pres_mgmt.hide__session_code = !$events_loc.pres_mgmt.hide__session_code;
|
||||
}}
|
||||
class="btn btn-sm"
|
||||
class:variant-ghost-success={!$events_loc.pres_mgmt?.hide__session_code}
|
||||
class:variant-ghost-warning={$events_loc.pres_mgmt?.hide__session_code}
|
||||
title="Show or hide the session code."
|
||||
>
|
||||
{#if !$events_loc.pres_mgmt.hide__session_code}
|
||||
<span class="fas fa-toggle-on m-1"></span>
|
||||
Session Code
|
||||
{:else}
|
||||
<span class="fas fa-toggle-off m-1"></span>
|
||||
Session Code
|
||||
{/if}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div> <!-- END: The expanded menu area for information and options -->
|
||||
|
||||
|
||||
Reference in New Issue
Block a user