Files
online-energieausweis/src/modules/Dashboard/DashboardModule.svelte
2025-02-04 10:00:18 +07:00

29 lines
971 B
Svelte

<script lang="ts">
import { BenutzerClient, ObjektClient } from "#components/Ausweis/types";
export let user: BenutzerClient;
export let gebaeudeArray: ObjektClient[];
</script>
<h1 class="text-4xl font-medium my-8">Willkommen zurück, {user.vorname}!</h1>
<p class="text-lg">
Hier finden Sie eine Übersicht über all ihre Ausweise und Gebäude.
</p>
<h1 class="text-4xl font-medium my-8">Gebäude</h1>
<div class="grid grid-cols-1 gap-4 lg:grid-cols-2">
{#each gebaeudeArray as gebaeude}
<div class="card lg:card-side bg-base-200 card-bordered border-base-300">
<figure class="lg:w-1/2">
<img
src={(gebaeude.gebaeude_bilder && `/bilder/${gebaeude.gebaeude_bilder[0]?.uid}.webp`) || "/images/placeholder.jpg"}
class="object-cover w-full h-full"
alt="Gebäudebild"
/>
</figure>
<div class="card-body lg:w-1/2 p-4">
<h4 class="text-lg font-semibold">{gebaeude.adresse}, {gebaeude.plz} {gebaeude.ort}</h4>
</div>
</div>
{/each}
</div>