Files
online-energieausweis/src/modules/VerbrauchsausweisWohnen/VerbrauchsausweisWohnenModule.svelte
Robert Jagtiani 7f7f4b707f .
2024-12-20 04:06:05 +01:00

590 lines
18 KiB
Svelte

<script lang="ts">
import PerformanceScore from "#components/Ausweis/PerformanceScore.svelte";
import Progressbar from "#components/Ausweis/Progressbar.svelte";
import Hilfe from "#components/Ausweis/Hilfe.svelte";
import BereichLabel from "#labels/BereichLabel.svelte";
//import HelpLabel from "#labels/HelpLabel.svelte";
//import Inputlabel from "#labels/InputLabel.svelte";
//import Label from "#components/Label.svelte";
import ButtonSpaeterHilfe from "#components/Ausweis/ButtonSpaeterHilfe.svelte";
import Ausweisart from "#components/Ausweis/Ausweisart.svelte";
import GebaeudeDaten from "#components/Ausweis/GebaeudeDaten.svelte";
import Warmwasseranteil from "#components/Ausweis/Warmwasseranteil.svelte";
import Verbrauch from "#components/Ausweis/Verbrauch.svelte";
import moment from "moment";
import LueftungundLeerstand from "#components/Ausweis/LueftungundLeerstand.svelte";
import SanierungszustandHeizungsanlage from "#components/Ausweis/SanierungszustandHeizungsanlage.svelte";
import SanierungszustandFensterTueren from "#components/Ausweis/SanierungszustandFensterTueren.svelte";
import SanierungszustandWaermedammung from "#components/Ausweis/SanierungszustandWaermedammung.svelte";
import AusweisPreviewContainer from "#components/Ausweis/AusweisPreviewContainer.svelte";
//import ZipSearch from "#components/PlzSuche.svelte";
import {
RawNotificationWrapper,
RawNotification,
notifications,
} from "#components/Notifications/index.js";
import { auditHeizungGebaeudeBaujahr } from "#components/Verbrauchsausweis/audits/HeizungGebaeudeBaujahr.js";
import { auditHeizungJuengerDreiJahre } from "#components/Verbrauchsausweis/audits/HeizungJuengerDreiJahre.js";
import { auditZeitraumAktuell } from "#components/Verbrauchsausweis/audits/ZeitraumAktuell.js";
import { auditKlimaFaktoren } from "#components/Verbrauchsausweis/audits/KlimaFaktoren.js";
import { auditWohnFlaeche } from "#components/Verbrauchsausweis/audits/WohnFlaeche.js";
import { auditWarmWasser } from "#components/Verbrauchsausweis/audits/WarmWasser.js";
import { auditLeerStand } from "#components/Verbrauchsausweis/audits/LeerStand.js";
import { auditPlzNichtErkannt } from "#components/Verbrauchsausweis/audits/PlzNichtErkannt.js";
import {
AuditType,
hidden,
} from "#components/Verbrauchsausweis/audits/hidden.js";
import { auditBedarfsausweisBenoetigt } from "#components/Verbrauchsausweis/audits/BedarfsausweisBenoetigt.js";
import { auditVerbrauchAbweichung } from "#components/Verbrauchsausweis/audits/VerbrauchAbweichung.js";
import { auditEndEnergie } from "#components/Verbrauchsausweis/audits/EndEnergie.js";
import { auditWohnflaecheGroesserGesamtflaeche } from "#components/Verbrauchsausweis/audits/WohnflaecheGroesserGesamtflaeche.js";
//import { Enums } from "@ibcornelsen/database/client"
import Overlay from "#components/Overlay.svelte";
import AusweisGespeichertModule from "#modules/VerbrauchsausweisWohnen/AusweisGespeichertModule.svelte";
import {
VerbrauchsausweisWohnenClient,
BenutzerClient,
UploadedGebaeudeBild,
} from "#components/Ausweis/types.js";
import { verbrauchsausweisWohnenSpeichern } from "src/client/lib/verbrauchsausweisWohnenSpeichern.js";
import AusweisWeiter from "./AusweisWeiter.svelte";
import { Enums } from "@ibcornelsen/database/client";
// TODO: Vom Server sollte ein volles Objekt kommen, dass alle Subobjekte enthält, weil es sonst zu Problemen führen kann
// wenn gebaeude_aufnahme_allgemein oder gebaeude_stammdaten nicht existiert...
export let ausweis: VerbrauchsausweisWohnenClient;
export let user: BenutzerClient = {} as BenutzerClient;
let gebaeude_aufnahme_allgemein = ausweis.gebaeude_aufnahme_allgemein || {};
let gebaeude =
ausweis.gebaeude_aufnahme_allgemein?.gebaeude_stammdaten || {};
let images: (UploadedGebaeudeBild & { base64?: string })[] =
ausweis.gebaeude_aufnahme_allgemein?.gebaeude_stammdaten
?.gebaeude_bilder || [];
async function spaeterWeitermachen() {
const result = await verbrauchsausweisWohnenSpeichern(
ausweis,
gebaeude,
gebaeude_aufnahme_allgemein,
images,
user
);
if (result !== null) {
// Falls der Nutzer zurück navigiert, sollte er wieder auf seinen Vorgang kommen.
// Sonst müsste er alles neu eingeben...
ausweis.uid = result.uid;
gebaeude.uid = result.gebaeude_uid;
gebaeude_aufnahme_allgemein.uid = result.gebaeude_aufnahme_uid;
window.history.pushState(
{},
"",
`${location.pathname}?uid=${result.uid}`
);
speichernOverlayHidden = false;
}
}
function automatischAusfüllen() {
gebaeude_aufnahme_allgemein.baujahr_gebaeude = [1962];
gebaeude_aufnahme_allgemein.baujahr_heizung = [1952];
gebaeude_aufnahme_allgemein.saniert = true;
gebaeude_aufnahme_allgemein.einheiten = 1;
gebaeude_aufnahme_allgemein.gebaeudetyp = "Einfamilienhaus"
gebaeude_aufnahme_allgemein.keller = Enums.Heizungsstatus.NICHT_VORHANDEN
gebaeude_aufnahme_allgemein.dachgeschoss = Enums.Heizungsstatus.NICHT_VORHANDEN
gebaeude_aufnahme_allgemein.lueftung = "Fensterlüftung"
gebaeude_aufnahme_allgemein.kuehlung = "1"
ausweis.ausstellgrund = "Vermietung";
ausweis.verbrauch_1 = 15000;
ausweis.verbrauch_2 = 14000;
ausweis.verbrauch_3 = 16000;
gebaeude_aufnahme_allgemein.flaeche = 152;
gebaeude_aufnahme_allgemein.nutzflaeche = 172;
ausweis.keller_beheizt = true;
gebaeude_aufnahme_allgemein.brennstoff_1 = "Erdgas H";
ausweis.einheit_1 = "kWh";
ausweis.anteil_warmwasser_1 = 18;
ausweis.startdatum = moment("01.01.2021").toDate();
gebaeude_aufnahme_allgemein.plz = "21039";
gebaeude_aufnahme_allgemein.ort = "Hamburg";
gebaeude_aufnahme_allgemein.adresse = "Curslacker Deich 170";
gebaeude_aufnahme_allgemein.gebaeudeteil = "Gesamtgebäude";
gebaeude = gebaeude;
ausweis = ausweis;
}
async function ausweisAbschicken(e: SubmitEvent) {
if (e && e.preventDefault) e.preventDefault();
const result = await verbrauchsausweisWohnenSpeichern(
ausweis,
gebaeude,
gebaeude_aufnahme_allgemein,
images,
user
);
if (result !== null) {
// Falls der Nutzer zurück navigiert, sollte er wieder auf seinen Vorgang kommen.
// Sonst müsste er alles neu eingeben...
ausweis.uid = result.uid;
gebaeude.uid = result.gebaeude_uid;
gebaeude_aufnahme_allgemein.uid = result.gebaeude_aufnahme_uid;
window.history.pushState(
{},
"",
`${location.pathname}?uid=${result.uid}`
);
window.location.href = `/kundendaten?uid=${result.uid}`;
}
}
let waitOverlayHidden = true;
let speichernOverlayHidden = true;
$: {
if (
gebaeude_aufnahme_allgemein.saniert &&
gebaeude_aufnahme_allgemein.oberste_geschossdecke_gedaemmt ===
undefined &&
gebaeude_aufnahme_allgemein.dachgeschoss_gedaemmt === undefined
) {
gebaeude_aufnahme_allgemein.oberste_geschossdecke_gedaemmt = true;
gebaeude_aufnahme_allgemein.dachgeschoss_gedaemmt = true;
}
}
</script>
<Overlay bind:hidden={speichernOverlayHidden}>
<div class="bg-white w-full max-w-screen-sm py-8 px-8">
<AusweisGespeichertModule uid={ausweis.uid}></AusweisGespeichertModule>
</div>
</Overlay>
<Overlay bind:hidden={waitOverlayHidden}>
<p class="text-white font-semibold text-4xl">
Bitte warten sie, ihr Ausweis wird nun erstellt.
</p>
</Overlay>
<h1>Verbrauchsausweis erstellen - 45€</h1>
<div class="grid grid-cols-2 gap-x-8 px-4 items-center">
<div class="w-full rounded-lg border-gray/35 border-0 relative px-4">
<Progressbar progress={0} />
</div>
<div class="w-full rounded-lg border-gray/35 border-2 relative px-4">
<PerformanceScore
bind:ausweis
bind:gebaeude_aufnahme_allgemein
bind:gebaeude
/>
</div>
</div>
<ButtonSpaeterHilfe {automatischAusfüllen} {spaeterWeitermachen}/>
<form on:submit={ausweisAbschicken} name="ausweis" data-test="ausweis">
<div id="formular-box" class="formular-boxen ring-0">
<!-- 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 -->
<BereichLabel bereich="B"
>Eingabe&nbsp;der&nbsp;Gebäudeadresse -
Angaben&nbsp;zu&nbsp;Wohnfläche, Keller&nbsp;und&nbsp;Dachgeschoss</BereichLabel
>
<div class="collapseBereich">
<GebaeudeDaten bind:gebaeude_aufnahme_allgemein />
</div>
<!-- C Eingabe von 3 zusammenhängenden Verbrauchsjahren -->
<BereichLabel bereich="C"
>Eingabe von 3&nbsp;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 -->
<BereichLabel bereich="D"
>Eingabe&nbsp;Warmwasseranteil
und&nbsp;Verwendung&nbsp;von&nbsp;alternativen
Energieversorgungssystemen</BereichLabel
>
<div class="collapseBereich">
<Warmwasseranteil bind:ausweis />
</div>
<!-- E Eingabe von Gebäudeteil, Lüftung, Kühlung und Leerstand -->
<BereichLabel bereich="E"
>Eingabe&nbsp;von&nbsp;Gebäudeteil,
Lüftung,&nbsp;Kühlung&nbsp;und&nbsp;Leerstand</BereichLabel
>
<div class="collapseBereich">
<LueftungundLeerstand bind:gebaeude_aufnahme_allgemein />
</div>
<!-- F Angaben zur Heizungsanlage -->
<BereichLabel bereich="F"
>Angaben zur Heizunganlage</BereichLabel
>
<div class="collapseBereich">
<SanierungszustandHeizungsanlage
bind:images
bind:gebaeude
bind:gebaeude_aufnahme_allgemein
bind:ausweis
/>
</div>
<!-- G Angaben zur Fenster, Dachfenster und Türen -->
<BereichLabel bereich="G"
>Angaben zu Fenster, Dachfenster und Türen</BereichLabel
>
<div class="collapseBereich">
<SanierungszustandFensterTueren
bind:images
bind:gebaeude
bind:gebaeude_aufnahme_allgemein
bind:ausweis
/>
</div>
<!-- H Angaben zur Wärmedammung -->
<BereichLabel bereich="H"
>Angaben zur Wärmedämmung</BereichLabel
>
<div class="collapseBereich">
<SanierungszustandWaermedammung
bind:images
bind:gebaeude
bind:gebaeude_aufnahme_allgemein
bind:ausweis
/>
</div>
<!-- I Gebäudebild und Energieausweis PDF Vorschau -->
<BereichLabel bereich="I"
>Gebäudebild und Energieausweis PDF Vorschau</BereichLabel
>
<div class="collapseBereich">
<AusweisPreviewContainer
bind:images
bind:ausweis
bind:gebaeude />
</div>
</div>
<div
class="w-full px-4 mt-5 grid gap-x-4 gap-y-2
grid-cols-1
xs:grid-cols-2"
>
<div class="md:justify-self-start">
<AusweisWeiter bind:ausweis bind:images bind:user bind:gebaeude bind:gebaeude_aufnahme_allgemein></AusweisWeiter>
</div>
<div class="md:justify-self-end"><Hilfe />
</div>
</div>
</form>
<RawNotificationWrapper>
{#each Object.entries($notifications) as [uid, notification] (uid)}
<RawNotification notification={{ ...notification, uid }}>
{@html notification.subtext}
</RawNotification>
{/each}
{#if auditBedarfsausweisBenoetigt(ausweis, gebaeude_aufnahme_allgemein)}
<RawNotification
notification={{
message: "Bedarfsausweis benötigt!",
timeout: 0,
uid: "BEDARFSAUSWEIS",
dismissable: false,
type: "info",
}}
>
Sie benötigen einen Bedarfsausweis. <a href="/bedarfsausweis"
>Bitte führen Sie hier Ihre Eingabe für den Bedarfsausweis fort</a
>.
</RawNotification>
{/if}
{#await auditPlzNichtErkannt(gebaeude_aufnahme_allgemein) then result}
{#if result}
<RawNotification
notification={{
message: "Plausibilitätsprüfung",
timeout: 0,
uid: "PLZ_NICHT_ERKANNT",
dismissable: false,
type: "warning",
}}
>
Die Postleitzahl konnte nicht zugeordnet werden. Bitte prüfen
Sie die Eingabe. Sollte die Postleitzahl korrekt eingegeben
sein, werden wir den Ort händisch zuordnen.
</RawNotification>
{/if}
{/await}
{#if auditHeizungGebaeudeBaujahr(gebaeude_aufnahme_allgemein)}
<RawNotification
notification={{
message: "Plausibilitätsprüfung",
timeout: 0,
uid: "HEIZUNG_GEBAEUDE_BAUJAHR",
dismissable: true,
onUserDismiss: () => {
hidden.add(AuditType.HEIZUNG_GEBAEUDE_BAUJAHR);
gebaeude_aufnahme_allgemein = gebaeude_aufnahme_allgemein;
},
type: "warning",
}}
>
Sie haben angegeben, dass ihre Heizung vor ihrem Gebäude konstruiert
wurde. Sind sie sich sicher, dass das stimmt?
</RawNotification>
{/if}
{#if auditHeizungJuengerDreiJahre(gebaeude_aufnahme_allgemein)}
<RawNotification
notification={{
message: "Plausibilitätsprüfung",
timeout: 0,
uid: "HEIZUNG_JUENGER_DREI_JAHRE",
dismissable: true,
onUserDismiss: () => {
hidden.add(AuditType.HEIZUNG_JUENGER_DREI_JAHRE);
gebaeude = gebaeude;
},
type: "warning",
}}
>
Ihre Heizungsanlage ist jünger als 3 Jahre. Für den
Verbrauchsausweis müssen Sie mindestens 3 Verbrauchsjahre eingeben
die den aktuellen Stand des Gebäudes abbilden. Ein Verbrauchsausweis
ist daher nicht möglich. Bitte klicken Sie
<a href="/bedarfsausweis">hier</a> um zum Eingabeformular für den Bedarfsausweis
zu gelangen.
</RawNotification>
{/if}
{#if auditZeitraumAktuell(ausweis, gebaeude)}
<RawNotification
notification={{
message: "Plausibilitätsprüfung",
timeout: 0,
uid: "ZEITRAUM_AKTUELL",
dismissable: true,
onUserDismiss: () => {
hidden.add(AuditType.ZEITRAUM_AKTUELL);
gebaeude = gebaeude;
},
type: "warning",
}}
>
Die Verbrauchszeiträume sind nicht aktuell genug. Das Ende des
letzten Verbrauchszeitraumes darf nicht mehr als 18 Monate
zurückliegen. Ein Verbrauchsausweis ist mit diesen Zeiträumen daher
nicht möglich. Bitte klicken Sie <a href="/bedarfsausweis">hier</a> um
zum Eingabeformular für den Bedarfsausweis zu gelangen.
</RawNotification>
{/if}
{#await auditKlimaFaktoren(ausweis, gebaeude) then result}
{#if result}
<RawNotification
notification={{
message: "Plausibilitätsprüfung",
timeout: 0,
uid: "KLIMA_FAKTOREN",
dismissable: true,
onUserDismiss: () => {
hidden.add(AuditType.KLIMA_FAKTOREN);
gebaeude = gebaeude;
},
type: "warning",
}}
>
Die Verbrauchszeiträume sind zu aktuell und es liegen noch keine
Klimafaktoren dazu vor. Bitte verschieben Sie die
Verbrauchszeiträume 1 Jahr nach hinten. Wenn das nicht möglich
ist, klicken Sie
<a href="/bedarfsausweis">hier</a> um zum Eingabeformular für den
Bedarfsausweis zu gelangen.
</RawNotification>
{/if}
{/await}
{#if auditWohnFlaeche(gebaeude_aufnahme_allgemein)}
<RawNotification
notification={{
message: "Plausibilitätsprüfung",
timeout: 0,
uid: "WOHN_FLAECHE",
dismissable: true,
onUserDismiss: () => {
hidden.add(AuditType.WOHN_FLAECHE);
gebaeude = gebaeude;
},
type: "warning",
}}
>
Die Wohnfläche ist viel zu klein. Bitte überprüfen Sie Ihre Eingabe
nochmal und stellen sicher, daß sich Ihre Angaben auf das gesamte
Gebäude beziehen.
</RawNotification>
{/if}
{#if auditWarmWasser(ausweis)}
<RawNotification
notification={{
message: "Plausibilitätsprüfung",
timeout: 0,
uid: "WARM_WASSER",
dismissable: true,
onUserDismiss: () => {
hidden.add(AuditType.WARM_WASSER);
gebaeude = gebaeude;
},
type: "warning",
}}
>
Bitte überprüfen Sie nochmal die Höhe des Warmwasseranteils. Dieser
scheint nicht ganz im Rahmen zu liegen.
</RawNotification>
{/if}
{#if auditLeerStand(gebaeude_aufnahme_allgemein)}
<RawNotification
notification={{
message: "Plausibilitätsprüfung",
timeout: 0,
uid: "LEER_STAND",
dismissable: true,
onUserDismiss: () => {
hidden.add(AuditType.LEER_STAND);
gebaeude = gebaeude;
},
type: "warning",
}}
>
Bei Leerstand größer als 30% darf kein Verbrauchsausweis ausgestellt
werden. Bitte klicken Sie <a href="/bedarfsausweis">hier</a> um zum Eingabeformular
für den Bedarfsausweis zu gelangen.
</RawNotification>
{/if}
{#if auditVerbrauchAbweichung(ausweis, gebaeude_aufnahme_allgemein).length > 0}
<RawNotification
notification={{
message: "Plausibilitätsprüfung",
timeout: 0,
uid: "VERBRAUCH_ABWEICHUNG",
dismissable: true,
onUserDismiss: () => {
hidden.add(AuditType.VERBRAUCH_ABWEICHUNG);
gebaeude = gebaeude;
},
type: "warning",
}}
>
Die Abweichung der Verbräuche zwischen Zeitraum {auditVerbrauchAbweichung(
ausweis,
gebaeude_aufnahme_allgemein,
)[0]} und {auditVerbrauchAbweichung(ausweis, gebaeude_aufnahme_allgemein)[1]} beträgt mehr
als 30% und sie haben keinen Leerstand angegeben. Sind sie sich sicher,
dass das stimmt?
</RawNotification>
{/if}
{#await auditEndEnergie(ausweis, gebaeude, gebaeude_aufnahme_allgemein) then result}
{#if result}
<RawNotification
notification={{
message: "Plausibilitätsprüfung",
timeout: 0,
uid: "END_ENERGIE",
dismissable: true,
onUserDismiss: () => {
hidden.add(AuditType.END_ENERGIE);
gebaeude = gebaeude;
},
type: "warning",
}}
>
Die Endenergie liegt außerhalb des normalen Rahmens. Bitte
nochmal überprüfen. Bei Passivhäusern oder ganz alten
unsanierten Gebäuden ist so eine Abweichung durchaus möglich.
</RawNotification>
{/if}
{/await}
{#if auditWohnflaecheGroesserGesamtflaeche(gebaeude_aufnahme_allgemein)}
<RawNotification
notification={{
message: "Plausibilitätsprüfung",
timeout: 0,
uid: "WOHNFLAECHE_GROESSER_GESAMTFLAECHE",
dismissable: true,
onUserDismiss: () => {
hidden.add(AuditType.WOHNFLAECHE_GROESSER_GESAMTFLAECHE);
gebaeude = gebaeude;
},
type: "warning",
}}
>
Die Wohnfläche darf nicht größer als die Nutzfläche sein.
</RawNotification>
{/if}
</RawNotificationWrapper>
<style lang="scss">
</style>