1
0
Fork 0
mirror of https://github.com/seanmorley15/AdventureLog.git synced 2025-08-04 04:35:19 +02:00

checklists ui beta

This commit is contained in:
Sean Morley 2024-08-05 18:48:11 -04:00
parent f2888f26fe
commit d5f93c5d9d
8 changed files with 256 additions and 85 deletions

View file

@ -0,0 +1,67 @@
<script lang="ts">
import { addToast } from '$lib/toasts';
import type { Checklist, User } from '$lib/types';
import { createEventDispatcher } from 'svelte';
const dispatch = createEventDispatcher();
import Launch from '~icons/mdi/launch';
import TrashCan from '~icons/mdi/trash-can';
import Calendar from '~icons/mdi/calendar';
export let checklist: Checklist;
export let user: User | null = null;
function editNote() {
dispatch('edit', checklist);
}
async function deleteChecklist() {
const res = await fetch(`/api/checklists/${checklist.id}`, {
method: 'DELETE'
});
if (res.ok) {
addToast('success', 'Checklist deleted successfully');
dispatch('delete', checklist.id);
} else {
addToast('Failed to delete checklist', 'error');
}
}
</script>
<div
class="card w-full max-w-xs sm:max-w-sm md:max-w-md lg:max-w-md xl:max-w-md bg-primary-content shadow-xl overflow-hidden text-base-content"
>
<div class="card-body">
<div class="flex justify-between">
<h2 class="text-2xl font-semibold -mt-2 break-words text-wrap">
{checklist.name}
</h2>
</div>
<div class="badge badge-neutral">Checklist</div>
{#if checklist.items.length > 0}
<p>{checklist.items.length} {checklist.items.length > 1 ? 'Items' : 'Item'}</p>
{/if}
{#if checklist.date && checklist.date !== ''}
<div class="inline-flex items-center">
<Calendar class="w-5 h-5 mr-1" />
<p>{new Date(checklist.date).toLocaleDateString('en-US', { timeZone: 'UTC' })}</p>
</div>
{/if}
<div class="card-actions justify-end">
<!-- <button class="btn btn-neutral mb-2" on:click={() => goto(`/notes/${note.id}`)}
><Launch class="w-6 h-6" />Open Details</button
> -->
<button class="btn btn-neutral mb-2" on:click={editNote}>
<Launch class="w-6 h-6" />Open
</button>
{#if checklist.user_id == user?.pk}
<button
id="delete_adventure"
data-umami-event="Delete Checklist"
class="btn btn-warning"
on:click={deleteChecklist}><TrashCan class="w-6 h-6" /></button
>
{/if}
</div>
</div>
</div>

View file

@ -7,6 +7,7 @@
import Launch from '~icons/mdi/launch';
import TrashCan from '~icons/mdi/trash-can';
import Calendar from '~icons/mdi/calendar';
export let note: Note;
export let user: User | null = null;
@ -32,10 +33,21 @@
class="card w-full max-w-xs sm:max-w-sm md:max-w-md lg:max-w-md xl:max-w-md bg-primary-content shadow-xl overflow-hidden text-base-content"
>
<div class="card-body">
<h2 class="card-title overflow-ellipsis">{note.name}</h2>
<div class="flex justify-between">
<h2 class="text-2xl font-semibold -mt-2 break-words text-wrap">
{note.name}
</h2>
</div>
<div class="badge badge-neutral">Note</div>
{#if note.links && note.links.length > 0}
<p>{note.links.length} links</p>
{/if}
{#if note.date && note.date !== ''}
<div class="inline-flex items-center">
<Calendar class="w-5 h-5 mr-1" />
<p>{new Date(note.date).toLocaleDateString('en-US', { timeZone: 'UTC' })}</p>
</div>
{/if}
<div class="card-actions justify-end">
<!-- <button class="btn btn-neutral mb-2" on:click={() => goto(`/notes/${note.id}`)}
><Launch class="w-6 h-6" />Open Details</button

View file

@ -1,5 +1,5 @@
import inspirationalQuotes from './json/quotes.json';
import type { Adventure, Collection } from './types';
import type { Adventure, Collection, Note, Transportation } from './types';
export function getRandomQuote() {
const quotes = inspirationalQuotes.quotes;
@ -74,3 +74,81 @@ export function isValidUrl(url: string) {
return false;
}
}
export function groupAdventuresByDate(
adventures: Adventure[],
startDate: Date,
numberOfDays: number
): Record<string, Adventure[]> {
const groupedAdventures: Record<string, Adventure[]> = {};
for (let i = 0; i < numberOfDays; i++) {
const currentDate = new Date(startDate);
currentDate.setDate(startDate.getDate() + i);
const dateString = currentDate.toISOString().split('T')[0];
groupedAdventures[dateString] = [];
}
adventures.forEach((adventure) => {
if (adventure.date) {
const adventureDate = new Date(adventure.date).toISOString().split('T')[0];
if (groupedAdventures[adventureDate]) {
groupedAdventures[adventureDate].push(adventure);
}
}
});
return groupedAdventures;
}
export function groupTransportationsByDate(
transportations: Transportation[],
startDate: Date,
numberOfDays: number
): Record<string, Transportation[]> {
const groupedTransportations: Record<string, Transportation[]> = {};
for (let i = 0; i < numberOfDays; i++) {
const currentDate = new Date(startDate);
currentDate.setDate(startDate.getDate() + i);
const dateString = currentDate.toISOString().split('T')[0];
groupedTransportations[dateString] = [];
}
transportations.forEach((transportation) => {
if (transportation.date) {
const transportationDate = new Date(transportation.date).toISOString().split('T')[0];
if (groupedTransportations[transportationDate]) {
groupedTransportations[transportationDate].push(transportation);
}
}
});
return groupedTransportations;
}
export function groupNotesByDate(
notes: Note[],
startDate: Date,
numberOfDays: number
): Record<string, Note[]> {
const groupedNotes: Record<string, Note[]> = {};
for (let i = 0; i < numberOfDays; i++) {
const currentDate = new Date(startDate);
currentDate.setDate(startDate.getDate() + i);
const dateString = currentDate.toISOString().split('T')[0];
groupedNotes[dateString] = [];
}
notes.forEach((note) => {
if (note.date) {
const noteDate = new Date(note.date).toISOString().split('T')[0];
if (groupedNotes[noteDate]) {
groupedNotes[noteDate].push(note);
}
}
});
return groupedNotes;
}

View file

@ -69,6 +69,7 @@ export type Collection = {
end_date?: string;
transportations?: Transportation[];
notes?: Note[];
checklists?: Checklist[];
};
export type OpenStreetMapPlace = {
@ -118,3 +119,25 @@ export type Note = {
created_at: string; // ISO 8601 date string
updated_at: string; // ISO 8601 date string
};
export type Checklist = {
id: number;
user_id: number;
name: string;
items: ChecklistItem[];
date: string | null; // ISO 8601 date string
is_public: boolean;
collection: number | null;
created_at: string; // ISO 8601 date string
updated_at: string; // ISO 8601 date string
};
export type ChecklistItem = {
id: number;
user_id: number;
name: string;
is_checked: boolean;
checklist: number;
created_at: string; // ISO 8601 date string
updated_at: string; // ISO 8601 date string
};