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

Lots of work on the Journals

Browse Source
This commit is contained in:
Scott Idem
2025-03-21 16:26:01 -04:00
parent 35354a9d0f
commit 8826ebf92f
9 changed files with 677 additions and 218 deletions
Download Patch File Download Diff File Expand all files Collapse all files

129
src/routes/journals/ae_comp__journal_entry_obj_li.svelte
View File

@@ -4,7 +4,7 @@ let log_lvl: number = 1;
// *** Import Svelte specific
import { goto, invalidate, pushState, replaceState } from '$app/navigation';
import { NotebookText, Shapes } from '@lucide/svelte';
import { CalendarClock, NotebookPen, NotebookText, Shapes, Tags } from '@lucide/svelte';
// *** Import Aether specific variables and functions
@@ -46,55 +46,84 @@ let ae_promises: key_val = $state({});
>
<header class="ae_header flex flex-row gap-2 items-center justify-between w-full">
<a
href="/journals/{journals_journal_entry_obj?.journal_id}/entry/{journals_journal_entry_obj?.journal_entry_id}"
class="btn btn-secondary variant-ghost-primary hover:variant-filled-primary transition"
title={`View: ${journals_journal_entry_obj?.name}`}
>
<NotebookText class="m-1"/>
<span class="hidden md:inline">
View
</span>
</a>
{#if journals_journal_entry_obj.category_code}
<!-- When clicked, this will filter by the category code. -->
<button
type="button"
onclick={() => {
if (log_lvl) {
console.log('$journals_loc.filter__category_code', $journals_loc.filter__category_code);
}
if ($journals_loc.filter__category_code == journals_journal_entry_obj.category_code) {
$journals_loc.filter__category_code = null;
} else {
$journals_loc.filter__category_code = journals_journal_entry_obj.category_code;
}
// $journals_loc = {
// ...$journals_loc,
// };
$journals_trig.journal_entry_li = true;
if (log_lvl) {
console.log('$journals_loc.filter__category_code', $journals_loc.filter__category_code);
}
}}
class="btn variant-ghost-secondary hover:variant-filled-secondary transition"
title={`Filter by category: ${journals_journal_entry_obj.category_code}`}
>
<Shapes class="m-1 inline-block"/>
{journals_journal_entry_obj.category_code ?? '-- no category --'}
</button>
{/if}
<h3 class="journal__name h4">
<span class="journal__name">{@html journals_journal_entry_obj.name ?? ae_util.iso_datetime_formatter(journals_journal_entry_obj.created_on, 'datetime_iso_12_no_seconds')}</span>
<span class="journal_entry__name">
{#if (journals_journal_entry_obj.name)}
<NotebookText class="m-1 inline-block"/>
{@html journals_journal_entry_obj.name}
{:else}
<CalendarClock class="m-1 inline-block"/>
{ae_util.iso_datetime_formatter(journals_journal_entry_obj.created_on, 'datetime_iso_12_no_seconds')}
{/if}
</span>
</h3>
<div class="flex flex-row gap-2 items-center justify-end">
<!-- Tags for journal entry. Comma delimited list. -->
{#if journals_journal_entry_obj.tags && journals_journal_entry_obj.tags.length}
<div class="tags flex flex-wrap gap-1 items-center justify-start p-1">
<Tags class="m-1 inline-block"/>
<span class="text-sm text-gray-500 hidden md:inline">Tags:</span>
{#each journals_journal_entry_obj.tags.split(',') as tag}
<span
class="btn btn-sm variant-outline-tertiary hover:variant-ghost-tertiary transition py-1 px-2"
title={`Tag: ${tag.trim()}`}
>
{tag.trim()}
</span>
{/each}
</div>
{/if}
<!-- Category code for journal entry -->
{#if journals_journal_entry_obj.category_code}
<!-- When clicked, this will filter by the category code. -->
<button
type="button"
onclick={() => {
if ($journals_loc.filter__category_code == journals_journal_entry_obj.category_code) {
$journals_loc.filter__category_code = null;
} else {
$journals_loc.filter__category_code = journals_journal_entry_obj.category_code;
// We also want to set the category code used when creating a new journal entry.
$journals_loc.qry__category_code = journals_journal_entry_obj.category_code;
}
$journals_trig.journal_entry_li = true;
if (log_lvl) {
console.log('$journals_loc.filter__category_code', $journals_loc.filter__category_code);
}
}}
class="btn btn-sm variant-ghost-secondary hover:variant-filled-secondary transition py-1 px-2"
title={`Filter by category: ${journals_journal_entry_obj.category_code}`}
>
<Shapes class="m-1 inline-block"/>
{journals_journal_entry_obj.category_code ?? '-- no category --'}
</button>
{/if}
<a
href="/journals/{journals_journal_entry_obj?.journal_id}/entry/{journals_journal_entry_obj?.journal_entry_id}"
class="btn btn-secondary variant-ghost-primary hover:variant-filled-primary transition"
title={`View ID: ${journals_journal_entry_obj?.id}\n${journals_journal_entry_obj?.name ?? ae_util.iso_datetime_formatter(journals_journal_entry_obj.created_on, 'datetime_iso_12_no_seconds')}`}
>
<NotebookPen class="m-1 inline-block"/>
<span class="hidden md:inline">
View
</span>
</a>
</div>
</header>
{#if journals_journal_entry_obj.content}<pre class="journal__content p-2 bg-white shadow-md rounded-lg text-wrap text-sm font-normal whitespace-pre-wrap">{@html journals_journal_entry_obj.content}</pre>{/if}
{#if journals_journal_entry_obj.content}
<div class="journal__content w-full p-2 bg-white shadow-md rounded-lg text-wrap text-sm font-mono whitespace-pre-wrap">
{@html journals_journal_entry_obj.content}
</div>
{/if}
<!-- <div class="ae_options flex flex-row flex-wrap gap-2 items-center justify-center"> -->
@@ -166,26 +195,28 @@ let ae_promises: key_val = $state({});
<section
class="ae_meta mt-2 flex flex-col sm:flex-row gap-1 items-center justify-center text-sm text-gray-500"
class="ae_meta mt-2 flex flex-col sm:flex-row gap-2 items-center justify-center text-xs text-gray-500"
class:hidden={!$ae_loc.administrator_access}
>
<span
<!-- <span
class="journal_entry__journal_entry_type"
class:hidden={!journals_journal_entry_obj.journal_entry_type}
>
Type: {journals_journal_entry_obj.journal_entry_type}
</span>
<span class="ae_group">
</span> -->
<span class="flex flex-row gap-1 items-center justify-center">
<span
class="journal_entry__created_on"
>
Created on: {ae_util.iso_datetime_formatter(journals_journal_entry_obj.created_on, 'datetime_12_long')}
Created:
{ae_util.iso_datetime_formatter(journals_journal_entry_obj.created_on, 'datetime_12_long')}
</span>
<span
class="journal_entry__updated_on"
class:hidden={!journals_journal_entry_obj.updated_on}
>
Updated on: {ae_util.iso_datetime_formatter(journals_journal_entry_obj.updated_on, 'datetime_12_long')}
Last update:
{ae_util.iso_datetime_formatter(journals_journal_entry_obj.updated_on, 'datetime_12_long')}
</span>
</span>
</section>