Bildupload - UI - Globaler Ausweis

src/components/Verbrauchsausweis/VerbrauchsausweisContent.svelte

@@ -10,33 +10,14 @@
 	import FensterImage from "~/components/Ausweis/FensterImage.svelte";
 	import DaemmungImage from "~/components/Ausweis/DaemmungImage.svelte";
 	import AusweisPreviewContainer from "~/components/Ausweis/AusweisPreviewContainer.svelte";
-	import { calculateEnergyPerformanceScore } from "./energyPerformanceCalculation";
 	import ZipSearch from "../ZIPSearch.svelte";
 	import { Verbrauchsausweis } from "src/lib/Ausweis/Verbrauchsausweis";
+	import moment from "moment";
 
-	const ausweis = new Verbrauchsausweis();
+	let ausweis = new Verbrauchsausweis();
 
-	let conversionFactor: number = 0;
-	let calorificValueFactor: number = 0;
-
-	let energyConsumption = [0, 0, 0];
-	let additionalEnergyConsumption = [0, 0, 0];
-	let climateFactors = [0, 0, 0];
-
-	let area = 0;
-	let energyPerformance = 0;
-
-	$: {
-		energyPerformance = calculateEnergyPerformanceScore(
-			energyConsumption,
-			additionalEnergyConsumption,
-			ausweis.anteil_warmwasser_1,
-			climateFactors,
-			area * (ausweis.keller_beheizt ? 1.35 : 1.2),
-			conversionFactor,
-			calorificValueFactor
-		);
-	}
+	console.log(ausweis);
+	
 
 	let needsRequirementCertificate: boolean = false;
 
@@ -56,11 +37,19 @@
 		ausweis.objekt_saniert = true;
 		ausweis.anzahl_einheiten = 1;
 		ausweis.ausstellgrund = "Vermietung";
-		energyConsumption = [15000, 14000, 16000];
-		area = 152;
+		ausweis.energieverbrauch_1_heizquelle_1 = 15000;
+		ausweis.energieverbrauch_2_heizquelle_1 = 14000;
+		ausweis.energieverbrauch_3_heizquelle_1 = 16000;
+		ausweis.wohnflaeche = 152;
 		ausweis.keller_beheizt = true;
+		ausweis.energietraeger_1 = "Erdgas H"
+		ausweis.energietraeger_einheit_heizquelle_1 = "kWh"
 		ausweis.warmwasser_enthalten = true;
 		ausweis.anteil_warmwasser_1 = 18;
+		ausweis.energieverbrauch_zeitraum = moment("12.01.2019");
+		ausweis.objekt_plz = "21039";
+		ausweis.objekt_ort = "Hamburg";
+		ausweis.objekt_strasse = "Curslacker Deich 170";
 	}
 </script>
 
@@ -71,8 +60,7 @@
 	</div>
 
 	<PerformanceScore
-		verbrauch={energyPerformance}
-		primär={energyPerformance * 1.1}
+		bind:ausweis={ausweis}
 	/>
 </div>
 
@@ -84,7 +72,7 @@
 			<a class="button" href="/speichern">Später Weitermachen</a>
 			<div class="flex gap-4">
 				<Hilfe />
-				<button on:click={automatischAusfüllen}
+				<button on:click={automatischAusfüllen} type="button" class="button"
 					>Automatisch Ausfüllen</button
 				>
 			</div>
@@ -151,6 +139,7 @@
 						required
 						data-msg-minlength="min. 5 Zeichen"
 						data-msg-maxlength="max. 40 Zeichen"
+						bind:value={ausweis.objekt_strasse}
 					/>
 				</div>
 			</div>
@@ -196,7 +185,7 @@
 						autocomplete="off"
 						data-rule-minlength="2"
 						data-msg-minlength="min. 2 Zeichen"
-						bind:value={area}
+						bind:value={ausweis.wohnflaeche}
 					/>
 				</div>
 			</div>
@@ -240,12 +229,7 @@
 
 		<div class="GRB">
 			<Verbrauch
-				bind:additionalHeating={ausweis.zusaetzliche_heizquelle}
-				bind:energyConsumption
-				bind:additionalEnergyConsumption
-				bind:climateFactors
-				bind:conversionFactor
-				bind:calorificValueFactor
+				bind:ausweis={ausweis}
 			/>
 		</div>
 
@@ -283,7 +267,7 @@
 				<input
 					name="IGwarmwasser"
 					maxlength="2"
-					type="text"
+					type="number"
 					bind:value={ausweis.anteil_warmwasser_1}
 					disabled={!ausweis.warmwasser_enthalten}
 					autocomplete="off"
@@ -299,9 +283,10 @@
 				<input
 					name="IGwarmwasser2"
 					maxlength="3"
-					type="text"
+					type="number"
 					autocomplete="off"
-					disabled={!ausweis.zusaetzliche_heizquelle}
+					bind:value={ausweis.anteil_warmwasser_2}
+					disabled={!ausweis.zusaetzliche_heizquelle || !ausweis.warmwasser_enthalten}
 				/>
 			</div>
 
@@ -319,6 +304,7 @@
 						><input
 							type="checkbox"
 							name="IGversorgungssysteme1"
+							bind:checked={ausweis.energiequelle_2_nutzung[0]}
 							value="Heizung"
 						/>Heizung</label
 					>
@@ -326,6 +312,7 @@
 						><input
 							type="checkbox"
 							name="IGversorgungssysteme2"
+							bind:checked={ausweis.energiequelle_2_nutzung[1]}
 							value="Warmwasser"
 						/>Warmwasser</label
 					>
@@ -333,6 +320,7 @@
 						><input
 							type="checkbox"
 							name="IGversorgungssysteme3"
+							bind:checked={ausweis.energiequelle_2_nutzung[2]}
 							value="Lüftung"
 						/>Lüftung</label
 					>
@@ -340,6 +328,7 @@
 						><input
 							type="checkbox"
 							name="IGversorgungssysteme4"
+							bind:checked={ausweis.energiequelle_2_nutzung[3]}
 							value="Kühlung"
 						/>Kühlung</label
 					>
@@ -509,6 +498,7 @@
 						><input
 							type="checkbox"
 							name="IGheizungsanlage1"
+							bind:checked={ausweis.versorgungssysteme[0]}
 							value="ZH"
 						/>Zentral/Etage</label
 					>
@@ -518,6 +508,7 @@
 						><input
 							type="checkbox"
 							name="IGheizungsanlage2"
+							bind:checked={ausweis.versorgungssysteme[1]}
 							value="EO"
 						/>Einzelöfen</label
 					>
@@ -527,6 +518,7 @@
 						><input
 							type="checkbox"
 							name="IGheizungsanlage3"
+							bind:checked={ausweis.versorgungssysteme[2]}
 							value="DH"
 						/>Durchlauferhitzer</label
 					>
@@ -536,6 +528,7 @@
 						><input
 							type="checkbox"
 							name="IGheizungsanlage4"
+							bind:checked={ausweis.versorgungssysteme[3]}
 							value="SK"
 						/>Standardkessel</label
 					>
@@ -545,6 +538,7 @@
 						><input
 							type="checkbox"
 							name="IGheizungsanlage5"
+							bind:checked={ausweis.versorgungssysteme[4]}
 							value="SSWW"
 						/>Solarsystem für Warmwasser</label
 					>
@@ -554,6 +548,7 @@
 						><input
 							type="checkbox"
 							name="IGheizungsanlage6"
+							bind:checked={ausweis.versorgungssysteme[5]}
 							value="WP"
 						/>Wärmepumpe</label
 					>
@@ -563,6 +558,7 @@
 						><input
 							type="checkbox"
 							name="IGheizungsanlage7"
+							bind:checked={ausweis.versorgungssysteme[6]}
 							value="NK"
 						/>Niedertemperaturkessel</label
 					>
@@ -572,6 +568,7 @@
 						><input
 							type="checkbox"
 							name="IGheizungsanlage8"
+							bind:checked={ausweis.versorgungssysteme[7]}
 							value="BWK"
 						/>Brennwertkessel</label
 					>
@@ -581,6 +578,7 @@
 						><input
 							type="checkbox"
 							name="IGheizungsanlage9"
+							bind:checked={ausweis.versorgungssysteme[8]}
 							value="WRGD"
 						/>Warmwasserrohre gedämmt</label
 					>
@@ -590,6 +588,7 @@
 						><input
 							type="checkbox"
 							name="IGheizungsanlage10"
+							bind:checked={ausweis.versorgungssysteme[9]}
 							value="HRGD"
 						/>Heizungsrohre gedämmt</label
 					>
@@ -599,6 +598,7 @@
 						><input
 							type="checkbox"
 							name="IGheizungsanlage11"
+							bind:checked={ausweis.versorgungssysteme[10]}
 							value="ZK"
 						/>Zirkulation</label
 					>
@@ -608,6 +608,7 @@
 						><input
 							type="checkbox"
 							name="IGheizungsanlage12"
+							bind:checked={ausweis.versorgungssysteme[11]}
 							value="RTR"
 						/>Raumtemperaturregler</label
 					>
@@ -637,6 +638,7 @@
 						><input
 							type="checkbox"
 							name="IGfensterdach1"
+							bind:checked={ausweis.fenster_dach[0]}
 							value="EG"
 						/>Einfachglas</label
 					>
@@ -646,6 +648,7 @@
 						><input
 							type="checkbox"
 							name="IGfensterdach2"
+							bind:checked={ausweis.fenster_dach[1]}
 							value="DF"
 						/>Doppelverglasung</label
 					>
@@ -655,6 +658,7 @@
 						><input
 							type="checkbox"
 							name="IGfensterdach3"
+							bind:checked={ausweis.fenster_dach[2]}
 							value="IVG"
 						/>Isolierverglasung</label
 					>
@@ -664,6 +668,7 @@
 						><input
 							type="checkbox"
 							name="IGfensterdach4"
+							bind:checked={ausweis.fenster_dach[3]}
 							value="PHF"
 						/>Dreifachverglasung</label
 					>
@@ -673,6 +678,7 @@
 						><input
 							type="checkbox"
 							name="IGfensterdach5"
+							bind:checked={ausweis.fenster_dach[4]}
 							value="FD"
 						/>Alle Fenster dicht</label
 					>
@@ -682,6 +688,7 @@
 						><input
 							type="checkbox"
 							name="IGfensterdach6"
+							bind:checked={ausweis.fenster_dach[5]}
 							value="FTUD"
 						/>Fenster teilweise undicht</label
 					>
@@ -691,6 +698,7 @@
 						><input
 							type="checkbox"
 							name="IGfensterdach7"
+							bind:checked={ausweis.fenster_dach[6]}
 							value="TD"
 						/>Alle Türen dicht</label
 					>
@@ -700,6 +708,7 @@
 						><input
 							type="checkbox"
 							name="IGfensterdach8"
+							bind:checked={ausweis.fenster_dach[7]}
 							value="TUD"
 						/>Türen teilweise undicht</label
 					>
@@ -709,6 +718,7 @@
 						><input
 							type="checkbox"
 							name="IGfensterdach9"
+							bind:checked={ausweis.fenster_dach[8]}
 							value="RKD"
 						/>Rollladenkästen gedämmt, luftdicht</label
 					>
@@ -743,6 +753,7 @@
 						><input
 							type="checkbox"
 							name="IGwaermedaemmung1"
+							bind:checked={ausweis.daemmung[0]}
 							value="AWD"
 						/>Außenwand gedämmt</label
 					>
@@ -752,6 +763,7 @@
 						><input
 							type="checkbox"
 							name="IGwaermedaemmung2"
+							bind:checked={ausweis.daemmung[1]}
 							value="KWD"
 						/>Kelleraußenwand gedämmt</label
 					>
@@ -761,6 +773,7 @@
 						><input
 							type="checkbox"
 							name="IGwaermedaemmung3"
+							bind:checked={ausweis.daemmung[2]}
 							value="KDD"
 						/>Kellerdecke gedämmt</label
 					>
@@ -770,6 +783,7 @@
 						><input
 							type="checkbox"
 							name="IGwaermedaemmung4"
+							bind:checked={ausweis.daemmung[3]}
 							value="DGD"
 						/>Dachgeschoss gedämmt</label
 					>
@@ -779,6 +793,7 @@
 						><input
 							type="checkbox"
 							name="IGwaermedaemmung5"
+							bind:checked={ausweis.daemmung[4]}
 							value="OGDDW"
 						/>Oberste Geschossdecke gedämmt</label
 					>
@@ -788,6 +803,7 @@
 						><input
 							type="checkbox"
 							name="IGwaermedaemmung6"
+							bind:checked={ausweis.daemmung[5]}
 							value="OGDD"
 						/>Oberste Geschossdecke min. 12cm gedämmt</label
 					>
@@ -810,7 +826,7 @@
 
 		<div class="flex flex-row justify-between">
 			<Hilfe />
-			<button formnovalidate>Weiter</button>
+			<button class="button">Weiter</button>
 		</div>
 	</fieldset>
 </form>

src/components/Verbrauchsausweis/energyPerformanceCalculation.ts

@@ -1,40 +0,0 @@
-
-/**
- * 
- * @param energyConsumption Ein Array aus allen Verbräuchen der drei Verbrauchsjahre für die primäre Energiequelle
- * @param additionalEnergyConsumption Ein Array aus allen Verbräuchen der drei Verbrauchsjahre für die sekundäre Energiequelle
- * @param waterHeatingPortion Der Anteil den Warmwasser am Energieverbrauch ausgemacht hat
- * @param climateFactors Ein Array aus drei Klimafaktoren für die Verbrauchsjahre
- * @param area Die Nutzfläche des Gebäudes
- * @param conversionFactor Der Umrechnungsfaktor des Energieträgers
- * @param calorificValueFactor Der Heizwertfaktor des Energieträgers
- * @returns Den Performance Wert den das Gebäude erzielt hat.
- */
-export function calculateEnergyPerformanceScore(
-	energyConsumption: number[],
-	additionalEnergyConsumption: number[],
-	waterHeatingPortion: number,
-	climateFactors: number[],
-	area: number,
-	conversionFactor: number,
-	calorificValueFactor: number
-): number {
-	// Alle Werte müssen in kWh umgerechnet werden.
-	let energyConsumptionKWh = energyConsumption.map((x) => convertEnergyConsumptionToKWh(x, conversionFactor, calorificValueFactor))
-	let additionalEnergyConsumptionKWh = additionalEnergyConsumption.map((x) => convertEnergyConsumptionToKWh(x, conversionFactor, calorificValueFactor))
-	let heatingPortion = 1 - (waterHeatingPortion / 100);
-	
-
-	return (heatingPortion * (energyConsumptionKWh[0] + additionalEnergyConsumptionKWh[0]) * climateFactors[0] +
-		(waterHeatingPortion / 100) * (energyConsumptionKWh[0] + additionalEnergyConsumptionKWh[0]) +
-		heatingPortion * (energyConsumptionKWh[1] + additionalEnergyConsumptionKWh[1]) * climateFactors[1] +
-		(waterHeatingPortion / 100) * (energyConsumptionKWh[1] + additionalEnergyConsumptionKWh[1]) +
-		heatingPortion * (energyConsumptionKWh[2] + additionalEnergyConsumptionKWh[2]) * climateFactors[2] +
-		(waterHeatingPortion / 100) * (energyConsumptionKWh[2] + additionalEnergyConsumptionKWh[2])) /
-	3 /
-	(area || 1);
-}
-
-function convertEnergyConsumptionToKWh(consumption: number, conversionFactor: number, calorificValueFactor: number): number {
- return (consumption * conversionFactor) / calorificValueFactor;
-}