<script lang="ts">
	import ImageGrid from "../ImageGrid.svelte";;
	import { Enums } from "#lib/client/prisma";
	import { BedarfsausweisWohnenClient, ObjektClient, UploadedGebaeudeBild, VerbrauchsausweisGewerbeClient, VerbrauchsausweisWohnenClient } from "./types.js";

	export let images: UploadedGebaeudeBild[] = [];
	export let ausweis: VerbrauchsausweisWohnenClient | VerbrauchsausweisGewerbeClient | BedarfsausweisWohnenClient;
	export let gebaeude: ObjektClient;
</script>

<div class="grid grid-cols-1 lg:grid-cols-2 gap-x-6 mt-6 p-2 sm:px-0">
	
	<div class="md:box md:card mb-0 bereich-box">

		<div class="font-bold mb-2">
			<span class="text-red-500">WICHTIG:</span>
			Bild Upload - Heizungsanlage bzw. des Wärmeerzeugers (1 bis 4 Bilder)
		</div>

		<div>
			Seit Mai 2021 wird das neue Gebäudeenergiegesetz (GEG) in
			Deutschland angewendet. Daher werden von nun an Bilder vom Gebäude
			zur Einschätzung der Modernisierungsempfehlungen benötigt. Hierfür
			müssen laut Gesetzgeber Detailbilder vom Sanierungszustand bzw. der
			Gebäudehülle und der Anlagentechnik (Wärmeerzeuger etc.) zur
			Verfügung gestellt werden. Diese Bilder erscheinen nicht auf Ihrem
			Energieausweis.
		</div>
		<br />
		<ol>
			<li>1.Bild : Heizungsraum mit Heizkessel bzw. Heizungsanlage*</li>
			<li>2.Bild : <em>(wenn möglich, Warmwasserleitungen bzw. die Heizungsrohre)</em></li>
			<li>3.Bild : <em>(wenn möglich, Detailbild des Wärmeerzeugers bzw. Heizkessel)</em></li>
			<li>4.Bild : <em>(wenn möglich, Bild des Typenschildes der Heizung)</em></li>
		</ol>
		<br>
		<div>* erforderliches Bild</div>
		<br />
		<div>
			Idealerweise sollte der Heizungsraum mit Heizkessel bzw.
			Heizungsanlage fotografiert werden. Die Warmwasserleitungen bzw. die
			Heizungsrohre sollten gut sichtbar sein und vorhandene bzw. nicht
			vorhandene Dämmung sollte erkennbar sein.
		</div>
	</div>

	<div class="md:box md:card mb-0 mt-6 md:mt-0">
		<div>
			Diese Bilder erscheinen <span class="text-red-500">nicht</span> auf
			Ihrem Energieausweis!<br />
			<strong>Bitte laden Sie hier mind. 1 Bild hoch:</strong>
		</div>

		<ImageGrid 
		name={"heizung_image"} 
		kategorie={Enums.BilderKategorie.Heizung} 
		max={4} 
		min={1} 
		bind:objekt={gebaeude} 
		bind:images 
		bind:ausweis 
		>
		TEXT FEHLT
		</ImageGrid>

	</div>
</div>
