363 lines
9.2 KiB
Svelte
363 lines
9.2 KiB
Svelte
<script lang="ts">
|
|
import Ausweisart from "#components/Ausweis/Ausweisart.svelte";
|
|
import GebaeudeDaten from "#components/Ausweis/GebaeudeDaten.svelte";
|
|
import {
|
|
VerbrauchsausweisWohnenClient,
|
|
ObjektClient,
|
|
AufnahmeClient,
|
|
BenutzerClient,
|
|
UploadedGebaeudeBild,
|
|
UnterlageClient,
|
|
GEGNachweisWohnenClient,
|
|
} from "#components/Ausweis/types.js";
|
|
import Bereich from "#components/labels/Bereich.svelte";
|
|
import { Enums } from "@ibcornelsen/database/client";
|
|
import InputLabel from "#components/labels/InputLabel.svelte";
|
|
import HelpLabel from "#components/labels/HelpLabel.svelte";
|
|
import Progressbar from "#components/Ausweis/Progressbar.svelte";
|
|
import FileGrid from "#components/FileGrid.svelte";
|
|
import Hilfe from "#components/Ausweis/Hilfe.svelte";
|
|
import Overlay from "#components/Overlay.svelte";
|
|
import EmbeddedAuthFlowModule from "#modules/EmbeddedAuthFlowModule.svelte";
|
|
import { validateAccessTokenClient } from "#client/lib/validateAccessToken.js";
|
|
import { api } from "astro-typesafe-api/client";
|
|
import { API_ACCESS_TOKEN_COOKIE_NAME } from "#lib/constants.js";
|
|
import { exclude } from "#lib/exclude.js";
|
|
import Cookies from "js-cookie";
|
|
|
|
export async function nachweisSpeichern(
|
|
nachweis: GEGNachweisWohnenClient,
|
|
objekt: ObjektClient,
|
|
aufnahme: AufnahmeClient,
|
|
unterlagen: (UnterlageClient & { data?: string })[]
|
|
) {
|
|
if (objekt.uid) {
|
|
await api.objekt._uid.PATCH.fetch({
|
|
...exclude(objekt, ["uid"])
|
|
}, {
|
|
params: {
|
|
uid: objekt.uid
|
|
},
|
|
headers: {
|
|
"Authorization": `Bearer ${Cookies.get(API_ACCESS_TOKEN_COOKIE_NAME)}`
|
|
}
|
|
})
|
|
} else {
|
|
const { uid } = await api.objekt.PUT.fetch({
|
|
...exclude(objekt, ["uid"])
|
|
}, {
|
|
headers: {
|
|
"Authorization": `Bearer ${Cookies.get(API_ACCESS_TOKEN_COOKIE_NAME)}`
|
|
}
|
|
})
|
|
|
|
objekt.uid = uid;
|
|
}
|
|
|
|
|
|
|
|
if (aufnahme.uid) {
|
|
await api.aufnahme._uid.PATCH.fetch({
|
|
...exclude({...aufnahme, baujahr_klima: []}, ["uid"])
|
|
}, {
|
|
params: {
|
|
uid: aufnahme.uid
|
|
},
|
|
headers: {
|
|
"Authorization": `Bearer ${Cookies.get(API_ACCESS_TOKEN_COOKIE_NAME)}`
|
|
}
|
|
})
|
|
} else {
|
|
const { uid } = await api.aufnahme.PUT.fetch({
|
|
aufnahme: {...aufnahme, baujahr_klima: []},
|
|
uid_objekt: objekt.uid
|
|
}, {
|
|
headers: {
|
|
"Authorization": `Bearer ${Cookies.get(API_ACCESS_TOKEN_COOKIE_NAME)}`
|
|
}
|
|
})
|
|
|
|
aufnahme.uid = uid
|
|
}
|
|
|
|
if (nachweis.uid) {
|
|
await api["geg-nachweis-wohnen"]._uid.PATCH.fetch({
|
|
|
|
...exclude(nachweis, ["uid"])
|
|
}, {
|
|
params: {
|
|
uid: nachweis.uid
|
|
},
|
|
headers: {
|
|
"Authorization": `Bearer ${Cookies.get(API_ACCESS_TOKEN_COOKIE_NAME)}`
|
|
}
|
|
})
|
|
} else {
|
|
const { uid } = await api["geg-nachweis-wohnen"].PUT.fetch({
|
|
nachweis: nachweis,
|
|
uid_aufnahme: aufnahme.uid
|
|
}, {
|
|
headers: {
|
|
"Authorization": `Bearer ${Cookies.get(API_ACCESS_TOKEN_COOKIE_NAME)}`
|
|
}
|
|
})
|
|
|
|
nachweis.uid = uid;
|
|
}
|
|
|
|
for (const unterlage of unterlagen) {
|
|
if (unterlage.uid || !unterlage.data) {
|
|
continue;
|
|
}
|
|
|
|
const response = await api.objekt._uid.unterlagen.PUT.fetch({
|
|
data: unterlage.data,
|
|
kategorie: unterlage.kategorie,
|
|
mime: unterlage.mime,
|
|
name: unterlage.name
|
|
}, {
|
|
params: {
|
|
uid: objekt.uid
|
|
},
|
|
headers: {
|
|
"Authorization": `Bearer ${Cookies.get(API_ACCESS_TOKEN_COOKIE_NAME)}`
|
|
}
|
|
})
|
|
|
|
unterlage.uid = response.uid
|
|
}
|
|
|
|
return {
|
|
uid_ausweis: nachweis.uid,
|
|
uid_aufnahme: aufnahme.uid,
|
|
uid_objekt: objekt.uid
|
|
}
|
|
}
|
|
|
|
|
|
async function nachweisAbschicken() {
|
|
if (!(await validateAccessTokenClient())) {
|
|
loginOverlayHidden = false;
|
|
return;
|
|
}
|
|
|
|
const result = await nachweisSpeichern(nachweis, objekt, aufnahme, unterlagen)
|
|
|
|
if (result !== null) {
|
|
window.history.pushState(
|
|
{},
|
|
"",
|
|
`${location.pathname}?uid=${result.uid_ausweis}`
|
|
);
|
|
window.location.href = `/kundendaten?uid=${result.uid_ausweis}`;
|
|
}
|
|
|
|
loginOverlayHidden = true;
|
|
}
|
|
|
|
async function spaeterWeitermachen() {
|
|
if (!(await validateAccessTokenClient())) {
|
|
loginOverlayHidden = false;
|
|
return;
|
|
}
|
|
|
|
loginOverlayHidden = true;
|
|
}
|
|
|
|
let loginOverlayHidden = true;
|
|
|
|
export let nachweis: GEGNachweisWohnenClient;
|
|
export let objekt: ObjektClient;
|
|
export let aufnahme: AufnahmeClient;
|
|
export let user: BenutzerClient = {} as BenutzerClient;
|
|
export let bilder: UploadedGebaeudeBild[] = [];
|
|
export let plaene: (UnterlageClient & { data: string })[] =
|
|
[];
|
|
export let unterlagen: (UnterlageClient & {
|
|
data: string;
|
|
})[] = [];
|
|
|
|
|
|
if (Object.keys(nachweis).length === 0) {
|
|
const localStorageAusweis = localStorage.getItem("ausweis");
|
|
if (localStorageAusweis) {
|
|
nachweis = JSON.parse(localStorageAusweis)
|
|
}
|
|
}
|
|
|
|
if (Object.keys(aufnahme).length === 0) {
|
|
const localStorageAufnahme = localStorage.getItem("aufnahme");
|
|
if (localStorageAufnahme) {
|
|
aufnahme = JSON.parse(localStorageAufnahme)
|
|
}
|
|
}
|
|
|
|
if (Object.keys(objekt).length === 0) {
|
|
const localStorageObjekt = localStorage.getItem("objekt");
|
|
if (localStorageObjekt) {
|
|
objekt = JSON.parse(localStorageObjekt)
|
|
}
|
|
}
|
|
|
|
|
|
$: {
|
|
if (nachweis.uid && objekt.uid && aufnahme.uid) {
|
|
localStorage.setItem(nachweis.uid, JSON.stringify(nachweis))
|
|
localStorage.setItem(objekt.uid, JSON.stringify(objekt))
|
|
localStorage.setItem(aufnahme.uid, JSON.stringify(aufnahme))
|
|
} else {
|
|
localStorage.setItem("ausweis", JSON.stringify(nachweis))
|
|
localStorage.setItem("aufnahme", JSON.stringify(aufnahme))
|
|
localStorage.setItem("objekt", JSON.stringify(objekt))
|
|
}
|
|
}
|
|
|
|
const ausweisart = Enums.Ausweisart.GEGNachweisVerbrauchsausweisWohnen;
|
|
</script>
|
|
|
|
<div
|
|
id="skala"
|
|
class="bg-white grid grid-cols-1 p-4 lg:grid-cols-2 lg:gap-x-6 no-scroll"
|
|
>
|
|
<div
|
|
id="progress-box"
|
|
class="w-full box relative px-4 py-3 text-center order-2 self-stretch"
|
|
>
|
|
<h1 class="text-secondary text-3xl m-0">GEG Nachweis Anfragen</h1>
|
|
<h2 class="text-primary text-xl">Verbrauchsausweis Wohnen</h2>
|
|
<Progressbar
|
|
active={0}
|
|
steps={["Gebäudedaten", "Kundendaten", "Bestätigung"]}
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
<form
|
|
id="formInput-1"
|
|
on:submit={nachweisAbschicken}
|
|
name="ausweis"
|
|
data-test="ausweis"
|
|
>
|
|
<div id="formular-box" class="formular-boxen ring-0">
|
|
<!-- A Prüfung der Ausweisart -->
|
|
|
|
<Bereich bereich="A" title="Prüfung der Ausweisart">
|
|
<Ausweisart bind:objekt bind:aufnahme bind:ausweis={nachweis} {ausweisart} />
|
|
</Bereich>
|
|
|
|
<!-- B Eingabe der Gebäudeadresse - Angaben zu Wohnfläche, Keller und Dachgeschoss -->
|
|
|
|
<Bereich
|
|
bereich="B"
|
|
title="Eingabe der Gebäudeadresse - Angaben zu Wohnfläche, Keller und Dachgeschoss"
|
|
><GebaeudeDaten bind:aufnahme bind:objekt {ausweisart} /></Bereich
|
|
>
|
|
|
|
<Bereich bereich="C" title="Beschreibung des Bauvorhabens">
|
|
<div class="bereich-box">
|
|
<div class="input-standard order-3 md:order-5 xl:order-3">
|
|
<InputLabel
|
|
title="Angaben zur Heizung, Lüftung, Energieerezugung, Qualität und Aufbau der Gebäudehülle usw."
|
|
></InputLabel>
|
|
|
|
<textarea class="rounded-e-none" rows="10" bind:value={nachweis.beschreibung}></textarea>
|
|
|
|
<div class="help-label">
|
|
<HelpLabel>
|
|
Geben Sie kurz an: Heizung, Lüftung, regenerative
|
|
Energie (Solar, PV) und die Gebäudehülle (Qualität,
|
|
Aufbau).
|
|
</HelpLabel>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</Bereich>
|
|
|
|
<Bereich bereich="D" title="Gebäudepläne & Unterlagen">
|
|
<div
|
|
class="bereich-box grid grid-cols-1 lg:grid-cols-2 gap-x-6 mt-6"
|
|
>
|
|
<div class="md:box md:card mb-0">
|
|
<div class="font-bold mb-2">Pläne</div>
|
|
|
|
<div>
|
|
Hier können sie Grundrisspläne, Ansichtspläne und
|
|
Schnitte hochladen. Die Dateien können entweder im PDF
|
|
Format oder als Bild hochgeladen werden.
|
|
</div>
|
|
</div>
|
|
|
|
<div class="md:box md:card mb-0 mt-6 md:mt-0">
|
|
<div>
|
|
<strong
|
|
>Bitte laden Sie hier mind. 1 Dokument hoch:</strong
|
|
>
|
|
</div>
|
|
<FileGrid
|
|
max={Infinity}
|
|
min={1}
|
|
name={"plaene"}
|
|
bind:files={plaene}
|
|
bind:ausweis={nachweis}
|
|
bind:objekt
|
|
></FileGrid>
|
|
</div>
|
|
</div>
|
|
<div
|
|
class="bereich-box grid grid-cols-1 lg:grid-cols-2 gap-x-6 mt-6"
|
|
>
|
|
<div class="md:box md:card mb-0">
|
|
<div class="font-bold mb-2">Unterlagen</div>
|
|
|
|
<div>
|
|
Hier können sie weitere Unterlagen wie z.B.
|
|
Baugenehmigungen, U-Wert Berechnungen, Anlagentechnik
|
|
oder ihren alten Energieausweis hochladen. Die Dateien
|
|
können entweder im PDF Format oder als Bild hochgeladen
|
|
werden.
|
|
</div>
|
|
</div>
|
|
|
|
<div class="md:box md:card mb-0 mt-6 md:mt-0">
|
|
<FileGrid
|
|
max={Infinity}
|
|
min={0}
|
|
name={"unterlagen"}
|
|
bind:files={unterlagen}
|
|
bind:ausweis={nachweis}
|
|
bind:objekt
|
|
></FileGrid>
|
|
</div>
|
|
</div>
|
|
</Bereich>
|
|
</div>
|
|
|
|
<div
|
|
class="grid grid-cols-[1fr_min-content_min-content_min-content] grid-rows-[min_content_1fr] gap-x-2 self-start justify-self-end mt-8"
|
|
>
|
|
<div></div>
|
|
|
|
<Hilfe />
|
|
|
|
<button class="button" type="button" on:click={spaeterWeitermachen}
|
|
>Später Weitermachen
|
|
</button>
|
|
|
|
<div>
|
|
<Overlay bind:hidden={loginOverlayHidden}>
|
|
<div class="bg-white w-full max-w-screen-sm py-8">
|
|
<EmbeddedAuthFlowModule onLogin={nachweisAbschicken}
|
|
></EmbeddedAuthFlowModule>
|
|
</div>
|
|
</Overlay>
|
|
|
|
<button
|
|
on:click={nachweisAbschicken}
|
|
type="button"
|
|
class="button"
|
|
data-cy="weiter">Weiter</button
|
|
>
|
|
</div>
|
|
</div>
|
|
</form>
|