<script lang="ts">
	import HelpLabel from "../HelpLabel.svelte";
	import HeizungImage from "./HeizungImage.svelte";
	import AusweisPreviewContainer from "./AusweisPreviewContainer.svelte";
	import DaemmungImage from "./DaemmungImage.svelte";
	import FensterImage from "./FensterImage.svelte";
	import Label from "../Label.svelte";
	import type {
		BedarfsausweisWohnen,
		VerbrauchsausweisGewerbe,
	} from "@ibcornelsen/database/client";
	import {
	GebaeudeAufnahmeClient,
		GebaeudeClient,
		UploadedGebaeudeBild,
		VerbrauchsausweisWohnenClient,
	} from "./types";

	export let gebaeude: GebaeudeClient;
	export let gebaeude_aufnahme_allgemein: GebaeudeAufnahmeClient;
	export let ausweis:
		| VerbrauchsausweisWohnenClient
		| VerbrauchsausweisGewerbe
		| BedarfsausweisWohnen;
	export let images: UploadedGebaeudeBild[];
</script>

<div class="GRB3">
	<HelpLabel title="Heizungsanlage (bitte zutreffendes ankreuzen) *">
		Wir benötigen diese Angaben um den allgemeinen Modernisierungsstand
		einschätzen zu können. Bitte setzen Sie den Haken wenn zutreffend. Das
		seit Mai 2021 gültige GEG erfordert eine genauere Prüfung anhand von
		Fotos. Bitte laden Sie ein oder mehrere Fotos der Heizungsanlage bzw.
		des Heizungsraums hoch.
	</HelpLabel>
	<hr />

	<div class="grid grid-cols-4">
		<div class="form-group col-md-3 mw1">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="zentralheizung"
					bind:checked={gebaeude_aufnahme_allgemein.zentralheizung}
					value="ZH"
				/>Zentral/Etage</label
			>
		</div>
		<div class="form-group col-md-3 mw1">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="einzelofen"
					bind:checked={gebaeude_aufnahme_allgemein.einzelofen}
					value="EO"
				/>Einzelöfen</label
			>
		</div>
		<div class="form-group col-md-3 mw1">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="durchlauf_erhitzer"
					bind:checked={gebaeude_aufnahme_allgemein.durchlauf_erhitzer}
					value="DH"
				/>Durchlauferhitzer</label
			>
		</div>
		<div class="form-group col-md-3 mw1">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="standard_kessel"
					bind:checked={gebaeude_aufnahme_allgemein.standard_kessel}
					value="SK"
				/>Standardkessel</label
			>
		</div>
		<div class="form-group col-md-3 mw1">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="solarsystem_warmwasser"
					bind:checked={gebaeude_aufnahme_allgemein.solarsystem_warmwasser}
					value="SSWW"
				/>Solarsystem für Warmwasser</label
			>
		</div>
		<div class="form-group col-md-3 mw1">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="waermepumpe"
					bind:checked={gebaeude_aufnahme_allgemein.waermepumpe}
					value="WP"
				/>Wärmepumpe</label
			>
		</div>
		<div class="form-group col-md-3 mw1">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="niedertemperatur_kessel"
					bind:checked={gebaeude_aufnahme_allgemein.niedertemperatur_kessel}
					value="NK"
				/>Niedertemperaturkessel</label
			>
		</div>
		<div class="form-group col-md-3 mw1">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="brennwert_kessel"
					bind:checked={gebaeude_aufnahme_allgemein.brennwert_kessel}
					value="BWK"
				/>Brennwertkessel</label
			>
		</div>
		<div class="form-group col-md-3 mw1">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="warmwasser_rohre_gedaemmt"
					bind:checked={gebaeude_aufnahme_allgemein.warmwasser_rohre_gedaemmt}
					value="WRGD"
				/>Warmwasserrohre gedämmt</label
			>
		</div>
		<div class="form-group col-md-3 mw1">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="heizungsrohre_gedaemmt"
					bind:checked={gebaeude_aufnahme_allgemein.heizungsrohre_gedaemmt}
					value="HRGD"
				/>Heizungsrohre gedämmt</label
			>
		</div>
		<div class="form-group col-md-3 mw1">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="zirkulation"
					bind:checked={gebaeude_aufnahme_allgemein.zirkulation}
					value="ZK"
				/>Zirkulation</label
			>
		</div>
		<div class="form-group col-md-3 mw1">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="raum_temperatur_regler"
					bind:checked={gebaeude_aufnahme_allgemein.raum_temperatur_regler}
					value="RTR"
				/>Raumtemperaturregler</label
			>
		</div>
	</div>
</div>

<hr />

<HeizungImage bind:images bind:ausweis bind:gebaeude />

<hr />

<div class="GRB3">
	<HelpLabel
		title="Fenster/Dachfenster/Türen (bitte zutreffendes ankreuzen):*"
	>
		Wir benötigen diese Angaben um den allgemeinen Modernisierungsstand
		einschätzen zu können. Bitte setzen Sie den Haken wenn zutreffend.
	</HelpLabel>
	<hr />

	<div class="grid grid-cols-4">
		<div class="form-group col-md-3">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="einfach_verglasung"
					bind:checked={gebaeude_aufnahme_allgemein.einfach_verglasung}
					value="EG"
				/>Einfachglas</label
			>
		</div>
		<div class="form-group col-md-3">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="doppel_verglasung"
					bind:checked={gebaeude_aufnahme_allgemein.doppel_verglasung}
					value="DF"
				/>Doppelverglasung</label
			>
		</div>
		<div class="form-group col-md-3">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="isolier_verglasung"
					bind:checked={gebaeude_aufnahme_allgemein.isolier_verglasung}
					value="IVG"
				/>Isolierverglasung</label
			>
		</div>
		<div class="form-group col-md-3">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="dreifach_verglasung"
					bind:checked={gebaeude_aufnahme_allgemein.dreifach_verglasung}
					value="PHF"
				/>Dreifachverglasung</label
			>
		</div>
		<div class="form-group col-md-3">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="fenster_dicht"
					bind:checked={gebaeude_aufnahme_allgemein.fenster_dicht}
					value="FD"
				/>Alle Fenster dicht</label
			>
		</div>
		<div class="form-group col-md-3">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="fenster_teilweise_undicht"
					bind:checked={gebaeude_aufnahme_allgemein.fenster_teilweise_undicht}
					value="FTUD"
				/>Fenster teilweise undicht</label
			>
		</div>
		<div class="form-group col-md-3">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="tueren_dicht"
					bind:checked={gebaeude_aufnahme_allgemein.tueren_dicht}
					value="TD"
				/>Alle Türen dicht</label
			>
		</div>
		<div class="form-group col-md-3">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="tueren_undicht"
					bind:checked={gebaeude_aufnahme_allgemein.tueren_undicht}
					value="TUD"
				/>Türen teilweise undicht</label
			>
		</div>
		<div class="form-group col-md-3">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="rolllaeden_kaesten_gedaemmt"
					bind:checked={gebaeude_aufnahme_allgemein.rolllaeden_kaesten_gedaemmt}
					value="RKD"
				/>Rollladenkästen gedämmt, luftdicht</label
			>
		</div>
	</div>
</div>

<hr />

<FensterImage bind:images bind:ausweis bind:gebaeude />

<hr />

<div class="GRB3">
	<div class="form-group col-md-12">
		<HelpLabel title="Wärmedämmung (bitte zutreffendes ankreuzen) *">
			Wir benötigen diese Angaben um den allgemeinen Modernisierungsstand
			einschätzen zu können. Bitte setzen Sie den Haken wenn zutreffend.
			Das seit Mai 2021 gültige GEG erfordert eine genauere Prüfung anhand
			von Fotos. Bitte laden Sie ein oder mehrere Fotos der Außenwand und
			des Dachbereiches hoch.
		</HelpLabel>
		<hr />
	</div>

	<div class="grid grid-cols-4">
		<div class="form-group col-md-3 mw1">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="aussenwand_gedaemmt"
					bind:checked={gebaeude_aufnahme_allgemein.aussenwand_gedaemmt}
					value="AWD"
				/>Außenwand gedämmt</label
			>
		</div>
		<div class="form-group col-md-3 mw1">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="keller_wand_gedaemmt"
					bind:checked={gebaeude_aufnahme_allgemein.keller_wand_gedaemmt}
					value="KWD"
				/>Kelleraußenwand gedämmt</label
			>
		</div>
		<div class="form-group col-md-3 mw1">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="keller_decke_gedaemmt"
					bind:checked={gebaeude_aufnahme_allgemein.keller_decke_gedaemmt}
					value="KDD"
				/>Kellerdecke gedämmt</label
			>
		</div>
		<div class="form-group col-md-3 mw1">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="dachgeschoss_gedaemmt"
					bind:checked={gebaeude_aufnahme_allgemein.dachgeschoss_gedaemmt}
					value="DGD"
				/>Dachgeschoss gedämmt</label
			>
		</div>
		<div class="form-group col-md-3 mw1">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="oberste_geschossdecke_gedaemmt"
					bind:checked={gebaeude_aufnahme_allgemein.oberste_geschossdecke_gedaemmt}
					value="OGDDW"
				/>Oberste Geschossdecke gedämmt</label
			>
		</div>
		<div class="form-group col-md-6 mw1">
			<label class="checkbox-inline"
				><input
					type="checkbox"
					class="checkbox"
					name="oberste_geschossdecke_min_12cm_gedaemmt"
					bind:checked={gebaeude_aufnahme_allgemein.oberste_geschossdecke_min_12cm_gedaemmt}
					value="OGDD"
				/>Oberste Geschossdecke min. 12cm gedämmt</label
			>
		</div>
	</div>
</div>

<hr />

<DaemmungImage bind:images bind:ausweis bind:gebaeude />

<hr />

<Label
	>H - Hier können Sie ein Gebäudebild hochladen und sich Ihren Energieausweis
	als PDF anschauen</Label
>

<AusweisPreviewContainer {ausweis} {gebaeude} />
