Docker/AdventureLog
Docker/AdventureLog
1
0
Fork 0
mirror of https://github.com/seanmorley15/AdventureLog.git synced 2025-07-23 14:59:36 +02:00
Code Issues Releases Activity

Category frontend fixes

Browse source
This commit is contained in:
Sean Morley 2024-09-23 18:46:04 -04:00
parent 9a672e51cd
commit 86cefc8b2f
5 changed files with 62 additions and 117 deletions
Download patch file Download diff file Expand all files Collapse all files

28
frontend/src/lib/components/AdventureCard.svelte
View file

@ -19,6 +19,7 @@
import DotsHorizontal from '~icons/mdi/dots-horizontal';
import DeleteWarning from './DeleteWarning.svelte';
import ImageDisplayModal from './ImageDisplayModal.svelte';
import { typeToString } from '$lib';
export let type: string;
export let user: User | null;
@ -209,16 +210,8 @@
</button>
</div>
<div>
{#if adventure.type == 'visited'}
<div class="badge badge-primary">Visited</div>
{:else if adventure.type == 'planned'}
<div class="badge badge-secondary">Planned</div>
{:else if adventure.type == 'lodging'}
<div class="badge badge-success">Lodging</div>
{:else if adventure.type == 'dining'}
<div class="badge badge-accent">Dining</div>
{/if}
<div class="badge badge-primary">{typeToString(adventure.type)}</div>
<div class="badge badge-success">{adventure.visits.length > 0 ? 'Visited' : 'Planned'}</div>
<div class="badge badge-secondary">{adventure.is_public ? 'Public' : 'Private'}</div>
</div>
{#if adventure.location && adventure.location !== ''}
@ -227,16 +220,13 @@
<p class="ml-.5">{adventure.location}</p>
</div>
{/if}
{#if adventure.date && adventure.date !== ''}
<div class="inline-flex items-center">
{#if adventure.visits.length > 0}
<!-- visited badge -->
<div class="flex items-center">
<Calendar class="w-5 h-5 mr-1" />
<p>
{new Date(adventure.date).toLocaleDateString(undefined, {
timeZone: 'UTC'
})}{adventure.end_date && adventure.end_date !== ''
? ' - ' +
new Date(adventure.end_date).toLocaleDateString(undefined, { timeZone: 'UTC' })
: ''}
<p class="ml-.5">
{adventure.visits.length}
{adventure.visits.length > 1 ? 'visits' : 'visit'}
</p>
</div>
{/if}

108
frontend/src/lib/components/AdventureModal.svelte
View file

@ -22,6 +22,7 @@
import Earth from '~icons/mdi/earth';
import ActivityComplete from './ActivityComplete.svelte';
import { appVersion } from '$lib/config';
import { ADVENTURE_TYPES } from '$lib';
export let startDate: string | null = null;
export let endDate: string | null = null;
@ -37,8 +38,7 @@
id: '',
name: '',
type: 'visited',
date: null,
end_date: null,
visits: [],
link: null,
description: null,
activity_types: [],
@ -57,9 +57,7 @@
adventure = {
id: adventureToEdit?.id || '',
name: adventureToEdit?.name || '',
type: adventureToEdit?.type || 'visited',
date: adventureToEdit?.date || null,
end_date: adventureToEdit?.end_date || null,
type: adventureToEdit?.type || 'general',
link: adventureToEdit?.link || null,
description: adventureToEdit?.description || null,
activity_types: adventureToEdit?.activity_types || [],
@ -70,7 +68,9 @@
location: adventureToEdit?.location || null,
images: adventureToEdit?.images || [],
user_id: adventureToEdit?.user_id || null,
collection: adventureToEdit?.collection || collection_id || null
collection: adventureToEdit?.collection || collection_id || null,
// visits: adventureToEdit?.visits || []
visits: []
};
let markers: Point[] = [];
@ -369,18 +369,6 @@
}
}
if (adventure.date && adventure.end_date) {
if (new Date(adventure.date) > new Date(adventure.end_date)) {
addToast('error', 'Start date must be before end date');
return;
}
}
if (adventure.end_date && !adventure.date) {
adventure.end_date = null;
adventure.date = null;
}
console.log(adventure);
if (adventure.id === '') {
let res = await fetch('/api/adventures', {
@ -449,84 +437,14 @@
</div>
<div>
<div class="form-control">
<label class="label cursor-pointer">
<span class="label-text">Visited</span>
<input
type="radio"
name="radio-10"
class="radio checked:bg-red-500"
on:click={() => (adventure.type = 'visited')}
checked={adventure.type == 'visited'}
/>
</label>
</div>
<div class="form-control">
<label class="label cursor-pointer">
<span class="label-text">Planned</span>
<input
type="radio"
name="radio-10"
class="radio checked:bg-blue-500"
on:click={() => (adventure.type = 'planned')}
checked={adventure.type == 'planned'}
/>
</label>
</div>
{#if is_collection}
<div class="form-control">
<label class="label cursor-pointer">
<span class="label-text">Lodging</span>
<input
type="radio"
name="radio-10"
class="radio checked:bg-blue-500"
on:click={() => (adventure.type = 'lodging')}
checked={adventure.type == 'lodging'}
/>
</label>
</div>
<div class="form-control">
<label class="label cursor-pointer">
<span class="label-text">Dining</span>
<input
type="radio"
name="radio-10"
class="radio checked:bg-blue-500"
on:click={() => (adventure.type = 'dining')}
checked={adventure.type == 'dining'}
/>
</label>
</div>
{/if}
<label for="link">Category</label><br />
<select class="select select-bordered w-full max-w-xs" bind:value={adventure.type}>
<option disabled selected>Select Adventure Type</option>
{#each ADVENTURE_TYPES as type}
<option value={type.type}>{type.label}</option>
{/each}
</select>
</div>
<div>
<label for="date">{adventure.date ? 'Start Date' : 'Date'}</label><br />
<input
type="date"
id="date"
name="date"
min={startDate || ''}
max={endDate || ''}
bind:value={adventure.date}
class="input input-bordered w-full"
/>
</div>
{#if adventure.date}
<div>
<label for="end_date">End Date</label><br />
<input
type="date"
id="end_date"
name="end_date"
min={startDate || ''}
max={endDate || ''}
bind:value={adventure.end_date}
class="input input-bordered w-full"
/>
</div>
{/if}
<div>
<!-- link -->
<div>