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

refactor(leads): fix native calls and apply batch formatting

Browse Source 
- Corrected native 'event.preventDefault()' calls in exhibit search components.
- Applied batch formatting (printWidth: 80) across the leads module.
This commit is contained in:
Scott Idem
2026-02-06 14:59:09 -05:00
parent 5385eacc0f
commit 9ea94c0727
5 changed files with 249 additions and 124 deletions
Download Patch File Download Diff File Expand all files Collapse all files

103
src/routes/events/[event_id]/(leads)/leads/+page.svelte
View File

@@ -2,7 +2,11 @@
import { onMount, untrack } from 'svelte'; import { onMount, untrack } from 'svelte';
import { liveQuery } from 'dexie'; import { liveQuery } from 'dexie';
import { db_events } from '$lib/ae_events/db_events'; import { db_events } from '$lib/ae_events/db_events';
import { events_loc, events_sess, events_slct } from '$lib/stores/ae_events_stores'; import {
events_loc,
events_sess,
events_slct
} from '$lib/stores/ae_events_stores';
import { ae_api, ae_loc } from '$lib/stores/ae_stores'; import { ae_api, ae_loc } from '$lib/stores/ae_stores';
import { page } from '$app/state'; import { page } from '$app/state';
import { events_func } from '$lib/ae_events_functions'; import { events_func } from '$lib/ae_events_functions';
@@ -11,10 +15,14 @@
// *** Initialization & Store Guard *** // *** Initialization & Store Guard ***
if ($events_loc.leads) { if ($events_loc.leads) {
if (typeof $events_loc.leads.search_version === 'undefined') $events_loc.leads.search_version = 0; if (typeof $events_loc.leads.search_version === 'undefined')
if (typeof $events_loc.leads.qry__remote_first === 'undefined') $events_loc.leads.qry__remote_first = false; $events_loc.leads.search_version = 0;
if (typeof $events_loc.leads.qry__search_text === 'undefined') $events_loc.leads.qry__search_text = ''; if (typeof $events_loc.leads.qry__remote_first === 'undefined')
if (typeof $events_loc.leads.qry__sort_order === 'undefined') $events_loc.leads.qry__sort_order = 'name_asc'; $events_loc.leads.qry__remote_first = false;
if (typeof $events_loc.leads.qry__search_text === 'undefined')
$events_loc.leads.qry__search_text = '';
if (typeof $events_loc.leads.qry__sort_order === 'undefined')
$events_loc.leads.qry__sort_order = 'name_asc';
} }
let exhibit_id_li: Array<string> = $state([]); let exhibit_id_li: Array<string> = $state([]);
@@ -32,7 +40,7 @@
// SCENARIO 1: Specific IDs provided (Search Results) // SCENARIO 1: Specific IDs provided (Search Results)
if (Array.isArray(ids) && ids.length > 0) { if (Array.isArray(ids) && ids.length > 0) {
const results = await db_events.exhibit.bulkGet(ids); const results = await db_events.exhibit.bulkGet(ids);
return results.filter(item => item !== undefined); return results.filter((item) => item !== undefined);
} }
// SCENARIO 2: Fallback broad search // SCENARIO 2: Fallback broad search
@@ -92,11 +100,15 @@
let local_results = await db_events.exhibit let local_results = await db_events.exhibit
.where('event_id_random') .where('event_id_random')
.equals(event_id) .equals(event_id)
.filter(exhibit => { .filter((exhibit) => {
if (qry_str) { if (qry_str) {
const name = (exhibit.name ?? '').toLowerCase(); const name = (exhibit.name ?? '').toLowerCase();
const code = (exhibit.code ?? '').toLowerCase(); const code = (exhibit.code ?? '').toLowerCase();
if (!name.includes(qry_str) && !code.includes(qry_str)) return false; if (
!name.includes(qry_str) &&
!code.includes(qry_str)
)
return false;
} }
return true; return true;
}) })
@@ -104,16 +116,27 @@
local_results.sort((a, b) => { local_results.sort((a, b) => {
switch (params.sort) { switch (params.sort) {
case 'name_asc': return (a.name ?? '').localeCompare(b.name ?? ''); case 'name_asc':
case 'name_desc': return (b.name ?? '').localeCompare(a.name ?? ''); return (a.name ?? '').localeCompare(b.name ?? '');
case 'code_asc': return (a.code ?? '').localeCompare(b.code ?? ''); case 'name_desc':
case 'code_desc': return (b.code ?? '').localeCompare(a.code ?? ''); return (b.name ?? '').localeCompare(a.name ?? '');
case 'updated_desc': return new Date(b.updated_on || 0).getTime() - new Date(a.updated_on || 0).getTime(); case 'code_asc':
default: return (a.name ?? '').localeCompare(b.name ?? ''); return (a.code ?? '').localeCompare(b.code ?? '');
case 'code_desc':
return (b.code ?? '').localeCompare(a.code ?? '');
case 'updated_desc':
return (
new Date(b.updated_on || 0).getTime() -
new Date(a.updated_on || 0).getTime()
);
default:
return (a.name ?? '').localeCompare(b.name ?? '');
} }
}); });
const local_ids = local_results.map(e => String(e.id || e.event_exhibit_id_random)).filter(Boolean); const local_ids = local_results
.map((e) => String(e.id || e.event_exhibit_id_random))
.filter(Boolean);
if (current_search_id === last_search_id) { if (current_search_id === last_search_id) {
untrack(() => { untrack(() => {
exhibit_id_li = local_ids; exhibit_id_li = local_ids;
@@ -128,12 +151,23 @@
try { try {
let order_by_li: any = {}; let order_by_li: any = {};
switch (params.sort) { switch (params.sort) {
case 'name_asc': order_by_li = { name: 'ASC' }; break; case 'name_asc':
case 'name_desc': order_by_li = { name: 'DESC' }; break; order_by_li = { name: 'ASC' };
case 'code_asc': order_by_li = { code: 'ASC' }; break; break;
case 'code_desc': order_by_li = { code: 'DESC' }; break; case 'name_desc':
case 'updated_desc': order_by_li = { updated_on: 'DESC' }; break; order_by_li = { name: 'DESC' };
default: order_by_li = { name: 'ASC' }; break;
case 'code_asc':
order_by_li = { code: 'ASC' };
break;
case 'code_desc':
order_by_li = { code: 'DESC' };
break;
case 'updated_desc':
order_by_li = { updated_on: 'DESC' };
break;
default:
order_by_li = { name: 'ASC' };
} }
const results = await events_func.search__exhibit({ const results = await events_func.search__exhibit({
@@ -145,7 +179,9 @@
}); });
if (current_search_id === last_search_id) { if (current_search_id === last_search_id) {
const api_ids = results.map((e: any) => String(e.id || e.event_exhibit_id_random)).filter(Boolean); const api_ids = results
.map((e: any) => String(e.id || e.event_exhibit_id_random))
.filter(Boolean);
untrack(() => { untrack(() => {
exhibit_id_li = api_ids; exhibit_id_li = api_ids;
$events_sess.leads.submit_status__search = 'done'; $events_sess.leads.submit_status__search = 'done';
@@ -161,29 +197,36 @@
} }
</script> </script>
<section class="ae_events_leads_new h-full w-full flex flex-col items-center space-y-4 p-4"> <section
class="ae_events_leads_new h-full w-full flex flex-col items-center space-y-4 p-4"
>
<h1 class="h2">Exhibitor Leads</h1> <h1 class="h2">Exhibitor Leads</h1>
<Comp_exhibit_search <Comp_exhibit_search event_id={page.params.event_id ?? ''} />
event_id={page.params.event_id ?? ''}
/>
{#if $events_sess.leads.submit_status__search === 'searching' && exhibit_id_li.length === 0} {#if $events_sess.leads.submit_status__search === 'searching' && exhibit_id_li.length === 0}
<div class="flex flex-col items-center justify-center p-10 opacity-50 text-center"> <div
class="flex flex-col items-center justify-center p-10 opacity-50 text-center"
>
<LoaderCircle size="3em" class="animate-spin mb-4 mx-auto" /> <LoaderCircle size="3em" class="animate-spin mb-4 mx-auto" />
<p class="text-xl">Searching exhibits...</p> <p class="text-xl">Searching exhibits...</p>
</div> </div>
{:else if $lq__event_exhibit_obj_li && $lq__event_exhibit_obj_li.length > 0} {:else if $lq__event_exhibit_obj_li && $lq__event_exhibit_obj_li.length > 0}
<h2 class="h3">Select your exhibit from the list</h2> <h2 class="h3">Select your exhibit from the list</h2>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 w-full max-w-6xl"> <div
class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 w-full max-w-6xl"
>
{#each $lq__event_exhibit_obj_li as exhibit_obj} {#each $lq__event_exhibit_obj_li as exhibit_obj}
<a <a
href="/events/{page.params.event_id}/leads/exhibit/{exhibit_obj.id_random}" href="/events/{page.params
.event_id}/leads/exhibit/{exhibit_obj.id_random}"
class="card card-hover p-4 flex flex-col items-center justify-center text-center space-y-2 preset-tonal" class="card card-hover p-4 flex flex-col items-center justify-center text-center space-y-2 preset-tonal"
> >
<Store size="2em" /> <Store size="2em" />
<div class="font-bold text-lg">{exhibit_obj.name}</div> <div class="font-bold text-lg">{exhibit_obj.name}</div>
<div class="badge preset-filled-surface-500">Booth #{exhibit_obj.code}</div> <div class="badge preset-filled-surface-500">
Booth #{exhibit_obj.code}
</div>
</a> </a>
{/each} {/each}
</div> </div>

35
src/routes/events/[event_id]/(leads)/leads/ae_comp__exhibit_search.svelte
View File

@@ -4,10 +4,7 @@
log_lvl?: number; log_lvl?: number;
} }
let { let { event_id, log_lvl = 0 }: Props = $props();
event_id,
log_lvl = 0
}: Props = $props();
// *** Import other supporting libraries // *** Import other supporting libraries
import { import {
@@ -17,13 +14,8 @@
LoaderCircle LoaderCircle
} from 'lucide-svelte'; } from 'lucide-svelte';
import { import { ae_loc } from '$lib/stores/ae_stores';
ae_loc import { events_loc, events_sess } from '$lib/stores/ae_events_stores';
} from '$lib/stores/ae_stores';
import {
events_loc,
events_sess
} from '$lib/stores/ae_events_stores';
function handle_search_trigger() { function handle_search_trigger() {
if ($events_loc.leads.search_version === undefined) { if ($events_loc.leads.search_version === undefined) {
@@ -34,13 +26,15 @@
function prevent_default<T extends Event>(fn: (event: T) => void) { function prevent_default<T extends Event>(fn: (event: T) => void) {
return function (event: T) { return function (event: T) {
event.prevent_default(); event.preventDefault();
fn(event); fn(event);
}; };
} }
</script> </script>
<div class="ae_group filters_and_search flex flex-col items-center justify-center gap-2 w-full"> <div
class="ae_group filters_and_search flex flex-col items-center justify-center gap-2 w-full"
>
<form <form
onsubmit={prevent_default(() => { onsubmit={prevent_default(() => {
handle_search_trigger(); handle_search_trigger();
@@ -48,7 +42,9 @@
autocomplete="off" autocomplete="off"
class="search_form flex flex-row flex-wrap gap-1 items-center justify-center w-full max-w-7xl px-2 md:px-12 py-2 preset-tonal-success rounded-lg shadow-sm" class="search_form flex flex-row flex-wrap gap-1 items-center justify-center w-full max-w-7xl px-2 md:px-12 py-2 preset-tonal-success rounded-lg shadow-sm"
> >
<div class="flex flex-col md:flex-row items-center justify-center gap-1 grow"> <div
class="flex flex-col md:flex-row items-center justify-center gap-1 grow"
>
<input <input
type="search" type="search"
placeholder="Exhibitor name or code..." placeholder="Exhibitor name or code..."
@@ -91,7 +87,8 @@
Search Search
</button> </button>
<button type="button" <button
type="button"
class:hidden={!$events_loc.leads.qry__search_text} class:hidden={!$events_loc.leads.qry__search_text}
onclick={() => { onclick={() => {
$events_loc.leads.qry__search_text = ''; $events_loc.leads.qry__search_text = '';
@@ -106,9 +103,13 @@
</div> </div>
</form> </form>
<div class="flex flex-row flex-wrap items-center justify-center gap-2 opacity-70 hover:opacity-100 transition-all"> <div
class="flex flex-row flex-wrap items-center justify-center gap-2 opacity-70 hover:opacity-100 transition-all"
>
{#if $ae_loc.edit_mode} {#if $ae_loc.edit_mode}
<label class="flex items-center gap-1 cursor-pointer bg-surface-200-800 px-2 py-1 rounded-token text-xs font-semibold"> <label
class="flex items-center gap-1 cursor-pointer bg-surface-200-800 px-2 py-1 rounded-token text-xs font-semibold"
>
<span> Remote First </span> <span> Remote First </span>
<input <input
type="checkbox" type="checkbox"

141
src/routes/events/[event_id]/(leads)/leads/exhibit/[exhibit_id]/+page.svelte
View File

@@ -2,7 +2,11 @@
import { onMount, untrack } from 'svelte'; import { onMount, untrack } from 'svelte';
import { liveQuery } from 'dexie'; import { liveQuery } from 'dexie';
import { db_events } from '$lib/ae_events/db_events'; import { db_events } from '$lib/ae_events/db_events';
import { events_loc, events_sess, events_slct } from '$lib/stores/ae_events_stores'; import {
events_loc,
events_sess,
events_slct
} from '$lib/stores/ae_events_stores';
import { ae_api, ae_loc } from '$lib/stores/ae_stores'; import { ae_api, ae_loc } from '$lib/stores/ae_stores';
import { page } from '$app/state'; import { page } from '$app/state';
import { events_func } from '$lib/ae_events_functions'; import { events_func } from '$lib/ae_events_functions';
@@ -12,10 +16,16 @@
// *** Initialization & Store Guard *** // *** Initialization & Store Guard ***
if ($events_loc.leads) { if ($events_loc.leads) {
if (typeof $events_loc.leads.tracking__search_version === 'undefined') $events_loc.leads.tracking__search_version = 0; if (typeof $events_loc.leads.tracking__search_version === 'undefined')
if (typeof $events_loc.leads.tracking__qry__remote_first === 'undefined') $events_loc.leads.tracking__qry__remote_first = false; $events_loc.leads.tracking__search_version = 0;
if (typeof $events_loc.leads.tracking__qry__search_text === 'undefined') $events_loc.leads.tracking__qry__search_text = ''; if (
if (typeof $events_loc.leads.tracking__qry__sort_order === 'undefined') $events_loc.leads.tracking__qry__sort_order = 'created_desc'; typeof $events_loc.leads.tracking__qry__remote_first === 'undefined'
)
$events_loc.leads.tracking__qry__remote_first = false;
if (typeof $events_loc.leads.tracking__qry__search_text === 'undefined')
$events_loc.leads.tracking__qry__search_text = '';
if (typeof $events_loc.leads.tracking__qry__sort_order === 'undefined')
$events_loc.leads.tracking__qry__sort_order = 'created_desc';
} }
let tracking_id_li: Array<string> = $state([]); let tracking_id_li: Array<string> = $state([]);
@@ -32,7 +42,7 @@
return liveQuery(async () => { return liveQuery(async () => {
if (Array.isArray(ids) && ids.length > 0) { if (Array.isArray(ids) && ids.length > 0) {
const results = await db_events.exhibit_tracking.bulkGet(ids); const results = await db_events.exhibit_tracking.bulkGet(ids);
return results.filter(item => item !== undefined); return results.filter((item) => item !== undefined);
} }
if (exhibit_id && !$events_loc.leads.tracking__qry__search_text) { if (exhibit_id && !$events_loc.leads.tracking__qry__search_text) {
@@ -57,7 +67,9 @@
// Standardized Reactive Search Pattern // Standardized Reactive Search Pattern
let search_params = $derived({ let search_params = $derived({
v: $events_loc.leads.tracking__search_version, v: $events_loc.leads.tracking__search_version,
str: ($events_loc.leads.tracking__qry__search_text ?? '').toLowerCase().trim(), str: ($events_loc.leads.tracking__qry__search_text ?? '')
.toLowerCase()
.trim(),
sort: $events_loc.leads.tracking__qry__sort_order, sort: $events_loc.leads.tracking__qry__sort_order,
exhibit_id: page.params.exhibit_id, exhibit_id: page.params.exhibit_id,
remote_first: $events_loc.leads.tracking__qry__remote_first remote_first: $events_loc.leads.tracking__qry__remote_first
@@ -99,12 +111,23 @@
let local_results = await db_events.exhibit_tracking let local_results = await db_events.exhibit_tracking
.where('event_exhibit_id_random') .where('event_exhibit_id_random')
.equals(exhibit_id) .equals(exhibit_id)
.filter(tracking => { .filter((tracking) => {
if (qry_str) { if (qry_str) {
const name = (tracking.event_badge_full_name ?? '').toLowerCase(); const name = (
const email = (tracking.event_badge_email ?? '').toLowerCase(); tracking.event_badge_full_name ?? ''
const notes = (tracking.exhibitor_notes ?? '').toLowerCase(); ).toLowerCase();
if (!name.includes(qry_str) && !email.includes(qry_str) && !notes.includes(qry_str)) return false; const email = (
tracking.event_badge_email ?? ''
).toLowerCase();
const notes = (
tracking.exhibitor_notes ?? ''
).toLowerCase();
if (
!name.includes(qry_str) &&
!email.includes(qry_str) &&
!notes.includes(qry_str)
)
return false;
} }
return true; return true;
}) })
@@ -112,15 +135,37 @@
local_results.sort((a, b) => { local_results.sort((a, b) => {
switch (params.sort) { switch (params.sort) {
case 'name_asc': return (a.event_badge_full_name ?? '').localeCompare(b.event_badge_full_name ?? ''); case 'name_asc':
case 'name_desc': return (b.event_badge_full_name ?? '').localeCompare(a.event_badge_full_name ?? ''); return (
case 'created_asc': return new Date(a.created_on || 0).getTime() - new Date(b.created_on || 0).getTime(); a.event_badge_full_name ?? ''
case 'created_desc': return new Date(b.created_on || 0).getTime() - new Date(a.created_on || 0).getTime(); ).localeCompare(b.event_badge_full_name ?? '');
default: return new Date(b.created_on || 0).getTime() - new Date(a.created_on || 0).getTime(); case 'name_desc':
return (
b.event_badge_full_name ?? ''
).localeCompare(a.event_badge_full_name ?? '');
case 'created_asc':
return (
new Date(a.created_on || 0).getTime() -
new Date(b.created_on || 0).getTime()
);
case 'created_desc':
return (
new Date(b.created_on || 0).getTime() -
new Date(a.created_on || 0).getTime()
);
default:
return (
new Date(b.created_on || 0).getTime() -
new Date(a.created_on || 0).getTime()
);
} }
}); });
const local_ids = local_results.map(e => String(e.id || e.event_exhibit_tracking_id_random)).filter(Boolean); const local_ids = local_results
.map((e) =>
String(e.id || e.event_exhibit_tracking_id_random)
)
.filter(Boolean);
if (current_search_id === last_search_id) { if (current_search_id === last_search_id) {
untrack(() => { untrack(() => {
tracking_id_li = local_ids; tracking_id_li = local_ids;
@@ -135,11 +180,20 @@
try { try {
let order_by_li: any = {}; let order_by_li: any = {};
switch (params.sort) { switch (params.sort) {
case 'name_asc': order_by_li = { event_badge_full_name: 'ASC' }; break; case 'name_asc':
case 'name_desc': order_by_li = { event_badge_full_name: 'DESC' }; break; order_by_li = { event_badge_full_name: 'ASC' };
case 'created_asc': order_by_li = { created_on: 'ASC' }; break; break;
case 'created_desc': order_by_li = { created_on: 'DESC' }; break; case 'name_desc':
default: order_by_li = { created_on: 'DESC' }; order_by_li = { event_badge_full_name: 'DESC' };
break;
case 'created_asc':
order_by_li = { created_on: 'ASC' };
break;
case 'created_desc':
order_by_li = { created_on: 'DESC' };
break;
default:
order_by_li = { created_on: 'DESC' };
} }
const results = await events_func.search__exhibit_tracking({ const results = await events_func.search__exhibit_tracking({
@@ -151,7 +205,11 @@
}); });
if (current_search_id === last_search_id) { if (current_search_id === last_search_id) {
const api_ids = results.map((e: any) => String(e.id || e.event_exhibit_tracking_id_random)).filter(Boolean); const api_ids = results
.map((e: any) =>
String(e.id || e.event_exhibit_tracking_id_random)
)
.filter(Boolean);
untrack(() => { untrack(() => {
tracking_id_li = api_ids; tracking_id_li = api_ids;
$events_sess.leads.submit_status__search = 'done'; $events_sess.leads.submit_status__search = 'done';
@@ -178,34 +236,45 @@
} }
</script> </script>
<section class="ae_events_leads_tracking_new h-full w-full flex flex-col items-center space-y-4 p-4"> <section
<div class="w-full max-w-6xl flex flex-col md:flex-row justify-between items-center gap-4"> class="ae_events_leads_tracking_new h-full w-full flex flex-col items-center space-y-4 p-4"
>
<div
class="w-full max-w-6xl flex flex-col md:flex-row justify-between items-center gap-4"
>
<div class="text-center md:text-left"> <div class="text-center md:text-left">
<h1 class="h2">Leads for {$lq__exhibit_obj?.name ?? 'Exhibitor'}</h1> <h1 class="h2">
Leads for {$lq__exhibit_obj?.name ?? 'Exhibitor'}
</h1>
<p class="opacity-50">Booth #{$lq__exhibit_obj?.code ?? '...'}</p> <p class="opacity-50">Booth #{$lq__exhibit_obj?.code ?? '...'}</p>
</div> </div>
<div class="flex gap-2"> <div class="flex gap-2">
<button type="button" class="btn preset-tonal-secondary" onclick={handle_export}> <button
type="button"
class="btn preset-tonal-secondary"
onclick={handle_export}
>
<Download size="1.25em" class="mr-2" /> Export CSV <Download size="1.25em" class="mr-2" /> Export CSV
</button> </button>
<a href={`/events/${page.params.event_id}/leads/exhibit/${page.params.exhibit_id}/scan`} class="btn preset-filled-primary"> <a
href={`/events/${page.params.event_id}/leads/exhibit/${page.params.exhibit_id}/scan`}
class="btn preset-filled-primary"
>
<UserPlus size="1.25em" class="mr-2" /> Add Lead <UserPlus size="1.25em" class="mr-2" /> Add Lead
</a> </a>
</div> </div>
</div> </div>
<Comp_exhibit_tracking_search <Comp_exhibit_tracking_search exhibit_id={page.params.exhibit_id ?? ''} />
exhibit_id={page.params.exhibit_id ?? ''}
/>
{#if $events_sess.leads.submit_status__search === 'searching' && tracking_id_li.length === 0} {#if $events_sess.leads.submit_status__search === 'searching' && tracking_id_li.length === 0}
<div class="flex flex-col items-center justify-center p-10 opacity-50 text-center"> <div
class="flex flex-col items-center justify-center p-10 opacity-50 text-center"
>
<LoaderCircle size="3em" class="animate-spin mb-4 mx-auto" /> <LoaderCircle size="3em" class="animate-spin mb-4 mx-auto" />
<p class="text-xl">Searching leads...</p> <p class="text-xl">Searching leads...</p>
</div> </div>
{:else} {:else}
<Comp_exhibit_tracking_obj_li <Comp_exhibit_tracking_obj_li {lq__event_exhibit_tracking_obj_li} />
lq__event_exhibit_tracking_obj_li={lq__event_exhibit_tracking_obj_li}
/>
{/if} {/if}
</section> </section>

21
src/routes/events/[event_id]/(leads)/leads/exhibit/[exhibit_id]/ae_comp__exhibit_tracking_obj_li.svelte
View File

@@ -32,7 +32,9 @@
{:else if $lq__event_exhibit_tracking_obj_li.length === 0} {:else if $lq__event_exhibit_tracking_obj_li.length === 0}
<div class="card p-8 text-center variant-soft-surface"> <div class="card p-8 text-center variant-soft-surface">
<p class="text-xl opacity-50">No leads found yet.</p> <p class="text-xl opacity-50">No leads found yet.</p>
<p class="text-sm opacity-50 mt-2">Start scanning badges to collect leads!</p> <p class="text-sm opacity-50 mt-2">
Start scanning badges to collect leads!
</p>
</div> </div>
{:else} {:else}
<div class="space-y-4"> <div class="space-y-4">
@@ -52,11 +54,15 @@
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
<User size="1.25em" class="text-primary-500" /> <User size="1.25em" class="text-primary-500" />
<span class="text-xl font-bold"> <span class="text-xl font-bold">
{tracking_obj.event_badge_full_name || tracking_obj.event_badge_full_name_override || 'Unknown Attendee'} {tracking_obj.event_badge_full_name ||
tracking_obj.event_badge_full_name_override ||
'Unknown Attendee'}
</span> </span>
</div> </div>
<div class="flex flex-wrap gap-x-4 gap-y-1 text-sm opacity-70"> <div
class="flex flex-wrap gap-x-4 gap-y-1 text-sm opacity-70"
>
{#if tracking_obj.event_badge_email} {#if tracking_obj.event_badge_email}
<div class="flex items-center gap-1"> <div class="flex items-center gap-1">
<Mail size="1em" /> <Mail size="1em" />
@@ -76,9 +82,14 @@
</div> </div>
{#if tracking_obj.exhibitor_notes} {#if tracking_obj.exhibitor_notes}
<div class="mt-2 p-2 bg-surface-100-900 rounded text-sm italic border-l-2 border-surface-300-700"> <div
class="mt-2 p-2 bg-surface-100-900 rounded text-sm italic border-l-2 border-surface-300-700"
>
<FileText size="1em" class="inline mr-1" /> <FileText size="1em" class="inline mr-1" />
{ae_util.shorten_string({ string: tracking_obj.exhibitor_notes, max_length: 100 })} {ae_util.shorten_string({
string: tracking_obj.exhibitor_notes,
max_length: 100
})}
</div> </div>
{/if} {/if}
</div> </div>

35
src/routes/events/[event_id]/(leads)/leads/exhibit/[exhibit_id]/ae_comp__exhibit_tracking_search.svelte
View File

@@ -4,10 +4,7 @@
log_lvl?: number; log_lvl?: number;
} }
let { let { exhibit_id, log_lvl = 0 }: Props = $props();
exhibit_id,
log_lvl = 0
}: Props = $props();
// *** Import other supporting libraries // *** Import other supporting libraries
import { import {
@@ -17,13 +14,8 @@
LoaderCircle LoaderCircle
} from 'lucide-svelte'; } from 'lucide-svelte';
import { import { ae_loc } from '$lib/stores/ae_stores';
ae_loc import { events_loc, events_sess } from '$lib/stores/ae_events_stores';
} from '$lib/stores/ae_stores';
import {
events_loc,
events_sess
} from '$lib/stores/ae_events_stores';
function handle_search_trigger() { function handle_search_trigger() {
if ($events_loc.leads.tracking__search_version === undefined) { if ($events_loc.leads.tracking__search_version === undefined) {
@@ -34,13 +26,15 @@
function prevent_default<T extends Event>(fn: (event: T) => void) { function prevent_default<T extends Event>(fn: (event: T) => void) {
return function (event: T) { return function (event: T) {
event.prevent_default(); event.preventDefault();
fn(event); fn(event);
}; };
} }
</script> </script>
<div class="ae_group filters_and_search flex flex-col items-center justify-center gap-2 w-full"> <div
class="ae_group filters_and_search flex flex-col items-center justify-center gap-2 w-full"
>
<form <form
onsubmit={prevent_default(() => { onsubmit={prevent_default(() => {
handle_search_trigger(); handle_search_trigger();
@@ -48,7 +42,9 @@
autocomplete="off" autocomplete="off"
class="search_form flex flex-row flex-wrap gap-1 items-center justify-center w-full max-w-7xl px-2 md:px-12 py-2 preset-tonal-primary rounded-lg shadow-sm" class="search_form flex flex-row flex-wrap gap-1 items-center justify-center w-full max-w-7xl px-2 md:px-12 py-2 preset-tonal-primary rounded-lg shadow-sm"
> >
<div class="flex flex-col md:flex-row items-center justify-center gap-1 grow"> <div
class="flex flex-col md:flex-row items-center justify-center gap-1 grow"
>
<input <input
type="search" type="search"
placeholder="Search leads (name, email, notes)..." placeholder="Search leads (name, email, notes)..."
@@ -90,7 +86,8 @@
Search Search
</button> </button>
<button type="button" <button
type="button"
class:hidden={!$events_loc.leads.tracking__qry__search_text} class:hidden={!$events_loc.leads.tracking__qry__search_text}
onclick={() => { onclick={() => {
$events_loc.leads.tracking__qry__search_text = ''; $events_loc.leads.tracking__qry__search_text = '';
@@ -105,9 +102,13 @@
</div> </div>
</form> </form>
<div class="flex flex-row flex-wrap items-center justify-center gap-2 opacity-70 hover:opacity-100 transition-all"> <div
class="flex flex-row flex-wrap items-center justify-center gap-2 opacity-70 hover:opacity-100 transition-all"
>
{#if $ae_loc.edit_mode} {#if $ae_loc.edit_mode}
<label class="flex items-center gap-1 cursor-pointer bg-surface-200-800 px-2 py-1 rounded-token text-xs font-semibold"> <label
class="flex items-center gap-1 cursor-pointer bg-surface-200-800 px-2 py-1 rounded-token text-xs font-semibold"
>
<span> Remote First </span> <span> Remote First </span>
<input <input
type="checkbox" type="checkbox"