online-energieausweis/src/modules/angebot-anfragen/BedarfsausweisGewerbeModule.svelte

<script lang="ts">
	import GebaeudeDaten from "#components/Ausweis/GebaeudeDaten.svelte";
	import {
		ObjektClient,
		AufnahmeClient,
		BenutzerClient,
		UnterlageClient,
		GEGNachweisWohnenClient,
		BildClient,
	} from "#components/Ausweis/types.js";
	import Bereich from "#components/labels/Bereich.svelte";
	import { Enums } from "#lib/client/prisma.js";
	import Progressbar from "#components/Ausweis/Progressbar.svelte";
	import FileGrid from "#components/FileGrid.svelte";
	import ButtonWeiterHilfe from "#components/Ausweis/ButtonWeiterHilfe.svelte";
	import GEGAusweisart from "#components/GEGNachweis/GEGAusweisart.svelte";
	import SanierungszustandHeizungsanlage from "#components/Ausweis/SanierungszustandHeizungsanlage.svelte";
	import SanierungszustandFensterTueren from "#components/Ausweis/SanierungszustandFensterTueren.svelte";
	import SanierungszustandWaermedammung from "#components/Ausweis/SanierungszustandWaermedammung.svelte";
	import AnlagenTechnik from "#components/Ausweis/AnlagenTechnik.svelte";

	export let nachweis: GEGNachweisWohnenClient;
	export let objekt: ObjektClient;
	export let aufnahme: AufnahmeClient;
	export let user: BenutzerClient = {} as BenutzerClient;
	export let bilder: BildClient[] = [];
	export let plaene: UnterlageClient[] = [];
	export let unterlagen: UnterlageClient[] = [];

	if (Object.keys(nachweis).length === 0) {
		const localStorageAusweis = localStorage.getItem(
			"geg-nachweis-wohnen.ausweis"
		);
		if (localStorageAusweis) {
			nachweis = JSON.parse(localStorageAusweis);
		}
	}

	if (Object.keys(aufnahme).length === 0) {
		const localStorageAufnahme = localStorage.getItem(
			"geg-nachweis-wohnen.aufnahme"
		);
		if (localStorageAufnahme) {
			aufnahme = JSON.parse(localStorageAufnahme);
		}
	}

	if (Object.keys(objekt).length === 0) {
		const localStorageObjekt = localStorage.getItem(
			"geg-nachweis-wohnen.objekt"
		);
		if (localStorageObjekt) {
			objekt = JSON.parse(localStorageObjekt);
		}
	}

	if (Object.keys(bilder).length === 0) {
		const localStorageBilder = localStorage.getItem(
			"geg-nachweis-wohnen.bilder"
		);
		if (localStorageBilder) {
			bilder = JSON.parse(localStorageBilder);
		}
	}

	if (Object.keys(unterlagen).length === 0) {
		const localStorageUnterlagen = localStorage.getItem(
			"geg-nachweis-wohnen.unterlagen"
		);
		if (localStorageUnterlagen) {
			unterlagen = JSON.parse(localStorageUnterlagen);
		}
	}

	$: {
		localStorage.setItem(
			"geg-nachweis-wohnen.ausweis",
			JSON.stringify(nachweis)
		);
		localStorage.setItem(
			"geg-nachweis-wohnen.aufnahme",
			JSON.stringify(aufnahme)
		);
		localStorage.setItem(
			"geg-nachweis-wohnen.objekt",
			JSON.stringify(objekt)
		);
		localStorage.setItem(
			"geg-nachweis-wohnen.bilder",
			JSON.stringify(bilder)
		);
		localStorage.setItem(
			"geg-nachweis-wohnen.unterlagen",
			JSON.stringify(unterlagen)
		);
	}

	const ausweisart = Enums.Ausweisart.BedarfsausweisGewerbe;
	const anliegen = "Angebot anfragen";

	let form: HTMLFormElement;
	let skala: HTMLDivElement;
</script>

<div
	id="skala"
	bind:this={skala}
	class="bg-white grid grid-cols-1 p-4 lg:grid-cols-2 lg:gap-x-6 no-scroll"
>
	<Progressbar
		active={0}
		{ausweisart}
		{anliegen}
		steps={["Gebäudedaten", "Kundendaten", "Anfragebestätigung"]}
	/>
</div>

<form id="formInput-1" name="ausweis" data-test="ausweis" bind:this={form}>
	<div id="formular-box" class="formular-boxen ring-0">
		<!-- A Prüfung der Ausweisart -->

		<Bereich bereich="A" title="Prüfung der Ausweisart">
			<GEGAusweisart
				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="Angaben zur Heizungsanlage"
			><SanierungszustandHeizungsanlage bind:ausweis={nachweis} bind:images={bilder} bind:aufnahme bind:objekt {ausweisart} /></Bereich
		>

		<Bereich
			bereich="D"
			title="Angaben zu Fenster, Dachfenster und Türen"
			><SanierungszustandFensterTueren bind:ausweis={nachweis} bind:images={bilder} bind:aufnahme bind:objekt {ausweisart} /></Bereich
		>

		<Bereich
			bereich="E"
			title="Angaben zur Wärmedämmung"
			><SanierungszustandWaermedammung bind:ausweis={nachweis} bind:images={bilder} bind:aufnahme bind:objekt {ausweisart} /></Bereich
		>

		<Bereich
			bereich="F"
			title="Angaben zur Wärmedämmung"
			><AnlagenTechnik bind:ausweis={nachweis} bind:images={bilder} bind:aufnahme bind:objekt {ausweisart} /></Bereich
		>

		<Bereich bereich="G" 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>

	<ButtonWeiterHilfe
		bind:ausweis={nachweis}
		bind:bilder
		bind:unterlagen
		bind:user
		bind:objekt
		bind:aufnahme
		ausweisart={Enums.Ausweisart.BedarfsausweisGewerbe}
		{form}
		{skala}
	></ButtonWeiterHilfe>
</form>