54 lines
2.3 KiB
Svelte
54 lines
2.3 KiB
Svelte
<script lang="ts">
|
|
import { ObjektKomplettClient } from "#components/Ausweis/types.js";
|
|
import { Enums } from "#lib/client/prisma.js";
|
|
import moment from "moment";
|
|
import { File, OpenInNewWindow } from "radix-svelte-icons";
|
|
|
|
export let objekt: ObjektKomplettClient;
|
|
</script>
|
|
|
|
<div class=" bg-white grid grid-cols-3 md:grid-cols-3 lg:grid-cols-3 gap-4">
|
|
{#if objekt.aufnahmen.length > 0}
|
|
{@const bild = objekt.aufnahmen[0].bilder.find(bild => bild.kategorie === Enums.BilderKategorie.Gebaeude)}
|
|
<div>
|
|
{#if bild}
|
|
<img src="/bilder/{bild.id}.jpg" class="w-full h-[150px] object-cover rounded-lg" alt="Gebäude">
|
|
{:else}
|
|
<img src="/placeholder.png" class="w-full h-[150px] object-cover rounded-lg" alt="Gebäude">
|
|
{/if}
|
|
<h3 class="text-lg font-medium">{objekt.adresse}, {objekt.plz} {objekt.ort}</h3>
|
|
</div>
|
|
{/if}
|
|
|
|
<div class="flex gap-4">
|
|
<div>
|
|
<div class="inline-block border rounded-lg bg-white">
|
|
<img src="/public/images/dashboard/ausweishaken.jpg" class="h-auto w-auto max-h-[150px] max-w-full object-contain p-1" alt="Energieausweis ausgestellt">
|
|
</div>
|
|
<div class="text-sm text-center">Energieausweis</div>
|
|
</div>
|
|
<div>
|
|
<div class="inline-block border rounded-lg bg-white">
|
|
<img src="/public/images/dashboard/ausweishaken.jpg" class="h-auto w-auto max-h-[150px] max-w-full object-contain p-1" alt="Energieausweis ausgestellt">
|
|
</div>
|
|
<div class="text-sm text-center">Energieausweis</div>
|
|
</div>
|
|
</div>
|
|
<div class="flex flex-col gap-4">
|
|
{#each objekt.aufnahmen as aufnahme}
|
|
<div class="inline-block border rounded-lg px-4 py-2 w-full">
|
|
<div class="flex justify-between items-center w-full">
|
|
<span class="text-sm">Detailübersicht<br>Stand vom {moment(aufnahme.erstellungsdatum).format("DD.MM.YYYY")}</span>
|
|
<a href="/dashboard/aufnahme/{aufnahme.id}" class="rounded-lg p-2 hover:bg-gray-100"><OpenInNewWindow size={30}></OpenInNewWindow></a>
|
|
</div>
|
|
</div>
|
|
<div class="inline-block border rounded-lg px-4 py-2 w-full">
|
|
<div class="flex justify-between items-center w-full">
|
|
<span class="text-sm">Detailübersicht<br>Stand vom {moment(aufnahme.erstellungsdatum).format("DD.MM.YYYY")}</span>
|
|
<a href="/dashboard/aufnahme/{aufnahme.id}" class="rounded-lg p-2 hover:bg-gray-100"><OpenInNewWindow size={30}></OpenInNewWindow></a>
|
|
</div>
|
|
</div>
|
|
{/each}
|
|
</div>
|
|
</div>
|
|
<hr> |