Merge pull request #236 from IBCornelsen/UMBE
UpDate Component mit Helptext
This commit is contained in:
@@ -14,32 +14,15 @@
|
||||
GebaeudeClient,
|
||||
UploadedGebaeudeBild,
|
||||
VerbrauchsausweisWohnenClient,
|
||||
} from "./types";
|
||||
} 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[];
|
||||
|
||||
var sanierungsoptionen =[
|
||||
|
||||
{"id":1,"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","bindchecked":gebaeude_aufnahme_allgemein.zentralheizung,"label":"Zentral/Etage"},
|
||||
{"id":2,"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","bindchecked":gebaeude_aufnahme_allgemein.einzelofen,"label":"Einzelofen"},
|
||||
{"id":3,"name":"durchlauf_erhitzer","help":"Wenn <strong>dezentrale</strong> elektrische <strong>Warmwassererzeugung</strong> vorhanden ist.","value":"DH","bindchecked":gebaeude_aufnahme_allgemein.durchlauf_erhitzer,"label":"Durchlauferhitzer (elektrisch)"},
|
||||
{"id":4,"name":"standard_kessel","help":"Gemeint sind Konstanttemperaturkessel und ältere Gebläse- oder Feststoffkessel.","value":"SK","bindchecked":gebaeude_aufnahme_allgemein.standard_kessel,"label":"Standardkessel"},
|
||||
{"id":5,"name":"solarsystem_warmwasser","help":"Solarpanele auf dem Dach zur <strong>alternativen Warmwassererzeugung</strong> aus Sonnenenergie. Nicht zu verwechseln mit Photovoltaik.","value":"SSWW","bindchecked":gebaeude_aufnahme_allgemein.solarsystem_warmwasser,"label":"Solarsystem für Warmwasser"},
|
||||
{"id":6,"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","bindchecked":gebaeude_aufnahme_allgemein.waermepumpe,"label":"Wärmepumpe"},
|
||||
|
||||
{"id":7,"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","bindchecked":gebaeude_aufnahme_allgemein.niedertemperatur_kessel,"label":"Niedertemperaturkessel"},
|
||||
{"id":8,"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","bindchecked":gebaeude_aufnahme_allgemein.brennwert_kessel,"label":"Brennwertkessel"},
|
||||
{"id":9,"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","bindchecked":gebaeude_aufnahme_allgemein.warmwasser_rohre_gedaemmt,"label":"Warmwasserrohre gedämmt"},
|
||||
{"id":10,"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.","value":"HRGD","bindchecked":gebaeude_aufnahme_allgemein.heizungsrohre_gedaemmt,"label":"Heizungsrohre gedämmt"},
|
||||
{"id":11,"name":"zirkulation","help":"Kreislauf von Heizungs- oder Warmwasser <strong>innerhalb eines Leitungssystems</strong>, um eine gleichmäßige Wärmeverteilung sicherzustellen.","value":"ZK","bindchecked":gebaeude_aufnahme_allgemein.zirkulation,"label":"Zirkulation"},
|
||||
{"id":12,"name":"photovoltaik","help":"Direkte Umwandlung von Sonnenlicht in <strong>elektrische Energie</strong> mittels Solarzellen, die den photoelektrischen Effekt nutzen.","value":"RTR","bindchecked":gebaeude_aufnahme_allgemein.photovoltaik,"label":"Photovoltaik auf dem Dach"}
|
||||
];
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<div id="sanierungszustand" class="bereich-box grid
|
||||
@@ -52,33 +35,18 @@ xl:grid-cols-2 xl:gap-x-8 xl:gap-y-8
|
||||
2xl:grid-cols-3 2xl:gap-x-8 2xl:gap-y-2
|
||||
">
|
||||
|
||||
|
||||
{#each sanierungsoptionen as item}
|
||||
|
||||
<div class="input-standard order-{item.id} md:order-{item.id} xl:order-{item.id}">
|
||||
|
||||
<div class="grid grid-cols-[40px_1fr] items-center justify-items-start h-[38px] ring-1 ring-black/15 bg-white active:bg-green-100" >
|
||||
|
||||
<input
|
||||
id="{item.name}"
|
||||
type="checkbox"
|
||||
class="checkbox"
|
||||
name="{item.name}"
|
||||
bind:checked={item.bindchecked}
|
||||
value="{item.value}"
|
||||
/>
|
||||
<label class="w-full" for="{item.name}">{item.label}</label>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="help-label">
|
||||
<HelpLabel>{@html item.help}</HelpLabel>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
{/each}
|
||||
|
||||
<SanierungsOption label="Zentral/Etage" name="zentralheizung" help="helptext" value="ZH" bind:checked={gebaeude_aufnahme_allgemein.zentralheizung}></SanierungsOption>
|
||||
<SanierungsOption label="Einzelofen" name="einzelofen" help="helptext" value="EO" bind:checked={gebaeude_aufnahme_allgemein.einzelofen}></SanierungsOption>
|
||||
<SanierungsOption label="Durchlauferhitzer" name="durchlauf_erhitzer" help="helptext" value="DH" bind:checked={gebaeude_aufnahme_allgemein.durchlauf_erhitzer}></SanierungsOption>
|
||||
<SanierungsOption label="Standardkessel" name="standard_kessel" help="helptext" value="SK" bind:checked={gebaeude_aufnahme_allgemein.standard_kessel}></SanierungsOption>
|
||||
<SanierungsOption label="Solarsystem für Warmwasser" name="solarsystem_warmwasser" help="helptext" value="SSWW" bind:checked={gebaeude_aufnahme_allgemein.solarsystem_warmwasser}></SanierungsOption>
|
||||
<SanierungsOption label="Wärmepumpe" name="waermepumpe" help="helptext" value="WP" bind:checked={gebaeude_aufnahme_allgemein.waermepumpe}></SanierungsOption>
|
||||
<SanierungsOption label="Niedertemperaturkessel" name="niedertemperatur_kessel" help="helptext" value="NK" bind:checked={gebaeude_aufnahme_allgemein.niedertemperatur_kessel}></SanierungsOption>
|
||||
<SanierungsOption label="Brennwertkessel" name="brennwert_kessel" help="helptext" value="BWK" bind:checked={gebaeude_aufnahme_allgemein.brennwert_kessel}></SanierungsOption>
|
||||
<SanierungsOption label="Warmwasserrohre gedämmt" name="warmwasser_rohre_gedaemmt" help="helptext" value="BWK" bind:checked={gebaeude_aufnahme_allgemein.warmwasser_rohre_gedaemmt}></SanierungsOption>
|
||||
<SanierungsOption label="Heizungsrohre gedämmt" name="heizungsrohre_gedaemmt" help="helptext" value="HRGD" bind:checked={gebaeude_aufnahme_allgemein.heizungsrohre_gedaemmt}></SanierungsOption>
|
||||
<SanierungsOption label="Zirkulation" name="zirkulation" help="helptext" value="ZK" bind:checked={gebaeude_aufnahme_allgemein.zirkulation}></SanierungsOption>
|
||||
<SanierungsOption label="Raumtemperaturregler" name="raum_temperatur_regler" help="helptext" value="RTR" bind:checked={gebaeude_aufnahme_allgemein.raum_temperatur_regler}></SanierungsOption>
|
||||
</div>
|
||||
|
||||
<HeizungImage bind:images bind:ausweis bind:gebaeude />
|
||||
|
||||
31
src/components/Ausweis/SanierungsOption.svelte
Normal file
31
src/components/Ausweis/SanierungsOption.svelte
Normal file
@@ -0,0 +1,31 @@
|
||||
<script lang="ts">
|
||||
import HelpLabel from "#labels/HelpLabel.svelte";
|
||||
|
||||
export let checked: boolean | null | undefined;
|
||||
export let name: string;
|
||||
export let label: string;
|
||||
export let help: string;
|
||||
export let value: string;
|
||||
</script>
|
||||
|
||||
<div
|
||||
class="input-standard"
|
||||
>
|
||||
<div
|
||||
class="grid grid-cols-[40px_1fr] items-center justify-items-start h-[38px] ring-1 ring-black/15 bg-white active:bg-green-100"
|
||||
>
|
||||
<input
|
||||
id={name}
|
||||
type="checkbox"
|
||||
class="checkbox"
|
||||
{name}
|
||||
bind:checked={checked}
|
||||
value={value}
|
||||
/>
|
||||
<label class="w-full" for={name}>{label}</label>
|
||||
</div>
|
||||
|
||||
<div class="help-label">
|
||||
<HelpLabel>{@html help}</HelpLabel>
|
||||
</div>
|
||||
</div>
|
||||
@@ -5,6 +5,11 @@ import Inputlabel from "#labels/InputLabel.svelte";
|
||||
|
||||
export let ausweis;
|
||||
|
||||
$: {
|
||||
if (!ausweis.warmwasser_enthalten) {
|
||||
ausweis.warmwasser_anteil_bekannt = false;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
import Warmwasseranteil from "#components/Ausweis/Warmwasseranteil.svelte";
|
||||
import Verbrauch from "#components/Ausweis/Verbrauch.svelte";
|
||||
import LueftungundLeerstand from "#components/Ausweis/LueftungundLeerstand.svelte";
|
||||
|
||||
|
||||
//import ZipSearch from "#components/PlzSuche.svelte";
|
||||
import moment from "moment";
|
||||
import BilderZusatzsysteme from "#components/Ausweis/BilderZusatzsysteme.svelte";
|
||||
@@ -190,75 +190,74 @@
|
||||
>
|
||||
</div>
|
||||
|
||||
<!-- A Prüfung der Ausweisart -->
|
||||
<BereichLabel bereich="A">Prüfung der Ausweisart</BereichLabel>
|
||||
<div class="collapseBereich">
|
||||
<Ausweisart
|
||||
bind:gebaeude
|
||||
bind:gebaeude_aufnahme_allgemein
|
||||
bind:ausweis
|
||||
/>
|
||||
</div>
|
||||
<!-- A Prüfung der Ausweisart -->
|
||||
<BereichLabel bereich="A">Prüfung der Ausweisart</BereichLabel>
|
||||
<div class="collapseBereich">
|
||||
<Ausweisart
|
||||
bind:gebaeude
|
||||
bind:gebaeude_aufnahme_allgemein
|
||||
bind:ausweis
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- B Eingabe der Gebäudeadresse - Angaben zu Wohnfläche, Keller und Dachgeschoss -->
|
||||
<!-- B Eingabe der Gebäudeadresse - Angaben zu Wohnfläche, Keller und Dachgeschoss -->
|
||||
|
||||
<BereichLabel bereich="B">Eingabe der Gebäudeadresse - Angaben zu Wohnfläche, Keller und Dachgeschoss</BereichLabel>
|
||||
<div class="collapseBereich">
|
||||
<GebaeudeDaten
|
||||
bind:gebaeude_aufnahme_allgemein
|
||||
/>
|
||||
</div>
|
||||
<BereichLabel bereich="B"
|
||||
>Eingabe der Gebäudeadresse -
|
||||
Angaben zu Wohnfläche, Keller und Dachgeschoss</BereichLabel
|
||||
>
|
||||
<div class="collapseBereich">
|
||||
<GebaeudeDaten bind:gebaeude_aufnahme_allgemein />
|
||||
</div>
|
||||
|
||||
<!-- C Eingabe von 3 zusammenhängenden Verbrauchsjahren -->
|
||||
<!-- C Eingabe von 3 zusammenhängenden Verbrauchsjahren -->
|
||||
|
||||
<BereichLabel bereich="C">Eingabe von 3 zusammenhängenden Verbrauchsjahren</BereichLabel>
|
||||
<div class="collapseBereich">
|
||||
<Verbrauch
|
||||
bind:gebaeude
|
||||
bind:gebaeude_aufnahme_allgemein
|
||||
bind:ausweis
|
||||
/>
|
||||
</div>
|
||||
<BereichLabel bereich="C"
|
||||
>Eingabe von 3 zusammenhängenden Verbrauchsjahren</BereichLabel
|
||||
>
|
||||
<div class="collapseBereich">
|
||||
<Verbrauch
|
||||
bind:gebaeude
|
||||
bind:gebaeude_aufnahme_allgemein
|
||||
bind:ausweis
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- D Eingabe Warmwasseranteil und Verwendung von alternativen Energieversorgungssystemen -->
|
||||
<!-- D Eingabe Warmwasseranteil und Verwendung von alternativen Energieversorgungssystemen -->
|
||||
|
||||
<BereichLabel bereich="D">Eingabe Warmwasseranteil und Verwendung von alternativen Energieversorgungssystemen</BereichLabel>
|
||||
<div class="collapseBereich">
|
||||
<Warmwasseranteil
|
||||
bind:ausweis
|
||||
/>
|
||||
</div>
|
||||
<BereichLabel bereich="D"
|
||||
>Eingabe Warmwasseranteil
|
||||
und Verwendung von alternativen
|
||||
Energieversorgungssystemen</BereichLabel
|
||||
>
|
||||
<div class="collapseBereich">
|
||||
<Warmwasseranteil bind:ausweis />
|
||||
</div>
|
||||
|
||||
<!-- E Eingabe von Gebäudeteil, Lüftung, Kühlung und Leerstand -->
|
||||
<!-- E Eingabe von Gebäudeteil, Lüftung, Kühlung und Leerstand -->
|
||||
|
||||
<BereichLabel bereich="E">Eingabe von Gebäudeteil, Lüftung, Kühlung und Leerstand</BereichLabel>
|
||||
<div class="collapseBereich">
|
||||
<LueftungundLeerstand
|
||||
bind:gebaeude_aufnahme_allgemein
|
||||
/>
|
||||
</div>
|
||||
<BereichLabel bereich="E"
|
||||
>Eingabe von Gebäudeteil,
|
||||
Lüftung, Kühlung und Leerstand</BereichLabel
|
||||
>
|
||||
<div class="collapseBereich">
|
||||
<LueftungundLeerstand bind:gebaeude_aufnahme_allgemein />
|
||||
</div>
|
||||
|
||||
<!-- F Angaben zum Sanierungszustand des Gebäudes -->
|
||||
|
||||
<BereichLabel bereich="F">Angaben zum Sanierungszustand des Gebäudes</BereichLabel>
|
||||
<div class="collapseBereich">
|
||||
<BilderZusatzsysteme
|
||||
bind:images
|
||||
bind:gebaeude
|
||||
bind:gebaeude_aufnahme_allgemein
|
||||
bind:ausweis
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
<!-- F Angaben zum Sanierungszustand des Gebäudes -->
|
||||
|
||||
<BereichLabel bereich="F"
|
||||
>Angaben zum Sanierungszustand des Gebäudes</BereichLabel
|
||||
>
|
||||
<div class="collapseBereich">
|
||||
<BilderZusatzsysteme
|
||||
bind:images
|
||||
bind:gebaeude
|
||||
bind:gebaeude_aufnahme_allgemein
|
||||
bind:ausweis
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
Reference in New Issue
Block a user