Mostly working with event file reports being moved out.

This commit is contained in:
Scott Idem
2025-09-24 10:50:28 -04:00
parent 08bc3142e6
commit 6f4f54a0c9
7 changed files with 820 additions and 88 deletions

View File

@@ -4,20 +4,20 @@ interface Props {
container_class_li?: string|Array<string>;
// export let event_presenter_id_random_li: Array<string>;
lq__event_presenter_obj_li: any;
log_lvl?: number;
// export let allow_moderator: boolean = false;
show_presentation_fields?: boolean;
show_session_fields?: boolean;
hide_session_code?: boolean;
log_lvl?: number;
}
let {
container_class_li = [],
lq__event_presenter_obj_li,
log_lvl = $bindable(0),
show_presentation_fields = false,
show_session_fields = false,
hide_session_code = false,
log_lvl = $bindable(0),
}: Props = $props();

View File

@@ -8,10 +8,10 @@ interface Props {
link_to_type?: string;
link_to_id?: string;
// export let lq__event_presentation_obj
log_lvl?: number;
show_presentation_fields?: boolean;
show_session_fields?: boolean;
hide_session_code?: boolean;
log_lvl?: number;
}
let {
@@ -21,10 +21,10 @@ let {
event_presenter_obj_li = $bindable(),
link_to_type,
link_to_id,
log_lvl = $bindable(0),
show_presentation_fields = false,
show_session_fields = false,
hide_session_code = false,
log_lvl = $bindable(0),
}: Props = $props();
@@ -48,7 +48,7 @@ if (log_lvl) {
let event_presenter_id_random_li: Array<string> = $state([]);
let dq__where_type_id_val: string = `${link_to_type}_id_random`;
let dq__where_eq_id_val: string = link_to_id;
let dq__where_eq_id_val: string = link_to_id ?? '';
// *** Functions and Logic

View File

@@ -22,7 +22,8 @@ import { events_func } from '$lib/ae_events_functions';
import Event_reports_page_menu from './event_reports_page_menu.svelte';
import Reports_sessions from './reports_sessions.svelte';
import Reports_presenters from './reports_presenters.svelte';
import Comp_event_file_obj_tbl from '../../ae_comp__event_file_obj_tbl.svelte';
import Reports_files from './reports_files.svelte';
// import Comp_event_file_obj_tbl from '../../ae_comp__event_file_obj_tbl.svelte';
// Quickly save the data passed from the parent(s) to the Svelte stores, localStorage, and other.
@@ -88,19 +89,19 @@ let ae_triggers: key_val = {};
// lk_search_str: '',
// log_lvl: log_lvl,
// });
if ($events_loc.pres_mgmt.show_report == 'recent_files') {
handle_qry__event_file({
created_on_offset: $events_loc.pres_mgmt.qry__files_offset_seconds ?? 0,
file_purpose: $events_loc.pres_mgmt.qry__files_purpose ?? null,
log_lvl: 0,
});
} else if ($events_loc.pres_mgmt.show_report == 'large_files') {
handle_qry__event_file({
min_file_size: $events_loc.pres_mgmt.qry__files_min_size ?? 100000000, // in bytes
file_purpose: $events_loc.pres_mgmt.qry__files_purpose ?? null,
log_lvl: log_lvl,
});
}
// if ($events_loc.pres_mgmt.show_report == 'recent_files') {
// handle_qry__event_file({
// created_on_offset: $events_loc.pres_mgmt.qry__files_offset_seconds ?? 0,
// file_purpose: $events_loc.pres_mgmt.qry__files_purpose ?? null,
// log_lvl: 0,
// });
// } else if ($events_loc.pres_mgmt.show_report == 'large_files') {
// handle_qry__event_file({
// min_file_size: $events_loc.pres_mgmt.qry__files_min_size ?? 100000000, // in bytes
// file_purpose: $events_loc.pres_mgmt.qry__files_purpose ?? null,
// log_lvl: log_lvl,
// });
// }
// onMount(() => {
// console.log('Events Event [slug] Reports: +page.svelte');
@@ -762,7 +763,6 @@ async function handle_qry__event_session(
disabled={!$ae_loc.trusted_access}
onclick={() => {
handle_search__event_presenter({
ft_search_str: '',
lk_search_str: '',
log_lvl: log_lvl,
@@ -791,10 +791,11 @@ async function handle_qry__event_session(
onclick={() => {
handle_qry__event_file({
created_on_offset: $events_loc.pres_mgmt.qry__files_offset_seconds ?? 0,
log_lvl: 0,
log_lvl: log_lvl,
});
$events_loc.pres_mgmt.show_report = 'recent_files';
}}
class:hidden={$lq__event_obj?.mod_pres_mgmt_json?.hide__report_kv.recent_files}
class="btn btn-sm preset-tonal-success border border-success-500 hover:preset-filled-success-500 transition-all m-1"
title="Show recent file uploads."
>
@@ -816,6 +817,7 @@ async function handle_qry__event_session(
});
$events_loc.pres_mgmt.show_report = 'large_files';
}}
class:hidden={$lq__event_obj?.mod_pres_mgmt_json?.hide__report_kv.large_files}
class="btn btn-sm preset-tonal-success border border-success-500 hover:preset-filled-success-500 transition-all m-1"
title="Show large file uploads."
>
@@ -1144,8 +1146,32 @@ async function handle_qry__event_session(
</Comp_event_presenter_obj_tbl>
{/if} -->
<!-- All Event File related reports -->
{#if $events_loc.pres_mgmt.show_report == 'recent_files' || $events_loc.pres_mgmt.show_report == 'large_files'}
<Reports_files
lq__event_obj={lq__event_obj}
event_file_obj_li={$events_sess.event_file_obj_li}
rpt__name={$events_loc.pres_mgmt.show_report}
rpt__sort={$events_loc.pres_mgmt.qry__file_sort}
rpt__enabled={$events_loc.pres_mgmt.qry_enabled}
rpt__hidden={$events_loc.pres_mgmt.qry_hidden}
rpt__limit={$events_loc.pres_mgmt.qry_limit__files}
bind:qry__status={$events_sess.pres_mgmt.status_qry__search}
qry__count={$events_sess.event_file_obj_li?.length ?? 0}
hide_session_code={$events_loc.pres_mgmt?.hide__session_code}
log_lvl={log_lvl}
/>
{/if}
<!-- Show recently uploaded files -->
{#if $events_loc.pres_mgmt.show_report == 'recent_files' && event_file_id_random_li}
{#if 1==3 && $events_loc.pres_mgmt.show_report == 'recent_files' && event_file_id_random_li}
<header class="w-full flex flex-row flex-wrap items-center justify-center gap-1">
<h3 class="h4 text-center">
Recent File Uploads
@@ -1267,7 +1293,7 @@ async function handle_qry__event_session(
This report is new and still being tested.
</p> -->
<Comp_event_file_obj_tbl
<!-- <Comp_event_file_obj_tbl
bind:event_file_id_random_li={event_file_id_random_li}
bind:show_direct_download={$events_loc.pres_mgmt.show__direct_download}
show_location_fields={true}
@@ -1276,12 +1302,12 @@ async function handle_qry__event_session(
show_session_fields={true}
hide_session_code={$events_loc.pres_mgmt?.hide__session_code}
>
</Comp_event_file_obj_tbl>
</Comp_event_file_obj_tbl> -->
{/if}
<!-- Show large files -->
{#if $events_loc.pres_mgmt.show_report == 'large_files' && event_file_id_random_li}
{#if 1==3 && $events_loc.pres_mgmt.show_report == 'large_files' && event_file_id_random_li}
<header class="w-full flex flex-row flex-wrap items-center justify-center gap-1">
<h3 class="h4 text-center">
Large File Uploads
@@ -1354,7 +1380,7 @@ async function handle_qry__event_session(
</header>
<Comp_event_file_obj_tbl
<!-- <Comp_event_file_obj_tbl
bind:event_file_id_random_li={event_file_id_random_li}
show_location_fields={true}
show_presenter_fields={true}
@@ -1362,40 +1388,8 @@ async function handle_qry__event_session(
show_session_fields={true}
hide_session_code={$events_loc.pres_mgmt?.hide__session_code}
>
</Comp_event_file_obj_tbl>
</Comp_event_file_obj_tbl> -->
{/if}
{/if}
<!-- </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%, 0%, .5);
} */
/* 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%, 100%, .95);
padding: 1rem;
border-radius: .5rem;
box-shadow: 0 0 1rem hsla(0, 0%, 0%, .5);
min-height: 30%;
min-width: 80%;
} */
</style>

View File

@@ -0,0 +1,501 @@
<script lang="ts">
interface Props {
log_lvl?: number;
lq__event_obj: any;
event_file_obj_li?: any[];
rpt__name?: string;
rpt__sort?: string;
rpt__order_by_li?: any;
rpt__enabled?: string;
rpt__hidden?: string;
rpt__limit?: number;
qry__status?: string;
qry__count?: number;
qry__trigger?: boolean;
show_presentation_fields?: boolean;
show_session_fields?: boolean;
hide_session_code?: boolean;
}
let {
log_lvl = $bindable(0),
lq__event_obj, // This is the live query so it updates automatically anyways?
event_file_obj_li = $bindable([]),
rpt__name = $bindable('recent_files'), // recent_files, large_files
rpt__sort = $bindable('updated_on'), // updated_on, given_name, family_name, email, start_datetime
rpt__order_by_li = $bindable({'updated_on': 'DESC', 'priority': 'DESC', 'sort': 'DESC', 'filename': 'ASC', 'extension': 'ASC', 'created_on': 'DESC'}),
rpt__enabled = $bindable('enabled'), // enabled, disabled, all
rpt__hidden = $bindable('not_hidden'), // hidden, not_hidden, all
rpt__limit = $bindable(150),
qry__status = $bindable(''), // loading, processing, done
qry__count = $bindable(0),
qry__trigger = $bindable(true),
show_presentation_fields = false,
show_session_fields = false,
hide_session_code = false,
}: Props = $props();
// *** Import Svelte specific
// *** Import other supporting libraries
// *** Import Aether specific variables and functions
import type { key_val } from '$lib/ae_stores';
// import { ae_util } from '$lib/ae_utils/ae_utils';
import { ae_snip, ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$lib/ae_stores';
// import { db_events } from "$lib/ae_events/db_events";
import { events_loc, events_sess, events_slct, events_trigger } from '$lib/ae_events_stores';
import { events_func } from '$lib/ae_events_functions';
import Comp_event_file_obj_tbl from './../../ae_comp__event_file_obj_tbl_wrapper.svelte';
let ae_promises: key_val = $state({});
let sort_option_kv: key_val = {
'created_on': {
name: 'Created On',
field_kv: {
'email': 'ASC',
'given_name': 'ASC',
'family_name': 'ASC',
'updated_on': 'DESC',
'priority': 'DESC',
'sort': 'DESC',
'created_on': 'DESC',
}
},
'updated_on': {
name: 'Updated On',
field_kv: {
'event_presentation_start_datetime': 'ASC',
'priority': 'DESC',
'sort': 'DESC',
'given_name': 'ASC',
'family_name': 'ASC',
'email': 'ASC',
'updated_on': 'DESC',
'created_on': 'DESC',
}
},
'filename': {
name: 'Filename',
field_kv: {
'given_name': 'ASC',
'family_name': 'ASC',
'updated_on': 'DESC',
'priority': 'DESC',
'sort': 'DESC',
'email': 'ASC',
'created_on': 'DESC',
}
},
'extension': {
name: 'Extension/Type',
field_kv: {
'family_name': 'ASC',
'given_name': 'ASC',
'updated_on': 'DESC',
'priority': 'DESC',
'sort': 'DESC',
'email': 'ASC',
'created_on': 'DESC',
}
},
};
$effect(() => {
if (qry__trigger) {
qry__trigger = false;
if (rpt__name == 'recent_files') {
handle_qry__event_file({
created_on_offset: null,
min_file_size: null, // in bytes
file_purpose: null,
// ft_search_str: '',
// lk_search_str: '',
order_by_li: rpt__order_by_li,
log_lvl: log_lvl,
});
} else if (rpt__name == 'large_files') {
handle_qry__event_file({
created_on_offset: null,
min_file_size: 5000000, // in bytes
file_purpose: null,
// ft_search_str: '',
// lk_search_str: '',
order_by_li: rpt__order_by_li,
log_lvl: log_lvl,
});
}
}
});
async function handle_qry__event_file(
{
created_on_offset = null,
min_file_size = null, // in bytes
file_purpose = null,
// ft_search_str = '',
// lk_search_str = '',
enabled = rpt__hidden,
hidden = rpt__enabled,
limit = rpt__limit,
order_by_li = {'updated_on': 'DESC', 'priority': 'DESC', 'sort': 'DESC', 'filename': 'ASC', 'extension': 'ASC', 'created_on': 'DESC'},
log_lvl = 0,
}: {
created_on_offset?: string | null,
min_file_size?: number | null,
file_purpose?: string | null,
// ft_search_str?: string,
// lk_search_str?: string,
enabled?: string,
hidden?: string,
limit?: number,
order_by_li?: key_val,
log_lvl?: number,
}
) {
log_lvl = 2;
if (log_lvl) {
console.log('handle_qry__event_file()');
}
$events_sess.pres_mgmt.status_qry__search = 'loading';
$events_sess.pres_mgmt.status_rpt[rpt__name] = 'loading';
qry__status = 'loading';
qry__count = 0;
$events_sess.event_file_obj_li = [];
$events_slct.event_file_obj_li = []; // Clear out any previous results.
event_file_obj_li = [];
let created_on_str = null;
if (created_on_offset) {
// Calculate the datetime to pass based on the selected offset.
let offset = created_on_offset ?? 0;
let current_datetime = new Date();
console.log(`Current time:`, current_datetime);
// It is very important to know that all of the created_on and updated_on timestamps are in ET timezone. Sorry...?
let for_et_tz_datetime = new Date(current_datetime.toLocaleString('en-US', {timeZone: 'America/New_York'}));
const adjust_minutes = for_et_tz_datetime.getTimezoneOffset(); // Usually 240 minutes for ET.
const adjusted_for_et_tz_datetime = new Date(for_et_tz_datetime.getTime() - adjust_minutes * 60 * 1000);
const adjusted_for_et_tz_datetime_iso_str = adjusted_for_et_tz_datetime.toISOString().slice(0, -1);
console.log(`Adjusted for ET TZ time:`, adjusted_for_et_tz_datetime_iso_str);
let offset_datetime = adjusted_for_et_tz_datetime;
offset_datetime.setSeconds(offset_datetime.getSeconds() - offset);
console.log(`Offset time:`, offset_datetime);
// .slice(0, 19).replace('T', ' '), // '2024-10-15 13:59:59'
const offset_datetime_iso_str = adjusted_for_et_tz_datetime.toISOString().slice(0, -1);
console.log(`Offset time ET ISO: ${offset_datetime_iso_str}`);
created_on_str = offset_datetime_iso_str;
// Convert to US Eastern time and output as ISO string.
// let offset_datetime_local = new Date(offset_datetime.toLocaleString('en-US', {timeZone: 'America/New_York'}));
// console.log(`Test time local ET: ${offset_datetime_local}`);
// let formatted_str = offset_datetime_local.toLocaleString('en-US', {
// year: 'numeric',
// month: '2-digit',
// day: '2-digit',
// hour: '2-digit',
// minute: '2-digit',
// second: '2-digit',
// timeZone: 'UTC'
// });
// console.log(`Test time local ET: ${formatted_str}`);
// let offset_datetime_local_str = offset_datetime_local.toISOString();
// console.log(`Test time local ET: ${offset_datetime_local_str}`);
// created_on_str = offset_datetime_local_str;
}
ae_promises.search__event_file = events_func.qry__event_file({
api_cfg: $ae_api,
event_id: $events_slct.event_id,
qry_created_on: created_on_str,
qry_min_file_size: min_file_size,
qry_file_purpose: file_purpose,
enabled: enabled,
hidden: hidden,
limit: limit,
order_by_li: order_by_li,
// try_cache: try_cache,
log_lvl: log_lvl,
})
.then(function (search_results) {
// Processing the results from the search.
$events_sess.pres_mgmt.status_qry__search = 'processing';
$events_sess.pres_mgmt.status_rpt[rpt__name] = 'processing';
qry__status = 'processing';
qry__count = search_results?.length ?? 0;
$events_sess.event_file_obj_li = search_results;
// $events_slct.event_file_obj_li = search_results;
event_file_obj_li = search_results;
if (log_lvl) {
console.log(event_file_obj_li);
}
// $events_sess.pres_mgmt.status_qry__search = 'done';
})
.finally(() => {
if (log_lvl) {
console.log('TEST SEARCH - Search done. Pulling out the event_file_id_randoms.');
}
// console.log(`TEST search: ${$lq_kv__event_file_obj_li}`);
// event_file_id_random_li = [];
// We need to loop through the array of objects and get the event_file_id_random from each object a new list of event_file_id_randoms. Then we can use this list to get the full objects from the database.
// let tmp_li = []; // This is to prevent the array from constantly updating and triggering the liveQuery.
// for (let i = 0; i < $events_slct.event_file_obj_li.length; i++) {
// tmp_li.push($events_slct.event_file_obj_li[i].event_file_id_random);
// }
// event_file_id_random_li = tmp_li;
// event_file_id_random_li = $events_slct.event_file_obj_li.map(file_obj => file_obj.event_file_id_random);
// Finally done with the search.
$events_sess.pres_mgmt.status_qry__search = 'done';
$events_sess.pres_mgmt.status_rpt[rpt__name] = 'done';
qry__status = 'done';
// if (log_lvl > 1) {
// console.log(`TEST SEARCH - event_file_id_random_li:`, event_file_id_random_li);
// // console.log(`TEST SEARCH - search live query: ${$lq_kv__event_file_obj_li}`);
// }
});
}
</script>
<!-- Show files that were recently uploaded -->
{#if rpt__name == 'recent_files'}
<header class="w-full flex flex-row flex-wrap items-center justify-center gap-1">
<h3 class="h4 text-center">
{#if qry__status == 'loading'}
<span class="fas fa-spinner fa-spin m-1"></span>
<!-- <span>Loading...</span> -->
{:else}
<span class="fas fa-bell m-1"></span>
{/if}
Recent File Uploads
</h3>
<div class="flex flex-row items-center justify-center">
<select
class="inline-block select text-sm px-1 w-40 m-1 ae_btn_info"
bind:value={$events_loc.pres_mgmt.qry__files_offset_seconds}
onchange={() => {
if ($events_loc.pres_mgmt?.qry__files_offset_seconds) {
// Calculate the datetime to pass based on the selected offset.
// let offset = $events_loc.pres_mgmt.qry__files_offset_seconds ?? 0;
// let created_on = new Date()
// console.log(`Created on:`, created_on);
// created_on.setSeconds(created_on.getSeconds() - offset);
handle_qry__event_file({
created_on_offset: $events_loc.pres_mgmt.qry__files_offset_seconds ?? 0,
file_purpose: $events_loc.pres_mgmt.qry__file_purpose ?? null,
log_lvl: log_lvl,
});
} else {
console.log('No offset is will be used.');
handle_qry__event_file({
log_lvl: log_lvl,
});
}
$events_loc.pres_mgmt.show_report = 'recent_files';
}}
>
<option value="">-- offset not set --</option>
<option value="600">10 minutes</option>
<option value="1800">30 minutes</option>
<option value="3600">1 hour</option>
<option value="10800">2 hours</option>
<option value="21600">6 hours</option>
<option value="43200">12 hours</option>
<option value="86400">24 hours</option>
<option value="129600">36 hours</option>
<option value="172800">48 hours</option>
<option value="259200">72 hours</option>
<option value="604800">1 week</option>
<option value="1209600">2 weeks</option>
<option value="2419200">4 weeks</option>
<option value="7776000">12 weeks</option>
<option value="15552000">24 weeks</option>
</select>
<select
id="file_purpose"
name="file_purpose"
class="inline-block select text-sm w-40 px-1 m-1 ae_btn_info"
bind:value={$events_loc.pres_mgmt.qry__file_purpose}
onchange={() => {
handle_qry__event_file({
created_on_offset: $events_loc.pres_mgmt.qry__files_offset_seconds ?? 0,
file_purpose: $events_loc.pres_mgmt.qry__file_purpose ?? null,
log_lvl: log_lvl,
});
$events_loc.pres_mgmt.show_report = 'recent_files';
}}
>
<option
value={null}
selected={!$events_loc.pres_mgmt.qry__file_purpose}
class="text-xs"
>
-- purpose not set --
</option>
{#if $events_loc.pres_mgmt?.file_purpose_option_kv}
{#each Object.entries($events_loc.pres_mgmt.file_purpose_option_kv) as [key, file_purpose_option]}
<option
value={key} selected={$events_loc.pres_mgmt.qry__file_purpose === key}
disabled={file_purpose_option?.disabled}
class:hidden={file_purpose_option?.hidden}
>
{file_purpose_option?.name}
</option>
{/each}
{/if}
</select>
<!-- Max files select options -->
<select
id="qry_limit__files"
bind:value={$events_loc.pres_mgmt.qry_limit__files}
class="inline-block select text-sm px-1 w-40 m-1 ae_btn_info"
onchange={() => {
handle_qry__event_file({
created_on_offset: $events_loc.pres_mgmt.qry__files_offset_seconds ?? 0,
file_purpose: $events_loc.pres_mgmt.qry__file_purpose ?? null,
limit: $events_loc.pres_mgmt.qry_limit__files ?? 100,
log_lvl: log_lvl,
});
$events_loc.pres_mgmt.show_report = 'recent_files';
}}
>
<option value={0}>-- max not set --</option>
<option value={25}>25 files</option>
<option value={50}>50 files</option>
<option value={75}>75 files</option>
<option value={100}>100 files</option>
<option value={200}>200 files</option>
<option value={500}>500 files</option>
</select>
</div>
</header>
{/if}
<!-- Show large files -->
{#if rpt__name == 'large_files'}
<header class="w-full flex flex-row flex-wrap items-center justify-center gap-1">
<h3 class="h4 text-center">
{#if qry__status == 'loading'}
<span class="fas fa-spinner fa-spin m-1"></span>
<!-- <span>Loading...</span> -->
{:else}
<span class="fas fa-list m-1"></span>
{/if}
Large File Uploads
</h3>
<div class="flex flex-row items-center justify-center">
<select
class="inline-block select text-sm w-40 px-1 m-1 ae_btn_info"
bind:value={$events_loc.pres_mgmt.qry__files_min_size}
onchange={() => {
handle_qry__event_file({
min_file_size: $events_loc.pres_mgmt.qry__files_min_size ?? 100000000, // in bytes
file_purpose: $events_loc.pres_mgmt.qry__file_purpose ?? null,
log_lvl: log_lvl,
});
$events_loc.pres_mgmt.show_report = 'large_files';
}}
>
<option value="">-- size not set --</option>
<option value="10000000">10 MB</option>
<option value="25000000">25 MB</option>
<option value="50000000">50 MB</option>
<option value="75000000">75 MB</option>
<option value="100000000">100 MB</option>
<option value="150000000">150 MB</option>
<option value="250000000">250 MB</option>
<option value="500000000">500 MB</option>
<option value="1000000000">1 GB</option>
<!-- <option value="5000000000">5 GB</option> -->
</select>
<select
id="file_purpose"
name="file_purpose"
class="inline-block select text-sm w-40 p-1 m-1 ae_btn_info"
bind:value={$events_loc.pres_mgmt.qry__file_purpose}
onchange={() => {
handle_qry__event_file({
min_file_size: $events_loc.pres_mgmt.qry__files_min_size ?? 100000000, // in bytes
file_purpose: $events_loc.pres_mgmt.qry__file_purpose ?? null,
log_lvl: 1,
});
$events_loc.pres_mgmt.show_report = 'large_files';
}}
>
<option
value={null}
selected={!$events_loc.pres_mgmt.qry__file_purpose}
class="text-xs"
>
-- purpose not set --
</option>
{#if $events_loc.pres_mgmt?.file_purpose_option_kv}
{#each Object.entries($events_loc.pres_mgmt.file_purpose_option_kv) as [key, file_purpose_option]}
<option
value={key} selected={$events_loc.pres_mgmt.qry__file_purpose === key}
disabled={file_purpose_option?.disabled}
class:hidden={file_purpose_option?.hidden}
>
{file_purpose_option?.name}
</option>
{/each}
{/if}
</select>
</div>
</header>
{/if}
{#if event_file_obj_li}
<Comp_event_file_obj_tbl
bind:event_file_obj_li={event_file_obj_li}
bind:show_direct_download={$events_loc.pres_mgmt.show__direct_download}
show_location_fields={true}
show_presentation_fields={true}
show_session_fields={true}
hide_session_code={hide_session_code}
>
</Comp_event_file_obj_tbl>
{/if}

View File

@@ -3,6 +3,7 @@ interface Props {
// Exports
container_class_li?: string|Array<string>;
event_file_id_random_li?: Array<string>;
lq__event_file_obj_li: any;
allow_basic?: boolean;
allow_moderator?: boolean;
// export let max_records: number = 100;
@@ -12,18 +13,21 @@ interface Props {
// export let show_presenter_fields: boolean = false;
show_session_fields?: boolean;
hide_session_code?: boolean;
log_lvl?: number;
}
let {
container_class_li = [],
event_file_id_random_li = [],
lq__event_file_obj_li,
allow_basic = false,
allow_moderator = false,
show_direct_download = false,
show_direct_download = $bindable(false),
show_location_fields = false,
show_presentation_fields = false,
show_session_fields = false,
hide_session_code = false
hide_session_code = false,
log_lvl = $bindable(0),
}: Props = $props();
// Imports
@@ -46,17 +50,7 @@ import MyClipboard from '$lib/e_app_clipboard.svelte';
let ae_promises: key_val = $state({});
// *** Functions and Logic
// let lq__event_file_obj = liveQuery(
// () => db_events.files.get($events_slct.event_file_id)
// );
let lq_kv__event_file_obj_li = $derived(liveQuery(async () => {
// let lq_kv__event_file_obj_li = liveQuery(
let results = await db_events.files
.bulkGet(event_file_id_random_li);
return results;
}));
// Define the list of unacceptable characters if not using the default.
// const unacceptable_chars = /[ <>:"/\\|?*]/g;
@@ -74,6 +68,7 @@ $effect(() => {
// console.log('Element fits within the container. No horizontal scrolling.', horiz_check_element);
}
});
</script>
@@ -84,31 +79,137 @@ $effect(() => {
class="ae_comp event_file_obj_tbl {container_class_li} container overflow-auto max-w-screen">
{#if event_file_id_random_li && $lq_kv__event_file_obj_li && $lq_kv__event_file_obj_li?.length > 0 && $lq_kv__event_file_obj_li?.length == event_file_id_random_li?.length}
<!-- {#if event_file_id_random_li && $lq_kv__event_file_obj_li && $lq_kv__event_file_obj_li?.length > 0 && $lq_kv__event_file_obj_li?.length == event_file_id_random_li?.length} -->
{#if $lq__event_file_obj_li && $lq__event_file_obj_li?.length}
<div
bind:this={horiz_check_element}
id="tbl_container"
class="space-y-2 pb-8"
>
<h2 class="h3">
<span class="text-base">
Results:
</span>
<header
class="flex flex-row flex-wrap gap-1 items-center justify-between"
>
<h2 class="h3">
<span class="text-base">
Results:
</span>
{#if $lq_kv__event_file_obj_li.length}
<span
class="text-3xl font-bold preset-filled-success-100-900 px-4 rounded-lg"
title="Count {$lq_kv__event_file_obj_li.length ?? 'None'}"
{#if $lq__event_file_obj_li.length}
<span
class="text-3xl font-bold preset-filled-success-100-900 px-4 rounded-lg"
title="Count {$lq__event_file_obj_li.length ?? 'None'}"
>
<span class="fas fa-list-ol mx-4"></span>
{$lq__event_file_obj_li.length ?? 'None'}&times;
</span>
{/if}
</h2>
<div
class="flex flex-row flex-wrap gap-1 items-center justify-end"
class:hidden={!$ae_loc.edit_mode}
>
<span class="fas fa-list-ol mx-4"></span>
{$lq_kv__event_file_obj_li.length ?? 'None'}&times;
</span>
<button
class="btn btn-sm preset-tonal-warning border border-warning-500 mb-1 generate_csv_btn"
onclick={() => {
if (!confirm('Generate and download a CSV file with the file list?')) {
return false;
}
let csv_data = generate_file_export_csv($lq__event_file_obj_li);
console.log('CSV Data:', csv_data);
}}
>
<span class="fas fa-file-csv mx-1"></span>
Export Presenters CSV
</button>
<span id="download_csv_container"></span>
{#if show_session_fields}
<button
type="button"
onclick={() => {
show_session_fields = !show_session_fields;
}}
class="btn btn-sm {show_session_fields ? 'ae_btn_surface' : 'ae_btn_surface_outlined'}"
title="Show or hide the session-related column fields."
>
<span class="fas fa-toggle-on m-1"></span>
Showing Session Fields
</button>
{:else}
<button
type="button"
onclick={() => {
show_session_fields = !show_session_fields;
}}
class="btn btn-sm {show_session_fields ? 'ae_btn_surface' : 'ae_btn_surface_outlined'}"
title="Show or hide the session-related column fields."
>
<span class="fas fa-toggle-off m-1"></span>
Show Session Fields
</button>
{/if}
</h2>
<!-- Show or hide the session code -->
{#if !hide_session_code}
<button
type="button"
onclick={() => {
hide_session_code = true;
}}
class="btn btn-sm ae_btn_surface"
title="Hide the session code column from view. Currently showing the Session Code column."
>
<span class="fas fa-toggle-on m-1"></span>
Showing Session Code
</button>
{:else}
<button
type="button"
onclick={() => {
hide_session_code = false;
}}
class="btn btn-sm ae_btn_surface_outlined"
title="Show the session code column. Currently hiding the Session Code column from view."
>
<span class="fas fa-toggle-off m-1"></span>
Show Session Code
</button>
{/if}
{#if show_presentation_fields}
<button
type="button"
onclick={() => {
show_presentation_fields = !show_presentation_fields;
}}
class="btn btn-sm {show_presentation_fields ? 'ae_btn_surface' : 'ae_btn_surface_outlined'}"
title="Show or hide the extra presentation-related column fields."
>
<span class="fas fa-toggle-on m-1"></span>
Showing Presentation Fields
</button>
{:else}
<button
type="button"
onclick={() => {
show_presentation_fields = !show_presentation_fields;
}}
class="btn btn-sm {show_presentation_fields ? 'ae_btn_surface' : 'ae_btn_surface_outlined'}"
title="Show or hide the extra presentation-related column fields."
>
<span class="fas fa-toggle-off m-1"></span>
Show Presentation Fields
</button>
{/if}
</div>
</header>
<table
class="table table-auto table-striped w-full text-xs lg:text-sm"
>
<thead
@@ -117,7 +218,7 @@ $effect(() => {
<tr>
<th class="px-4 py-2">
Filename
<!-- ({$lq_kv__event_file_obj_li?.length}&times;) -->
<!-- ({$lq__event_file_obj_li?.length}&times;) -->
</th>
<th
class="px-4 py-2"
@@ -151,7 +252,7 @@ $effect(() => {
</thead>
<tbody
class="">
{#each $lq_kv__event_file_obj_li as event_file_obj}
{#each $lq__event_file_obj_li as event_file_obj}
<tr
class:dim={event_file_obj?.hide}
>

View File

@@ -0,0 +1,136 @@
<script lang="ts">
interface Props {
// Exports
container_class_li?: string|Array<string>;
event_file_obj_li?: Array<any>;
link_to_type?: string;
link_to_id?: string;
allow_basic?: boolean;
allow_moderator?: boolean;
show_direct_download?: boolean;
show_location_fields?: boolean;
show_presentation_fields?: boolean;
show_session_fields?: boolean;
hide_session_code?: boolean;
log_lvl?: number;
}
let {
container_class_li = [],
// display_mode = 'default',
// event_file_id_random_li = $bindable(),
event_file_obj_li = $bindable(),
link_to_type,
link_to_id,
allow_basic = true,
allow_moderator = true,
show_direct_download = $bindable(false),
show_location_fields = false,
show_presentation_fields = true,
show_session_fields = true,
hide_session_code = false,
log_lvl = $bindable(0),
}: Props = $props();
// Imports
import Comp_event_file_obj_tbl from './ae_comp__event_file_obj_tbl.svelte';
import { liveQuery } from "dexie";
import { events_loc, events_sess, events_slct, events_trigger } from '$lib/ae_events_stores';
import { db_events } from "$lib/ae_events/db_events";
import { all } from 'axios';
if (log_lvl) {
console.log(`link_to_type: ${link_to_type}; link_to_id: ${link_to_id}`);
}
// Variables
// let ae_promises: key_val = {};
// let ae_tmp: key_val = {};
// let ae_triggers: key_val = {};
let event_file_id_random_li: Array<string> = $state([]);
let dq__where_type_id_val: string = `${link_to_type}_id_random`;
let dq__where_eq_id_val: string = link_to_id ?? '';
// *** Functions and Logic
let lq__event_file_obj_li = $derived(liveQuery(async () => {
let results: any;
// let event_file_id_random_li = []; // This is to prevent the array from constantly updating and triggering the liveQuery.
// for (let i = 0; i < $events_sess?.event_file_obj_li.length; i++) {
// let event_file_obj = $events_sess?.event_file_obj_li[i];
// let event_file_id_random = event_file_obj.event_file_id_random;
// event_file_id_random_li.push(event_file_id_random);
// }
if (event_file_obj_li?.length) {
if (log_lvl) {
console.log(`LQ - Using event_file_obj_li to get event files.`);
}
event_file_id_random_li = []; // This is to prevent the array from constantly updating and triggering the liveQuery.
for (let i = 0; i < event_file_obj_li.length; i++) {
let event_file_obj = event_file_obj_li[i];
let event_file_id_random = event_file_obj.event_file_id_random;
event_file_id_random_li.push(event_file_id_random);
}
// if (event_file_id_random_li.length) {
results = await db_events.files
.bulkGet(event_file_id_random_li);
// }
} else if (link_to_type && link_to_id) {
console.log(`Trying where: ${dq__where_type_id_val}; equals: ${dq__where_eq_id_val}`);
event_file_id_random_li = [];
results = await db_events.files
.where(dq__where_type_id_val)
.equals(dq__where_eq_id_val)
.sortBy('name');
} else {
event_file_id_random_li = [];
results = [];
}
// Check if results are different than the current session version stored under $events_slct
if ($events_slct.event_file_obj_li && JSON.stringify($events_slct.event_file_obj_li) !== JSON.stringify(results)) {
$events_slct.event_file_obj_li = [...results];
if (log_lvl) {
console.log(`Session slct li stored version has changed for ID = ${$events_slct.journal_id}`, $events_slct.event_file_obj_li);
}
} else {
if (log_lvl > 1) {
console.log(`Session slct li stored version has not changed for ID = ${$events_slct.journal_id}`);
}
}
return results;
}));
</script>
{#if event_file_obj_li && event_file_obj_li?.length}
<!-- {#if event_file_id_random_li && event_file_id_random_li?.length} -->
<Comp_event_file_obj_tbl
container_class_li={container_class_li}
lq__event_file_obj_li={lq__event_file_obj_li}
allow_basic={allow_basic}
allow_moderator={allow_moderator}
bind:show_direct_download={show_direct_download}
show_presentation_fields={show_presentation_fields}
show_session_fields={show_session_fields}
hide_session_code={hide_session_code}
log_lvl={log_lvl}
>
</Comp_event_file_obj_tbl>
{:else}
<section class="grow px-1 md:px-2 pb-28 flex flex-col gap-1 items-center">
<p>No files available to show in table.</p>
</section>
{/if}

View File

@@ -34,7 +34,7 @@ if (log_lvl > 1) {
// let ae_triggers: key_val = {};
let dq__where_type_id_val: string = `${link_to_type}_id_random`;
let dq__where_eq_id_val: string = link_to_id;
let dq__where_eq_id_val: string = link_to_id ?? '';
// *** Functions and Logic
let lq__event_session_obj_li = $derived(liveQuery(async () => {