Improving person reports and related

src/lib/ae_stores.ts

@@ -217,6 +217,8 @@ export let ae_app_session_data_struct: key_val = {
 
     'person': {
         show_report__person_li: false,
+
+        qry_max__people: 100,
     },
 
 

src/routes/core/+page.svelte

@@ -64,7 +64,7 @@ let person_id_random_li: string[] = [];
         console.log('Edit the POC person for the session.');
 
         let params = {
-            qry__limit: 300,
+            qry__limit: $ae_sess.person.qry_max__people,
         }
 
         // $slct.person_obj_li = await core_func.handle_load_ae_obj_li__person({api_cfg: $ae_api, account_id: $slct.account_id, params: params});
@@ -173,8 +173,59 @@ let person_id_random_li: string[] = [];
 
 <!-- Show people for this account -->
 {#if $ae_sess.person.show_report__person_li && person_id_random_li?.length > 0}
+<h3 class="h4 text-center">Person Records</h3>
+
+<label
+    class="text-sm"
+    for="qry_max__people">Max results:
+
+<select
+    id="qry_max__people"
+    bind:value={$ae_sess.person.qry_max__people}
+    on:change={() => {
+        core_func.handle_load_ae_obj_li__person({
+            api_cfg: $ae_api,
+            account_id: $slct.account_id,
+            params: {
+                'qry__enabled': 'enabled',
+                'qry__hidden': 'not_hidden',
+                'qry__limit': $ae_sess.person.qry_max__people,},
+            log_lvl: 1,
+        })
+        .then(function (load_results) {
+            console.log(`Loaded person_obj_li:`, load_results);
+            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;
+            }
+            return load_results;
+        })
+    }}
+    class="select max-w-20 text-sm"
+    >
+    <option value={25}>25</option>
+    <option value={50}>50</option>
+    <option value={75}>75</option>
+    <option value={100}>100</option>
+    <option value={250}>250</option>
+    <option value={400}>400</option>
+    <option value={500}>500</option>
+</select>
+
+</label>
+
 <div class="">
-Count: {person_id_random_li?.length}
+<!-- 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}

src/routes/core/ae_comp__person_obj_tbl.svelte

@@ -38,8 +38,23 @@ let lq_kv__person_obj_li = liveQuery(
 
 {#if person_id_random_li && $lq_kv__person_obj_li && $lq_kv__person_obj_li?.length > 0}
 <div class="overflow-auto">
+<h2 class="h3">
+    <span class="text-md">
+    Results:
+    </span>
+
+    {#if $lq_kv__person_obj_li.length}
+    <span class="text-3xl font-bold bg-success-100 px-4 border rounded-lg border-success-200"
+            title="Count {$lq_kv__person_obj_li.length ?? 'None'}"
+            >
+        <span class="fas fa-list-ol mx-4"></span>
+        {$lq_kv__person_obj_li.length ?? 'None'}
+    </span>
+    {/if}
+</h2>
+
 <table
-    class="table-auto w-full table-striped table-hover"
+    class="table table-auto table-striped table-hover w-full text-xs lg:text-sm"
     >
     <thead>
         <tr>

src/routes/events_pres_mgmt/ae_comp__event_file_obj_tbl.svelte

@@ -57,8 +57,9 @@ let lq_kv__event_file_obj_li = liveQuery(
     </span>
     {/if}
 </h2>
+
 <table
-    class="table-auto w-full table-striped table-hover text-xs lg:text-sm"
+    class="table table-auto table-striped table-hover w-full text-xs lg:text-sm"
     >
     <thead
         class=""

src/routes/events_pres_mgmt/ae_comp__event_presenter_obj_tbl.svelte

@@ -52,8 +52,9 @@ let lq_kv__event_presenter_obj_li = liveQuery(
     </span>
     {/if}
 </h2>
+
 <table
-    class="table-auto w-full table-striped table-hover text-xs lg:text-sm"
+    class="table table-auto table-striped table-hover w-full text-xs lg:text-sm"
     >
     <thead>
         <tr>