mirror of
https://github.com/seanmorley15/AdventureLog.git
synced 2025-07-31 02:39:38 +02:00
eab7cb6087
The code changes include adding activity types functionality to the CreateNewAdventure and AdventureCard components. This allows users to specify different types of activities for each adventure. The changes also include updates to the server files to handle the new activity types. Recent user commits: - Refactor adventure page layout to display activity types and update server files - Add activity types to EditModal component and update server files - Add activity types to AdventureCard component and update server files - Refactor adventure page layout to display activity types in +page.svelte and update server files - Refactor adventure page layout to display activity types in +page.svelte and update server files - Refactor CreateNewAdventure component to add activity types and update server files - Refactor adventure page layout to use a responsive image size in +page.svelte - Merge pull request #52 from seanmorley15/development - Refactor error handling and add validation for adventure name in server and page files - Update config.ts
87 lines
2.8 KiB
Svelte
87 lines
2.8 KiB
Svelte
<script lang="ts">
|
|
import { createEventDispatcher } from "svelte";
|
|
import locationDot from "$lib/assets/locationDot.svg";
|
|
import calendar from "$lib/assets/calendar.svg";
|
|
import { goto } from "$app/navigation";
|
|
import { desc } from "drizzle-orm";
|
|
import type { Adventure } from "$lib/utils/types";
|
|
const dispatch = createEventDispatcher();
|
|
|
|
export let type: String;
|
|
|
|
export let adventure: Adventure;
|
|
|
|
// export let name: String | undefined = undefined;
|
|
// export let location: String | undefined = undefined;
|
|
// export let date: String | undefined = undefined;
|
|
// export let id: Number | undefined = undefined;
|
|
|
|
function remove() {
|
|
dispatch("remove", adventure.id);
|
|
}
|
|
function edit() {
|
|
console.log(adventure.activityTypes);
|
|
dispatch("edit", adventure.id);
|
|
}
|
|
function add() {
|
|
dispatch("add", adventure);
|
|
}
|
|
|
|
function moreInfo() {
|
|
console.log(adventure.id);
|
|
goto(`/adventure/${adventure.id}`);
|
|
}
|
|
</script>
|
|
|
|
<div
|
|
class="card min-w-max lg:w-96 md:w-80 sm:w-60 xs:w-40 bg-primary-content shadow-xl overflow-hidden text-base-content"
|
|
>
|
|
<div class="card-body">
|
|
<h2 class="card-title overflow-ellipsis">{adventure.name}</h2>
|
|
{#if adventure.location && adventure.location !== ""}
|
|
<div class="inline-flex items-center">
|
|
<iconify-icon icon="mdi:map-marker" class="text-xl"></iconify-icon>
|
|
<p class="ml-.5">{adventure.location}</p>
|
|
</div>
|
|
{/if}
|
|
{#if adventure.date && adventure.date !== ""}
|
|
<div class="inline-flex items-center">
|
|
<iconify-icon icon="mdi:calendar" class="text-xl"></iconify-icon>
|
|
<p class="ml-1">{adventure.date}</p>
|
|
</div>
|
|
{/if}
|
|
{#if adventure.activityTypes && adventure.activityTypes.length > 0}
|
|
<ul class="flex flex-wrap">
|
|
{#each adventure.activityTypes as activity}
|
|
<div
|
|
class="badge badge-primary mr-1 text-md font-semibold pb-2 pt-1 mb-1"
|
|
>
|
|
{activity}
|
|
</div>
|
|
{/each}
|
|
</ul>
|
|
{/if}
|
|
<div class="card-actions justify-end">
|
|
{#if type == "mylog"}
|
|
<button class="btn btn-primary" on:click={moreInfo}
|
|
><iconify-icon icon="mdi:launch" class="text-2xl"
|
|
></iconify-icon></button
|
|
>
|
|
<button class="btn btn-primary" on:click={edit}
|
|
><iconify-icon icon="mdi:file-document-edit" class="text-2xl"
|
|
></iconify-icon></button
|
|
>
|
|
<button class="btn btn-secondary" on:click={remove}
|
|
><iconify-icon icon="mdi:trash-can-outline" class="text-2xl"
|
|
></iconify-icon></button
|
|
>
|
|
{/if}
|
|
{#if type == "featured"}
|
|
<button class="btn btn-primary" on:click={add}
|
|
><iconify-icon icon="mdi:plus" class="text-2xl"
|
|
></iconify-icon></button
|
|
>
|
|
{/if}
|
|
</div>
|
|
</div>
|
|
</div>
|