Wrapping up for the day. Lots of changes.

src/routes/events_leads/+layout.svelte

@@ -8,6 +8,11 @@ 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';
 
+$events_loc.qry__enabled = 'enabled';
+$events_loc.qry__hidden = 'not_hidden';
+$events_loc.qry__limit = 25;
+$events_loc.qry__offset = 0;
+
 onMount(() => {
     console.log('Events Leads: +layout.svelte');
 

src/routes/events_leads/+page.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 export let data;
-console.log(`ae_events_leads +page data:`, data);
+// console.log(`ae_events_leads +page data:`, data);
 // console.log(`ae_events_leads Data Params:`, data.url.searchParams.get('event_id'));
 
 import { onMount } from 'svelte';

src/routes/events_leads/+page.ts

@@ -32,7 +32,7 @@ export async function load({ params, parent, url }) { // route
     // console.log(`load_event_obj = `, load_event_obj);
 
     let load_event_exhibit_obj_li = events_func.handle_load_ae_obj_li__exhibit({api_cfg: data.ae_api, event_id:  event_id, try_cache: false});
-    // console.log(`load_event_exhibit_obj_li = `, load_event_exhibit_obj_li);
+    console.log(`load_event_exhibit_obj_li = `, load_event_exhibit_obj_li);
 
     // let exhibit_id = data.params.slug;
     // let load_event_exhibit_obj = events_func.handle_load_ae_obj_id__exhibit({api_cfg: data.ae_api, exhibit_id:  exhibit_id, try_cache: false});

src/routes/events_leads/exhibit/[slug]/+page.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 export let data;
-console.log(`ae_events_leads exhibit [slug] +page.svelte data:`, data);
+// console.log(`ae_events_leads exhibit [slug] +page.svelte data:`, data);
 
 import { onMount } from 'svelte';
 import { goto, invalidate, pushState, replaceState } from '$app/navigation';
@@ -22,6 +22,7 @@ import { clipboard, FileDropzone, getModalStore, localStorageStore, ProgressRadi
 import Element_data_store from '$lib/element_data_store.svelte';
 import Element_qr_scanner from '$lib/element_qr_scanner.svelte';
 
+import Leads_list from './leads_list.svelte';
 import Leads_manage from './leads_manage.svelte';
 import Leads_payment from './leads_payment.svelte';
 
@@ -79,7 +80,7 @@ if ($events_loc.leads.auth_exhibit_kv && $events_loc.leads.auth_exhibit_kv[$even
 onMount(() => {
     console.log('Events Leads Exhibit [slug]: +page.svelte');
 
-    console.log(`ae_events_leads exhibit [slug] +page.svelte data:`, data);
+    // console.log(`ae_events_leads exhibit [slug] +page.svelte data:`, data);
 
     if ($events_slct.exhibit_id) {
         console.log(`Got an ID. Let's do something!?`);
@@ -1105,10 +1106,7 @@ function handle_qr_camera(event) {
 {:else if $events_loc.leads.tab[$events_slct.exhibit_id] == 'leads'}
 
 
-<h2 class="h3">Leads for {$event_exhibit_obj.name}</h2>
-<div class="variant-soft-warning">This section is not currently enabled.</div>
-<!-- <Leads_list /> -->
-
+<Leads_list />
 
 
 <!-- BEGIN Tab: Manage -->

src/routes/events_leads/exhibit/[slug]/+page.ts

@@ -0,0 +1,44 @@
+/** @type {import('./$types').PageLoad} */
+
+import { events_func } from '$lib/ae_events_functions';
+
+export async function load({ params, parent, url }) { // route
+    // console.log(`ae_events_leads +page.ts data.params:`, params);
+    // console.log(`ae_events_leads +page.ts data.route:`, route);
+    // console.log(`ae_events_leads +page.ts data.url:`, url);
+
+    let data = await parent();
+    // console.log(`ae_events_leads +page.ts data:`, data);
+
+    // console.log(`ae_events_leads +page.ts data.ae_loc:`, data.ae_loc);
+    if (data.ae_loc.account_id) {
+    } else {
+        console.log(`The account_id was not found in the data.ae_loc!!!`);
+        return false;
+    }
+
+    data.ae_events_leads_exhibit_slug_page_ts = true;
+
+    // let submenu = {
+    //     main: {name: 'Main', href: '/events_leads', access: false},
+    //     manage: {name: 'Manage', href: '/events_leads/manage', access: 'administrator', disable: true, hide: true},
+    //     review: {name: 'Exhibitor', href: '/events_leads/exhibitor', access: false, disable: false, hide: false},
+    //     };
+    // data.submenu = submenu
+
+    // Do not wait on these:
+    // let event_id = url.searchParams.get('event_id');
+    // let load_event_obj = events_func.handle_load_ae_obj_id__event({api_cfg: data.ae_api, event_id:  event_id, try_cache: false});
+    // console.log(`load_event_obj = `, load_event_obj);
+
+    let param_slug_event_exhibit_id = data.params.slug;
+
+    let load_event_exhibit_tracking_obj_li = events_func.handle_load_ae_obj_li__exhibit_tracking({api_cfg: data.ae_api, exhibit_id:  param_slug_event_exhibit_id, try_cache: false});
+    // console.log(`load_event_exhibit_tracking_obj_li = `, load_event_exhibit_tracking_obj_li);
+
+    // let exhibit_id = data.params.slug;
+    // let load_event_exhibit_obj = events_func.handle_load_ae_obj_id__exhibit({api_cfg: data.ae_api, exhibit_id:  exhibit_id, try_cache: false});
+    // console.log(`load_event_exhibit_obj = `, load_event_exhibit_obj);
+
+    return data;
+}

src/routes/events_leads/exhibit/[slug]/leads_list.svelte

@@ -0,0 +1,202 @@
+<script lang="ts">
+// export let data;
+// console.log(`ae_events_leads exhibit [slug] leads_payment.svelte data:`, data);
+
+import { ae_util } from '$lib/ae_utils';
+import { liveQuery } from "dexie";
+import { db_events } from "$lib/db_events";
+import { ae_loc, ae_sess, ae_api, slct, slct_trigger } from '$lib/ae_stores';
+import { events_loc, events_sess, events_slct, events_trigger } from '$lib/ae_events_stores';
+
+// let param_slug_event_exhibit_id = data.params.slug;
+
+// let l_event_exhibit_tracking_obj = liveQuery(
+//     () => db_events.exhibit_tracking.get($events_slct.exhibit_tracking_id)
+// );
+
+// Version 1: This is the version that works
+// let event_exhibit_tracking_obj_li = liveQuery(
+//     // () => db_events.exhibits.toArray()
+//     () => db_events.exhibit_tracking
+//         // .where('enable')
+//         // .aboveOrEqual(0)
+//         // .equals(true)
+//         .where('event_exhibit_id_random')
+//         .equals($events_slct.exhibit_id)
+//         // .above(0)
+//         .sortBy('created_on') // Use sortBy() instead of orderBy(). toArray() is also not needed???
+//         // .orderBy('name')
+//         // .offset(10).limit(5)
+//         // .toArray()
+// );
+
+// Version 2: This does not work yet
+let event_exhibit_tracking_obj_li = liveQuery(
+    // () => db_events.exhibits.toArray()
+    () => db_events.exhibit_tracking
+        // .where({event_exhibit_id_random: $events_slct.exhibit_id, enable: true, hide: false})
+        .where({event_exhibit_id_random: $events_slct.exhibit_id})
+        // .where('event_exhibit_id_random').equals($events_slct.exhibit_id)
+        // .and('enable').equals(true)
+        .sortBy('created_on') // Use sortBy() instead of orderBy(). toArray() is also not needed???
+        // .toArray()
+);
+
+
+</script>
+
+
+<section class="tab__leads_list flex flex-col wrap justify-center items-center space-y-4">
+
+{#if $events_slct.exhibit_id && $events_slct.exhibit_obj}
+    <h2 class="h3">
+        <span class="fas fa-clipboard-list-check"></span>
+        Leads for {$events_slct.exhibit_obj.name}
+    </h2>
+
+    <div class="variant-soft-warning">This section is not currently enabled.</div>
+
+    <button
+        on:click={() => {
+            console.log('Show Hidden Leads');
+            $events_loc.leads.show_hidden = !$events_loc.leads.show_hidden;
+
+            console.log('$events_loc.leads.show_hidden:', $events_loc.leads.show_hidden);
+
+
+        }}
+        class="btn"
+        >
+        {$events_loc.leads.show_hidden ? 'Hide' : 'Show'} Hidden Leads
+    </button>
+    {$events_loc.leads.show_hidden}
+{#if $event_exhibit_tracking_obj_li}
+<table class="table table-compact table-hover">
+<thead>
+<tr>
+    <th class="star text-center">Star</th>
+    <th class="rank text-center">Rank</th>
+    <th class="person text-center">Person</th>
+</tr>
+</thead>
+
+<tbody>
+
+{#each $event_exhibit_tracking_obj_li as event_exhibit_tracking_obj, index}
+<!-- flex flex-row justify-center items-center m-auto -->
+<tr
+    class:hidden={$events_loc.leads.show_hidden}
+    class:test_dim={event_exhibit_tracking_obj.hide}
+    >
+    <td class="star text-center">
+        <!-- <span class="star_container flex flex-col justify-center items-center m-auto"> -->
+
+        <button
+            on:click={async () => {
+            }}
+            class="btn btn-sm variant-soft-tertiary"
+            >
+            {#if event_exhibit_tracking_obj.priority}
+                <span class="fas fa-star" title="stared or priority"></span>
+            {:else}
+                <span class="far fa-star" title="not stared or priority"></span>
+            {/if}
+        </button>
+        <!-- </span> -->
+    </td>
+
+    <!-- text-center align-middle -->
+    <td class="ranking text-center"> <!-- BEGIN: Ranking in table -->
+        <div class="ranking_container flex flex-col lg:flex-row justify-stretch items-center">
+            <button
+                on:click={() => {
+                    $events_slct.exhibit_tracking_id = event_exhibit_tracking_obj.event_exhibit_tracking_id_random;
+
+                    db_events.exhibit_tracking.get($events_slct.exhibit_tracking_id)
+                    .then((event_exhibit_tracking_obj) => {
+                        console.log('event_exhibit_tracking_obj:', event_exhibit_tracking_obj);
+                        if (event_exhibit_tracking_obj.sort < 1) {
+                            event_exhibit_tracking_obj.sort = 0;
+                        } else {
+                            event_exhibit_tracking_obj.sort -= 1;
+                        }
+                        db_events.exhibit_tracking.put(event_exhibit_tracking_obj);
+                    });
+                }}
+                disabled={event_exhibit_tracking_obj.sort < 1}
+                class="btn btn-sm variant-soft-secondary"
+                >
+                <span class="fas fa-arrow-up" title="Move up"></span>
+            </button>
+
+            <span class="exhibit_tracking__sort m-0 lg:mx-1">{event_exhibit_tracking_obj.sort ?? ''}</span>
+
+            <button
+                on:click={() => {
+                    $events_slct.exhibit_tracking_id = event_exhibit_tracking_obj.event_exhibit_tracking_id_random;
+
+                    db_events.exhibit_tracking.get($events_slct.exhibit_tracking_id)
+                    .then((event_exhibit_tracking_obj) => {
+                        console.log('event_exhibit_tracking_obj:', event_exhibit_tracking_obj);
+                        if (event_exhibit_tracking_obj.sort > 5) {
+                            event_exhibit_tracking_obj.sort = 5;
+                        } else {
+                            event_exhibit_tracking_obj.sort += 1;
+                        }
+                        db_events.exhibit_tracking.put(event_exhibit_tracking_obj);
+                    });
+                }}
+                disabled={event_exhibit_tracking_obj.sort >= 5}
+                class="btn btn-sm variant-soft-secondary"
+                >
+                <span class="fas fa-arrow-down" title="Move down"></span>
+            </button>
+        </div>
+    </td> <!-- END: Ranking in table -->
+
+    <td class="person">
+        <div class="person_container flex flex-col lg:flex-row gap-1 wrap justify-between">
+            <button
+                on:click={() => {
+                }}
+                class="btn btn-sm variant-soft-primary min-w-60 flex flex-row justify-between items-center gap-0.5"
+                >
+                <span class="fas fa-user mx-0.5"></span>
+                <span class="text-lg grow text-center">{event_exhibit_tracking_obj.event_badge_full_name}</span>
+            </button>
+
+            <span class="flex flex-col lg:flex-row gap-0.5 wrap justify-between min-w-60">
+            <span class="text-sm">
+                <span class="fas fa-envelope mx-0.5"></span>
+                <a href="mailto:{event_exhibit_tracking_obj.event_badge_email}" class="font-medium text-blue-600 dark:text-blue-500 hover:underline">
+                    {event_exhibit_tracking_obj.event_badge_email}
+                </a>
+            </span>
+
+            <span class="text-sm">{event_exhibit_tracking_obj.event_badge_affiliations}</span>
+            </span>
+        </div>
+    </td>
+
+</tr>
+{/each}
+
+</tbody>
+
+</table>
+{:else}
+    No leads available to show
+    {$event_exhibit_tracking_obj_li}
+{/if}
+
+{:else}
+    Loading...?
+{/if}
+
+</section>
+
+<style lang="postcss">
+.test_dim {
+    opacity: 0.25;
+}
+</style>

src/routes/events_leads/exhibit/[slug]/leads_manage.svelte

@@ -119,7 +119,7 @@ export let get_event_exhibit_tracking_export = async function get_event_exhibit_
     Export Data
 </h2>
 
-<p>Use this to export the leads data for this exhibit to an Excel file format. The data can be downloaded at anytime using the export button below.</p>
+<p>Use this to export the leads data for this exhibit to an Excel file format. The data can be downloaded at anytime using the export button below. The data exported to exhibitors will likely be these fields: given/first name, family/last name, professional title, affiliations, email, city, state/province, country. The exact fields exported sometimes changes slightly from meeting to meeting.</p>
 <button
     type="button"
     on:click={() => {

src/routes/events_leads/exhibit/[slug]/leads_payment.svelte

@@ -251,7 +251,7 @@ BTN Do you need to rent tablets as well?
 
 
 <div class="border-2 border-primary p-2 variant-soft-warning">
-    <p><strong>NOTE:</strong> Your payment will be reviewed and is not reflected immediately on this page for your exhibit. It may take up to 2 business days for this to show as being paid. If you have any questions or concerns please email <a href="mailto:exhibits@oneskyit.com" class="text-blue-500">exhibits@oneskyit.com</a>.</p>
+    <p><strong>NOTE:</strong> Your payment will be reviewed and is not reflected immediately on this page for your exhibit. It may take up to 2 business days for this to show as being paid. If you have any questions or concerns please email <a href="mailto:exhibits@oneskyit.com" class="font-medium text-blue-600 dark:text-blue-500 hover:underline">exhibits@oneskyit.com</a>.</p>
 </div>
 
 <!-- <div>