<script lang="ts">
    import HelpLabel from "#labels/HelpLabel.svelte";
    import Inputlabel from "#labels/InputLabel.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 {
        GebaeudeAufnahmeClient,
            GebaeudeClient,
            UploadedGebaeudeBild,
            VerbrauchsausweisWohnenClient,
        } from "./types.js";
        import { boolean } from "astro:schema";
            import SanierungsOption from "#components/Ausweis/SanierungsOption.svelte"
    
        export let gebaeude: GebaeudeClient;
        export let gebaeude_aufnahme_allgemein: GebaeudeAufnahmeClient;
        export let ausweis: VerbrauchsausweisWohnenClient
        export let images: UploadedGebaeudeBild[];
    
    </script>
    
    <div id="sanierungszustand" class="bereich-box grid 
    grid-cols-1 gap-x-4 gap-y-2
    
    sm:grid-cols-2 sm:gap-x-6 sm:gap-y-8
    md:grid-cols-2 md:gap-x-6 md:gap-y-8
    
    xl:grid-cols-2 xl:gap-x-8 xl:gap-y-8
    2xl:grid-cols-3 2xl:gap-x-8 2xl:gap-y-2
    ">
    
    <SanierungsOption label="Zentral/Etage" name="zentralheizung" help="Bitte anklicken wenn die Heizwärme <strong>zentral erzeugt</strong> und von dort in die Räume verteilt wird. Gasthermen und Etagenheizungen in der Wohnung gehören auch dazu." value="ZH" bind:checked={gebaeude_aufnahme_allgemein.zentralheizung}></SanierungsOption>
    <SanierungsOption label="Einzelofen" name="einzelofen" help="Bei <strong>dezentraler Erzeugung</strong> in den Räumen wie z.B. Nachtspeicher, Kami- oder Kachelofen. Dezentrale Klimageräte zur Wärmeerzeugung gehören auch dazu." value="EO" bind:checked={gebaeude_aufnahme_allgemein.einzelofen}></SanierungsOption>
    <SanierungsOption label="Durchlauferhitzer (elektrisch)" name="durchlauf_erhitzer" help="Wenn <strong>dezentrale</strong> elektrische <strong>Warmwassererzeugung</strong> vorhanden ist" value="DH" bind:checked={gebaeude_aufnahme_allgemein.durchlauf_erhitzer}></SanierungsOption>
    <SanierungsOption label="Standardkessel" name="standard_kessel" help="Gemeint sind Konstanttemperaturkessel und ältere Gebläse- oder Feststoffkessel" value="SK" bind:checked={gebaeude_aufnahme_allgemein.standard_kessel}></SanierungsOption>
    <SanierungsOption label="Solarsystem für Warmwasser" name="solarsystem_warmwasser" help="Solarpanele auf dem Dach zur <strong>alternativen Warmwassererzeugung</strong> aus Sonnenenergie. Nicht zu verwechseln mit Photovoltaik." value="SSWW" bind:checked={gebaeude_aufnahme_allgemein.solarsystem_warmwasser}></SanierungsOption>
    <SanierungsOption label="Wärmepumpe" name="waermepumpe" help="Elektrisch betriebener Wärmerzeuger der thermische Energie aus natürlichen Wärmequellen wie der <strong>Umgebungsluft, dem Erdreich oder Grundwasser</strong> nutzbar macht." value="WP" bind:checked={gebaeude_aufnahme_allgemein.waermepumpe}></SanierungsOption>
    <SanierungsOption label="Niedertemperaturkessel" name="niedertemperatur_kessel" help="Heizkessel der mit <strong>niedrigen Vorlauftemperaturen</strong> (35-75 °C) arbeitet. Im Vergleich zum Brennwertkessel ist er weniger effizient, wird aber noch in älteren Heizsystemen eingesetzt." value="NK" bind:checked={gebaeude_aufnahme_allgemein.niedertemperatur_kessel}></SanierungsOption>
    <SanierungsOption label="Brennwertkessel" name="brennwert_kessel" help="Hat einen besonders <strong>hohen Wirkungsgrad</strong> weil er die im Abgas enthaltene Kondensationswärme zurückgewinnt. Auch zu erkennen am doppelwandigem Abgasrohr welches sich nicht erhitzt." value="BWK" bind:checked={gebaeude_aufnahme_allgemein.brennwert_kessel}></SanierungsOption>
    <SanierungsOption label="Warmwasserrohre gedämmt" name="warmwasser_rohre_gedaemmt" help="Gemeint sind die sichtbaren Rohre des Verteilsystems Warmwasser. Gedämmte Rohre sind an den <strong>dunklen Ummantelungen</strong> (Manschetten) zu erkennen." value="BWK" bind:checked={gebaeude_aufnahme_allgemein.warmwasser_rohre_gedaemmt}></SanierungsOption>
    <SanierungsOption label="Heizungsrohre gedämmt" name="heizungsrohre_gedaemmt" help="Gemeint sind die sichtbaren Rohre des Verteilsystems Heizung. Gedämmte Rohre sind an den <strong>dunklen Ummantelungen</strong> (Manschetten) zu erkennen.ext" value="HRGD" bind:checked={gebaeude_aufnahme_allgemein.heizungsrohre_gedaemmt}></SanierungsOption>
    <SanierungsOption label="Zirkulation" name="zirkulation" help="Kreislauf von Heizungs- oder Warmwasser <strong>innerhalb eines Leitungssystems</strong>, um eine gleichmäßige Wärmeverteilung sicherzustellen." value="ZK" bind:checked={gebaeude_aufnahme_allgemein.zirkulation}></SanierungsOption>
    <SanierungsOption label="Photovoltaik auf dem Dach" name="photovoltaik" help="Direkte Umwandlung von Sonnenlicht in <strong>elektrische Energie</strong> mittels Solarzellen, die den photoelektrischen Effekt nutzen." value="PV" bind:checked={gebaeude_aufnahme_allgemein.photovotaik}></SanierungsOption>
    </div>
    
    <HeizungImage bind:images bind:ausweis bind:gebaeude />
    
    <style lang="postcss">
    
    </style>
    
    <!--
    
    <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 bind:images bind:ausweis bind:gebaeude />
    
    -->
    
    