Merge pull request #311 from IBCornelsen/main

upDate

astro.config.mjs

@@ -4,12 +4,14 @@ import svelte from "@astrojs/svelte";
 import tailwind from "@astrojs/tailwind";
 import node from "@astrojs/node";
 import mdx from "@astrojs/mdx";
+import dsv from "@rollup/plugin-dsv"
+import astroTypesafeAPI from "astro-typesafe-api"
 
 import { fileURLToPath } from "url";
 
 // https://astro.build/config 
 export default defineConfig({
-  integrations: [svelte(), tailwind(), mdx()],
+  integrations: [svelte(), tailwind(), mdx(), astroTypesafeAPI()],
   outDir: "./dist",
   output: "server",
   vite: {
@@ -28,7 +30,8 @@ export default defineConfig({
       commonjsOptions: {
         transformMixedEsModules: false
       }
-    }
+    },
+		plugins: [dsv()]
   },
   adapter: node({
     mode: "middleware"

cypress.config.ts

@@ -1,17 +1,42 @@
 import { defineConfig } from "cypress";
+import dsv from "@rollup/plugin-dsv"
+
+import { fileURLToPath } from "url";
+import vitePreprocessor from "cypress-vite";
 
 export default defineConfig({
   e2e: {
     baseUrl: "http://localhost:3000",
-    supportFile: false,
 		viewportHeight: 900,
 		viewportWidth: 1660,
+		supportFile: false,
+		specPattern: "./src/cypress/e2e/**/*.{ts,js}",
+		setupNodeEvents(on, config) {
+				on("file:preprocessor", vitePreprocessor({
+					optimizeDeps: {
+						exclude: ["@ibcornelsen/api", "@ibcornelsen/database"]
+					},
+					resolve: {
+						alias: {
+							"#": fileURLToPath(new URL("./src", import.meta.url)),
+							"#components": fileURLToPath(new URL("./src/components", import.meta.url)),
+							"#lib": fileURLToPath(new URL("./src/lib", import.meta.url))
+						}
+					},
+					base: fileURLToPath(new URL("./src", import.meta.url)),
+					build: {
+						commonjsOptions: {
+							transformMixedEsModules: false
+						}
+					},
+					plugins: [dsv()]
+				}))
+		},
   },
-
   component: {
     devServer: {
       framework: "svelte",
-      bundler: "vite",
-    },
+      bundler: "vite"
     },
+  }
 });

package.json

@@ -13,7 +13,8 @@
     "format": "prettier --write .",
     "build:production": "astro build && bun --bun server.ts",
     "i18n:generate": "bunx astro-i18next generate",
-    "prisma:studio": "bunx prisma studio --schema=./node_modules/@ibcornelsen/database/prisma/schema.prisma"
+    "prisma:studio": "bunx prisma studio --schema=./node_modules/@ibcornelsen/database/prisma/schema.prisma",
+    "openapi:generate": "bun astro-typesafe-api generate"
   },
   "private": true,
   "dependencies": {
@@ -24,59 +25,71 @@
     "@ibcornelsen/api": "link:@ibcornelsen/api",
     "@ibcornelsen/database": "link:@ibcornelsen/database",
     "@ibcornelsen/ui": "^0.0.2",
-    "@mollie/api-client": "^3.7.0",
-    "@pdfme/common": "^5.1.7",
-    "@pdfme/generator": "^5.2.11",
-    "@pdfme/ui": "^5.1.7",
+    "@mollie/api-client": "^4.1.0",
+    "@pdfme/common": "^5.2.16",
+    "@pdfme/generator": "^5.2.16",
+    "@pdfme/ui": "^5.2.16",
     "@trpc/client": "^10.45.2",
     "@trpc/server": "^10.45.2",
-    "astro": "^4.16.10",
+    "astro": "^4.16.17",
+    "astro-typesafe-api": "^0.2.1",
     "body-scroll-lock": "^4.0.0-beta.0",
     "buffer": "^6.0.3",
-    "bun": "^1.1.34",
+    "bun": "^1.1.45",
     "csvtojson": "^2.0.10",
-    "express": "^4.21.1",
+    "express": "^4.21.2",
     "flag-icons": "^6.15.0",
     "fontkit": "^2.0.4",
+    "is-base64": "^1.1.0",
     "js-cookie": "^3.0.5",
     "js-interpolate": "^1.3.2",
+    "jsonwebtoken": "^9.0.2",
+    "jwt-decode": "^4.0.0",
     "moment": "^2.30.1",
     "moment-timezone": "^0.5.46",
+    "nodemailer": "^6.10.0",
     "pdf-lib": "^1.17.1",
     "postcss-nested": "^7.0.2",
     "radix-svelte-icons": "^1.0.0",
-    "sass": "^1.80.6",
+    "sass": "^1.83.4",
     "svelte": "^3.59.2",
     "svelte-dialogs": "^1.2.2",
     "svelte-preprocess": "^5.1.4",
     "svelte-ripple-action": "^1.0.6",
-    "tailwindcss": "^3.4.14",
+    "tailwindcss": "^3.4.17",
     "trpc-openapi": "^1.2.0",
     "uuid": "^9.0.1",
-    "zod": "^3.23.8"
+    "zod": "^3.24.1"
   },
   "devDependencies": {
     "@faker-js/faker": "^8.4.1",
     "@rollup/plugin-dsv": "^3.0.5",
-    "@tailwindcss/typography": "^0.5.15",
+    "@tailwindcss/typography": "^0.5.16",
     "@types/body-scroll-lock": "^3.1.2",
     "@types/express": "^5.0.0",
     "@types/fontkit": "^2.0.7",
+    "@types/is-base64": "^1.1.3",
     "@types/js-cookie": "^3.0.6",
+    "@types/jsonwebtoken": "^9.0.7",
+    "@types/nodemailer": "^6.4.17",
     "@types/uuid": "^9.0.8",
     "@typescript-eslint/eslint-plugin": "^5.62.0",
     "@typescript-eslint/parser": "^5.62.0",
     "autoprefixer": "^10.4.20",
-    "bun-types": "^1.1.34",
-    "cypress": "^13.15.2",
+    "bun-types": "^1.1.45",
+    "cypress": "^13.17.0",
     "cypress-file-upload": "^5.0.8",
-    "daisyui": "^4.12.14",
+    "cypress-vite": "^1.6.0",
+    "daisyui": "^4.12.23",
     "eslint": "~8.15.0",
     "eslint-config-prettier": "8.1.0",
-    "postcss": "^8.4.49",
+    "postcss": "^8.5.1",
     "postcss-import": "^16.1.0",
     "postcss-nesting": "^13.0.1",
     "prettier": "^2.8.8",
     "typescript": "^4.9.5"
+  },
+  "overrides": {
+    "zod": "^3.24.1"
   }
 }

public/images/pfeil-nach-oben.svg

@@ -0,0 +1,10 @@
+<svg width="70" height="96" viewBox="0 0 70 96" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_0_3)">
+<path d="M0 62.6526L12 56.5895V96H35H57.5V56.5895L70 62.6526L35 0L0 62.6526Z" fill="black"/>
+</g>
+<defs>
+<clipPath id="clip0_0_3">
+<rect width="70" height="96" fill="white"/>
+</clipPath>
+</defs>
+</svg>

public/images/pfeil-nach-unten.svg

@@ -0,0 +1,10 @@
+<svg width="70" height="96" viewBox="0 0 70 96" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_0_3)">
+<path d="M0 33.3474L12 39.4105V0H35H57.5V39.4105L70 33.3474L35 96L0 33.3474Z" fill="black"/>
+</g>
+<defs>
+<clipPath id="clip0_0_3">
+<rect width="70" height="96" fill="white"/>
+</clipPath>
+</defs>
+</svg>

src/astro-typesafe-api-caller.ts

@@ -0,0 +1,24 @@
+import { createCallerFactory } from "astro-typesafe-api/server";
+
+export const createCaller = createCallerFactory({
+    "klimafaktoren": await import("../src/pages/api/klimafaktoren.ts"),
+    "postleitzahlen": await import("../src/pages/api/postleitzahlen.ts"),
+    "aufnahme/[uid]": await import("../src/pages/api/aufnahme/[uid].ts"),
+    "aufnahme": await import("../src/pages/api/aufnahme/index.ts"),
+    "bedarfsausweis-wohnen": await import("../src/pages/api/bedarfsausweis-wohnen/index.ts"),
+    "auth/access-token": await import("../src/pages/api/auth/access-token.ts"),
+    "auth/forgot-password": await import("../src/pages/api/auth/forgot-password.ts"),
+    "auth/refresh-token": await import("../src/pages/api/auth/refresh-token.ts"),
+    "bilder/[uid]": await import("../src/pages/api/bilder/[uid].ts"),
+    "objekt": await import("../src/pages/api/objekt/index.ts"),
+    "rechnung": await import("../src/pages/api/rechnung/index.ts"),
+    "ticket": await import("../src/pages/api/ticket/index.ts"),
+    "user": await import("../src/pages/api/user/index.ts"),
+    "user/self": await import("../src/pages/api/user/self.ts"),
+    "verbrauchsausweis-gewerbe/[uid]": await import("../src/pages/api/verbrauchsausweis-gewerbe/[uid].ts"),
+    "verbrauchsausweis-gewerbe": await import("../src/pages/api/verbrauchsausweis-gewerbe/index.ts"),
+    "verbrauchsausweis-wohnen/[uid]": await import("../src/pages/api/verbrauchsausweis-wohnen/[uid].ts"),
+    "verbrauchsausweis-wohnen": await import("../src/pages/api/verbrauchsausweis-wohnen/index.ts"),
+    "objekt/[uid]/bilder": await import("../src/pages/api/objekt/[uid]/bilder.ts"),
+    "objekt/[uid]": await import("../src/pages/api/objekt/[uid]/index.ts"),
+})

src/client/lib/bilderHochladen.ts

@@ -1,16 +1,32 @@
-import { GebaeudeClient, UploadedGebaeudeBild, VerbrauchsausweisWohnenClient } from "#components/Ausweis/types";
+import {
+  ObjektClient,
+  UploadedGebaeudeBild,
+  VerbrauchsausweisWohnenClient,
+} from "#components/Ausweis/types.js";
+import { API_ACCESS_TOKEN_COOKIE_NAME } from "#lib/constants.js";
 import { Enums } from "@ibcornelsen/database/client";
 import { addNotification, updateNotification } from "@ibcornelsen/ui";
-import { client } from "src/trpc";
+import { api } from "astro-typesafe-api/client";
+import Cookies from "js-cookie";
 
-export async function bilderHochladen(images: (UploadedGebaeudeBild & { base64?: string })[], gebaeude_uid: string) {
+export async function bilderHochladen(
+  images: (UploadedGebaeudeBild & { base64?: string, update?: boolean })[],
+  gebaeude_uid: string
+) {
   if (images.length == 0) {
     return images;
   }
 
   // Wenn Bilder hochgeladen werden konvertieren wir sie zu base64, das heißt, dass die base64 Eigenschaft bei diesen Bildern
   // existiert. Das müssen wir TypeScript nur wissen lassen, damit es uns in Ruhe lässt.
-	const imagesToUpload = images.filter(image => !image.uid || image.update) as unknown as { base64: string, kategorie: string, uid?: string, update: boolean }[];
+  const imagesToUpload = images.filter(
+    (image) => !image.uid || image.update
+  ) as unknown as {
+    base64: string;
+    kategorie: string;
+    uid?: string;
+    update: boolean;
+  }[];
 
   if (imagesToUpload.length == 0) {
     return images;
@@ -22,42 +38,56 @@ export async function bilderHochladen(images: (UploadedGebaeudeBild & { base64?:
     message: "Bilder hochladen.",
     subtext: `${imagesToUpload.length} Bilder werden hochgeladen, bitte haben sie Geduld.`,
     timeout: 0,
-		type: "info"
-	})
+    type: "info",
+  });
   for (let i = 0; i < imagesToUpload.length; i++) {
     const image = imagesToUpload[i];
 
     try {
       if (image.update) {
-				await client.v1.bilder.update.mutate({
-					uid: image.uid as string,
-					base64: image.base64,
-					kategorie: image.kategorie as Enums.BilderKategorie
-				})
-			} else {
-				const response = await client.v1.bilder.upload.mutate({
+        await api.bilder._uid.PATCH.fetch({
           base64: image.base64,
           kategorie: image.kategorie as Enums.BilderKategorie,
-					gebaeude_uid
-				})
+        }, {
+					params: {
+						uid: image.uid as string,
+					},
+					headers: {
+						"Authorization": `Bearer ${Cookies.get(API_ACCESS_TOKEN_COOKIE_NAME)}`
+					}
+				});
+      } else {
+        const response = await api.objekt._uid.bilder.PUT.fetch({
+          base64: image.base64,
+          kategorie: image.kategorie as Enums.BilderKategorie
+        }, {
+					params: {
+						uid: gebaeude_uid
+					},
+					headers: {
+						"Authorization": `Bearer ${Cookies.get(API_ACCESS_TOKEN_COOKIE_NAME)}`
+					}
+				});
 
-				image.uid = response.uid
+        image.uid = response.uid;
       }
 
       updateNotification(notification, {
         dismissable: true,
         message: "Bild hochgeladen.",
-				subtext: `${i + 1}/${imagesToUpload.length} Bildern wurden erfolgreich hochgeladen.`,
-				timeout: 3000
-			})
+        subtext: `${i + 1}/${
+          imagesToUpload.length
+        } Bildern wurden erfolgreich hochgeladen.`,
+        timeout: 3000,
+      });
     } catch (e) {
       updateNotification(notification, {
         dismissable: true,
         message: "Bild konnte nicht hochgeladen werden.",
         subtext: `Eines ihrer Bilder konnte nicht hochgeladen werden. Wir haben bereits ein Ticket erstellt und melden uns so schnell wie möglich bei ihnen.`,
         timeout: 15000,
-				type: "error"
-			})
+        type: "error",
+      });
     }
   }
 

src/client/lib/spawnSignupPrompt.ts

@@ -1,6 +1,6 @@
-import { dialogs } from "../../../svelte-dialogs.config";
-import { addNotification } from "#components/Notifications/shared";
-import { client } from "src/trpc";
+import { dialogs } from "../../../svelte-dialogs.config.js";
+import { addNotification } from "#components/Notifications/shared.js";
+import { api } from "astro-typesafe-api/client";
 
 export async function spawnSignupPrompt() {
 	const result = await dialogs.prompt(
@@ -46,7 +46,7 @@ export async function spawnSignupPrompt() {
 	const [vorname, name, email, passwort] = result;
 
 	try {
-		const response = await client.v1.benutzer.erstellen.mutate({
+		const response = await api.user.PUT.fetch({
 			email,
 			passwort,
 			vorname,

src/client/lib/validateAccessToken.ts

@@ -1,7 +1,9 @@
 import Cookies from "js-cookie";
 import { API_ACCESS_TOKEN_COOKIE_NAME, API_REFRESH_TOKEN_COOKIE_NAME, API_UID_COOKIE_NAME } from "#lib/constants.js";
-import { client } from "../../trpc.js";
 import moment from "moment";
+import { TokenData, TokenType } from "#lib/auth/types.js";
+import { api } from "astro-typesafe-api/client";
+import { jwtDecode } from "jwt-decode"
 
 
 export async function validateAccessTokenClient() { 
@@ -9,10 +11,10 @@ export async function validateAccessTokenClient() {
 	const refreshToken = Cookies.get(API_REFRESH_TOKEN_COOKIE_NAME);
 
 	if (accessToken) {
-		const { valid } = await client.v1.benutzer.validateAccessToken.query({accessToken})
+		const { exp, typ, uid } = jwtDecode(accessToken) as TokenData
 
-		if (valid) {
-			return valid;
+		if (exp > Date.now() && typ === TokenType.Access) {
+			return true;
 		} else {
 			Cookies.remove(API_ACCESS_TOKEN_COOKIE_NAME);
 		}
@@ -33,7 +35,7 @@ export async function validateAccessTokenClient() {
 	// Wenn das klappt, dann haben wir auch einen neuen Access Token.
 	// Wenn das nicht klappt, dann müssen wir uns neu anmelden.
 	try {
-		const { accessToken: newAccessToken, accessTokenExpiry, refreshToken: newRefreshToken, refreshTokenExpiry } = await client.v1.benutzer.getAccessToken.query({
+		const { accessToken: newAccessToken, accessTokenExpiry, refreshToken: newRefreshToken, refreshTokenExpiry } = await api.auth["access-token"].GET.fetch({
 			refreshToken
 		})
 

src/client/lib/verbrauchsausweisWohnenSpeichern.ts

@@ -1,86 +1,134 @@
-import {
-	BenutzerClient,
-	GebaeudeAufnahmeClient,
-	GebaeudeClient,
-	UploadedGebaeudeBild,
-	VerbrauchsausweisWohnenClient,
-} from "#components/Ausweis/types.js";
+
+import { api } from "astro-typesafe-api/client"
 
 import { exclude } from "#lib/exclude.js";
-import { client } from "src/trpc.js";
-import { bilderHochladen } from "./bilderHochladen.js";
-import { addNotification } from "@ibcornelsen/ui";
+import Cookies from "js-cookie";
+import { API_ACCESS_TOKEN_COOKIE_NAME } from "#lib/constants.js";
+import { AufnahmeClient, ObjektClient, UploadedGebaeudeBild, VerbrauchsausweisWohnenClient,  } from "#components/Ausweis/types.js";
 
 export async function verbrauchsausweisWohnenSpeichern(
 	ausweis: VerbrauchsausweisWohnenClient,
-	gebaeude: GebaeudeClient,
-	gebaeude_aufnahme_allgemein: GebaeudeAufnahmeClient,
-	images: (UploadedGebaeudeBild & { base64?: string })[],
-	user: BenutzerClient
+	objekt: ObjektClient,
+	aufnahme: AufnahmeClient,
+	bilder: (UploadedGebaeudeBild & { base64?: string })[]
 ) {
-	if (ausweis.uid) {
-		// Anscheinend wurde der Ausweis bereits erstellt und hat eine UID.
-		// Jetzt müssen wir ihn nun nur noch abspeichern.
-		try {
-			await client.v1.verbrauchsausweisWohnen[2016].speichern.mutate({
-				...ausweis,
-				gebaeude_aufnahme_allgemein: {
-					...exclude(
-						gebaeude_aufnahme_allgemein,
-						["erstellungsdatum", "events", "ausstellungsdatum", "rechnungen"]
-					),
-					gebaeude_stammdaten: {
-						...exclude(gebaeude, [
-							"gebaeude_bilder",
-						]),
+	if (objekt.uid) {
+		await api.objekt._uid.PATCH.fetch({
+			...exclude(objekt, ["uid"])
+		}, {
+			params: {
+				uid: objekt.uid
 			},
-				},
-			});
-
-			images = await bilderHochladen(images, gebaeude.uid);
-
-			return  { uid: ausweis.uid, gebaeude_uid: gebaeude.uid, gebaeude_aufnahme_uid: gebaeude_aufnahme_allgemein.uid };
-		} catch (e) {
-			// TODO: Ticket mit Fehldermeldung abschicken.
+			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, ["uid"])
+		}, {
+			params: {
+				uid: aufnahme.uid
+			},
+			headers: {
+				"Authorization": `Bearer ${Cookies.get(API_ACCESS_TOKEN_COOKIE_NAME)}`
+			}
+		})
 	} else {
-		// Wir speichern den Ausweis ab und leiten auf die "ausweis-gespeichert" Seite weiter.
-		try {
-			const response =
-				await client.v1.verbrauchsausweisWohnen[2016].erstellen.mutate({
-					...ausweis,
-					gebaeude_aufnahme_allgemein: {
-						...gebaeude_aufnahme_allgemein,
-						gebaeude_stammdaten: {
-							...gebaeude,
-						},
-					},
-				});
+		const { uid } = await api.aufnahme.PUT.fetch({
+			aufnahme,
+			uid_objekt: objekt.uid
+		}, {
+			headers: {
+				"Authorization": `Bearer ${Cookies.get(API_ACCESS_TOKEN_COOKIE_NAME)}`
+			}
+		})
 
-			images = await bilderHochladen(images, response.gebaeude_uid);
+		aufnahme.uid = uid
+	}
 
-			return response;
-		} catch (e: any) {
-			await client.v1.tickets.erstellen.mutate({
-				titel: "Ausweis konnte nicht gespeichert werden",
-				beschreibung: e.stack,
-				email: user.email ?? "",
-				metadata: JSON.stringify({
+	if (ausweis.uid) {
+		await api["verbrauchsausweis-wohnen"]._uid.PATCH.fetch({
+			...exclude(ausweis, ["uid"])
+		}, {
+			params: {
+				uid: ausweis.uid
+			},
+			headers: {
+				"Authorization": `Bearer ${Cookies.get(API_ACCESS_TOKEN_COOKIE_NAME)}`
+			}
+		})
+	} else {
+		const { uid } = await api["verbrauchsausweis-wohnen"].PUT.fetch({
 			ausweis,
-				}),
-			});
-			// TODO: Ticket mit Fehldermeldung abschicken.
+			uid_aufnahme: aufnahme.uid
+		}, {
+			headers: {
+				"Authorization": `Bearer ${Cookies.get(API_ACCESS_TOKEN_COOKIE_NAME)}`
 			}
+		})
+
+		ausweis.uid = uid;
 	}
 
-	addNotification({
-		dismissable: false,
-		message:
-			"Ausweis konnte nicht gespeichert werden, bitte versuchen sie es erneut.",
-		subtext:
-			"Sollte das Problem weiterhin bestehen, kontaktieren sie bitte den Support.",
-		timeout: 6000,
-		type: "error",
-	});
+	for (const bild of bilder) {
+		if (bild.uid) {
+			continue;
+		}
+
+		const response = await api.objekt._uid.bilder.PUT.fetch({
+			base64: bild.base64,
+			kategorie: bild.kategorie
+		}, {
+			params: {
+				uid: objekt.uid
+			},
+			headers: {
+				"Authorization": `Bearer ${Cookies.get(API_ACCESS_TOKEN_COOKIE_NAME)}`
+			}
+		})
+
+		bild.uid = response.uid
+	}
+
+	return {
+		uid_ausweis: ausweis.uid,
+		uid_aufnahme: aufnahme.uid,
+		uid_objekt: objekt.uid
+	}
+	
+
+	// await client.v1.tickets.erstellen.mutate({
+	// 	titel: "Ausweis konnte nicht gespeichert werden",
+	// 	beschreibung: e.stack,
+	// 	email: user.email ?? "",
+	// 	metadata: JSON.stringify({
+	// 		ausweis,
+	// 	}),
+	// });
+
+	// addNotification({
+	// 	dismissable: false,
+	// 	message:
+	// 		"Ausweis konnte nicht gespeichert werden, bitte versuchen sie es erneut.",
+	// 	subtext:
+	// 		"Sollte das Problem weiterhin bestehen, kontaktieren sie bitte den Support.",
+	// 	timeout: 6000,
+	// 	type: "error",
+	// });
 	return null;
 }

src/client/tickets/createTicket.ts

@@ -1,7 +1,6 @@
-import { AppRouter } from "@ibcornelsen/api";
-import { inferProcedureInput } from "@trpc/server";
-import { client } from "src/trpc";
+import { OmitKeys, TicketClient } from "#components/Ausweis/types.js";
+import { api } from "astro-typesafe-api/client";
 
-export async function createTicket(info: inferProcedureInput<AppRouter["v1"]["tickets"]["erstellen"]>) {
-	return await client.v1.tickets.erstellen.mutate(info)
+export async function createTicket(info: OmitKeys<TicketClient, "created_at" | "deleted_at" | "prioritaet" | "updated_at" | "status" | "uid">) {
+	return await api.ticket.PUT.fetch(info)
 }

src/components/Ausweis/Ansprechpartner.svelte

@@ -1,7 +1,8 @@
 <script lang="ts">
 
-	import HelpLabel from "#labels/HelpLabel.svelte";
-	import Inputlabel from "#labels/InputLabel.svelte";
+	import HelpLabel from "#components/labels/HelpLabel.svelte";
+	import Inputlabel from "#components/labels/InputLabel.svelte";
+	import { BenutzerClient } from "./types.js";
 
 	export let user: BenutzerClient;
 

src/components/Ausweis/AusweisPreviewContainer.svelte

@@ -1,21 +1,21 @@
 <script lang="ts">
 	import AnsichtsausweisButton from "#components/AnsichtsausweisButton.svelte";
 	import DatenblattButton from "#components/DatenblattButton.svelte";
-	import HelpLabel from "#labels/HelpLabel.svelte";
-	import Inputlabel from "#labels/InputLabel.svelte";
+	import HelpLabel from "#components/labels/HelpLabel.svelte";
+	import Inputlabel from "#components/labels/InputLabel.svelte";
 	import ImageGrid from "#components/ImageGrid.svelte";
 	import {
 	Enums,
 	} from "@ibcornelsen/database/client";
 
 	import {
-		GebaeudeClient,
+		ObjektClient,
 		UploadedGebaeudeBild,
 		VerbrauchsausweisWohnenClient,
 	} from "./types.js";
 
 	export let ausweis: VerbrauchsausweisWohnenClient;
-	export let gebaeude: GebaeudeClient;
+	export let gebaeude: ObjektClient;
 	export let images: UploadedGebaeudeBild[] = [];
 </script>
 

src/components/Ausweis/Ausweisart.svelte

@@ -1,8 +1,6 @@
 <script lang="ts">
-
-
-	import HelpLabel from "#labels/HelpLabel.svelte";
-	import Inputlabel from "#labels/InputLabel.svelte";
+	import HelpLabel from "#components/labels/HelpLabel.svelte";
+	import Inputlabel from "#components/labels/InputLabel.svelte";
 
 	//import Label from "#components/Label.svelte";
 
@@ -12,20 +10,20 @@
 	import { Enums } from "@ibcornelsen/database/client";
 	import {
 	BedarfsausweisWohnenClient,
-		GebaeudeAufnahmeClient,
-		GebaeudeClient,
+		AufnahmeClient,
+		ObjektClient,
 		VerbrauchsausweisGewerbeClient,
 		VerbrauchsausweisWohnenClient,
 	} from "./types.js";
 
-	export let gebaeude: GebaeudeClient;
+	export let objekt: ObjektClient;
 	export let ausweis:
 		| VerbrauchsausweisWohnenClient
 		| VerbrauchsausweisGewerbeClient
 		| BedarfsausweisWohnenClient;
-	export let gebaeude_aufnahme_allgemein: GebaeudeAufnahmeClient;
+	export let aufnahme: AufnahmeClient;
 
-	export let Energieausweis;
+	export let ausweisart: Enums.Ausweisart;
 </script>
 
 <div id="ausweisart" class="bereich-box grid
@@ -46,6 +44,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 			placeholder="Anlass"
 			bind:value={ausweis.ausstellgrund}
 			required
+			data-cy="ausstellgrund"
 		>
 			<option disabled selected value={false}>Bitte auswählen</option>
 			{#each Object.entries(Enums.Ausstellgrund) as [name, ausstellgrund]}
@@ -69,11 +68,11 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 			name="gebaeudetyp"
 			data-test="gebaeudetyp"
 			required
-			bind:value={gebaeude_aufnahme_allgemein.gebaeudetyp}
+			bind:value={aufnahme.gebaeudetyp}
 		>
 			<option disabled selected value={false}>Bitte auswählen</option>
 
-			{#if Energieausweis=="Verbrauchsausweis Wohngebäude" || Energieausweis=="Bedarfsausweis Wohngebäude"}
+			{#if ausweisart=="VerbrauchsausweisWohnen"}
 			<option value="Einfamilienhaus">Einfamilienhaus</option>
 			<option value="Freistehendes Einfamilienhaus">Freistehendes Einfamilienhaus</option>
 			<option value="Freistehendes Zweifamilienhaus">Freistehendes Zweifamilienhaus</option>
@@ -85,7 +84,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 			<option value="Atrium-Bungalow">Atrium-Bungalow</option>
 			<option value="Winkelbungalow">Winkelbungalow</option>
 
-			{:else if Energieausweis=="Verbrauchsausweis Gewerbe"}
+			{:else if ausweisart=="VerbrauchsausweisGewerbe"}
 			<option value="Verwaltungsgebäude (allgemein)">Verwaltungsgebäude (allgemein)</option>
 			<option value="Parlaments- und Gerichtsgebäude">Parlaments- und Gerichtsgebäude</option>
 			<option value="Ministerien u. Ämter u. Behörden">Ministerien u. Ämter u. Behörden</option>
@@ -161,7 +160,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 			autocomplete="off"
 			data-msg="Pflichtfeld"
 			maxlength="3"
-			bind:value={gebaeude_aufnahme_allgemein.einheiten}
+			bind:value={aufnahme.einheiten}
 		/>
 
 		<div class="help-label">
@@ -180,7 +179,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 		<select
 			name="saniert"
 			required
-			bind:value={gebaeude_aufnahme_allgemein.saniert}
+			bind:value={aufnahme.saniert}
 		>
 			<option disabled selected>Bitte auswählen</option>
 			<option value={true}>saniert</option>
@@ -220,10 +219,10 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 			onFocusOut={() => {
 				deleteNotification("GEBAEUDE_BAUJAHR");
 			}}
-			className={auditHeizungGebaeudeBaujahr(gebaeude_aufnahme_allgemein)
+			className={auditHeizungGebaeudeBaujahr(aufnahme)
 				? "linked"
 				: ""}
-			bind:tags={gebaeude_aufnahme_allgemein.baujahr_gebaeude}
+			bind:tags={aufnahme.baujahr_gebaeude}
 		/>
 
 		<div class="help-label">
@@ -258,10 +257,10 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 			onFocusOut={() => {
 				deleteNotification("HEIZUNG_BAUJAHR");
 			}}
-			className={auditHeizungGebaeudeBaujahr(gebaeude_aufnahme_allgemein)
+			className={auditHeizungGebaeudeBaujahr(aufnahme)
 				? "linked"
 				: ""}
-			bind:tags={gebaeude_aufnahme_allgemein.baujahr_heizung}
+			bind:tags={aufnahme.baujahr_heizung}
 		/>
 
 		<div class="help-label">

src/components/Ausweis/Bezahlung.svelte

@@ -1,10 +1,10 @@
 <script lang="ts">
 
-	import HelpLabel from "#labels/HelpLabel.svelte";
-	import Inputlabel from "#labels/InputLabel.svelte";
+	import HelpLabel from "#components/labels/HelpLabel.svelte";
+	import Inputlabel from "#components/labels/InputLabel.svelte";
     import ZipSearch from "#components/PlzSuche.svelte";
  
-    import { Enums } from "@ibcornelsen/database/client";
+    import { Bezahlmethoden, Enums } from "@ibcornelsen/database/client";
 	import PaymentOption from "#components/PaymentOption.svelte";
 
     export let selectedPaymentType: Bezahlmethoden =

src/components/Ausweis/BilderZusatzsysteme.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
-	import HelpLabel from "#labels/HelpLabel.svelte";
-	import Inputlabel from "#labels/InputLabel.svelte";
+	import HelpLabel from "#components/labels/HelpLabel.svelte";
+	import Inputlabel from "#components/labels/InputLabel.svelte";
 
 	import HeizungImage from "./HeizungImage.svelte";
 	import AusweisPreviewContainer from "./AusweisPreviewContainer.svelte";
@@ -10,16 +10,16 @@
 	//import Label from "../Label.svelte";
 
 	import {
-		GebaeudeAufnahmeClient,
-		GebaeudeClient,
+		AufnahmeClient,
+		ObjektClient,
 		UploadedGebaeudeBild,
 		VerbrauchsausweisWohnenClient,
 	} 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 gebaeude: ObjektClient;
+	export let aufnahme: AufnahmeClient;
 	export let ausweis: VerbrauchsausweisWohnenClient;
 	export let images: UploadedGebaeudeBild[];
 </script>
@@ -35,21 +35,92 @@ md:grid-cols-2 md:gap-x-6 md:gap-y-8
 xl:grid-cols-2 xl:gap-x-8 xl:gap-y-8
 2xl:grid-cols-3 2xl:gap-x-8 2xl:gap-y-2
 
-">
-
-<SanierungsOption label="Zentral/Etage" name="zentralheizung" help="Bitte anklicken wenn die Heizwärme <b>zentral erzeugt</b> und von dort in die Räume verteilt wird. Gasthermen und Etagenheizungen in der Wohnung gehören auch dazu." value="ZH" bind:checked={gebaeude_aufnahme_allgemein.zentralheizung}></SanierungsOption>
-<SanierungsOption label="Einzelofen" name="einzelofen" help="Bei <b>dezentraler Erzeugung</b> in den Räumen wie z.B. Nachtspeicher, Kami- oder Kachelofen. Dezentrale Klimageräte zur Wärmeerzeugung gehören auch dazu." value="EO" bind:checked={gebaeude_aufnahme_allgemein.einzelofen}></SanierungsOption>
-<SanierungsOption label="Durchlauferhitzer (elektrisch)" name="durchlauf_erhitzer" help="Wenn <b>dezentrale</b> elektrische <b>Warmwassererzeugung</b> vorhanden ist" value="DH" bind:checked={gebaeude_aufnahme_allgemein.durchlauf_erhitzer}></SanierungsOption>
-<SanierungsOption label="Standardkessel" name="standard_kessel" help="Gemeint sind Konstanttemperaturkessel und ältere Gebläse- oder Feststoffkessel" value="SK" bind:checked={gebaeude_aufnahme_allgemein.standard_kessel}></SanierungsOption>
-<SanierungsOption label="Solarsystem für Warmwasser" name="solarsystem_warmwasser" help="Solarpanele auf dem Dach zur <b>alternativen Warmwassererzeugung</b> aus Sonnenenergie. Nicht zu verwechseln mit Photovoltaik." value="SSWW" bind:checked={gebaeude_aufnahme_allgemein.solarsystem_warmwasser}></SanierungsOption>
-<SanierungsOption label="Wärmepumpe" name="waermepumpe" help="Elektrisch betriebener Wärmerzeuger der thermische Energie aus natürlichen Wärmequellen wie der <b>Umgebungsluft, dem Erdreich oder Grundwasser</b> nutzbar macht." value="WP" bind:checked={gebaeude_aufnahme_allgemein.waermepumpe}></SanierungsOption>
-<SanierungsOption label="Niedertemperaturkessel" name="niedertemperatur_kessel" help="Heizkessel der mit <b>niedrigen Vorlauftemperaturen</b> (35-75 °C) arbeitet. Im Vergleich zum Brennwertkessel ist er weniger effizient, wird aber noch in älteren Heizsystemen eingesetzt." value="NK" bind:checked={gebaeude_aufnahme_allgemein.niedertemperatur_kessel}></SanierungsOption>
-<SanierungsOption label="Brennwertkessel" name="brennwert_kessel" help="Hat einen besonders <b>hohen Wirkungsgrad</b> weil er die im Abgas enthaltene Kondensationswärme zurückgewinnt. Auch zu erkennen am doppelwandigem Abgasrohr welches sich nicht erhitzt." value="BWK" bind:checked={gebaeude_aufnahme_allgemein.brennwert_kessel}></SanierungsOption>
-<SanierungsOption label="Warmwasserrohre gedämmt" name="warmwasser_rohre_gedaemmt" help="Gemeint sind die sichtbaren Rohre des Verteilsystems Warmwasser. Gedämmte Rohre sind an den <b>dunklen Ummantelungen</b> (Manschetten) zu erkennen." value="BWK" bind:checked={gebaeude_aufnahme_allgemein.warmwasser_rohre_gedaemmt}></SanierungsOption>
-<SanierungsOption label="Heizungsrohre gedämmt" name="heizungsrohre_gedaemmt" help="Gemeint sind die sichtbaren Rohre des Verteilsystems Heizung. Gedämmte Rohre sind an den <b>dunklen Ummantelungen</b> (Manschetten) zu erkennen.ext" value="HRGD" bind:checked={gebaeude_aufnahme_allgemein.heizungsrohre_gedaemmt}></SanierungsOption>
-<SanierungsOption label="Zirkulation" name="zirkulation" help="Kreislauf von Heizungs- oder Warmwasser <b>innerhalb eines Leitungssystems</b>, um eine gleichmäßige Wärmeverteilung sicherzustellen." value="ZK" bind:checked={gebaeude_aufnahme_allgemein.zirkulation}></SanierungsOption>
-<SanierungsOption label="Photovoltaik auf dem Dach" name="photovoltaik" help="Direkte Umwandlung von Sonnenlicht in <b>elektrische Energie</b> mittels Solarzellen, die den photoelektrischen Effekt nutzen." value="PV" bind:checked={gebaeude_aufnahme_allgemein.photovotaik}></SanierungsOption>
-
+"
+>
+	<SanierungsOption
+		label="Zentral/Etage"
+		name="zentralheizung"
+		help="Bitte anklicken wenn die Heizwärme <b>zentral erzeugt</b> und von dort in die Räume verteilt wird. Gasthermen und Etagenheizungen in der Wohnung gehören auch dazu."
+		value="ZH"
+		bind:checked={aufnahme.zentralheizung}
+	></SanierungsOption>
+	<SanierungsOption
+		label="Einzelofen"
+		name="einzelofen"
+		help="Bei <b>dezentraler Erzeugung</b> in den Räumen wie z.B. Nachtspeicher, Kami- oder Kachelofen. Dezentrale Klimageräte zur Wärmeerzeugung gehören auch dazu."
+		value="EO"
+		bind:checked={aufnahme.einzelofen}
+	></SanierungsOption>
+	<SanierungsOption
+		label="Durchlauferhitzer (elektrisch)"
+		name="durchlauf_erhitzer"
+		help="Wenn <b>dezentrale</b> elektrische <b>Warmwassererzeugung</b> vorhanden ist"
+		value="DH"
+		bind:checked={aufnahme.durchlauf_erhitzer}
+	></SanierungsOption>
+	<SanierungsOption
+		label="Standardkessel"
+		name="standard_kessel"
+		help="Gemeint sind Konstanttemperaturkessel und ältere Gebläse- oder Feststoffkessel"
+		value="SK"
+		bind:checked={aufnahme.standard_kessel}
+	></SanierungsOption>
+	<SanierungsOption
+		label="Solarsystem für Warmwasser"
+		name="solarsystem_warmwasser"
+		help="Solarpanele auf dem Dach zur <b>alternativen Warmwassererzeugung</b> aus Sonnenenergie. Nicht zu verwechseln mit Photovoltaik."
+		value="SSWW"
+		bind:checked={aufnahme.solarsystem_warmwasser}
+	></SanierungsOption>
+	<SanierungsOption
+		label="Wärmepumpe"
+		name="waermepumpe"
+		help="Elektrisch betriebener Wärmerzeuger der thermische Energie aus natürlichen Wärmequellen wie der <b>Umgebungsluft, dem Erdreich oder Grundwasser</b> nutzbar macht."
+		value="WP"
+		bind:checked={aufnahme.waermepumpe}
+	></SanierungsOption>
+	<SanierungsOption
+		label="Niedertemperaturkessel"
+		name="niedertemperatur_kessel"
+		help="Heizkessel der mit <b>niedrigen Vorlauftemperaturen</b> (35-75 °C) arbeitet. Im Vergleich zum Brennwertkessel ist er weniger effizient, wird aber noch in älteren Heizsystemen eingesetzt."
+		value="NK"
+		bind:checked={aufnahme.niedertemperatur_kessel}
+	></SanierungsOption>
+	<SanierungsOption
+		label="Brennwertkessel"
+		name="brennwert_kessel"
+		help="Hat einen besonders <b>hohen Wirkungsgrad</b> weil er die im Abgas enthaltene Kondensationswärme zurückgewinnt. Auch zu erkennen am doppelwandigem Abgasrohr welches sich nicht erhitzt."
+		value="BWK"
+		bind:checked={aufnahme.brennwert_kessel}
+	></SanierungsOption>
+	<SanierungsOption
+		label="Warmwasserrohre gedämmt"
+		name="warmwasser_rohre_gedaemmt"
+		help="Gemeint sind die sichtbaren Rohre des Verteilsystems Warmwasser. Gedämmte Rohre sind an den <b>dunklen Ummantelungen</b> (Manschetten) zu erkennen."
+		value="BWK"
+		bind:checked={aufnahme.warmwasser_rohre_gedaemmt}
+	></SanierungsOption>
+	<SanierungsOption
+		label="Heizungsrohre gedämmt"
+		name="heizungsrohre_gedaemmt"
+		help="Gemeint sind die sichtbaren Rohre des Verteilsystems Heizung. Gedämmte Rohre sind an den <b>dunklen Ummantelungen</b> (Manschetten) zu erkennen.ext"
+		value="HRGD"
+		bind:checked={aufnahme.heizungsrohre_gedaemmt}
+	></SanierungsOption>
+	<SanierungsOption
+		label="Zirkulation"
+		name="zirkulation"
+		help="Kreislauf von Heizungs- oder Warmwasser <b>innerhalb eines Leitungssystems</b>, um eine gleichmäßige Wärmeverteilung sicherzustellen."
+		value="ZK"
+		bind:checked={aufnahme.zirkulation}
+	></SanierungsOption>
+	<SanierungsOption
+		label="Photovoltaik auf dem Dach"
+		name="photovoltaik"
+		help="Direkte Umwandlung von Sonnenlicht in <b>elektrische Energie</b> mittels Solarzellen, die den photoelektrischen Effekt nutzen."
+		value="PV"
+		bind:checked={aufnahme.photovoltaik}
+	></SanierungsOption>
 </div>
 
 <HeizungImage bind:images bind:ausweis bind:gebaeude />
@@ -86,7 +157,7 @@ xl:grid-cols-2 xl:gap-x-8 xl:gap-y-8
 					type="checkbox"
 					class="checkbox"
 					name="einfach_verglasung"
-					bind:checked={gebaeude_aufnahme_allgemein.einfach_verglasung}
+					bind:checked={aufnahme.einfach_verglasung}
 					value="EG"
 				/>Einfachglas</label
 			>
@@ -97,7 +168,7 @@ xl:grid-cols-2 xl:gap-x-8 xl:gap-y-8
 					type="checkbox"
 					class="checkbox"
 					name="doppel_verglasung"
-					bind:checked={gebaeude_aufnahme_allgemein.doppel_verglasung}
+					bind:checked={aufnahme.doppel_verglasung}
 					value="DF"
 				/>Doppelverglasung</label
 			>
@@ -108,7 +179,7 @@ xl:grid-cols-2 xl:gap-x-8 xl:gap-y-8
 					type="checkbox"
 					class="checkbox"
 					name="isolier_verglasung"
-					bind:checked={gebaeude_aufnahme_allgemein.isolier_verglasung}
+					bind:checked={aufnahme.isolier_verglasung}
 					value="IVG"
 				/>Isolierverglasung</label
 			>
@@ -119,7 +190,7 @@ xl:grid-cols-2 xl:gap-x-8 xl:gap-y-8
 					type="checkbox"
 					class="checkbox"
 					name="dreifach_verglasung"
-					bind:checked={gebaeude_aufnahme_allgemein.dreifach_verglasung}
+					bind:checked={aufnahme.dreifach_verglasung}
 					value="PHF"
 				/>Dreifachverglasung</label
 			>
@@ -130,7 +201,7 @@ xl:grid-cols-2 xl:gap-x-8 xl:gap-y-8
 					type="checkbox"
 					class="checkbox"
 					name="fenster_dicht"
-					bind:checked={gebaeude_aufnahme_allgemein.fenster_dicht}
+					bind:checked={aufnahme.fenster_dicht}
 					value="FD"
 				/>Alle Fenster dicht</label
 			>
@@ -141,7 +212,7 @@ xl:grid-cols-2 xl:gap-x-8 xl:gap-y-8
 					type="checkbox"
 					class="checkbox"
 					name="fenster_teilweise_undicht"
-					bind:checked={gebaeude_aufnahme_allgemein.fenster_teilweise_undicht}
+					bind:checked={aufnahme.fenster_teilweise_undicht}
 					value="FTUD"
 				/>Fenster teilweise undicht</label
 			>
@@ -152,7 +223,7 @@ xl:grid-cols-2 xl:gap-x-8 xl:gap-y-8
 					type="checkbox"
 					class="checkbox"
 					name="tueren_dicht"
-					bind:checked={gebaeude_aufnahme_allgemein.tueren_dicht}
+					bind:checked={aufnahme.tueren_dicht}
 					value="TD"
 				/>Alle Türen dicht</label
 			>
@@ -163,7 +234,7 @@ xl:grid-cols-2 xl:gap-x-8 xl:gap-y-8
 					type="checkbox"
 					class="checkbox"
 					name="tueren_undicht"
-					bind:checked={gebaeude_aufnahme_allgemein.tueren_undicht}
+					bind:checked={aufnahme.tueren_undicht}
 					value="TUD"
 				/>Türen teilweise undicht</label
 			>
@@ -174,7 +245,7 @@ xl:grid-cols-2 xl:gap-x-8 xl:gap-y-8
 					type="checkbox"
 					class="checkbox"
 					name="rolllaeden_kaesten_gedaemmt"
-					bind:checked={gebaeude_aufnahme_allgemein.rolllaeden_kaesten_gedaemmt}
+					bind:checked={aufnahme.rolllaeden_kaesten_gedaemmt}
 					value="RKD"
 				/>Rollladenkästen gedämmt, luftdicht</label
 			>
@@ -207,7 +278,7 @@ xl:grid-cols-2 xl:gap-x-8 xl:gap-y-8
 					type="checkbox"
 					class="checkbox"
 					name="aussenwand_gedaemmt"
-					bind:checked={gebaeude_aufnahme_allgemein.aussenwand_gedaemmt}
+					bind:checked={aufnahme.aussenwand_gedaemmt}
 					value="AWD"
 				/>Außenwand gedämmt</label
 			>
@@ -218,7 +289,7 @@ xl:grid-cols-2 xl:gap-x-8 xl:gap-y-8
 					type="checkbox"
 					class="checkbox"
 					name="keller_wand_gedaemmt"
-					bind:checked={gebaeude_aufnahme_allgemein.keller_wand_gedaemmt}
+					bind:checked={aufnahme.keller_wand_gedaemmt}
 					value="KWD"
 				/>Kelleraußenwand gedämmt</label
 			>
@@ -229,7 +300,7 @@ xl:grid-cols-2 xl:gap-x-8 xl:gap-y-8
 					type="checkbox"
 					class="checkbox"
 					name="keller_decke_gedaemmt"
-					bind:checked={gebaeude_aufnahme_allgemein.keller_decke_gedaemmt}
+					bind:checked={aufnahme.keller_decke_gedaemmt}
 					value="KDD"
 				/>Kellerdecke gedämmt</label
 			>
@@ -240,7 +311,7 @@ xl:grid-cols-2 xl:gap-x-8 xl:gap-y-8
 					type="checkbox"
 					class="checkbox"
 					name="dachgeschoss_gedaemmt"
-					bind:checked={gebaeude_aufnahme_allgemein.dachgeschoss_gedaemmt}
+					bind:checked={aufnahme.dachgeschoss_gedaemmt}
 					value="DGD"
 				/>Dachgeschoss gedämmt</label
 			>
@@ -251,7 +322,7 @@ xl:grid-cols-2 xl:gap-x-8 xl:gap-y-8
 					type="checkbox"
 					class="checkbox"
 					name="oberste_geschossdecke_gedaemmt"
-					bind:checked={gebaeude_aufnahme_allgemein.oberste_geschossdecke_gedaemmt}
+					bind:checked={aufnahme.oberste_geschossdecke_gedaemmt}
 					value="OGDDW"
 				/>Oberste Geschossdecke gedämmt</label
 			>
@@ -262,7 +333,7 @@ xl:grid-cols-2 xl:gap-x-8 xl:gap-y-8
 					type="checkbox"
 					class="checkbox"
 					name="oberste_geschossdecke_min_12cm_gedaemmt"
-					bind:checked={gebaeude_aufnahme_allgemein.oberste_geschossdecke_min_12cm_gedaemmt}
+					bind:checked={aufnahme.oberste_geschossdecke_min_12cm_gedaemmt}
 					value="OGDD"
 				/>Oberste Geschossdecke min. 12cm gedämmt</label
 			>

src/components/Ausweis/ButtonWeiterHilfe.svelte

@@ -1,20 +1,26 @@
 <script lang="ts">
 	import AusweisWeiter from "#modules/VerbrauchsausweisWohnen/AusweisWeiter.svelte";
 	import Hilfe from "#components/Ausweis/Hilfe.svelte";
+	import {
+		AufnahmeClient,
+		BenutzerClient,
+		ObjektClient,
+		UploadedGebaeudeBild,
+		VerbrauchsausweisWohnenClient,
+	} from "./types.js";
 
-	export let ausweis;
-	export let images;
-	export let user;
-	export let gebaeude;
-	export let gebaeude_aufnahme_allgemein;
+	export let ausweis: VerbrauchsausweisWohnenClient;
+	export let bilder: UploadedGebaeudeBild[];
+	export let user: BenutzerClient;
+	export let objekt: ObjektClient;
+	export let aufnahme: AufnahmeClient;
 
 	export let spaeterWeitermachen;
-
 </script>
 
-
-<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
+	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 />
@@ -26,12 +32,10 @@
 	<div class="">
 		<AusweisWeiter
 			bind:ausweis
-				bind:images
+			bind:bilder
 			bind:user
-				bind:gebaeude
-				bind:gebaeude_aufnahme_allgemein
+			bind:objekt
+			bind:aufnahme
 		></AusweisWeiter>
 	</div>
-
-		
-	</div>
+</div>

src/components/Ausweis/ButtonZurueckSpeichernKaufabschluss.svelte

@@ -1,28 +1,14 @@
 <script lang="ts">
-    import AusweisWeiter from "#modules/VerbrauchsausweisWohnen/AusweisWeiter.svelte";
-	import Hilfe from "#components/Ausweis/Hilfe.svelte";
-    
-	export let ausweis;
-	export let images;
-	export let user;
-	export let gebaeude;
-	export let gebaeude_aufnahme_allgemein;
-
-	export let spaeterWeitermachen;
-
 </script>
 
-
-<div class="w-full grid grid-cols-[min-content_1fr_min-content_min-content] grid-rows-[min_content_1fr] gap-x-2 self-start justify-self-end mt-8">
-	
+<div
+	class="w-full grid grid-cols-[min-content_1fr_min-content_min-content] grid-rows-[min_content_1fr] gap-x-2 self-start justify-self-end mt-8"
+>
 	<button class="button justify-self-start">Zurück</button>
 
 	<div></div>
 
 	<button class="button">Speichern</button>
 
-	<button class="button">kostenpflichtig bestellen</button
-		>
-
-		
-	</div>
+	<button class="button">kostenpflichtig bestellen</button>
+</div>

src/components/Ausweis/DaemmungImage.svelte

@@ -1,11 +1,11 @@
 <script lang="ts">
 	import ImageGrid from "../ImageGrid.svelte";;
 	import { Enums, type BedarfsausweisWohnen, type VerbrauchsausweisGewerbe } from "@ibcornelsen/database/client";
-	import { GebaeudeClient, UploadedGebaeudeBild, VerbrauchsausweisWohnenClient } from "./types.js";
+	import { ObjektClient, UploadedGebaeudeBild, VerbrauchsausweisWohnenClient } from "./types.js";
 
 	export let images: UploadedGebaeudeBild[] = [];
 	export let ausweis: VerbrauchsausweisWohnenClient | VerbrauchsausweisGewerbe | BedarfsausweisWohnen;
-	export let gebaeude: GebaeudeClient;
+	export let gebaeude: ObjektClient;
 </script>
 
 <div class="grid grid-cols-2 gap-x-6 mt-6">

src/components/Ausweis/FensterImage.svelte

@@ -1,11 +1,11 @@
 <script lang="ts">
 	import ImageGrid from "../ImageGrid.svelte";;
 	import { Enums, type BedarfsausweisWohnen, type VerbrauchsausweisGewerbe } from "@ibcornelsen/database/client";
-	import { GebaeudeClient, UploadedGebaeudeBild, VerbrauchsausweisWohnenClient } from "./types.js";
+	import { ObjektClient, UploadedGebaeudeBild, VerbrauchsausweisWohnenClient } from "./types.js";
 
 	export let images: UploadedGebaeudeBild[] = [];
 	export let ausweis: VerbrauchsausweisWohnenClient | VerbrauchsausweisGewerbe | BedarfsausweisWohnen;
-	export let gebaeude: GebaeudeClient;
+	export let gebaeude: ObjektClient;
 </script>
 
 <div class="grid grid-cols-2 gap-x-6 mt-6">

src/components/Ausweis/GebaeudeDaten.svelte

@@ -1,12 +1,14 @@
 <script lang="ts">
 
-	import HelpLabel from "#labels/HelpLabel.svelte";
-	import Inputlabel from "#labels/InputLabel.svelte";
+	import HelpLabel from "#components/labels/HelpLabel.svelte";
+	import Inputlabel from "#components/labels/InputLabel.svelte";
 
     import ZipSearch from "#components/PlzSuche.svelte";
     import { Enums } from "@ibcornelsen/database/client"
+	import { AufnahmeClient, ObjektClient } from "./types.js";
 
-    export let gebaeude_aufnahme_allgemein: GebaeudeAufnahmeClient;
+    export let aufnahme: AufnahmeClient;
+		export let objekt: ObjektClient;
 
 </script>
 
@@ -29,7 +31,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
         required
         data-msg-minlength="min. 5 Zeichen"
         data-msg-maxlength="max. 40 Zeichen"
-        bind:value={gebaeude_aufnahme_allgemein.adresse}
+        bind:value={objekt.adresse}
     />
 
 		<div class="help-label">
@@ -47,8 +49,8 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 	<Inputlabel title="PLZ *"></Inputlabel>
 	
 	<ZipSearch
-		bind:zip={gebaeude_aufnahme_allgemein.plz}
-		bind:city={gebaeude_aufnahme_allgemein.ort}
+		bind:zip={objekt.plz}
+		bind:city={objekt.ort}
 		name="plz"
 	/>
 
@@ -61,7 +63,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 		name="ort"
 		data-test="ort"
 		readonly={true}
-		bind:value={gebaeude_aufnahme_allgemein.ort}
+		bind:value={objekt.ort}
 		type="text"
 		/>
 
@@ -91,7 +93,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 		autocomplete="off"
 		data-rule-minlength="2"
 		data-msg-minlength="min. 2 Zeichen"
-		bind:value={gebaeude_aufnahme_allgemein.flaeche}
+		bind:value={aufnahme.flaeche}
 	/>
 
 		<div class="help-label">
@@ -112,7 +114,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
     <select
 		name="dachgeschoss"
 		data-test="dachgeschoss"
-		bind:value={gebaeude_aufnahme_allgemein.dachgeschoss}
+		bind:value={aufnahme.dachgeschoss}
 		required
 	>
 			<option disabled selected value={false}>Bitte auswählen</option>
@@ -138,7 +140,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 		name="keller"
 		data-test="keller"
 		required
-		bind:value={gebaeude_aufnahme_allgemein.keller}
+		bind:value={aufnahme.keller}
 	>
 			<option disabled selected value={false}>Bitte auswählen</option>
 			<option value={Enums.Heizungsstatus.NICHT_VORHANDEN}>nicht vorhanden</option>
@@ -170,7 +172,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 		autocomplete="off"
 		data-rule-minlength="2"
 		data-msg-minlength="min. 2 Zeichen"
-		bind:value={gebaeude_aufnahme_allgemein.nutzflaeche}
+		bind:value={aufnahme.nutzflaeche}
 	/>
 
 		<div class="help-label">

src/components/Ausweis/HeizungImage.svelte

@@ -1,11 +1,11 @@
 <script lang="ts">
 	import ImageGrid from "../ImageGrid.svelte";;
 	import { Enums, type BedarfsausweisWohnen, type VerbrauchsausweisGewerbe } from "@ibcornelsen/database/client";
-	import { GebaeudeClient, UploadedGebaeudeBild, VerbrauchsausweisWohnenClient } from "./types.js";
+	import { ObjektClient, UploadedGebaeudeBild, VerbrauchsausweisWohnenClient } from "./types.js";
 
 	export let images: UploadedGebaeudeBild[] = [];
 	export let ausweis: VerbrauchsausweisWohnenClient | VerbrauchsausweisGewerbe | BedarfsausweisWohnen;
-	export let gebaeude: GebaeudeClient;
+	export let gebaeude: ObjektClient;
 </script>
 
 <div class="grid grid-cols-2 gap-x-6 mt-6">

src/components/Ausweis/LueftungundLeerstand.svelte

@@ -1,9 +1,10 @@
 <script lang="ts">
 
-	import HelpLabel from "#labels/HelpLabel.svelte";
-	import Inputlabel from "#labels/InputLabel.svelte";
+	import HelpLabel from "#components/labels/HelpLabel.svelte";
+	import Inputlabel from "#components/labels/InputLabel.svelte";
+	import { AufnahmeClient } from "./types.js";
 
-    export let gebaeude_aufnahme_allgemein: GebaeudeAufnahmeClient;
+    export let aufnahme: AufnahmeClient;
 
 </script>
 
@@ -25,7 +26,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
         <select
         name="gebaeudeteil"
         data-test="gebaeudeteil"
-        bind:value={gebaeude_aufnahme_allgemein.gebaeudeteil}
+        bind:value={aufnahme.gebaeudeteil}
         required
         >
         <option disabled selected value={false}>Bitte auswählen</option>
@@ -53,7 +54,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
     data-test="leerstand"
     maxlength="2"
     type="number"
-    bind:value={gebaeude_aufnahme_allgemein.leerstand}
+    bind:value={aufnahme.leerstand}
 />
 
 		<div class="help-label">
@@ -76,15 +77,15 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
     name="lueftung"
     data-test="lueftung"
     required
-    bind:value={gebaeude_aufnahme_allgemein.lueftung}
+    bind:value={aufnahme.lueftung}
     >
     <option disabled selected value={false}>Bitte auswählen</option>
-    <option value="Fensterlüftung">Fensterlüftung</option>
-    <option value="Schachtlüftung">Schachtlüftung</option>
-    <option value="Lüftungsanlage ohne Wärmerückgewinnung"
+    <option value="Fensterlueftung">Fensterlüftung</option>
+    <option value="Schachtlueftung">Schachtlüftung</option>
+    <option value="LueftungsanlageOhneWaermerueckgewinnung"
         >Lüftungsanlage ohne Wärmerückgewinnung</option
     >
-    <option value="Lüftungsanlage mit Wärmerückgewinnung"
+    <option value="LueftungsanlageMitWaermerueckgewinnung"
         >Lüftungsanlage mit Wärmerückgewinnung</option
     >
 </select>
@@ -109,7 +110,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
     name="kuehlung"
     data-test="kuehlung"
     required
-    bind:value={gebaeude_aufnahme_allgemein.kuehlung}
+    bind:value={aufnahme.kuehlung}
     >
     <option disabled selected value={false}>Bitte auswählen</option>
     <option value="1">vorhanden</option>

src/components/Ausweis/PerformanceScore.svelte

@@ -1,18 +1,18 @@
 <script lang="ts">
-	import { endEnergieVerbrauchVerbrauchsausweis_2016 } from "#lib/Berechnungen/VerbrauchsausweisWohnen/VerbrauchsausweisWohnen_2016";
+	import { endEnergieVerbrauchVerbrauchsausweis_2016 } from "#lib/Berechnungen/VerbrauchsausweisWohnen/VerbrauchsausweisWohnen_2016.js";
 	import ThickArrowDown from "radix-svelte-icons/src/lib/icons/ThickArrowDown.svelte";
 	import {
 		BedarfsausweisWohnenClient,
-		GebaeudeAufnahmeClient,
-		GebaeudeClient,
+		AufnahmeClient,
+		ObjektClient,
 		VerbrauchsausweisGewerbeClient,
 		VerbrauchsausweisWohnenClient,
-	} from "./types";
+	} from "./types.js";
 	import ThickArrowUp from "radix-svelte-icons/src/lib/icons/ThickArrowUp.svelte";
 
 	export let ausweis: VerbrauchsausweisWohnenClient;
-	export let gebaeude_aufnahme_allgemein: GebaeudeAufnahmeClient;
-	export let gebaeude: GebaeudeClient;
+	export let aufnahme: AufnahmeClient;
+	export let objekt: ObjektClient;
 
 	let maxPerformance = 250;
 
@@ -56,14 +56,12 @@
 		(async () => {
 			const result = await endEnergieVerbrauchVerbrauchsausweis_2016({
 				...ausweis,
-				gebaeude_aufnahme_allgemein: {
-					...gebaeude_aufnahme_allgemein,
-					gebaeude_stammdaten: gebaeude,
+				aufnahme: {
+					...aufnahme,
+					objekt: objekt,
 				},
 			});
 
-			console.log(result, ausweis);
-
 			if (!result) {
 				return;
 			}

src/components/Ausweis/Pruefung.svelte

@@ -1,27 +1,34 @@
 <script lang="ts">
 	export let bereich: string;
 	export let title: string;
-	export let bullets: string;
+	export let bullets: [string, boolean][];
 </script>
 
 <div class="">
 	<strong>{bereich} - {title}</strong>
 	<div class="mt-4 mb-6">
-       
 		{#each bullets as [bullet, check]}
-			<div class="bullets grid grid-cols-[1fr_40px] items-center border-b-[1px] border-b-black/10">
+			<div
+				class="bullets grid grid-cols-[1fr_40px] items-center border-b-[1px] border-b-black/10"
+			>
 				<span>{@html bullet}</span>
-				<div class="justify-self-end" class:check={check} class:check-no={!check}>{check ? "✔" : "✘"}</div>
+				<div
+					class="justify-self-end"
+					class:check
+					class:check-no={!check}
+				>
+					{check ? "✔" : "✘"}
+				</div>
 			</div>
 		{/each}
-
 	</div>
 </div>
 
-
 <style lang="postcss">
-
-.check{@apply self-center font-bold text-green-700}
-.check-no{@apply self-center font-bold text-red-700}
-
+	.check {
+		@apply self-center font-bold text-green-700;
+	}
+	.check-no {
+		@apply self-center font-bold text-red-700;
+	}
 </style>

src/components/Ausweis/Rechnungsadresse.svelte

@@ -1,14 +1,13 @@
 <script lang="ts">
 
-	import HelpLabel from "#labels/HelpLabel.svelte";
-	import Inputlabel from "#labels/InputLabel.svelte";
+	import HelpLabel from "#components/labels/HelpLabel.svelte";
+	import Inputlabel from "#components/labels/InputLabel.svelte";
     import ZipSearch from "#components/PlzSuche.svelte";
+	import { BenutzerClient, RechnungClient } from "./types.js";
 
 	export let user: BenutzerClient;
 
-	let rechnung: inferProcedureInput<
-		AppRouter["v1"]["rechnungen"]["erstellen"]
-	> = {
+	let rechnung: RechnungClient = {
 		email: user.email,
 		empfaenger: user.vorname + " " + user.name,
 		strasse: user.adresse,

src/components/Ausweis/SanierungsOption.svelte

@@ -1,34 +1,27 @@
 <script lang="ts">
-	import HelpLabel from "#labels/HelpLabel.svelte";
+	import HelpLabel from "#components/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;
 
-function clickCheckbox(e){
-e.target.firstChild.click();
-};
-
-
 </script>
 
-<div
-	class="input-standard"
->
+<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 cursor-pointer"
-		on:click={() => clickCheckbox(event)} on:keydown={() => clickCheckbox(event)}
 	>
-
 		<input
 			id={name}
 			type="checkbox"
 			class="checkbox"
 			{name}
-			bind:checked={checked}
-			value={value}
+			bind:checked
+			{value}
+			data-cy={name}
 		/>
 
 		<label class="w-full cursor-pointer" for={name}>{label}</label>

src/components/Ausweis/SanierungszustandFensterTueren.svelte

@@ -1,22 +1,22 @@
 <script lang="ts">
-        import HelpLabel from "#labels/HelpLabel.svelte";
-        import Inputlabel from "#labels/InputLabel.svelte";
+        import HelpLabel from "#components/labels/HelpLabel.svelte";
+        import Inputlabel from "#components/labels/InputLabel.svelte";
     
         import FensterImage from "./FensterImage.svelte";
     
         //import Label from "../Label.svelte";
     
         import {
-        GebaeudeAufnahmeClient,
-            GebaeudeClient,
+        AufnahmeClient,
+            ObjektClient,
             UploadedGebaeudeBild,
             VerbrauchsausweisWohnenClient,
         } 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 gebaeude: ObjektClient;
+        export let aufnahme: AufnahmeClient;
         export let ausweis: VerbrauchsausweisWohnenClient
         export let images: UploadedGebaeudeBild[];
     
@@ -32,15 +32,15 @@
     xl:grid-cols-2 xl:gap-x-8 xl:gap-y-8
     2xl:grid-cols-3 2xl:gap-x-8 2xl:gap-y-2
     ">
-    
-    <SanierungsOption label="Einfachglas" name="einfach_verglasung" help="" value="EG" bind:checked={gebaeude_aufnahme_allgemein.einfach_verglasung}></SanierungsOption>
-    <SanierungsOption label="Doppelverglasung" name="doppel_verglasung" help="" value="DF" bind:checked={gebaeude_aufnahme_allgemein.doppel_verglasung}></SanierungsOption>
-    <SanierungsOption label="Dreifachverglasung" name="dreifach_verglasung" help="" value="PHF" bind:checked={gebaeude_aufnahme_allgemein.dreifach_verglasung}></SanierungsOption>
-    <SanierungsOption label="Isolierverglasung" name="isolier_verglasung" help="" value="IVG" bind:checked={gebaeude_aufnahme_allgemein.isolier_verglasung}></SanierungsOption>
-    <SanierungsOption label="Alle Fenster dicht" name="fenster_dicht" help="" value="FD" bind:checked={gebaeude_aufnahme_allgemein.fenster_dicht}></SanierungsOption>
-    <SanierungsOption label="Fenster teilweise undicht" name="fenster_teilweise_undicht" help="" value="FTUD" bind:checked={gebaeude_aufnahme_allgemein.fenster_teilweise_undicht}></SanierungsOption>
-    <SanierungsOption label="Rollladenkästen gedämmt, luftdicht" name="rolllaeden_kaesten_gedaemmt" help="" value="TUD" bind:checked={gebaeude_aufnahme_allgemein.rolllaeden_kaesten_gedaemmt}></SanierungsOption>
-    <SanierungsOption label="Alle Türen dicht" name="tueren_dicht" help="" value="TD" bind:checked={gebaeude_aufnahme_allgemein.tueren_dicht}></SanierungsOption>
+    
+    <SanierungsOption label="Einfachglas" name="einfach_verglasung" help="" value="EG" bind:checked={aufnahme.einfach_verglasung}></SanierungsOption>
+    <SanierungsOption label="Doppelverglasung" name="doppel_verglasung" help="" value="DF" bind:checked={aufnahme.doppel_verglasung}></SanierungsOption>
+    <SanierungsOption label="Dreifachverglasung" name="dreifach_verglasung" help="" value="PHF" bind:checked={aufnahme.dreifach_verglasung}></SanierungsOption>
+    <SanierungsOption label="Isolierverglasung" name="isolier_verglasung" help="" value="IVG" bind:checked={aufnahme.isolier_verglasung}></SanierungsOption>
+    <SanierungsOption label="Alle Fenster dicht" name="fenster_dicht" help="" value="FD" bind:checked={aufnahme.fenster_dicht}></SanierungsOption>
+    <SanierungsOption label="Fenster teilweise undicht" name="fenster_teilweise_undicht" help="" value="FTUD" bind:checked={aufnahme.fenster_teilweise_undicht}></SanierungsOption>
+    <SanierungsOption label="Rollladenkästen gedämmt, luftdicht" name="rolllaeden_kaesten_gedaemmt" help="" value="TUD" bind:checked={aufnahme.rolllaeden_kaesten_gedaemmt}></SanierungsOption>
+    <SanierungsOption label="Alle Türen dicht" name="tueren_dicht" help="" value="TD" bind:checked={aufnahme.tueren_dicht}></SanierungsOption>
     <SanierungsOption label="Türen teilweise undicht" name="tueren_undicht" help="" value="TUD" bind:checked={aufnahme.tueren_undicht}></SanierungsOption>
     
     </div>
@@ -84,7 +84,7 @@
                     ><input
                         type="checkbox"
                         class="checkbox"
-                        name="aussenwand_gedaemmt"
+                        name="aussenwand_gedaemmt"
                         bind:checked={aufnahme.aussenwand_gedaemmt}
                         value="AWD"
                     />Außenwand gedämmt</label
@@ -95,7 +95,7 @@
                     ><input
                         type="checkbox"
                         class="checkbox"
-                        name="keller_wand_gedaemmt"
+                        name="keller_wand_gedaemmt"
                         bind:checked={aufnahme.keller_wand_gedaemmt}
                         value="KWD"
                     />Kelleraußenwand gedämmt</label
@@ -106,7 +106,7 @@
                     ><input
                         type="checkbox"
                         class="checkbox"
-                        name="keller_decke_gedaemmt"
+                        name="keller_decke_gedaemmt"
                         bind:checked={aufnahme.keller_decke_gedaemmt}
                         value="KDD"
                     />Kellerdecke gedämmt</label
@@ -117,7 +117,7 @@
                     ><input
                         type="checkbox"
                         class="checkbox"
-                        name="dachgeschoss_gedaemmt"
+                        name="dachgeschoss_gedaemmt"
                         bind:checked={aufnahme.dachgeschoss_gedaemmt}
                         value="DGD"
                     />Dachgeschoss gedämmt</label
@@ -128,7 +128,7 @@
                     ><input
                         type="checkbox"
                         class="checkbox"
-                        name="oberste_geschossdecke_gedaemmt"
+                        name="oberste_geschossdecke_gedaemmt"
                         bind:checked={aufnahme.oberste_geschossdecke_gedaemmt}
                         value="OGDDW"
                     />Oberste Geschossdecke gedämmt</label
@@ -139,7 +139,7 @@
                     ><input
                         type="checkbox"
                         class="checkbox"
-                        name="oberste_geschossdecke_min_12cm_gedaemmt"
+                        name="oberste_geschossdecke_min_12cm_gedaemmt"
                         bind:checked={aufnahme.oberste_geschossdecke_min_12cm_gedaemmt}
                         value="OGDD"
                     />Oberste Geschossdecke min. 12cm gedämmt</label

src/components/Ausweis/SanierungszustandHeizungsanlage.svelte

@@ -1,29 +1,29 @@
 <script lang="ts">
-        import HelpLabel from "#labels/HelpLabel.svelte";
-        import Inputlabel from "#labels/InputLabel.svelte";
+	import HelpLabel from "#components/labels/HelpLabel.svelte";
+	import Inputlabel from "#components/labels/InputLabel.svelte";
 
 	import HeizungImage from "./HeizungImage.svelte";
 
-    
 	//import Label from "../Label.svelte";
 
 	import {
-        GebaeudeAufnahmeClient,
-            GebaeudeClient,
+		AufnahmeClient,
+		ObjektClient,
 		UploadedGebaeudeBild,
 		VerbrauchsausweisWohnenClient,
 	} from "./types.js";
 	import { boolean } from "astro:schema";
-        import SanierungsOption from "#components/Ausweis/SanierungsOption.svelte"
+	import SanierungsOption from "#components/Ausweis/SanierungsOption.svelte";
 
-        export let gebaeude: GebaeudeClient;
-        export let gebaeude_aufnahme_allgemein: GebaeudeAufnahmeClient;
-        export let ausweis: VerbrauchsausweisWohnenClient
+	export let gebaeude: ObjektClient;
+	export let aufnahme: AufnahmeClient;
+	export let ausweis: VerbrauchsausweisWohnenClient;
 	export let images: UploadedGebaeudeBild[];
+</script>
 
-    
-</script>
-    
+<div
+	id="sanierungszustand"
+	class="bereich-box grid
     grid-cols-1 gap-x-4 gap-y-2
     
     sm:grid-cols-2 sm:gap-x-6 sm:gap-y-8
@@ -31,29 +31,97 @@
     
     xl:grid-cols-2 xl:gap-x-8 xl:gap-y-8
     2xl:grid-cols-3 2xl:gap-x-8 2xl:gap-y-2
-    2xl:grid-cols-3 2xl:gap-x-8 2xl:gap-y-2
+    "
+>
+	<SanierungsOption
+		label="Zentral/Etage"
+		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"
+		bind:checked={aufnahme.zentralheizung}
+	></SanierungsOption>
+	<SanierungsOption
+		label="Einzelofen"
+		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"
+		bind:checked={aufnahme.einzelofen}
+	></SanierungsOption>
+	<SanierungsOption
+		label="Durchlauferhitzer (elektrisch)"
+		name="durchlauf_erhitzer"
+		help="Wenn <strong>dezentrale</strong> elektrische <strong>Warmwassererzeugung</strong> vorhanden ist"
+		value="DH"
+		bind:checked={aufnahme.durchlauf_erhitzer}
+	></SanierungsOption>
+	<SanierungsOption
+		label="Standardkessel"
+		name="standard_kessel"
+		help="Gemeint sind Konstanttemperaturkessel und ältere Gebläse- oder Feststoffkessel"
+		value="SK"
+		bind:checked={aufnahme.standard_kessel}
+	></SanierungsOption>
+	<SanierungsOption
+		label="Solarsystem für Warmwasser"
+		name="solarsystem_warmwasser"
+		help="Solarpanele auf dem Dach zur <strong>alternativen Warmwassererzeugung</strong> aus Sonnenenergie. Nicht zu verwechseln mit Photovoltaik."
+		value="SSWW"
+		bind:checked={aufnahme.solarsystem_warmwasser}
+	></SanierungsOption>
+	<SanierungsOption
+		label="Wärmepumpe"
+		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"
+		bind:checked={aufnahme.waermepumpe}
+	></SanierungsOption>
+	<SanierungsOption
+		label="Niedertemperaturkessel"
+		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"
+		bind:checked={aufnahme.niedertemperatur_kessel}
+	></SanierungsOption>
+	<SanierungsOption
+		label="Brennwertkessel"
+		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"
+		bind:checked={aufnahme.brennwert_kessel}
+	></SanierungsOption>
+	<SanierungsOption
+		label="Warmwasserrohre gedämmt"
+		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"
+		bind:checked={aufnahme.warmwasser_rohre_gedaemmt}
+	></SanierungsOption>
+	<SanierungsOption
+		label="Heizungsrohre gedämmt"
+		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.ext"
+		value="HRGD"
+		bind:checked={aufnahme.heizungsrohre_gedaemmt}
+	></SanierungsOption>
+	<SanierungsOption
+		label="Zirkulation"
+		name="zirkulation"
+		help="Kreislauf von Heizungs- oder Warmwasser <strong>innerhalb eines Leitungssystems</strong>, um eine gleichmäßige Wärmeverteilung sicherzustellen."
+		value="ZK"
+		bind:checked={aufnahme.zirkulation}
+	></SanierungsOption>
+	<SanierungsOption
+		label="Photovoltaik auf dem Dach"
+		name="photovoltaik"
+		help="Direkte Umwandlung von Sonnenlicht in <strong>elektrische Energie</strong> mittels Solarzellen, die den photoelektrischen Effekt nutzen."
+		value="PV"
+		bind:checked={aufnahme.photovoltaik}
+	></SanierungsOption>
+</div>
 
-    
-    <SanierungsOption label="Zentral/Etage" 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" bind:checked={gebaeude_aufnahme_allgemein.zentralheizung}></SanierungsOption>
-    <SanierungsOption label="Einzelofen" 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" bind:checked={gebaeude_aufnahme_allgemein.einzelofen}></SanierungsOption>
-    <SanierungsOption label="Durchlauferhitzer (elektrisch)" name="durchlauf_erhitzer" help="Wenn <strong>dezentrale</strong> elektrische <strong>Warmwassererzeugung</strong> vorhanden ist" value="DH" bind:checked={gebaeude_aufnahme_allgemein.durchlauf_erhitzer}></SanierungsOption>
-    <SanierungsOption label="Standardkessel" name="standard_kessel" help="Gemeint sind Konstanttemperaturkessel und ältere Gebläse- oder Feststoffkessel" value="SK" bind:checked={gebaeude_aufnahme_allgemein.standard_kessel}></SanierungsOption>
-    <SanierungsOption label="Solarsystem für Warmwasser" name="solarsystem_warmwasser" help="Solarpanele auf dem Dach zur <strong>alternativen Warmwassererzeugung</strong> aus Sonnenenergie. Nicht zu verwechseln mit Photovoltaik." value="SSWW" bind:checked={gebaeude_aufnahme_allgemein.solarsystem_warmwasser}></SanierungsOption>
-    <SanierungsOption label="Wärmepumpe" 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" bind:checked={gebaeude_aufnahme_allgemein.waermepumpe}></SanierungsOption>
-    <SanierungsOption label="Niedertemperaturkessel" 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" bind:checked={gebaeude_aufnahme_allgemein.niedertemperatur_kessel}></SanierungsOption>
-    <SanierungsOption label="Brennwertkessel" 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" bind:checked={gebaeude_aufnahme_allgemein.brennwert_kessel}></SanierungsOption>
-    <SanierungsOption label="Warmwasserrohre gedämmt" 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" bind:checked={gebaeude_aufnahme_allgemein.warmwasser_rohre_gedaemmt}></SanierungsOption>
-    <SanierungsOption label="Heizungsrohre gedämmt" 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.ext" value="HRGD" bind:checked={gebaeude_aufnahme_allgemein.heizungsrohre_gedaemmt}></SanierungsOption>
-    <SanierungsOption label="Zirkulation" name="zirkulation" help="Kreislauf von Heizungs- oder Warmwasser <strong>innerhalb eines Leitungssystems</strong>, um eine gleichmäßige Wärmeverteilung sicherzustellen." value="ZK" bind:checked={gebaeude_aufnahme_allgemein.zirkulation}></SanierungsOption>
-    <SanierungsOption label="Photovoltaik auf dem Dach" name="photovoltaik" help="Direkte Umwandlung von Sonnenlicht in <strong>elektrische Energie</strong> mittels Solarzellen, die den photoelektrischen Effekt nutzen." value="PV" bind:checked={gebaeude_aufnahme_allgemein.photovotaik}></SanierungsOption>
+<HeizungImage bind:images bind:ausweis bind:gebaeude />
 
-    
-    <HeizungImage bind:images bind:ausweis bind:gebaeude />
-    
-    <style lang="postcss">
-    
-    </style>
-    
+<!--
     
     <div class="GRB3">
         <div class="form-group col-md-12">
@@ -74,7 +142,7 @@
                         type="checkbox"
                         class="checkbox"
                         name="aussenwand_gedaemmt"
-                        name="aussenwand_gedaemmt"
+                        bind:checked={aufnahme.aussenwand_gedaemmt}
                         value="AWD"
                     />Außenwand gedämmt</label
                 >
@@ -85,7 +153,7 @@
                         type="checkbox"
                         class="checkbox"
                         name="keller_wand_gedaemmt"
-                        name="keller_wand_gedaemmt"
+                        bind:checked={aufnahme.keller_wand_gedaemmt}
                         value="KWD"
                     />Kelleraußenwand gedämmt</label
                 >
@@ -96,7 +164,7 @@
                         type="checkbox"
                         class="checkbox"
                         name="keller_decke_gedaemmt"
-                        name="keller_decke_gedaemmt"
+                        bind:checked={aufnahme.keller_decke_gedaemmt}
                         value="KDD"
                     />Kellerdecke gedämmt</label
                 >
@@ -107,7 +175,7 @@
                         type="checkbox"
                         class="checkbox"
                         name="dachgeschoss_gedaemmt"
-                        name="dachgeschoss_gedaemmt"
+                        bind:checked={aufnahme.dachgeschoss_gedaemmt}
                         value="DGD"
                     />Dachgeschoss gedämmt</label
                 >
@@ -118,7 +186,7 @@
                         type="checkbox"
                         class="checkbox"
                         name="oberste_geschossdecke_gedaemmt"
-                        name="oberste_geschossdecke_gedaemmt"
+                        bind:checked={aufnahme.oberste_geschossdecke_gedaemmt}
                         value="OGDDW"
                     />Oberste Geschossdecke gedämmt</label
                 >
@@ -129,7 +197,7 @@
                         type="checkbox"
                         class="checkbox"
                         name="oberste_geschossdecke_min_12cm_gedaemmt"
-                        name="oberste_geschossdecke_min_12cm_gedaemmt"
+                        bind:checked={aufnahme.oberste_geschossdecke_min_12cm_gedaemmt}
                         value="OGDD"
                     />Oberste Geschossdecke min. 12cm gedämmt</label
                 >
@@ -152,4 +220,5 @@
     
     -->
 
-    
+<style lang="postcss">
+</style>

src/components/Ausweis/SanierungszustandWaermedammung.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
-        import HelpLabel from "#labels/HelpLabel.svelte";
-        import Inputlabel from "#labels/InputLabel.svelte";
+        import HelpLabel from "#components/labels/HelpLabel.svelte";
+        import Inputlabel from "#components/labels/InputLabel.svelte";
         
         import DaemmungImage from "./DaemmungImage.svelte";
 
@@ -8,16 +8,16 @@
         //import Label from "../Label.svelte";
     
         import {
-        GebaeudeAufnahmeClient,
-            GebaeudeClient,
+        AufnahmeClient,
+            ObjektClient,
             UploadedGebaeudeBild,
             VerbrauchsausweisWohnenClient,
         } 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 gebaeude: ObjektClient;
+        export let aufnahme: AufnahmeClient;
         export let ausweis: VerbrauchsausweisWohnenClient
         export let images: UploadedGebaeudeBild[];
     
@@ -33,12 +33,12 @@
     xl:grid-cols-2 xl:gap-x-8 xl:gap-y-8
     2xl:grid-cols-3 2xl:gap-x-8 2xl:gap-y-2
     ">
-    
-    <SanierungsOption label="Außenwand gedämmt" name="aussenwand_gedaemmt" help="" value="AWD" bind:checked={gebaeude_aufnahme_allgemein.aussenwand_gedaemmt}></SanierungsOption>
-    <SanierungsOption label="Kelleraußenwand gedämmt" name="keller_wand_gedaemmt" help="" value="KWD" bind:checked={gebaeude_aufnahme_allgemein.keller_wand_gedaemmt}></SanierungsOption>
-    <SanierungsOption label="Kellerdecke gedämmt" name="keller_decke_gedaemmt" help="" value="KDD" bind:checked={gebaeude_aufnahme_allgemein.keller_decke_gedaemmt}></SanierungsOption>
-    <SanierungsOption label="Dachgeschoss gedämmt" name="dachgeschoss_gedaemmt" help="" value="DGD" bind:checked={gebaeude_aufnahme_allgemein.dachgeschoss_gedaemmt}></SanierungsOption>
-    <SanierungsOption label="Oberste Geschossdecke gedämmt" name="oberste_geschossdecke_gedaemmt" help="" value="DGD" bind:checked={gebaeude_aufnahme_allgemein.oberste_geschossdecke_gedaemmt}></SanierungsOption>
+    
+    <SanierungsOption label="Außenwand gedämmt" name="aussenwand_gedaemmt" help="" value="AWD" bind:checked={aufnahme.aussenwand_gedaemmt}></SanierungsOption>
+    <SanierungsOption label="Kelleraußenwand gedämmt" name="keller_wand_gedaemmt" help="" value="KWD" bind:checked={aufnahme.keller_wand_gedaemmt}></SanierungsOption>
+    <SanierungsOption label="Kellerdecke gedämmt" name="keller_decke_gedaemmt" help="" value="KDD" bind:checked={aufnahme.keller_decke_gedaemmt}></SanierungsOption>
+    <SanierungsOption label="Dachgeschoss gedämmt" name="dachgeschoss_gedaemmt" help="" value="DGD" bind:checked={aufnahme.dachgeschoss_gedaemmt}></SanierungsOption>
+    <SanierungsOption label="Oberste Geschossdecke gedämmt" name="oberste_geschossdecke_gedaemmt" help="" value="DGD" bind:checked={aufnahme.oberste_geschossdecke_gedaemmt}></SanierungsOption>
     <SanierungsOption label="Oberste Geschossdecke min. 12cm gedämmt" name="oberste_geschossdecke_min_12cm_gedaemmt" help="" value="DGD" bind:checked={aufnahme.oberste_geschossdecke_min_12cm_gedaemmt}></SanierungsOption>
    
     </div>

src/components/Ausweis/StromVerbrauch.svelte

@@ -1,10 +1,10 @@
 <script lang="ts">
-	import HelpLabel from "#labels/HelpLabel.svelte";
-	import Inputlabel from "#labels/InputLabel.svelte";
-	import Verbrauchslabel from "#labels/VerbrauchsLabel.svelte";
-	import StromVerbrauchslabel from "#labels/StromVerbrauchslabel.svelte";
-	import VerbrauchsHelpLabel from "#labels/VerbrauchsHelpLabel.svelte";
-	import StromVerbrauchsHelpLabel from "#labels/StromVerbrauchsHelpLabel.svelte";
+	import HelpLabel from "#components/labels/HelpLabel.svelte";
+	import Inputlabel from "#components/labels/InputLabel.svelte";
+	import Verbrauchslabel from "#components/labels/VerbrauchsLabel.svelte";
+	import StromVerbrauchslabel from "#components/labels/StromVerbrauchslabel.svelte";
+	import VerbrauchsHelpLabel from "#components/labels/VerbrauchsHelpLabel.svelte";
+	import StromVerbrauchsHelpLabel from "#components/labels/StromVerbrauchsHelpLabel.svelte";
 	import SanierungsOption from "#components/Ausweis/SanierungsOption.svelte"
 	
 
@@ -14,14 +14,14 @@
 	import fuelList from "./brennstoffListe.js";
 	import { auditVerbrauchAbweichung } from "../Verbrauchsausweis/audits/VerbrauchAbweichung.js";
 	import {
-		GebaeudeAufnahmeClient,
-		GebaeudeClient,
+		AufnahmeClient,
+		ObjektClient,
 		VerbrauchsausweisWohnenClient,
 	} from "./types.js";
 	import { addNotification } from "#components/Notifications/shared.js";
 
-	export let gebaeude: GebaeudeClient;
-	export let gebaeude_aufnahme_allgemein: GebaeudeAufnahmeClient;
+	export let gebaeude: ObjektClient;
+	export let aufnahme: AufnahmeClient;
 	export let ausweis: VerbrauchsausweisWohnenClient;
 
 	// Wir dürfen bis zu 4.5 Jahre alte Klimafaktoren benutzen, also nehmen wir alle Monate seitdem und generieren daraus die Auswahl.
@@ -48,12 +48,12 @@
 	];
 
 	const startDate = moment(
-		ausweis.gebaeude_aufnahme_allgemein.erstellungsdatum || Date.now()
+		ausweis.aufnahme.erstellungsdatum || Date.now()
 	)
 		.subtract(4, "years")
 		.subtract(6, "months");
 	const endDate = moment(
-		ausweis.gebaeude_aufnahme_allgemein.erstellungsdatum || Date.now()
+		ausweis.aufnahme.erstellungsdatum || Date.now()
 	).subtract(3, "years");
 
 	for (let m = moment(startDate); m.isBefore(endDate); m.add(1, "month")) {
@@ -236,7 +236,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 			<select
 				class="rounded-e-none"
 				name="brennstoff_1"
-				bind:value={gebaeude_aufnahme_allgemein.brennstoff_1}
+				bind:value={aufnahme.brennstoff_1}
 				required
 			>
 				<option disabled selected value={false}>Bitte auswählen</option>
@@ -268,11 +268,11 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 				class="rounded-s-none"
 				name="einheit_1"
 				bind:value={ausweis.einheit_1}
-				disabled={!gebaeude_aufnahme_allgemein.brennstoff_1}
+				disabled={!aufnahme.brennstoff_1}
 				required
 			>
 				<option disabled selected value={false}>Bitte auswählen</option>
-				{#each fuelMap.hasOwnProperty(gebaeude_aufnahme_allgemein.brennstoff_1) ? fuelMap[gebaeude_aufnahme_allgemein.brennstoff_1] : [] as unit}
+				{#each fuelMap.hasOwnProperty(aufnahme.brennstoff_1) ? fuelMap[aufnahme.brennstoff_1] : [] as unit}
 					<option value={unit}>{unit}</option>
 				{/each}
 			</select>
@@ -308,7 +308,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 			<HelpLabel>
 				<VerbrauchsHelpLabel
 					bind:ausweis
-					bind:gebaeude_aufnahme_allgemein
+					bind:aufnahme
 					addYear={1}
 					heizquelle={1}
 				></VerbrauchsHelpLabel>
@@ -336,7 +336,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 			<HelpLabel>
 				<VerbrauchsHelpLabel
 					bind:ausweis
-					bind:gebaeude_aufnahme_allgemein
+					bind:aufnahme
 					addYear={2}
 					heizquelle={1}
 				></VerbrauchsHelpLabel>
@@ -364,7 +364,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 			<HelpLabel>
 				<VerbrauchsHelpLabel
 					bind:ausweis
-					bind:gebaeude_aufnahme_allgemein
+					bind:aufnahme
 					addYear={3}
 					heizquelle={1}
 				></VerbrauchsHelpLabel>
@@ -416,7 +416,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 				<select
 					class="rounded-e-none"
 					name="brennstoff_2"
-					bind:value={gebaeude_aufnahme_allgemein.brennstoff_2}
+					bind:value={aufnahme.brennstoff_2}
 					required
 				>
 					<option disabled selected value={false}
@@ -450,13 +450,13 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 					class="rounded-s-none"
 					name="einheit_2"
 					bind:value={ausweis.einheit_2}
-					disabled={!gebaeude_aufnahme_allgemein.brennstoff_2}
+					disabled={!aufnahme.brennstoff_2}
 					required
 				>
 					<option disabled selected value={false}
 						>Bitte auswählen</option
 					>
-					{#each fuelMap.hasOwnProperty(gebaeude_aufnahme_allgemein.brennstoff_2) ? fuelMap[gebaeude_aufnahme_allgemein.brennstoff_2] : [] as unit}
+					{#each fuelMap.hasOwnProperty(aufnahme.brennstoff_2) ? fuelMap[aufnahme.brennstoff_2] : [] as unit}
 						<option value={unit}>{unit}</option>
 					{/each}
 				</select>
@@ -490,7 +490,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 				<HelpLabel>
 					<VerbrauchsHelpLabel
 						bind:ausweis
-						bind:gebaeude_aufnahme_allgemein
+						bind:aufnahme
 						addYear={1}
 						heizquelle={2}
 					></VerbrauchsHelpLabel>
@@ -517,7 +517,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 				<HelpLabel>
 					<VerbrauchsHelpLabel
 						bind:ausweis
-						bind:gebaeude_aufnahme_allgemein
+						bind:aufnahme
 						addYear={2}
 						heizquelle={2}
 					></VerbrauchsHelpLabel>
@@ -544,7 +544,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 				<HelpLabel>
 					<VerbrauchsHelpLabel
 						bind:ausweis
-						bind:gebaeude_aufnahme_allgemein
+						bind:aufnahme
 						addYear={3}
 						heizquelle={2}
 					></VerbrauchsHelpLabel>
@@ -579,7 +579,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 		<HelpLabel>
 			<StromVerbrauchsHelpLabel
 				bind:ausweis
-				bind:gebaeude_aufnahme_allgemein
+				bind:aufnahme
 				addYear={1}
 				heizquelle={1}
 			></StromVerbrauchsHelpLabel>
@@ -606,7 +606,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 		<HelpLabel>
 			<StromVerbrauchsHelpLabel
 				bind:ausweis
-				bind:gebaeude_aufnahme_allgemein
+				bind:aufnahme
 				addYear={2}
 				heizquelle={1}
 			></StromVerbrauchsHelpLabel>
@@ -633,7 +633,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 		<HelpLabel>
 			<StromVerbrauchsHelpLabel
 				bind:ausweis
-				bind:gebaeude_aufnahme_allgemein
+				bind:aufnahme
 				addYear={3}
 				heizquelle={1}
 			></StromVerbrauchsHelpLabel>
@@ -655,11 +655,11 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 
 <!-- Enthält Stromverbrauch für: -->
 
-<SanierungsOption label="Heizung" name="stromverbrauch_enthaelt_heizung" help="" bind:checked={gebaeude_aufnahme_allgemein.stromverbrauch_enthaelt_heizung}></SanierungsOption>
-<SanierungsOption label="Warmwasser " name="stromverbrauch_enthaelt_warmwasser" help="" bind:checked={gebaeude_aufnahme_allgemein.stromverbrauch_enthaelt_warmwasser}></SanierungsOption>
-<SanierungsOption label="Lüftung " name="stromverbrauch_enthaelt_lueftung" help="" bind:checked={gebaeude_aufnahme_allgemein.stromverbrauch_enthaelt_lueftung}></SanierungsOption>
-<SanierungsOption label="Beleuchtung" name="stromverbrauch_enthaelt_beleuchtung" help="" bind:checked={gebaeude_aufnahme_allgemein.stromverbrauch_enthaelt_beleuchtung}></SanierungsOption>
-<SanierungsOption label="Kühlung" name="stromverbrauch_enthaelt_kuehlung" help="" bind:checked={gebaeude_aufnahme_allgemein.stromverbrauch_enthaelt_kuehlung}></SanierungsOption>
+<SanierungsOption label="Heizung" name="stromverbrauch_enthaelt_heizung" help="" bind:checked={aufnahme.stromverbrauch_enthaelt_heizung}></SanierungsOption>
+<SanierungsOption label="Warmwasser " name="stromverbrauch_enthaelt_warmwasser" help="" bind:checked={aufnahme.stromverbrauch_enthaelt_warmwasser}></SanierungsOption>
+<SanierungsOption label="Lüftung " name="stromverbrauch_enthaelt_lueftung" help="" bind:checked={aufnahme.stromverbrauch_enthaelt_lueftung}></SanierungsOption>
+<SanierungsOption label="Beleuchtung" name="stromverbrauch_enthaelt_beleuchtung" help="" bind:checked={aufnahme.stromverbrauch_enthaelt_beleuchtung}></SanierungsOption>
+<SanierungsOption label="Kühlung" name="stromverbrauch_enthaelt_kuehlung" help="" bind:checked={aufnahme.stromverbrauch_enthaelt_kuehlung}></SanierungsOption>
 
 <div class="input-standard">
 	<Inputlabel title="Sonstige"></Inputlabel>

src/components/Ausweis/ThermischeKuehlung.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 
-import HelpLabel from "#labels/HelpLabel.svelte";
-import Inputlabel from "#labels/InputLabel.svelte";
+import HelpLabel from "#components/labels/HelpLabel.svelte";
+import Inputlabel from "#components/labels/InputLabel.svelte";
 
 export let ausweis;
 

src/components/Ausweis/Verbrauch.svelte

@@ -1,8 +1,8 @@
 <script lang="ts">
-	import HelpLabel from "#labels/HelpLabel.svelte";
-	import Inputlabel from "#labels/InputLabel.svelte";
-	import Verbrauchslabel from "#labels/VerbrauchsLabel.svelte";
-	import VerbrauchsHelpLabel from "#labels/VerbrauchsHelpLabel.svelte";
+	import HelpLabel from "#components/labels/HelpLabel.svelte";
+	import Inputlabel from "#components/labels/InputLabel.svelte";
+	import Verbrauchslabel from "#components/labels/VerbrauchsLabel.svelte";
+	import VerbrauchsHelpLabel from "#components/labels/VerbrauchsHelpLabel.svelte";
 
 	import Label from "../Label.svelte";
 
@@ -10,14 +10,14 @@
 	import fuelList from "./brennstoffListe.js";
 	import { auditVerbrauchAbweichung } from "../Verbrauchsausweis/audits/VerbrauchAbweichung.js";
 	import {
-		GebaeudeAufnahmeClient,
-		GebaeudeClient,
+		AufnahmeClient,
+		ObjektClient,
 		VerbrauchsausweisWohnenClient,
 	} from "./types.js";
 	import { addNotification } from "#components/Notifications/shared.js";
 
-	export let gebaeude: GebaeudeClient;
-	export let gebaeude_aufnahme_allgemein: GebaeudeAufnahmeClient;
+	export let gebaeude: ObjektClient;
+	export let aufnahme: AufnahmeClient;
 	export let ausweis: VerbrauchsausweisWohnenClient;
 
 	// Wir dürfen bis zu 4.5 Jahre alte Klimafaktoren benutzen, also nehmen wir alle Monate seitdem und generieren daraus die Auswahl.
@@ -44,12 +44,12 @@
 	];
 
 	const startDate = moment(
-		ausweis.gebaeude_aufnahme_allgemein.erstellungsdatum || Date.now()
+		aufnahme.erstellungsdatum || Date.now()
 	)
 		.subtract(4, "years")
 		.subtract(6, "months");
 	const endDate = moment(
-		ausweis.gebaeude_aufnahme_allgemein.erstellungsdatum || Date.now()
+		aufnahme.erstellungsdatum || Date.now()
 	).subtract(3, "years");
 
 	for (let m = moment(startDate); m.isBefore(endDate); m.add(1, "month")) {
@@ -138,6 +138,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 						class="checkbox"
 						name="zusaetzliche_heizquelle_1"
 						bind:checked={ausweis.zusaetzliche_heizquelle}
+						data-cy="zusaetzliche_heizquelle"
 					/>
 					<label
 						for="zusaetzliche_heizquelle_1"
@@ -232,7 +233,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 			<select
 				class="rounded-e-none"
 				name="brennstoff_1"
-				bind:value={gebaeude_aufnahme_allgemein.brennstoff_1}
+				bind:value={aufnahme.brennstoff_1}
 				required
 			>
 				<option disabled selected value={false}>Bitte auswählen</option>
@@ -264,11 +265,11 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 				class="rounded-s-none"
 				name="einheit_1"
 				bind:value={ausweis.einheit_1}
-				disabled={!gebaeude_aufnahme_allgemein.brennstoff_1}
+				disabled={!aufnahme.brennstoff_1}
 				required
 			>
 				<option disabled selected value={false}>Bitte auswählen</option>
-				{#each fuelMap.hasOwnProperty(gebaeude_aufnahme_allgemein.brennstoff_1) ? fuelMap[gebaeude_aufnahme_allgemein.brennstoff_1] : [] as unit}
+				{#each fuelMap.hasOwnProperty(aufnahme.brennstoff_1) ? fuelMap[aufnahme.brennstoff_1] : [] as unit}
 					<option value={unit}>{unit}</option>
 				{/each}
 			</select>
@@ -304,7 +305,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 			<HelpLabel>
 				<VerbrauchsHelpLabel
 					bind:ausweis
-					bind:gebaeude_aufnahme_allgemein
+					bind:aufnahme
 					addYear={1}
 					heizquelle={1}
 				></VerbrauchsHelpLabel>
@@ -332,7 +333,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 			<HelpLabel>
 				<VerbrauchsHelpLabel
 					bind:ausweis
-					bind:gebaeude_aufnahme_allgemein
+					bind:aufnahme
 					addYear={2}
 					heizquelle={1}
 				></VerbrauchsHelpLabel>
@@ -360,7 +361,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 			<HelpLabel>
 				<VerbrauchsHelpLabel
 					bind:ausweis
-					bind:gebaeude_aufnahme_allgemein
+					bind:aufnahme
 					addYear={3}
 					heizquelle={1}
 				></VerbrauchsHelpLabel>
@@ -412,8 +413,9 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 				<select
 					class="rounded-e-none"
 					name="brennstoff_2"
-					bind:value={gebaeude_aufnahme_allgemein.brennstoff_2}
+					bind:value={aufnahme.brennstoff_2}
 					required
+					data-cy="brennstoff_2"
 				>
 					<option disabled selected value={false}
 						>Bitte auswählen</option
@@ -445,14 +447,15 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 				<select
 					class="rounded-s-none"
 					name="einheit_2"
+					data-cy="einheit_2"
 					bind:value={ausweis.einheit_2}
-					disabled={!gebaeude_aufnahme_allgemein.brennstoff_2}
+					disabled={!aufnahme.brennstoff_2}
 					required
 				>
 					<option disabled selected value={false}
 						>Bitte auswählen</option
 					>
-					{#each fuelMap.hasOwnProperty(gebaeude_aufnahme_allgemein.brennstoff_2) ? fuelMap[gebaeude_aufnahme_allgemein.brennstoff_2] : [] as unit}
+					{#each fuelMap.hasOwnProperty(aufnahme.brennstoff_2) ? fuelMap[aufnahme.brennstoff_2] : [] as unit}
 						<option value={unit}>{unit}</option>
 					{/each}
 				</select>
@@ -486,7 +489,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 				<HelpLabel>
 					<VerbrauchsHelpLabel
 						bind:ausweis
-						bind:gebaeude_aufnahme_allgemein
+						bind:aufnahme
 						addYear={1}
 						heizquelle={2}
 					></VerbrauchsHelpLabel>
@@ -513,7 +516,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 				<HelpLabel>
 					<VerbrauchsHelpLabel
 						bind:ausweis
-						bind:gebaeude_aufnahme_allgemein
+						bind:aufnahme
 						addYear={2}
 						heizquelle={2}
 					></VerbrauchsHelpLabel>
@@ -540,7 +543,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 				<HelpLabel>
 					<VerbrauchsHelpLabel
 						bind:ausweis
-						bind:gebaeude_aufnahme_allgemein
+						bind:aufnahme
 						addYear={3}
 						heizquelle={2}
 					></VerbrauchsHelpLabel>

src/components/Ausweis/Warmwasseranteil.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 
-import HelpLabel from "#labels/HelpLabel.svelte";
-import Inputlabel from "#labels/InputLabel.svelte";
+import HelpLabel from "#components/labels/HelpLabel.svelte";
+import Inputlabel from "#components/labels/InputLabel.svelte";
 
 export let ausweis;
 

src/components/Ausweis/types.ts

@@ -1,11 +1,23 @@
-import { AppRouter } from "@ibcornelsen/api";
-import { Benutzer, GebaeudeBilder } from "@ibcornelsen/database/client";
-import { inferProcedureInput, inferProcedureOutput } from "@trpc/server";
+import { VALID_UUID_PREFIXES } from "#lib/constants.js";
+import {
+	Aufnahme,
+	BedarfsausweisWohnen,
+	Benutzer,
+	Enums,
+	GebaeudeBilder,
+	Objekt,
+	Rechnung,
+	Tickets,
+	VerbrauchsausweisGewerbe,
+	VerbrauchsausweisWohnen,
+} from "@ibcornelsen/database/client";
+import { z, ZodSchema } from "zod";
 
-export type UploadedGebaeudeBild = inferProcedureOutput<
-AppRouter["v1"]["verbrauchsausweisWohnen"]["get"]
->["gebaeude_aufnahme_allgemein"]["gebaeude_stammdaten"]["gebaeude_bilder"][0] & { base64?: string, update?: boolean };
+export type OmitKeys<T, K extends keyof T> = Omit<T, K>;
 
+export type UploadedGebaeudeBild = OmitKeys<GebaeudeBilder, "id" | "objekt_id"> & {
+	base64: string
+}
 
 /**
  * Das ist der Typescript Type für den Verbrauchsausweis Wohnen mit allen Feldern die
@@ -17,8 +29,28 @@ AppRouter["v1"]["verbrauchsausweisWohnen"]["get"]
  * @export
  * @typedef {VerbrauchsausweisWohnenClient}
  */
-export type VerbrauchsausweisWohnenClient = inferProcedureOutput<
-AppRouter["v1"]["verbrauchsausweisWohnen"]["get"]
+export type VerbrauchsausweisWohnenClient = OmitKeys<
+	VerbrauchsausweisWohnen,
+	"id" | "aufnahme_id" | "benutzer_id"
+> & {
+	uid_objekt: string,
+	uid_aufnahme: string,
+	uid_benutzer?: string
+};
+
+/**
+ * Das ist der Typescript Type für den Verbrauchsausweis Gewerbe mit allen Feldern die
+ * von der API erwartet werden. Das Backend wird dem Client nur diese Daten zur Verfügung stellen.
+ * Hiermit kann sichergestellt werden, dass eine Funktion auf dem Client mit den richtigen Daten
+ * ausgeführt werden kann.
+ * @date 1/14/2024 - 3:33:33 PM
+ *
+ * @export
+ * @typedef {VerbrauchsausweisWohnenClient}
+ */
+export type VerbrauchsausweisGewerbeClient = OmitKeys<
+	VerbrauchsausweisGewerbe,
+	"id" | "aufnahme_id" | "benutzer_id"
 >;
 
 /**
@@ -31,25 +63,10 @@ AppRouter["v1"]["verbrauchsausweisWohnen"]["get"]
  * @export
  * @typedef {VerbrauchsausweisWohnenClient}
  */
-export type VerbrauchsausweisGewerbeClient = inferProcedureInput<
-	AppRouter["v1"]["verbrauchsausweisGewerbe"]["2016"]["speichern"]
->["ausweis"];
-
-/**
- * Das ist der Typescript Type für den Verbrauchsausweis Gewerbe mit allen Feldern die
- * von der API erwartet werden. Das Backend wird dem Client nur diese Daten zur Verfügung stellen.
- * Hiermit kann sichergestellt werden, dass eine Funktion auf dem Client mit den richtigen Daten
- * ausgeführt werden kann.
- * @date 1/14/2024 - 3:33:33 PM
- *
- * @export
- * @typedef {VerbrauchsausweisWohnenClient}
- */
-export type BedarfsausweisWohnenClient = inferProcedureInput<
-	AppRouter["v1"]["bedarfsausweisWohen"]["2016"]["speichern"]
->["ausweis"];
-
-
+export type BedarfsausweisWohnenClient = OmitKeys<
+	BedarfsausweisWohnen,
+	"id" | "aufnahme_id" | "benutzer_id"
+>;
 
 /**
  * Das ist der Typescript Type für die Gebäude Stammdaten mit allen Feldern die
@@ -59,15 +76,67 @@ export type BedarfsausweisWohnenClient = inferProcedureInput<
  * @date 1/14/2024 - 3:33:33 PM
  *
  * @export
- * @typedef {GebaeudeClient}
+ * @typedef {ObjektClient}
  */
-export type GebaeudeClient = inferProcedureOutput<
-	AppRouter["v1"]["verbrauchsausweisWohnen"]["get"]
->["gebaeude_aufnahme_allgemein"]["gebaeude_stammdaten"];
+export type ObjektClient = OmitKeys<Objekt, "benutzer_id" | "id">;
 
+export type AufnahmeClient = OmitKeys<
+	Aufnahme,
+	"id" | "objekt_id" | "benutzer_id"
+> & {
+	uid_objekt: string
+};
 
-export type GebaeudeAufnahmeClient = inferProcedureOutput<
-	AppRouter["v1"]["verbrauchsausweisWohnen"]["get"]
->["gebaeude_aufnahme_allgemein"];
+export type TicketClient = OmitKeys<Tickets, "bearbeiter_id" | "benutzer_id" | "id">
 
-export type BenutzerClient = inferProcedureOutput<AppRouter["v1"]["benutzer"]["fromPublicId"]>
+export type BenutzerClient = OmitKeys<Benutzer, "id" | "passwort">;
+
+export type RechnungClient = OmitKeys<Rechnung, "aufnahme_id" | "benutzer_id" | "id">
+
+export function ZodOverlap<T, S = z.ZodType<T, z.ZodTypeDef, T>>(arg: S): S {
+	return arg;
+}
+
+type PickNullable<T> = {
+	[P in keyof T as null extends T[P] ? P : never]: T[P]
+}
+
+type PickNotNullable<T> = {
+	[P in keyof T as null extends T[P] ? never : P]: T[P]
+}
+
+export type OptionalNullable<T> = T extends object ? {
+	[K in keyof PickNullable<T>]?: OptionalNullable<T[K]>
+} & {
+	[K in keyof PickNotNullable<T>]: OptionalNullable<T[K]>
+} : T;
+
+export const UUidWithPrefix = z.string().refine((value) => {
+	const prefixedUUidRegex = /^([0-9a-z]+)-[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i
+
+	const match = value.match(prefixedUUidRegex)
+
+	if (match && match[1] in VALID_UUID_PREFIXES) {
+		return true;
+	}
+
+	return false;
+})
+
+export function getAusweisartFromUUID(uid: string): Enums.Ausweisart | null {
+	if (!UUidWithPrefix.safeParse(uid).success) {
+		return null
+	}
+
+	if (uid.startsWith("vaw")) {
+		return Enums.Ausweisart.VerbrauchsausweisWohnen
+	} else if (uid.startsWith("vag")) {
+		return Enums.Ausweisart.VerbrauchsausweisGewerbe
+	} else if (uid.startsWith("baw")) {
+		return Enums.Ausweisart.BedarfsausweisWohnen
+	} else if (uid.startsWith("bag")) {
+		return Enums.Ausweisart.BedarfsausweisGewerbe
+	}
+
+	return null;
+} 

src/components/AusweisPruefenBox.svelte

@@ -17,12 +17,12 @@
 
 	console.log(ausweis);
 
-	const gebaeude_aufnahme_allgemein = ausweis.gebaeude_aufnahme_allgemein
+	const aufnahme = ausweis.aufnahme
 	
 
 	const ausweisArt = "VA"; // TODO: Das ist ein Platzhalter, hier muss die Ausweisart aus dem Ausweisobjekt kommen
 
-	const images = ausweis.gebaeude_aufnahme_allgemein.gebaeude_stammdaten.gebaeude_bilder;
+	const images = ausweis.aufnahme.objekt.gebaeude_bilder;
 
 	let verbrauchWWGesamt_1 = "";
 	let verbrauchWWGesamt_2 = "";
@@ -97,12 +97,12 @@
 
 	let Abgeschlossen: any;
 
-	if (gebaeude_aufnahme_allgemein.erledigt) {
+	if (aufnahme.erledigt) {
 		Ausweisbild = "/images/dashboard/ausweishaken.jpg";
 		DatenBlattBild = "/images/dashboard/datenblatthaken.jpg";
 		StatusIcon = "/images/dashboard/erledigt.svg";
 		Abgeschlossen = 0;
-	} else if (gebaeude_aufnahme_allgemein.bestellt) {
+	} else if (aufnahme.bestellt) {
 		Ausweisbild = "/images/dashboard/ausweis.jpg";
 		DatenBlattBild = "/images/dashboard/datenblatt.jpg";
 		StatusIcon = "/images/dashboard/bestellt.svg";
@@ -114,13 +114,13 @@
 		Abgeschlossen = 2;
 	}
 
-	if (gebaeude_aufnahme_allgemein.boxpruefung) {
+	if (aufnahme.boxpruefung) {
 		symbolPruefung = "/images/dashboard/kreishaken.png";
 	} else {
 		symbolPruefung = "/images/dashboard/kreiskreuz.png";
 	}
 
-	if (gebaeude_aufnahme_allgemein.zurueckgestellt) {
+	if (aufnahme.zurueckgestellt) {
 		zurueckGestellt =
 			"<img src='/images/dashboard/zurueckGestellt.svg' alt='Status' width=\"25\" height=\"25\"></img>";
 	} else {
@@ -143,7 +143,7 @@
 			ausweis.warmwasser_enthalten &&
 			ausweis.warmwasser_anteil_bekannt
 		) {
-			if (gebaeude_aufnahme_allgemein.solarsystem_warmwasser) {
+			if (aufnahme.solarsystem_warmwasser) {
 				// Wenn Warmwasser enthalten und Anteil bekannt und Solarsystem
 				verbrauchWWGesamt_1 = `${calculations?.energieVerbrauchGesamt_1} kWh x ${ausweis.anteil_warmwasser_1 / 100} x 0.6`;
 				verbrauchWWGesamt_2 = `${calculations?.energieVerbrauchGesamt_2} kWh x ${ausweis.anteil_warmwasser_2 / 100} x 0.6`;
@@ -155,7 +155,7 @@
 				solarsystemWarmwasser = "kein Solarsystem Warmwasser";
 			}
 		} else {
-			if (gebaeude_aufnahme_allgemein.solarsystem_warmwasser) {
+			if (aufnahme.solarsystem_warmwasser) {
 				// Wenn Warmwasser Anteil unbekannt und Solarsystem
 				verbrauchWWGesamt_1 =
 					calculations?.energetischeNutzflaeche +
@@ -176,11 +176,11 @@
 		tooltip3Z2 =
 		ausweis.faktorKeller +
 			" x " +
-			gebaeude_aufnahme_allgemein.flaeche +
+			aufnahme.flaeche +
 			" m² Energetische Nutzfläche (Keller " +
 			ausweis.keller_beheizt +
 			" ) in m²";
-			table3Z1 = gebaeude_aufnahme_allgemein.flaeche;
+			table3Z1 = aufnahme.flaeche;
 			table3Z2 = calculations?.energetischeNutzflaeche;
 
 	
@@ -202,7 +202,7 @@
 			" kWh/" +
 			ausweis.einheit_1 +
 			" >> Verbrauch 1 " +
-			gebaeude_aufnahme_allgemein.brennstoff_1 +
+			aufnahme.brennstoff_1 +
 			" in kWh";
 		tooltip4Z2 =
 			"(" +
@@ -222,7 +222,7 @@
 			" kWh/" +
 			ausweis.einheit_2 +
 			" >> Verbrauch 2 " +
-			gebaeude_aufnahme_allgemein.brennstoff_2 +
+			aufnahme.brennstoff_2 +
 			" in kWh";
 		table4Z1 = calculations?.energieVerbrauchGesamt_1;
 		table4Z2 = calculations?.energieVerbrauchGesamt_2;
@@ -411,7 +411,7 @@
 			" Primärenergieverbrauch in kWh/m²a";
 		tooltip16Z2 = "Effizienzklasse";
 		table16Z1 = calculations?.primaerEnergieVerbrauchGesamt;
-		table16Z2 = gebaeude_aufnahme_allgemein.energieeffizienzklasse;
+		table16Z2 = aufnahme.energieeffizienzklasse;
 
 	let imagePreview = "";
 
@@ -436,7 +436,7 @@
 			timeout: 3000,
 		})
 
-		ausweis.gebaeude_aufnahme_allgemein.storniert = true;
+		ausweis.aufnahme.storniert = true;
 
 		ausweis = ausweis;
 	}
@@ -452,11 +452,11 @@
 				<td><button on:click={() => infoVisible = !infoVisible}><ChevronDown size={22} class="transition-all {infoVisible ? "" : "rotate-180"}"></ChevronDown></button></td>
 				<td class="w-6 px-2"
 					>
-					{#if gebaeude_aufnahme_allgemein.erledigt}
+					{#if aufnahme.erledigt}
 						<div class="tooltip" data-tip="Ausweis wurde ausgestellt">
 							<div class="rounded-full w-6 h-6 bg-success"></div>
 						</div>
-					{:else if gebaeude_aufnahme_allgemein.bestellt}
+					{:else if aufnahme.bestellt}
 						<div class="tooltip" data-tip="Ausweis wurde bestellt">
 							<div class="rounded-full w-6 h-6 bg-warning"></div>
 						</div>
@@ -471,12 +471,12 @@
 					>
 					<AusweisPruefenTooltip>
 						<div slot="tooltip">
-							<span>{gebaeude_aufnahme_allgemein.adresse} {gebaeude_aufnahme_allgemein.plz} {gebaeude_aufnahme_allgemein.ort}</span>
+							<span>{aufnahme.adresse} {aufnahme.plz} {aufnahme.ort}</span>
 							<br>
-							<span>{gebaeude_aufnahme_allgemein.gebaeudetyp}, Einheiten: {gebaeude_aufnahme_allgemein.einheiten}</span>
+							<span>{aufnahme.gebaeudetyp}, Einheiten: {aufnahme.einheiten}</span>
 						</div>
-						<span>{ausweisArt} - {gebaeude_aufnahme_allgemein.id}</span>
-						<span>{moment(gebaeude_aufnahme_allgemein.erstellungsdatum).format("DD.MM.YYYY")}</span>
+						<span>{ausweisArt} - {aufnahme.id}</span>
+						<span>{moment(aufnahme.erstellungsdatum).format("DD.MM.YYYY")}</span>
 					</AusweisPruefenTooltip></td
 				>
 				<td width="35px"
@@ -485,8 +485,8 @@
 						<div slot="tooltip">
 							<span>Baujahr Gebäude / Baujahr Heizung</span>
 						</div>
-						<span>{gebaeude_aufnahme_allgemein.baujahr_gebaeude.join(", ")}</span>
-							<span>{gebaeude_aufnahme_allgemein.baujahr_heizung.join(", ")}</span>
+						<span>{aufnahme.baujahr_gebaeude.join(", ")}</span>
+							<span>{aufnahme.baujahr_heizung.join(", ")}</span>
 					</AusweisPruefenTooltip>
 					<div class="tooltip" data-tip="">
 						
@@ -498,9 +498,9 @@
 						<div slot="tooltip">
 							<span>Wohnfläche in m²</span>
 							<br>
-							<span>{ausweis.faktorKeller} x {gebaeude_aufnahme_allgemein.flaeche}m² Energetische Nutzfläche (Keller {gebaeude_aufnahme_allgemein.keller}) in m²</span>
+							<span>{ausweis.faktorKeller} x {aufnahme.flaeche}m² Energetische Nutzfläche (Keller {aufnahme.keller}) in m²</span>
 						</div>
-						<span>{gebaeude_aufnahme_allgemein.flaeche}</span>
+						<span>{aufnahme.flaeche}</span>
 						<span><strong>{calculations?.energetischeNutzflaeche}</strong></span>
 					</AusweisPruefenTooltip>
 					</td
@@ -697,9 +697,9 @@
 					>
 					<AusweisPruefenTooltip>
 						<div slot="tooltip">
-							<span>{gebaeude_aufnahme_allgemein.prueftext}</span>
+							<span>{aufnahme.prueftext}</span>
 						</div>
-						{#if gebaeude_aufnahme_allgemein.boxpruefung}
+						{#if aufnahme.boxpruefung}
 							<CheckCircled size={22}></CheckCircled>
 						{:else}
 							<CrossCircled size={22}></CrossCircled>
@@ -740,7 +740,7 @@
 				<td title="Ausweis ausstellen" class="w-4 p-1"
 					><button
 						class="btn btn-xs btn-ghost"
-						on:click={() => ausweisAusstellen(gebaeude_aufnahme_allgemein.uid)}>A</button
+						on:click={() => ausweisAusstellen(aufnahme.uid)}>A</button
 					></td
 				>
 				<td
@@ -748,7 +748,7 @@
 					class="w-4 p-1"
 					><button
 						class="btn btn-xs btn-ghost"
-						on:click={() => ausweisAusstellenPost(gebaeude_aufnahme_allgemein.uid)}>P</button
+						on:click={() => ausweisAusstellenPost(aufnahme.uid)}>P</button
 					></td
 				>
 				<td
@@ -756,7 +756,7 @@
 					class="w-4 p-1"
 					><button
 						class="btn btn-xs btn-ghost"
-						on:click={() => ausweisnichtAusstellen(gebaeude_aufnahme_allgemein.uid)}>N</button
+						on:click={() => ausweisnichtAusstellen(aufnahme.uid)}>N</button
 					></td
 				>
 				<td
@@ -764,7 +764,7 @@
 					class="w-4 p-1"
 					><button
 						class="btn btn-xs btn-ghost"
-						on:click={() => bestellBestaetigung(gebaeude_aufnahme_allgemein.uid)}>B</button
+						on:click={() => bestellBestaetigung(aufnahme.uid)}>B</button
 					></td
 				>
 				<td
@@ -772,7 +772,7 @@
 					class="w-4 p-1"
 					><button
 						class="btn btn-xs btn-ghost"
-						on:click={() => erinnern(gebaeude_aufnahme_allgemein.uid)}
+						on:click={() => erinnern(aufnahme.uid)}
 						>E</button
 					></td
 				>
@@ -782,17 +782,17 @@
 					><a
 						class="btn btn-xs btn-ghost"
 						target="_blank"
-						href="/energieausweis-erstellen/gespeichert?id={gebaeude_aufnahme_allgemein.uid}">F</a
+						href="/energieausweis-erstellen/gespeichert?id={aufnahme.uid}">F</a
 					></td
 				>
-				{#if gebaeude_aufnahme_allgemein.kontrolldatei}
+				{#if aufnahme.kontrolldatei}
 					<td title="XML-Datei an das DiBT verschicken." class="w-4 p-1"><button class="btn btn-xs btn-ghost" on:click={() => {
-						xmlAbschicken(gebaeude_aufnahme_allgemein.uid)
+						xmlAbschicken(aufnahme.uid)
 					}}>X</button></td>
 				{/if}
-				{#if !gebaeude_aufnahme_allgemein.registriernummer}
+				{#if !aufnahme.registriernummer}
 					<td title="Registriernummer vom DiBT anfordern." class="w-4 p-1"><button class="btn btn-xs btn-ghost" on:click={() => {
-						registriernummerAnfordern(gebaeude_aufnahme_allgemein.uid)
+						registriernummerAnfordern(aufnahme.uid)
 					}}>R</button></td>
 				{/if}
 			</tr>
@@ -815,7 +815,7 @@
 						</tr>
 						<tr>
 							<td>Informationen des Nutzers</td>
-							<td>{gebaeude_aufnahme_allgemein.boxpruefung}</td>
+							<td>{aufnahme.boxpruefung}</td>
 						</tr>
 						<tr>
 							<td>UID</td>
@@ -837,7 +837,7 @@
 						</div>
 						<hr/>
 					</li>
-					{#each ausweis.gebaeude_aufnahme_allgemein.events as event, i}
+					{#each ausweis.aufnahme.events as event, i}
 						<li>
 							<hr />
 							<div class="timeline-middle">

src/components/CheckoutItem.svelte

@@ -1,8 +1,4 @@
 <script lang="ts">
-	import { get_current_component } from "svelte/internal";
-
-	const component = get_current_component();
-
 	export let image: string;
 	export let name: string;
 	export let description: string;
@@ -23,14 +19,10 @@
 		</div>
 	</div>
 	<div class="join">
-		<button class="btn btn-sm join-item" disabled={!removable && quantity == 1} on:click={() => {
+		<button class="p-3.5 border rounded-lg" disabled={!removable && quantity == 1} on:click={() => {
 			quantity--
-
-			if ((quantity == 0) && removable) {
-				component.$destroy();
-			}
 		}}>-</button>
-		<button class="btn btn-sm join-item btn-ghost">{quantity}</button>
-		<button class="btn btn-sm join-item" disabled={quantity <= maxQuantity} on:click={() => quantity++}>+</button>
+		<button class="p-3.5 border rounded-lg">{quantity}</button>
+		<button class="p-3.5 border rounded-lg" disabled={quantity <= maxQuantity} on:click={() => quantity++}>+</button>
 	</div>
 </div>

src/components/Dashboard/DashboardAusweis.svelte

@@ -1,5 +1,8 @@
 <script lang="ts">
 	import {
+	AufnahmeClient,
+	ObjektClient,
+	UploadedGebaeudeBild,
 	VerbrauchsausweisWohnenClient,
 	} from "#components/Ausweis/types.js";
 	import moment from "moment";
@@ -12,9 +15,14 @@
 		QuestionMarkCircled,
 	} from "radix-svelte-icons";
 	import { endEnergieVerbrauchVerbrauchsausweis_2016 } from "#lib/Berechnungen/VerbrauchsausweisWohnen/VerbrauchsausweisWohnen_2016.js";
-	import { client } from "src/trpc.js";
+	import { api } from "astro-typesafe-api/client";
+	import Cookies from "js-cookie";
+	import { API_ACCESS_TOKEN_COOKIE_NAME } from "#lib/constants.js";
 		
 	export let ausweis: VerbrauchsausweisWohnenClient;
+	export let aufnahme: AufnahmeClient;
+	export let bilder: UploadedGebaeudeBild[];
+	export let objekt: ObjektClient;
 	export let progress: number;
 
 	async function ausweisStornieren() {
@@ -33,11 +41,16 @@
 		});
 
 		if (result === true) {
-			await client.v1.verbrauchsausweisWohnen.stornieren.mutate({
+			await api["verbrauchsausweis-wohnen"]._uid.DELETE.fetch(undefined, {
+				params: {
 					uid: ausweis.uid
+				},
+				headers: {
+					Authorization: `Bearer ${Cookies.get(API_ACCESS_TOKEN_COOKIE_NAME)}`
+				}
 			})
 
-			ausweis.gebaeude_aufnahme_allgemein.storniert = true;
+			aufnahme.storniert = true;
 			ausweis = ausweis;
 
 			dialogs.alert({
@@ -58,14 +71,14 @@
 </script>
 
 <div class="card lg:card-side bg-base-200 card-bordered border-base-300">
-	{#if ausweis.gebaeude_aufnahme_allgemein.storniert}
+	{#if aufnahme.storniert}
 		<div class="absolute top-0 left-0 w-full h-full bg-[rgba(0,0,0,0.7)] z-[5] rounded-lg select-none">
 			<h1 class="absolute -rotate-[25deg] text-5xl md:text-7xl tracking-wide uppercase text-red-500 border-4 border-red-500 rounded-lg top-[50%] translate-y-[-50%] left-[50%] translate-x-[-50%]">Storniert</h1>
 		</div>
 	{/if}
 	<figure class="lg:w-1/2">
 		<img
-			src={(ausweis.gebaeude_aufnahme_allgemein.gebaeude_stammdaten.gebaeude_bilder && `/bilder/${ausweis.gebaeude_aufnahme_allgemein.gebaeude_stammdaten.gebaeude_bilder[0]?.uid}.webp`) || "/images/placeholder.jpg"}
+			src={(bilder.length > 0 && `/bilder/${bilder[0].uid}.webp`) || "/images/placeholder.jpg"}
 			class="object-cover w-full h-full"
 			alt="Gebäudebild"
 		/>
@@ -95,25 +108,25 @@
 			</ul>
 		</div>
 		<div class="flex flex-row flex-wrap gap-2">
-			{#if ausweis.gebaeude_aufnahme_allgemein.ausweisart == "VerbrauchsausweisWohnen"}
+			{#if aufnahme.ausweisart == "VerbrauchsausweisWohnen"}
 			<div class="badge badge-accent font-semibold">
 				Verbrauchsausweis Wohnen
 			</div>
-			{:else if ausweis.gebaeude_aufnahme_allgemein.ausweisart == "BedarfsausweisWohnen"}
+			{:else if aufnahme.ausweisart == "BedarfsausweisWohnen"}
 			<div class="badge badge-accent font-semibold">
 				Bedarfsausweis Wohnen
 			</div>
-			{:else if ausweis.gebaeude_aufnahme_allgemein.ausweisart == "VerbrauchsausweisGewerbe"}
+			{:else if aufnahme.ausweisart == "VerbrauchsausweisGewerbe"}
 			<div class="badge badge-accent font-semibold">
 				Verbrauchsausweis Gewerbe
 			</div>
 			{/if}
 
-			{#if ausweis.erledigt}
+			{#if aufnahme.erledigt}
 			<div class="badge badge-success font-semibold">Ausgestellt</div>
 			{/if}
 		</div>
-		<h2 class="card-title">{ausweis.gebaeude_aufnahme_allgemein.gebaeude_stammdaten.adresse}</h2>
+		<h2 class="card-title">{objekt.adresse}</h2>
 		<div class="mb-4 flex flex-row items-center gap-4">
 			<progress class="progress w-full" value={progress} max="100"></progress>
 			<!-- TODO: Metrics für den Fortschritt festlegen -->
@@ -134,7 +147,7 @@
 			<div class="flex flex-row justify-between">
 				<span>Erstellungsdatum</span>
 				<span class="font-bold text-base-content"
-					>{moment(ausweis.erstellungsdatum).format(
+					>{moment(aufnahme.erstellungsdatum).format(
 						"DD.MM.YYYY"
 					)}</span
 				>
@@ -144,16 +157,16 @@
 				<span
 					class="font-bold text-base-content"
 					title="Gebäude / Heizung"
-					>{ausweis.gebaeude_aufnahme_allgemein.baujahr_gebaeude[0] || "N/A"} /
-					{ausweis.gebaeude_aufnahme_allgemein.baujahr_heizung[0] ||
+					>{aufnahme.baujahr_gebaeude[0] || "N/A"} /
+					{aufnahme.baujahr_heizung[0] ||
 						"N/A"}</span
 				>
 			</div>
 			<div class="flex flex-row justify-between">
 				<span>Wohnfläche</span>
 				<span class="font-bold text-base-content"
-					>{ausweis.gebaeude_aufnahme_allgemein.flaeche
-						? `${ausweis.gebaeude_aufnahme_allgemein.flaeche}m²`
+					>{aufnahme.flaeche
+						? `${aufnahme.flaeche}m²`
 						: "N/A"}</span
 				>
 			</div>

src/components/ImageGrid.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import UploadImages from "./UploadImages.svelte";
 	import type { BedarfsausweisWohnen, Enums, VerbrauchsausweisGewerbe } from "@ibcornelsen/database/client";
-	import { GebaeudeClient, UploadedGebaeudeBild, VerbrauchsausweisWohnenClient } from "./Ausweis/types.js";
+	import { ObjektClient, UploadedGebaeudeBild, VerbrauchsausweisWohnenClient } from "./Ausweis/types.js";
 	import { RotateCounterClockwise, Trash, Upload } from "radix-svelte-icons";
 
 	export let images: UploadedGebaeudeBild[] = [];
@@ -9,7 +9,7 @@
 	export let min: number = 1;
 	export let name: string = "";
 	export let ausweis: VerbrauchsausweisWohnenClient | VerbrauchsausweisGewerbe | BedarfsausweisWohnen;
-	export let gebaeude: GebaeudeClient;
+	export let gebaeude: ObjektClient;
 	export let kategorie: Enums.BilderKategorie
 
 	async function rotateImage(image: UploadedGebaeudeBild): Promise<UploadedGebaeudeBild> {

src/components/Katex.svelte

@@ -1,19 +0,0 @@
-<script lang="ts">
-	import katex from "katex";
-	export let math: string;
-	export let displayMode: boolean = false;
-	
-	const options = {
-		displayMode: displayMode,
-		throwOnError: false
-	}
-	
-	let katexString: any;
-	$: katexString = katex.renderToString(math, options)
-</script>
-
-<svelte:head>
-	<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.12.0/dist/katex.min.css" integrity="sha384-AfEj0r4/OFrOo5t7NnNe46zW/tFgW6x/bCJG8FqQCEo3+Aro6EYUG4+cU+KJWu/X" crossorigin="anonymous">
-</svelte:head>
-
-{@html katexString}

src/components/NotificationProvider/NotificationProvider.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { notifications } from "./shared"
+	import { notifications } from "./shared.js"
 
 	export let component: ConstructorOfATypedSvelteComponent;
 </script>

src/components/Notifications/RawNotification.svelte

@@ -4,23 +4,9 @@
 	import { fly } from "svelte/transition";
 
 	export let notification: Partial<Notification> & { uid: string };
-</script>
 
-<div
-	class="border rounded-lg bg-white shadow-md flex flex-row border-l-8" in:fly={{x: 200, duration: 200}} out:fly={{x: 200, duration: 200}}
-	class:border-l-red-400={notification.type == "error"}
-	class:border-l-blue-400={notification.type == "info"}
-	class:border-l-green-400={notification.type == "success"}
-	class:border-l-yellow-400={notification.type == "warning"}
->
-	<div class="flex flex-col px-4 py-2">
-		<h2 class="text-xl font-semibold flex flex-row items-center gap-3">{@html notification.message} {#if notification.selector}
-			<button on:click={() => {
-				if (!notification.selector) {
-					return
-				}
-
-				const element = document.querySelector(notification.selector);
+	function focusSelector() {
+		const element = document.querySelector(notification.selector as string) as HTMLElement | null;
 
 		if (!element) {
 			return
@@ -40,7 +26,19 @@
 		setTimeout(() => {
 			element?.classList.remove("bg-red-300")
 		}, 3000)
-			}} class="p-1.5 border rounded-lg" title="Anzeigen"><OpenInNewWindow size={18}></OpenInNewWindow></button>
+	}
+</script>
+
+<div
+	class="border rounded-lg bg-white shadow-md flex flex-row border-l-8" in:fly={{x: 200, duration: 200}} out:fly={{x: 200, duration: 200}}
+	class:border-l-red-400={notification.type == "error"}
+	class:border-l-blue-400={notification.type == "info"}
+	class:border-l-green-400={notification.type == "success"}
+	class:border-l-yellow-400={notification.type == "warning"}
+>
+	<div class="flex flex-col px-4 py-2">
+		<h2 class="text-xl font-semibold flex flex-row items-center gap-3">{@html notification.message} {#if notification.selector}
+			<button on:click={focusSelector} class="p-1.5 border rounded-lg" title="Anzeigen"><OpenInNewWindow size={18}></OpenInNewWindow></button>
 		{/if}</h2>
 		<p class="text-gray-600 text-lg"><slot></slot></p>
 	</div>

src/components/PlzSuche.svelte

@@ -1,8 +1,5 @@
 <script lang="ts">
-	import Label from "./Label.svelte";
-	import { client } from "src/trpc";
-	import type { inferProcedureOutput } from "@trpc/server";
-	import type { AppRouter } from "@ibcornelsen/api";
+	import { API, api, inferOutput } from "astro-typesafe-api/client";
 
 	export let name: string;
 	export let readonly: boolean = false;
@@ -11,7 +8,7 @@
 
 
 	let hideZipDropdown: boolean = true;
-	let zipCodes: inferProcedureOutput<AppRouter["v1"]["postleitzahlen"]> = [];
+	let zipCodes: inferOutput<API["postleitzahlen"]["GET"]> = [];
 
 	async function fetchZipCodeInformation() {
 		if (!zip || (zip.length < 2)) {
@@ -19,7 +16,7 @@
 		}
 
 		try {
-			const result = await client.v1.postleitzahlen.query({ plz: zip });
+			const result = await api.postleitzahlen.GET.fetch({ plz: zip });
 			
 			if (result.length > 0) {
 				zipCodes = result;
@@ -68,7 +65,7 @@
 		maxlength="5"
 	/>
 
-	<div data-test="plz-container" class="absolute top-[calc(100%+4px)] left-0 z-10 bg-white py-2 shadow-md rounded-lg" hidden={hideZipDropdown}>
+	<div data-test="plz-container" class="absolute top-[calc(100%+4px)] left-0 w-full bg-white py-2 shadow-md rounded-lg z-50" hidden={hideZipDropdown}>
 		{#each zipCodes as zipCode}
 			<div class="hover:bg-gray-100 cursor-pointer px-2 py-0.5 text-nowrap" tabindex="-1" on:click={() => {
 				zip = zipCode.plz;

src/components/Tabellen/A10WaermequellenAnlagentechnikTrinkwarmwasser.svelte

@@ -0,0 +1,122 @@
+
+<script lang="ts">
+    import { A10BerechnungWaermequellenAnlagentechnikTrinkwarmwasser} from "#lib/Berechnungen/BedarfsausweisWohnen/A10BerechnungWaermequellenAnlagentechnikTrinkwarmwasser.js";
+ 
+   $: result = A10BerechnungWaermequellenAnlagentechnikTrinkwarmwasser();
+ 
+ 
+</script>
+
+
+<div class="overflow-x-auto mt-16">
+    <table class="table-auto border-collapse border border-gray-300 w-full text-sm">
+      <!-- Tabellenkopf -->
+      <thead>
+        <tr class="bg-gray-200 text-left">
+          <th colspan="4" class="border border-gray-300 p-2">
+            <h2>Tabelle A.10 — Trinkwassererwärmung – Berechnung der monatlichen Wärmequellen aus Anlagentechnik Trinkwassererwärmung</h2>
+          </th>
+        </tr>
+        <th class="border border-gray-300 px-4 py-2">Monat</th>
+        <th class="border border-gray-300 px-4 py-2">
+          Tage im Monat<br>
+          d<sub>mth</sub> [d] (1)
+        </th>
+        <th class="border border-gray-300 px-4 py-2">
+          Trinkwasserwärmebedarf<br>
+          Q<sub>w,b</sub> [kWh] aus Tabelle A.9<br>
+          (2)
+        </th>
+        <th class="border border-gray-300 px-4 py-2">
+          Wärmequellen Anlagentechnik<br>
+          Q<sub>l,source,w</sub> =  Q<sub>w,b</sub> · f<sub>A-w</sub> [kWh]<br>
+          (4) = (2) · (3)
+        </th>
+        <tr class="text-center">
+          <th colspan="3" class="border border-gray-300 p-2"></th>
+          <th colspan="1" class="border border-gray-300 p-2"> (3) = f<sub>A-w</sub><br>aus Tabelle 142 bzw. Tabelle 143</th>
+          <tr class="text-center h-10">
+            <th colspan="3" class="border border-gray-300 p-2"></th>
+            <th colspan="1" class="border border-gray-300 p-2 bg-blue-100">{result.FaktorNutzbareWaermeTrinkwarmwasser}</th>
+          </tr>
+      </thead>
+  
+      <!-- Tabellenkörper -->
+      <tbody>
+        <!-- Monatszeilen -->
+        <tr>
+          <td class="w-1/4 border border-gray-300 p-2 text-center">Januar</td>
+          <td class="w-1/4 border border-gray-300 p-2 text-center bg-gray-100">31</td>
+          <td class="border border-gray-300 p-2 text-center bg-yellow-100">{Math.round(result.trinkwasserWaermebedarf.Januar)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenAnlagentechnikTrinkwarmwasser.Januar)}</td>
+        </tr>
+        <tr>
+          <td class="w-1/4 border border-gray-300 p-2 text-center">Februar</td>
+          <td class="w-1/4 border border-gray-300 p-2 text-center bg-gray-100">28</td>
+          <td class="border border-gray-300 p-2 text-center bg-yellow-100">{Math.round(result.trinkwasserWaermebedarf.Februar)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenAnlagentechnikTrinkwarmwasser.Februar)}</td>
+        </tr>
+        <tr>
+          <td class="w-1/4 border border-gray-300 p-2 text-center">März</td>
+          <td class="w-1/4 border border-gray-300 p-2 text-center bg-gray-100">31</td>
+          <td class="border border-gray-300 p-2 text-center bg-yellow-100">{Math.round(result.trinkwasserWaermebedarf.Maerz)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenAnlagentechnikTrinkwarmwasser.Maerz)}</td>
+        </tr>
+        <tr>
+          <td class="w-1/4 border border-gray-300 p-2 text-center">April</td>
+          <td class="w-1/4 border border-gray-300 p-2 text-center bg-gray-100">30</td>
+          <td class="border border-gray-300 p-2 text-center bg-yellow-100">{Math.round(result.trinkwasserWaermebedarf.April)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenAnlagentechnikTrinkwarmwasser.April)}</td>
+        </tr>
+        <tr>
+          <td class="w-1/4 border border-gray-300 p-2 text-center">Mai</td>
+          <td class="w-1/4 border border-gray-300 p-2 text-center bg-gray-100">31</td>
+          <td class="border border-gray-300 p-2 text-center bg-yellow-100">{Math.round(result.trinkwasserWaermebedarf.Mai)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenAnlagentechnikTrinkwarmwasser.Mai)}</td>
+        </tr>
+        <tr>
+          <td class="w-1/4 border border-gray-300 p-2 text-center">Juni</td>
+          <td class="w-1/4 border border-gray-300 p-2 text-center bg-gray-100">30</td>
+          <td class="border border-gray-300 p-2 text-center bg-yellow-100">{Math.round(result.trinkwasserWaermebedarf.Juni)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenAnlagentechnikTrinkwarmwasser.Juni)}</td>
+        </tr>
+        <tr>
+          <td class="w-1/4 border border-gray-300 p-2 text-center">Juli</td>
+          <td class="w-1/4 border border-gray-300 p-2 text-center bg-gray-100">31</td>
+          <td class="border border-gray-300 p-2 text-center bg-yellow-100">{Math.round(result.trinkwasserWaermebedarf.Juli)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenAnlagentechnikTrinkwarmwasser.Juli)}</td>
+        </tr>
+        <tr>
+          <td class="w-1/4 border border-gray-300 p-2 text-center">August</td>
+          <td class="w-1/4 border border-gray-300 p-2 text-center bg-gray-100">31</td>
+          <td class="border border-gray-300 p-2 text-center bg-yellow-100">{Math.round(result.trinkwasserWaermebedarf.August)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenAnlagentechnikTrinkwarmwasser.August)}</td>
+        </tr>
+        <tr>
+          <td class="w-1/4 border border-gray-300 p-2 text-center">September</td>
+          <td class="w-1/4 border border-gray-300 p-2 text-center bg-gray-100">30</td>
+          <td class="border border-gray-300 p-2 text-center bg-yellow-100">{Math.round(result.trinkwasserWaermebedarf.September)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenAnlagentechnikTrinkwarmwasser.September)}</td>
+        </tr>
+        <tr>
+          <td class="w-1/4 border border-gray-300 p-2 text-center">Oktober</td>
+          <td class="w-1/4 border border-gray-300 p-2 text-center bg-gray-100">31</td>
+          <td class="border border-gray-300 p-2 text-center bg-yellow-100">{Math.round(result.trinkwasserWaermebedarf.Oktober)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenAnlagentechnikTrinkwarmwasser.Oktober)}</td>
+        </tr>
+        <tr>
+          <td class="w-1/4 border border-gray-300 p-2 text-center">November</td>
+          <td class="w-1/4 border border-gray-300 p-2 text-center bg-gray-100">30</td>
+          <td class="border border-gray-300 p-2 text-center bg-yellow-100">{Math.round(result.trinkwasserWaermebedarf.November)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenAnlagentechnikTrinkwarmwasser.November)}</td>
+        </tr>
+        <tr>
+          <td class="w-1/4 border border-gray-300 p-2 text-center">Dezember</td>
+          <td class="w-1/4 border border-gray-300 p-2 text-center bg-gray-100">31</td>
+          <td class="border border-gray-300 p-2 text-center bg-yellow-100">{Math.round(result.trinkwasserWaermebedarf.Dezember)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenAnlagentechnikTrinkwarmwasser.Dezember)}</td>
+        </tr>
+        
+        <!-- Summenzeile -->
+      </tbody>
+    </table>

src/components/Tabellen/A11WaermequellenZusammenstellung.svelte

@@ -0,0 +1,182 @@
+<script lang="ts">
+    import { A11BerechnungWaermequellenZusammenstellung } from "#lib/Berechnungen/BedarfsausweisWohnen/A11BerechnungWaermequellenZusammenstellung.js";
+  
+  $: result = A11BerechnungWaermequellenZusammenstellung();
+  
+  
+</script>
+
+
+<div class="overflow-x-auto mt-16">
+    <table class="table-auto border-collapse border border-gray-300 w-full text-left">
+      <thead>
+        <tr class="bg-gray-200 text-left">
+          <th colspan="7" class="border border-gray-300 p-2">
+            <h2>Tabelle A.11 — Gebäude – Zusammenstellung der Wärmequellen</h2>
+          </th>
+        <tr class="text-center">
+          <th colspan="1" class="border border-gray-300 p-2">Bezugsfläche<br>A<sub>NGF</sub> [m<sup>2</sup>]<br>(1)</th>
+          <th colspan="2" class="border border-gray-300 p-2">Interne Wärmequellen q<sub>i</sub> [Wh/m<sup>2</sup>d]<br>
+            (DIN V 18599-10:2018-09, Tabelle 4) (2)</th>
+          <th colspan="4" class="border border-gray-300 p-2"></th>
+          <tr class="text-center h-10">
+            <th colspan="1" class="border border-gray-300 p-2  bg-yellow-100">{result.NettoGrundflaeche}</th>
+            <th colspan="2" class="border border-gray-300 p-2  bg-yellow-100">{result.WaermeQuellenBewohner}</th>
+            <th colspan="4" class="border border-gray-300 p-2"></th>
+          </tr>
+    
+        <tr class="text-center">
+          <th class="border border-gray-300 px-4 py-2 text-gray-700">
+          Monat</th>
+          <th class="border border-gray-300 px-4 py-2 text-gray-700">
+          Tage im Monat<br>d<sub>mth</sub> [d] (3)</th>
+          <th class="border border-gray-300 px-4 py-2 text-gray-700">
+            Interne Wärmequellen<br>
+            Q<sub>l</sub> = A<sub>NGF</sub> · q<sub>l</sub> · d<sub>mth</sub> / 1000 [kWh]<br>(4) = (1) · (2) · (3) / 1000
+          </th>
+          <th class="border border-gray-300 px-4 py-2 text-gray-700">
+            Solare Wärmequellen<br>
+            Q<sub>S,tr</sub> [kWh]<br>aus Tabelle A.7 (5)
+          </th>
+          <th class="border border-gray-300 px-4 py-2 text-gray-700">
+            Wärmequellen Anlagentechnik<br>
+            Q<sub>l,source</sub> =  Q<sub>l,source,h</sub> + Q<sub>l,source,w</sub> [kWh]<br>aus Tabelle A.8 (8) und Tabelle A.10 (4)<br>(6)
+          </th>
+          <th class="border border-gray-300 px-4 py-2 text-gray-700">
+            Summe Wärmequellen als Energie<br>
+            Q<sub>i,ges</sub> = Q<sub>l</sub> + Q<sub>S,tr</sub> +  Q<sub>l,source</sub> [kWh]<br>(7) = (4) + (5) + (6)
+          </th>
+          <th class="border border-gray-300 px-4 py-2 text-gray-700">
+            Summe Wärmequellen als Leistung<br>
+            P<sub>i,ges</sub> =  Q<sub>i,ges</sub> / (24 · d<sub>mth</sub>) · 1000 [W]<br>(8) = (7) / [24 · (3)] · 1000
+          </th>
+        </tr>
+      </thead>
+      <tbody class="text-center">
+        <tr>
+          <td class="border border-gray-300 px-4 py-2">Januar</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">{result.TageMonat.Januar}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.interneWaermeQuellenProMonat.Januar*100)/100}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100">{Math.round(result.summeErgebnisseJanuar*100)/100}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenAnlagentechnikGesamt.Januar)}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenGesamt.Januar)}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenGesamtLeistung.Januar)}</td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 px-4 py-2">Februar</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">{result.TageMonat.Februar}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.interneWaermeQuellenProMonat.Februar*100)/100}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100">{Math.round(result.summeErgebnisseFebruar*100)/100}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenAnlagentechnikGesamt.Februar)}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenGesamt.Februar)}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenGesamtLeistung.Februar)}</td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 px-4 py-2">März</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">{result.TageMonat.Maerz}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.interneWaermeQuellenProMonat.Maerz*100)/100}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100">{Math.round(result.summeErgebnisseMaerz*100)/100}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenAnlagentechnikGesamt.Maerz)}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenGesamt.Maerz)}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenGesamtLeistung.Maerz)}</td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 px-4 py-2">April</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">{result.TageMonat.April}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.interneWaermeQuellenProMonat.April*100)/100}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100">{Math.round(result.summeErgebnisseApril*100)/100}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenAnlagentechnikGesamt.April)}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenGesamt.April)}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenGesamtLeistung.April)}</td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 px-4 py-2">Mai</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">{result.TageMonat.Mai}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.interneWaermeQuellenProMonat.Mai*100)/100}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100">{Math.round(result.summeErgebnisseMai*100)/100}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenAnlagentechnikGesamt.Mai)}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenGesamt.Mai)}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenGesamtLeistung.Mai)}</td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 px-4 py-2">Juni</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">{result.TageMonat.Juni}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.interneWaermeQuellenProMonat.Juni*100)/100}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100">{Math.round(result.summeErgebnisseJuni*100)/100}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenAnlagentechnikGesamt.Juni)}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenGesamt.Juni)}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenGesamtLeistung.Juni)}</td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 px-4 py-2">Juli</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">{result.TageMonat.Juli}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.interneWaermeQuellenProMonat.Juli*100)/100}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100">{Math.round(result.summeErgebnisseJuli*100)/100}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenAnlagentechnikGesamt.Juli)}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenGesamt.Juli)}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenGesamtLeistung.Juli)}</td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 px-4 py-2">August</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">{result.TageMonat.August}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.interneWaermeQuellenProMonat.August*100)/100}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100">{Math.round(result.summeErgebnisseAugust*100)/100}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenAnlagentechnikGesamt.August)}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenGesamt.August)}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenGesamtLeistung.August)}</td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 px-4 py-2">September</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">{result.TageMonat.September}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.interneWaermeQuellenProMonat.September*100)/100}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100">{Math.round(result.summeErgebnisseSeptember*100)/100}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenAnlagentechnikGesamt.September)}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenGesamt.September)}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenGesamtLeistung.September)}</td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 px-4 py-2">Oktober</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">{result.TageMonat.Oktober}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.interneWaermeQuellenProMonat.Oktober*100)/100}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100">{Math.round(result.summeErgebnisseOktober*100)/100}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenAnlagentechnikGesamt.Oktober)}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenGesamt.Oktober)}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenGesamtLeistung.Oktober)}</td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 px-4 py-2">November</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">{result.TageMonat.November}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.interneWaermeQuellenProMonat.November*100)/100}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100">{Math.round(result.summeErgebnisseNovember*100)/100}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenAnlagentechnikGesamt.November)}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenGesamt.November)}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenGesamtLeistung.November)}</td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 px-4 py-2">Dezember</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">{result.TageMonat.Dezember}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.interneWaermeQuellenProMonat.Dezember*100)/100}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100">{Math.round(result.summeErgebnisseDezember*100)/100}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenAnlagentechnikGesamt.Dezember)}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenGesamt.Dezember)}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.WaermeQuellenGesamtLeistung.Dezember)}</td>
+        </tr>
+       
+        <tr class="text-center h-10">
+          <th colspan="2" class="border border-gray-300 p-2">Jahressummen</th>
+          <th colspan="1" class="border-2 border-gray-600 p-2">{Math.round(result.interneWaermeQuellenGesamt)}</th>
+          <th colspan="1" class="border-2 border-gray-600 p-2">{Math.round(result.summeErgebnisseGesamt)}</th>
+          <th colspan="1" class="border-2 border-gray-600 p-2">{Math.round(result.summeWaermeQuellenAnlagentechnikGesamt)}</th>
+          <th colspan="1" class="border-2 border-gray-600 p-2">{Math.round(result.summeWaermeQuellenGesamt)}</th>
+          <th colspan="1" class="border-2 border-gray-600 p-2">{Math.round(result.summeWaermeQuellenGesamtLeistung)}</th>
+        </tr>
+      </tbody>
+      <tfoot>
+        <tr>
+          <td colspan="7" class="border border-gray-300 px-4 py-2 text-sm">
+            Interne Wärmequellen<sup>a</sup>: EFH: q<sub>i</sub> = 45 Wh/m<sup>2</sup>d; MFH: q<sub>i</sub> = 90 Wh/m<sup>2</sup>d<br>
+            <sup>a</sup> Werte sind auf Nettogrundfläche (NGF) bezogen.
+          </td>
+        </tr>
+      </tfoot>
+    </table>

src/components/Tabellen/A12NutzenergiebedarfHeizung.svelte

@@ -1,293 +1,10 @@
-
-
 <script lang="ts">
-  import { BedarfsausweisWohnenClient, GebaeudeAufnahmeClient } from "#components/Ausweis/types.js";
-  import { funktionMonatlicherBelastungsgrad } from "#lib/Berechnungen/BedarfsausweisWohnen/funktionMonatlicherBelastungsgrad.js";
-  import { funktionBilanzInnentemperatur } from "#lib/Berechnungen/BedarfsausweisWohnen/funktionBilanzInnentemperatur.js";
-  import { funktionAusnutzungsgrad } from "#lib/Berechnungen/BedarfsausweisWohnen/funktionAusnutzungsgrad.js";
+  import { A12BerechnungNutzenergiebedarfHeizung } from "#lib/Berechnungen/BedarfsausweisWohnen/A12BerechnungNutzenergiebedarfHeizung.js";
 
-  export let ausweis: BedarfsausweisWohnenClient;
-  export let gebaeude_aufnahme: GebaeudeAufnahmeClient;
+$: result = A12BerechnungNutzenergiebedarfHeizung();
 
-  // Beispielwerte - müssen noch errechnet werden
-  let heizlast = 150;
-  let zeitkonstante = 90;
-  let maximalerWaermestrom = 10000;
-
-  let waermeQuellen = {
-    Januar: 100,
-    Februar: 100,
-    März: 100,
-    April: 650,
-    Mai: 400,
-    Juni: 450,
-    Juli: 450,
-    August: 560,
-    September: 400,
-    Oktober: 350,
-    November: 320,
-    Dezember: 300
-  };
-
-
-  // Konstanten
-  let minimaleAussentemperatur = -12;
-  let innenTemperatur = 20;
-
-  let waermequellensenkenverhaeltnisJanuar = 0;
-  let waermequellensenkenverhaeltnisFebruar = 0;
-  let waermequellensenkenverhaeltnisMärz = 0;
-  let waermequellensenkenverhaeltnisApril = 0;
-  let waermequellensenkenverhaeltnisMai = 0;
-  let waermequellensenkenverhaeltnisJuni = 0;
-  let waermequellensenkenverhaeltnisJuli = 0;
-  let waermequellensenkenverhaeltnisAugust = 0;
-  let waermequellensenkenverhaeltnisSeptember = 0;
-  let waermequellensenkenverhaeltnisOktober = 0;
-  let waermequellensenkenverhaeltnisNovember = 0;
-  let waermequellensenkenverhaeltnisDezember = 0;
-    
-  let faktorBelastungJanuar = 0; 
-  let faktorBelastungFebruar = 0;
-  let faktorBelastungMärz = 0;
-  let faktorBelastungApril = 0;
-  let faktorBelastungMai = 0;
-  let faktorBelastungJuni = 0;
-  let faktorBelastungJuli = 0;
-  let faktorBelastungAugust = 0;
-  let faktorBelastungSeptember = 0;
-  let faktorBelastungOktober = 0;
-  let faktorBelastungNovember = 0;
-  let faktorBelastungDezember = 0;
-
-  let monatlicheBelastungJanuar = 0;
-  let monatlicheBelastungFebruar = 0;
-  let monatlicheBelastungMärz = 0;
-  let monatlicheBelastungApril = 0;
-  let monatlicheBelastungMai = 0;
-  let monatlicheBelastungJuni = 0;
-  let monatlicheBelastungJuli = 0;
-  let monatlicheBelastungAugust = 0;
-  let monatlicheBelastungSeptember = 0;
-  let monatlicheBelastungOktober = 0;
-  let monatlicheBelastungNovember = 0;
-  let monatlicheBelastungDezember = 0;
-  
-  let heizstundenJanuar = 0;
-  let heizstundenFebruar = 0;
-  let heizstundenMärz = 0;
-  let heizstundenApril = 0;
-  let heizstundenMai = 0;
-  let heizstundenJuni = 0;
-  let heizstundenJuli = 0;
-  let heizstundenAugust = 0;
-  let heizstundenSeptember = 0;
-  let heizstundenOktober = 0;
-  let heizstundenNovember = 0;
-  let heizstundenDezember = 0;
-
-  let nutzenergieHeizungJanuar = 0;
-  let nutzenergieHeizungFebruar = 0;
-  let nutzenergieHeizungMärz = 0;
-  let nutzenergieHeizungApril = 0;
-  let nutzenergieHeizungMai = 0;
-  let nutzenergieHeizungJuni = 0;
-  let nutzenergieHeizungJuli = 0;
-  let nutzenergieHeizungAugust = 0;
-  let nutzenergieHeizungSeptember = 0;
-  let nutzenergieHeizungOktober = 0;
-  let nutzenergieHeizungNovember = 0;
-  let nutzenergieHeizungDezember = 0;
-   
-  let waermeSenken = {
-    Januar: 0,
-    Februar: 0,
-    März: 0,
-    April: 0,
-    Mai: 0,
-    Juni: 0,
-    Juli: 0,
-    August: 0,
-    September: 0,
-    Oktober: 0,
-    November: 0,
-    Dezember: 0
-  };
-
-
-  let belastungsgrade = {
-    Januar: 0,
-    Februar: 0,
-    März: 0,
-    April: 0,
-    Mai: 0,
-    Juni: 0,
-    Juli: 0,
-    August: 0,
-    September: 0,
-    Oktober: 0,
-    November: 0,
-    Dezember: 0
-  };
-
-  let bilanzInnenTemperaturen = {
-    Januar: 0,
-    Februar: 0,
-    März: 0,
-    April: 0,
-    Mai: 0,
-    Juni: 0,
-    Juli: 0,
-    August: 0,
-    September: 0,
-    Oktober: 0,
-    November: 0,
-    Dezember: 0
-  };
-
-  let ausnutzungsgradJanuar = 0;
-  let ausnutzungsgradFebruar = 0;
-  let ausnutzungsgradMärz = 0;
-  let ausnutzungsgradApril = 0;
-  let ausnutzungsgradMai = 0;
-  let ausnutzungsgradJuni = 0;
-  let ausnutzungsgradJuli = 0;
-  let ausnutzungsgradAugust = 0;
-  let ausnutzungsgradSeptember = 0;
-  let ausnutzungsgradOktober = 0;
-  let ausnutzungsgradNovember = 0;
-  let ausnutzungsgradDezember = 0;
-
-  $: {
-    belastungsgrade.Januar = funktionMonatlicherBelastungsgrad(heizlast, zeitkonstante, "Januar");
-    belastungsgrade.Februar = funktionMonatlicherBelastungsgrad(heizlast, zeitkonstante, "Februar");
-    belastungsgrade.März = funktionMonatlicherBelastungsgrad(heizlast, zeitkonstante, "März");
-    belastungsgrade.April = funktionMonatlicherBelastungsgrad(heizlast, zeitkonstante, "April");
-    belastungsgrade.Mai = funktionMonatlicherBelastungsgrad(heizlast, zeitkonstante, "Mai");
-    belastungsgrade.Juni = funktionMonatlicherBelastungsgrad(heizlast, zeitkonstante, "Juni");
-    belastungsgrade.Juli = funktionMonatlicherBelastungsgrad(heizlast, zeitkonstante, "Juli");
-    belastungsgrade.August = funktionMonatlicherBelastungsgrad(heizlast, zeitkonstante, "August");
-    belastungsgrade.September = funktionMonatlicherBelastungsgrad(heizlast, zeitkonstante, "September");
-    belastungsgrade.Oktober = funktionMonatlicherBelastungsgrad(heizlast, zeitkonstante, "Oktober");
-    belastungsgrade.November = funktionMonatlicherBelastungsgrad(heizlast, zeitkonstante, "November");
-    belastungsgrade.Dezember = funktionMonatlicherBelastungsgrad(heizlast, zeitkonstante, "Dezember");		
-
-    bilanzInnenTemperaturen.Januar = funktionBilanzInnentemperatur(heizlast, zeitkonstante, "Januar");
-    bilanzInnenTemperaturen.Februar = funktionBilanzInnentemperatur(heizlast, zeitkonstante, "Februar");
-    bilanzInnenTemperaturen.März = funktionBilanzInnentemperatur(heizlast, zeitkonstante, "März");
-    bilanzInnenTemperaturen.April = funktionBilanzInnentemperatur(heizlast, zeitkonstante, "April");
-    bilanzInnenTemperaturen.Mai = funktionBilanzInnentemperatur(heizlast, zeitkonstante, "Mai");
-    bilanzInnenTemperaturen.Juni = funktionBilanzInnentemperatur(heizlast, zeitkonstante, "Juni");
-    bilanzInnenTemperaturen.Juli = funktionBilanzInnentemperatur(heizlast, zeitkonstante, "Juli");
-    bilanzInnenTemperaturen.August = funktionBilanzInnentemperatur(heizlast, zeitkonstante, "August");
-    bilanzInnenTemperaturen.September = funktionBilanzInnentemperatur(heizlast, zeitkonstante, "September");
-    bilanzInnenTemperaturen.Oktober = funktionBilanzInnentemperatur(heizlast, zeitkonstante, "Oktober");
-    bilanzInnenTemperaturen.November = funktionBilanzInnentemperatur(heizlast, zeitkonstante, "November");
-    bilanzInnenTemperaturen.Dezember = funktionBilanzInnentemperatur(heizlast, zeitkonstante, "Dezember");
-
-		console.log(belastungsgrade.Juli, bilanzInnenTemperaturen.Juli);
-
-
-    waermeSenken.Januar = maximalerWaermestrom * (bilanzInnenTemperaturen.Januar - minimaleAussentemperatur) / (innenTemperatur - minimaleAussentemperatur) * belastungsgrade.Januar;
-    waermeSenken.Februar = maximalerWaermestrom * (bilanzInnenTemperaturen.Februar - minimaleAussentemperatur) / (innenTemperatur - minimaleAussentemperatur) * belastungsgrade.Februar;
-    waermeSenken.März = maximalerWaermestrom * (bilanzInnenTemperaturen.März - minimaleAussentemperatur) / (innenTemperatur - minimaleAussentemperatur) * belastungsgrade.März;
-    waermeSenken.April = maximalerWaermestrom * (bilanzInnenTemperaturen.April - minimaleAussentemperatur) / (innenTemperatur - minimaleAussentemperatur) * belastungsgrade.April;
-    waermeSenken.Mai = maximalerWaermestrom * (bilanzInnenTemperaturen.Mai - minimaleAussentemperatur) / (innenTemperatur - minimaleAussentemperatur) * belastungsgrade.Mai;
-    waermeSenken.Juni = maximalerWaermestrom * (bilanzInnenTemperaturen.Juni - minimaleAussentemperatur) / (innenTemperatur - minimaleAussentemperatur) * belastungsgrade.Juni;
-    waermeSenken.Juli = maximalerWaermestrom * (bilanzInnenTemperaturen.Juli - minimaleAussentemperatur) / (innenTemperatur - minimaleAussentemperatur) * belastungsgrade.Juli;
-    waermeSenken.August = maximalerWaermestrom * (bilanzInnenTemperaturen.August - minimaleAussentemperatur) / (innenTemperatur - minimaleAussentemperatur) * belastungsgrade.August;
-    waermeSenken.September = maximalerWaermestrom * (bilanzInnenTemperaturen.September - minimaleAussentemperatur) / (innenTemperatur - minimaleAussentemperatur) * belastungsgrade.September;
-    waermeSenken.Oktober = maximalerWaermestrom * (bilanzInnenTemperaturen.Oktober - minimaleAussentemperatur) / (innenTemperatur - minimaleAussentemperatur) * belastungsgrade.Oktober;
-    waermeSenken.November = maximalerWaermestrom * (bilanzInnenTemperaturen.November - minimaleAussentemperatur) / (innenTemperatur - minimaleAussentemperatur) * belastungsgrade.November;
-    waermeSenken.Dezember = maximalerWaermestrom * (bilanzInnenTemperaturen.Dezember - minimaleAussentemperatur) / (innenTemperatur - minimaleAussentemperatur) * belastungsgrade.Dezember;
-
-
-    waermequellensenkenverhaeltnisJanuar = waermeQuellen.Januar / waermeSenken.Januar;
-    waermequellensenkenverhaeltnisFebruar = waermeQuellen.Februar / waermeSenken.Februar;
-    waermequellensenkenverhaeltnisMärz = waermeQuellen.März / waermeSenken.März;
-    waermequellensenkenverhaeltnisApril = waermeQuellen.April / waermeSenken.April;
-    waermequellensenkenverhaeltnisMai = waermeQuellen.Mai / waermeSenken.Mai;
-    waermequellensenkenverhaeltnisJuni = waermeQuellen.Juni / waermeSenken.Juni;
-    waermequellensenkenverhaeltnisJuli = waermeQuellen.Juli / waermeSenken.Juli;
-    waermequellensenkenverhaeltnisAugust = waermeQuellen.August / waermeSenken.August;
-    waermequellensenkenverhaeltnisSeptember = waermeQuellen.September / waermeSenken.September;
-    waermequellensenkenverhaeltnisOktober = waermeQuellen.Oktober / waermeSenken.Oktober;
-    waermequellensenkenverhaeltnisNovember = waermeQuellen.November / waermeSenken.November;
-    waermequellensenkenverhaeltnisDezember = waermeQuellen.Dezember / waermeSenken.Dezember;
-
-		console.log(waermequellensenkenverhaeltnisJuli);
-		
-
-    ausnutzungsgradJanuar = funktionAusnutzungsgrad(waermequellensenkenverhaeltnisJanuar, zeitkonstante, "alleMonate");
-    ausnutzungsgradFebruar = funktionAusnutzungsgrad(waermequellensenkenverhaeltnisFebruar, zeitkonstante, "alleMonate");
-    ausnutzungsgradMärz = funktionAusnutzungsgrad(waermequellensenkenverhaeltnisMärz, zeitkonstante, "alleMonate");
-    ausnutzungsgradApril = funktionAusnutzungsgrad(waermequellensenkenverhaeltnisApril, zeitkonstante, "alleMonate");
-    ausnutzungsgradMai = funktionAusnutzungsgrad(waermequellensenkenverhaeltnisMai, zeitkonstante, "alleMonate");
-    ausnutzungsgradJuni = funktionAusnutzungsgrad(waermequellensenkenverhaeltnisJuni, zeitkonstante, "alleMonate");
-    ausnutzungsgradJuli = funktionAusnutzungsgrad(waermequellensenkenverhaeltnisJuli, zeitkonstante, "alleMonate");
-    ausnutzungsgradAugust = funktionAusnutzungsgrad(waermequellensenkenverhaeltnisAugust, zeitkonstante, "alleMonate");
-    ausnutzungsgradSeptember = funktionAusnutzungsgrad(waermequellensenkenverhaeltnisSeptember, zeitkonstante, "alleMonate");
-    ausnutzungsgradOktober = funktionAusnutzungsgrad(waermequellensenkenverhaeltnisOktober, zeitkonstante, "alleMonate");
-    ausnutzungsgradNovember = funktionAusnutzungsgrad(waermequellensenkenverhaeltnisNovember, zeitkonstante, "alleMonate");
-    ausnutzungsgradDezember = funktionAusnutzungsgrad(waermequellensenkenverhaeltnisDezember, zeitkonstante, "alleMonate");
-
-    faktorBelastungJanuar = Math.max(1 - (waermequellensenkenverhaeltnisJanuar * ausnutzungsgradJanuar), 0);
-    faktorBelastungFebruar = Math.max(1 - (waermequellensenkenverhaeltnisFebruar * ausnutzungsgradFebruar), 0);
-    faktorBelastungMärz = Math.max(1 - (waermequellensenkenverhaeltnisMärz * ausnutzungsgradMärz), 0);
-    faktorBelastungApril = Math.max(1 - (waermequellensenkenverhaeltnisApril * ausnutzungsgradApril), 0);
-    faktorBelastungMai = Math.max(1 - (waermequellensenkenverhaeltnisMai * ausnutzungsgradMai), 0);
-    faktorBelastungJuni = Math.max(1 - (waermequellensenkenverhaeltnisJuni * ausnutzungsgradJuni), 0);
-    faktorBelastungJuli = Math.max(1 - (waermequellensenkenverhaeltnisJuli * ausnutzungsgradJuli), 0);
-    faktorBelastungAugust = Math.max(1 - (waermequellensenkenverhaeltnisAugust * ausnutzungsgradAugust), 0);
-    faktorBelastungSeptember = Math.max(1 - (waermequellensenkenverhaeltnisSeptember * ausnutzungsgradSeptember), 0);
-    faktorBelastungOktober = Math.max(1 - (waermequellensenkenverhaeltnisOktober * ausnutzungsgradOktober), 0);
-    faktorBelastungNovember = Math.max(1 - (waermequellensenkenverhaeltnisNovember * ausnutzungsgradNovember), 0);
-    faktorBelastungDezember = Math.max(1 - (waermequellensenkenverhaeltnisDezember * ausnutzungsgradDezember), 0);
-
-    monatlicheBelastungJanuar = belastungsgrade.Januar * faktorBelastungJanuar;
-    monatlicheBelastungFebruar = belastungsgrade.Februar * faktorBelastungFebruar;
-    monatlicheBelastungMärz = belastungsgrade.März * faktorBelastungMärz;
-    monatlicheBelastungApril = belastungsgrade.April * faktorBelastungApril;
-    monatlicheBelastungMai = belastungsgrade.Mai * faktorBelastungMai;
-    monatlicheBelastungJuni = belastungsgrade.Juni * faktorBelastungJuni;
-    monatlicheBelastungJuli = belastungsgrade.Juli * faktorBelastungJuli;
-    monatlicheBelastungAugust = belastungsgrade.August * faktorBelastungAugust;
-    monatlicheBelastungSeptember = belastungsgrade.September * faktorBelastungSeptember;
-    monatlicheBelastungOktober = belastungsgrade.Oktober * faktorBelastungOktober;
-    monatlicheBelastungNovember = belastungsgrade.November * faktorBelastungNovember;
-    monatlicheBelastungDezember = belastungsgrade.Dezember * faktorBelastungDezember;
-
-    if (monatlicheBelastungJanuar > 0.05) {heizstundenJanuar = 31 * 24;} else {heizstundenJanuar = (monatlicheBelastungJanuar / 0.05) * 31 * 24;}
-    if (monatlicheBelastungFebruar > 0.05) {heizstundenFebruar = 28 * 24;} else {heizstundenFebruar = (monatlicheBelastungFebruar / 0.05) * 28 * 24;}
-    if (monatlicheBelastungMärz > 0.05) {heizstundenMärz = 31 * 24;} else {heizstundenMärz = (monatlicheBelastungMärz / 0.05) * 31 * 24;}
-    if (monatlicheBelastungApril > 0.05) {heizstundenApril = 30 * 24;} else {heizstundenApril = (monatlicheBelastungApril / 0.05) * 30 * 24;}
-    if (monatlicheBelastungMai > 0.05) {heizstundenMai = 31 * 24;} else {heizstundenMai = (monatlicheBelastungMai / 0.05) * 31 * 24;}
-    if (monatlicheBelastungJuni > 0.05) {heizstundenJuni = 30 * 24;} else {heizstundenJuni = (monatlicheBelastungJuni / 0.05) * 30 * 24;}
-    if (monatlicheBelastungJuli > 0.05) {heizstundenJuli = 31 * 24;} else {heizstundenJuli = (monatlicheBelastungJuli / 0.05) * 31 * 24;}
-    if (monatlicheBelastungAugust > 0.05) {heizstundenAugust = 31 * 24;} else {heizstundenAugust = (monatlicheBelastungAugust / 0.05) * 31 * 24;}
-    if (monatlicheBelastungSeptember > 0.05) {heizstundenSeptember = 30 * 24;} else {heizstundenSeptember = (monatlicheBelastungSeptember / 0.05) * 30 * 24;}
-    if (monatlicheBelastungOktober > 0.05) {heizstundenOktober = 31 * 24;} else {heizstundenOktober = (monatlicheBelastungOktober / 0.05) * 31 * 24;}
-    if (monatlicheBelastungNovember > 0.05) {heizstundenNovember = 30 * 24;} else {heizstundenNovember = (monatlicheBelastungNovember / 0.05) * 30 * 24;}
-    if (monatlicheBelastungDezember > 0.05) {heizstundenDezember = 31 * 24;} else {heizstundenDezember = (monatlicheBelastungDezember / 0.05) * 31 * 24;}
-
-    nutzenergieHeizungJanuar = waermeSenken.Januar * faktorBelastungJanuar * heizstundenJanuar / 1000;
-    nutzenergieHeizungFebruar = waermeSenken.Februar * faktorBelastungFebruar * heizstundenFebruar / 1000;
-    nutzenergieHeizungMärz = waermeSenken.März * faktorBelastungMärz * heizstundenMärz / 1000;
-    nutzenergieHeizungApril = waermeSenken.April * faktorBelastungApril * heizstundenApril / 1000;
-    nutzenergieHeizungMai = waermeSenken.Mai * faktorBelastungMai * heizstundenMai / 1000;
-    nutzenergieHeizungJuni = waermeSenken.Juni * faktorBelastungJuni * heizstundenJuni / 1000;
-    nutzenergieHeizungJuli = waermeSenken.Juli * faktorBelastungJuli * heizstundenJuli / 1000;
-    nutzenergieHeizungAugust = waermeSenken.August * faktorBelastungAugust * heizstundenAugust / 1000;
-    nutzenergieHeizungSeptember = waermeSenken.September * faktorBelastungSeptember * heizstundenSeptember / 1000;
-    nutzenergieHeizungOktober = waermeSenken.Oktober * faktorBelastungOktober * heizstundenOktober / 1000;
-    nutzenergieHeizungNovember = waermeSenken.November * faktorBelastungNovember * heizstundenNovember / 1000;
-    nutzenergieHeizungDezember = waermeSenken.Dezember * faktorBelastungDezember * heizstundenDezember / 1000;
-
-  }
 </script>
 
-
-
 <div class="overflow-x-auto mt-16">
     <table class="table-auto border-collapse border border-gray-300 w-full text-left">
       <thead>
@@ -311,9 +28,9 @@
         </tr>
           
           <tr class="text-center h-10">
-            <th colspan="1" class="border border-gray-300 p-2  bg-gray-100">-12</th>
-            <th colspan="1" class="border border-gray-300 p-2  bg-gray-100">20</th>
-            <th colspan="2" class="border border-gray-300 p-2  bg-yellow-100"></th>
+            <th colspan="1" class="border border-gray-300 p-2  bg-gray-100">{result.minimaleAussentemperatur}</th>
+            <th colspan="1" class="border border-gray-300 p-2  bg-gray-100">{result.innenTemperatur}</th>
+            <th colspan="2" class="border border-gray-300 p-2  bg-yellow-100">{Math.round(result.maximalerWaermestromGesamt)}</th>
             <th colspan="8" class="border border-gray-300 p-2"></th>
           </tr>
     
@@ -335,201 +52,201 @@
     <tbody>
       <tr>
         <td class="border border-gray-300 px-2 py-1 bg-gray-100">31</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(bilanzInnenTemperaturen.Januar*1000)/1000}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.bilanzInnenTemperaturen.Januar*1000)/1000}</td>
         <td class="border border-gray-300 px-2 py-1 bg-gray-100">1,0</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(belastungsgrade.Januar*1000)/1000}
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.belastungsgrade.Januar*1000)/1000}
         </td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(waermeSenken.Januar)}</td>
-        <td class="border border-gray-300 px-2 py-1 bg-yellow-100">{Math.round(waermeQuellen.Januar)}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(waermequellensenkenverhaeltnisJanuar*1000)/1000}</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(ausnutzungsgradJanuar*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(faktorBelastungJanuar*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(monatlicheBelastungJanuar*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(heizstundenJanuar)}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(nutzenergieHeizungJanuar)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.waermeSenken.Januar)}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-yellow-100">{Math.round(result.waermeQuellen.Januar)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.waermequellensenkenverhaeltnisJanuar*1000)/1000}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.ausnutzungsgradJanuar*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.faktorBelastungJanuar*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.monatlicheBelastungJanuar*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.heizstundenJanuar)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.nutzenergieHeizungJanuar)}</td>
       </tr>
       <tr>
         <td class="border border-gray-300 px-2 py-1 bg-gray-100">28</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(bilanzInnenTemperaturen.Februar*1000)/1000}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.bilanzInnenTemperaturen.Februar*1000)/1000}</td>
         <td class="border border-gray-300 px-2 py-1 bg-gray-100">1,9</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(belastungsgrade.Februar*1000)/1000}
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.belastungsgrade.Februar*1000)/1000}
         
         </td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(waermeSenken.Februar)}</td>
-        <td class="border border-gray-300 px-2 py-1 bg-yellow-100">{Math.round(waermeQuellen.Februar)}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(waermequellensenkenverhaeltnisFebruar*1000)/1000}</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(ausnutzungsgradFebruar*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(faktorBelastungFebruar*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(monatlicheBelastungFebruar*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(heizstundenFebruar)}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(nutzenergieHeizungFebruar)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.waermeSenken.Februar)}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-yellow-100">{Math.round(result.waermeQuellen.Februar)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.waermequellensenkenverhaeltnisFebruar*1000)/1000}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.ausnutzungsgradFebruar*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.faktorBelastungFebruar*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.monatlicheBelastungFebruar*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.heizstundenFebruar)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.nutzenergieHeizungFebruar)}</td>
       </tr>
       <tr>
         <td class="border border-gray-300 px-2 py-1 bg-gray-100">31</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(bilanzInnenTemperaturen.März*1000)/1000}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.bilanzInnenTemperaturen.März*1000)/1000}</td>
         <td class="border border-gray-300 px-2 py-1 bg-gray-100">4,7</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(belastungsgrade.März*1000)/1000}
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.belastungsgrade.März*1000)/1000}
          
         </td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(waermeSenken.März)}</td>
-        <td class="border border-gray-300 px-2 py-1 bg-yellow-100">{Math.round(waermeQuellen.März)}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(waermequellensenkenverhaeltnisMärz*1000)/1000}</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(ausnutzungsgradMärz*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(faktorBelastungMärz*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(monatlicheBelastungMärz*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(heizstundenMärz)}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(nutzenergieHeizungMärz)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.waermeSenken.März)}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-yellow-100">{Math.round(result.waermeQuellen.Maerz)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.waermequellensenkenverhaeltnisMärz*1000)/1000}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.ausnutzungsgradMärz*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.faktorBelastungMärz*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.monatlicheBelastungMärz*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.heizstundenMärz)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.nutzenergieHeizungMärz)}</td>
       </tr>
       <tr>
         <td class="border border-gray-300 px-2 py-1 bg-gray-100">30</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(bilanzInnenTemperaturen.April*1000)/1000}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.bilanzInnenTemperaturen.April*1000)/1000}</td>
         <td class="border border-gray-300 px-2 py-1 bg-gray-100">9,2</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(belastungsgrade.April*1000)/1000}
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.belastungsgrade.April*1000)/1000}
          
         </td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(waermeSenken.April)}</td>
-        <td class="border border-gray-300 px-2 py-1 bg-yellow-100">{Math.round(waermeQuellen.April)}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(waermequellensenkenverhaeltnisApril*1000)/1000}</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(ausnutzungsgradApril*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(faktorBelastungApril*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(monatlicheBelastungApril*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(heizstundenApril)}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(nutzenergieHeizungApril)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.waermeSenken.April)}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-yellow-100">{Math.round(result.waermeQuellen.April)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.waermequellensenkenverhaeltnisApril*1000)/1000}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.ausnutzungsgradApril*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.faktorBelastungApril*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.monatlicheBelastungApril*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.heizstundenApril)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.nutzenergieHeizungApril)}</td>
       </tr>
       <tr>
         <td class="border border-gray-300 px-2 py-1 bg-gray-100">31</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(bilanzInnenTemperaturen.Mai*1000)/1000}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.bilanzInnenTemperaturen.Mai*1000)/1000}</td>
         <td class="border border-gray-300 px-2 py-1 bg-gray-100">14,1</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(belastungsgrade.Mai*1000)/1000}
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.belastungsgrade.Mai*1000)/1000}
          
         </td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(waermeSenken.Mai)}</td>
-        <td class="border border-gray-300 px-2 py-1 bg-yellow-100">{Math.round(waermeQuellen.Mai)}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(waermequellensenkenverhaeltnisMai*1000)/1000}</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(ausnutzungsgradMai*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(faktorBelastungMai*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(monatlicheBelastungMai*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(heizstundenMai)}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(nutzenergieHeizungMai)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.waermeSenken.Mai)}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-yellow-100">{Math.round(result.waermeQuellen.Mai)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.waermequellensenkenverhaeltnisMai*1000)/1000}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.ausnutzungsgradMai*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.faktorBelastungMai*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.monatlicheBelastungMai*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.heizstundenMai)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.nutzenergieHeizungMai)}</td>
       </tr>
       <tr>
         <td class="border border-gray-300 px-2 py-1 bg-gray-100">30</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(bilanzInnenTemperaturen.Juni*1000)/1000}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.bilanzInnenTemperaturen.Juni*1000)/1000}</td>
         <td class="border border-gray-300 px-2 py-1 bg-gray-100">16,7</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(belastungsgrade.Juni*1000)/1000}
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.belastungsgrade.Juni*1000)/1000}
          
         </td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(waermeSenken.Juni)}</td>
-        <td class="border border-gray-300 px-2 py-1 bg-yellow-100">{Math.round(waermeQuellen.Juni)}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(waermequellensenkenverhaeltnisJuni*1000)/1000}</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(ausnutzungsgradJuni*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(faktorBelastungJuni*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(monatlicheBelastungJuni*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(heizstundenJuni)}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(nutzenergieHeizungJuni)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.waermeSenken.Juni)}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-yellow-100">{Math.round(result.waermeQuellen.Juni)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.waermequellensenkenverhaeltnisJuni*1000)/1000}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.ausnutzungsgradJuni*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.faktorBelastungJuni*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.monatlicheBelastungJuni*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.heizstundenJuni)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.nutzenergieHeizungJuni)}</td>
       </tr>
       <tr>
         <td class="border border-gray-300 px-2 py-1 bg-gray-100">31</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(bilanzInnenTemperaturen.Juli*1000)/1000}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.bilanzInnenTemperaturen.Juli*1000)/1000}</td>
         <td class="border border-gray-300 px-2 py-1 bg-gray-100">19,0</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(belastungsgrade.Juli*1000)/1000}
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.belastungsgrade.Juli*1000)/1000}
          
         </td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(waermeSenken.Juli)}</td>
-        <td class="border border-gray-300 px-2 py-1 bg-yellow-100">{Math.round(waermeQuellen.Juli)}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(waermequellensenkenverhaeltnisJuli*1000)/1000}</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(ausnutzungsgradJuli*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(faktorBelastungJuli*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(monatlicheBelastungJuli*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(heizstundenJuli)}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(nutzenergieHeizungJuli)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.waermeSenken.Juli)}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-yellow-100">{Math.round(result.waermeQuellen.Juli)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.waermequellensenkenverhaeltnisJuli*1000)/1000}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.ausnutzungsgradJuli*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.faktorBelastungJuli*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.monatlicheBelastungJuli*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.heizstundenJuli)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.nutzenergieHeizungJuli)}</td>
       </tr>
       <tr>
         <td class="border border-gray-300 px-2 py-1 bg-gray-100">31</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(bilanzInnenTemperaturen.August*1000)/1000}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.bilanzInnenTemperaturen.August*1000)/1000}</td>
         <td class="border border-gray-300 px-2 py-1 bg-gray-100">18,6</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(belastungsgrade.August*1000)/1000}
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.belastungsgrade.August*1000)/1000}
           
         </td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(waermeSenken.August)}</td>
-        <td class="border border-gray-300 px-2 py-1 bg-yellow-100">{Math.round(waermeQuellen.August)}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(waermequellensenkenverhaeltnisAugust*1000)/1000}</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(ausnutzungsgradAugust*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(faktorBelastungAugust*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(monatlicheBelastungAugust*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(heizstundenAugust)}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(nutzenergieHeizungAugust)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.waermeSenken.August)}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-yellow-100">{Math.round(result.waermeQuellen.August)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.waermequellensenkenverhaeltnisAugust*1000)/1000}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.ausnutzungsgradAugust*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.faktorBelastungAugust*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.monatlicheBelastungAugust*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.heizstundenAugust)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.nutzenergieHeizungAugust)}</td>
       </tr>
       <tr>
         <td class="border border-gray-300 px-2 py-1 bg-gray-100">30</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(bilanzInnenTemperaturen.September*1000)/1000}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.bilanzInnenTemperaturen.September*1000)/1000}</td>
         <td class="border border-gray-300 px-2 py-1 bg-gray-100">14,3</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(belastungsgrade.September*1000)/1000}
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.belastungsgrade.September*1000)/1000}
          
         </td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(waermeSenken.September)}</td>
-        <td class="border border-gray-300 px-2 py-1 bg-yellow-100">{Math.round(waermeQuellen.September)}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(waermequellensenkenverhaeltnisSeptember*1000)/1000}</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(ausnutzungsgradSeptember*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(faktorBelastungSeptember*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(monatlicheBelastungSeptember*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(heizstundenSeptember)}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(nutzenergieHeizungSeptember)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.waermeSenken.September)}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-yellow-100">{Math.round(result.waermeQuellen.September)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.waermequellensenkenverhaeltnisSeptember*1000)/1000}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.ausnutzungsgradSeptember*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.faktorBelastungSeptember*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.monatlicheBelastungSeptember*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.heizstundenSeptember)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.nutzenergieHeizungSeptember)}</td>
       </tr>
       <tr>
         <td class="border border-gray-300 px-2 py-1 bg-gray-100">31</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(bilanzInnenTemperaturen.Oktober*1000)/1000}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.bilanzInnenTemperaturen.Oktober*1000)/1000}</td>
         <td class="border border-gray-300 px-2 py-1 bg-gray-100">9,4</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(belastungsgrade.Oktober*1000)/1000}
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.belastungsgrade.Oktober*1000)/1000}
          
         </td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(waermeSenken.Oktober)}</td>
-        <td class="border border-gray-300 px-2 py-1 bg-yellow-100">{Math.round(waermeQuellen.Oktober)}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(waermequellensenkenverhaeltnisOktober*1000)/1000}</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(ausnutzungsgradOktober*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(faktorBelastungOktober*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(monatlicheBelastungOktober*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(heizstundenOktober)}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(nutzenergieHeizungOktober)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.waermeSenken.Oktober)}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-yellow-100">{Math.round(result.waermeQuellen.Oktober)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.waermequellensenkenverhaeltnisOktober*1000)/1000}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.ausnutzungsgradOktober*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.faktorBelastungOktober*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.monatlicheBelastungOktober*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.heizstundenOktober)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.nutzenergieHeizungOktober)}</td>
       </tr>
       <tr>
         <td class="border border-gray-300 px-2 py-1 bg-gray-100">30</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(bilanzInnenTemperaturen.November*1000)/1000}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.bilanzInnenTemperaturen.November*1000)/1000}</td>
         <td class="border border-gray-300 px-2 py-1 bg-gray-100">4,1</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(belastungsgrade.November*1000)/1000}
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.belastungsgrade.November*1000)/1000}
          
         </td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(waermeSenken.November)}</td>
-        <td class="border border-gray-300 px-2 py-1 bg-yellow-100">{Math.round(waermeQuellen.November)}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(waermequellensenkenverhaeltnisNovember*1000)/1000}</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(ausnutzungsgradNovember*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(faktorBelastungNovember*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(monatlicheBelastungNovember*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(heizstundenNovember)}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(nutzenergieHeizungNovember)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.waermeSenken.November)}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-yellow-100">{Math.round(result.waermeQuellen.November)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.waermequellensenkenverhaeltnisNovember*1000)/1000}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.ausnutzungsgradNovember*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.faktorBelastungNovember*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.monatlicheBelastungNovember*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.heizstundenNovember)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.nutzenergieHeizungNovember)}</td>
       </tr>
       <tr>
         <td class="border border-gray-300 px-2 py-1 bg-gray-100">31</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(bilanzInnenTemperaturen.Dezember*1000)/1000}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.bilanzInnenTemperaturen.Dezember*1000)/1000}</td>
         <td class="border border-gray-300 px-2 py-1 bg-gray-100">0,9</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(belastungsgrade.Dezember*1000)/1000}
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.belastungsgrade.Dezember*1000)/1000}
          
         </td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(waermeSenken.Dezember)}</td>
-        <td class="border border-gray-300 px-2 py-1 bg-yellow-100">{Math.round(waermeQuellen.Dezember)}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(waermequellensenkenverhaeltnisDezember*1000)/1000}</td>
-        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(ausnutzungsgradDezember*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(faktorBelastungDezember*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(monatlicheBelastungDezember*1000)/1000}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(heizstundenDezember)}</td>
-        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(nutzenergieHeizungDezember)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.waermeSenken.Dezember)}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-yellow-100">{Math.round(result.waermeQuellen.Dezember)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.waermequellensenkenverhaeltnisDezember*1000)/1000}</td>
+        <td class="border border-gray-300 px-2 py-1 bg-blue-100">{Math.round(result.ausnutzungsgradDezember*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.faktorBelastungDezember*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.monatlicheBelastungDezember*1000)/1000}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.heizstundenDezember)}</td>
+        <td class="border-2 border-gray-600 px-2 py-1">{Math.round(result.nutzenergieHeizungDezember)}</td>
       </tr>
       <tr class="text-center h-10">
         <th colspan="9" class="border border-gray-300 p-2 text-left">Spalte 9:&nbsp;&nbsp;(8) &gt; 0,05 → (9) = d<sub>mth</sub> · 24 &nbsp;&nbsp;&nbsp;
           (8) &leq; 0,05 → (9) = (8) / 0,05 · d<sub>mth</sub> · 24</th>
         <th colspan="1" class="border border-gray-300 p-2">Summe</th> 
-        <th colspan="1" class="border-2 border-gray-600 p-2"></th>
-        <th colspan="1" class="border-2 border-gray-600 p-2"></th>
+        <th colspan="1" class="border-2 border-gray-600 p-2">{Math.round(result.gesamtHeizstunden)}</th>
+        <th colspan="1" class="border-2 border-gray-600 p-2">{Math.round(result.gesamtNutzenergieHeizung)}</th>
       </tr>
       <tr class="text-center h-10">
         <th colspan="10" class="border border-gray-300 p-2 text-left">Spalte 10:&nbsp;&nbsp;(10) = (3) · (7) · (9) / 1000</th>

src/components/Tabellen/A13RechnerischeLaufzeitHeizung.svelte

@@ -0,0 +1,138 @@
+<script lang="ts">
+  
+  import { A13BerechnungRechnerischeLaufzeitHeizung } from "#lib/Berechnungen/BedarfsausweisWohnen/A13BerechnungRechnerischeLaufzeitHeizung.js";
+  
+  $: result = A13BerechnungRechnerischeLaufzeitHeizung();
+</script>
+
+
+<div class="overflow-x-auto mt-16">
+    <table class="table-auto border-collapse border border-gray-300 w-full text-left">
+      <thead>
+        <tr class="bg-gray-200 text-left">
+          <th colspan="6" class="border border-gray-300 p-2">
+            <h2>Tabelle A.13 — Heizung – Berechnung der rechnerischen Laufzeit</h2>
+          </th>
+        <tr class="text-center">
+          <tr class="bg-gray-200 text-left">
+            <th colspan="6" class="border border-gray-300 p-2 text-xl">
+              Rechnerische Laufzeit Heizung
+            </th>
+          </tr> 
+          <tr class="text-center">
+            <th class="border border-gray-300 px-4 py-2">Monat</th>
+            <th class="border border-gray-300 px-4 py-2">t<sub>h</sub> [h] (aus Tabelle A.12)<br>(1)</th>
+            <th class="border border-gray-300 px-4 py-2">f<sub>WE</sub> [-]<br>(2)</th>
+            <th class="border border-gray-300 px-4 py-2">t<sub>rL</sub> [h] (EFH)<br>(3)</th>
+            <th class="border border-gray-300 px-4 py-2">t<sub>rL</sub> [h] (MFH)<br>(3)</th>
+            <th class="border border-gray-300 px-4 py-2">t<sub>h,rL</sub> [h]<br>(4) = (1) · (2) · (3)</th>
+          </tr>
+      </thead>
+      <tbody>
+        <tr class="text-center">
+          <td class="border border-gray-300 px-4 py-2">Januar</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100">{Math.round(result.heizstunden.Januar)}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">0,042</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">17,00</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">19,86</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.rechnerischeLaufzeiten[0])}</td>
+        </tr>
+        <tr class="text-center">
+          <td class="border border-gray-300 px-4 py-2">Februar</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100">{Math.round(result.heizstunden.Februar)}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">0,042</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">17,00</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">18,58</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.rechnerischeLaufzeiten[1])}</td>
+        </tr>
+        <tr class="text-center">
+          <td class="border border-gray-300 px-4 py-2">März</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100">{Math.round(result.heizstunden.Maerz)}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">0,042</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">17,00</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">18,69</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.rechnerischeLaufzeiten[2])}</td>
+        </tr>
+        <tr class="text-center">
+          <td class="border border-gray-300 px-4 py-2">April</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100">{Math.round(result.heizstunden.April)}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">0,042</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">17,00</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">17,25</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.rechnerischeLaufzeiten[3])}</td>
+        </tr>
+        <tr class="text-center">
+          <td class="border border-gray-300 px-4 py-2">Mai</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100">{Math.round(result.heizstunden.Mai)}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">0,042</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">17,00</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">17,00</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.rechnerischeLaufzeiten[4])}</td>
+        </tr>
+        <tr class="text-center">
+          <td class="border border-gray-300 px-4 py-2">Juni</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100">{Math.round(result.heizstunden.Juni)}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">0,042</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">17,00</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">17,00</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.rechnerischeLaufzeiten[5])}</td>
+        </tr>
+        <tr class="text-center">
+          <td class="border border-gray-300 px-4 py-2">Juli</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100">{Math.round(result.heizstunden.Juli)}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">0,042</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">17,00</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">17,00</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.rechnerischeLaufzeiten[6])}</td>
+        </tr>
+        <tr class="text-center">
+          <td class="border border-gray-300 px-4 py-2">August</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100">{Math.round(result.heizstunden.August)}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">0,042</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">17,00</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">17,00</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.rechnerischeLaufzeiten[7])}</td>
+        </tr>
+        <tr class="text-center">
+          <td class="border border-gray-300 px-4 py-2">September</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100">{Math.round(result.heizstunden.September)}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">0,042</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">17,00</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">17,00</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.rechnerischeLaufzeiten[8])}</td>
+        </tr>
+        <tr class="text-center">
+          <td class="border border-gray-300 px-4 py-2">Oktober</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100">{Math.round(result.heizstunden.Oktober)}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">0,042</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">17,00</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">17,16</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.rechnerischeLaufzeiten[9])}</td>
+        </tr>
+        <tr class="text-center">
+          <td class="border border-gray-300 px-4 py-2">November</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100">{Math.round(result.heizstunden.November)}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">0,042</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">17,00</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">18,88</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.rechnerischeLaufzeiten[10])}</td>
+        </tr>
+        <tr class="text-center">
+          <td class="border border-gray-300 px-4 py-2">Dezember</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100">{Math.round(result.heizstunden.Dezember)}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">0,042</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">17,00</td>
+          <td class="border border-gray-300 px-4 py-2 bg-gray-100">19,90</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.rechnerischeLaufzeiten[11])}</td>
+        </tr> 
+        <tr class="text-center">
+          <td class="border border-gray-300 px-4 py-2">Jahressumme</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.heizstundenGesamt)}</td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(result.rechnerischeLaufzeitGesamt)}</td>
+        </tr>
+      </tbody>
+    </table>
+  </div>

src/components/Tabellen/A14AufwandszahlenMittlereBelastung.svelte

@@ -0,0 +1,156 @@
+<script lang="ts">
+  import { A14BerechnungAufwandszahlenMittlereBelastung } from "#lib/Berechnungen/BedarfsausweisWohnen/A14BerechnungAufwandszahlenMittlereBelastung.js";
+
+$: result = A14BerechnungAufwandszahlenMittlereBelastung(); 
+
+</script>
+
+<div class="overflow-x-auto mt-16">
+    <table class="table-auto border-collapse border border-gray-300 w-full text-sm">
+      <thead>
+        <tr class="bg-gray-200 text-left">
+          <th colspan="10" class="border border-gray-300 p-2">
+            <h2>Tabelle A.14 — Anlage gesamt - Aufwandszahlen und mittlere Belastungen (Heizung)</h2>
+          </th>
+        <tr class="text-center">
+          <tr class="bg-gray-200 text-left">
+            <th colspan="10" class="border border-gray-300 p-2 text-xl">
+              Anlagenteilbereiche
+            </th>
+          </tr> 
+          <tr>
+            <th colspan="1" class="border border-gray-300 px-4 py-2 text-center">Objekt:</th>
+            <th colspan="9" class="border border-gray-300 px-4 py-2 text-center bg-yellow-100"></th>
+          </tr>
+          <tr>
+            <th colspan="1" class="border border-gray-300 px-4 py-2 text-center">Anlage:</th>
+            <th colspan="3" class="border border-gray-300 px-4 py-2 text-center bg-yellow-100"></th>
+            <th colspan="1" class="border border-gray-300 px-4 py-2 text-center">Q<sub>h,b</sub> [kWh/a]<br>aus Tabelle A.12:</th>
+            <th colspan="1" class="border border-gray-300 px-4 py-2 text-center bg-yellow-100">{Math.round(result.gesamtNutzenergieHeizung)}</th>
+            <th colspan="1" class="border border-gray-300 px-4 py-2 text-center">t<sub>h,m</sub> [h/a]<br>aus Tabelle A.12:</th>
+            <th colspan="1" class="border border-gray-300 px-4 py-2 text-center bg-yellow-100">{Math.round(result.heizstundenGesamt)}</th>
+            <th colspan="1" class="border border-gray-300 px-4 py-2 text-center">Φ<sub>h,max</sub>  [W]<br>aus Tabelle A.6:</th>
+            <th colspan="1" class="border border-gray-300 px-4 py-2 text-center bg-yellow-100">{Math.round(result.maximaleHeizlast)}</th>
+          </tr>
+          <tr>
+            <th colspan="10" class="px-4 py-2 text-center"></th>
+          </tr>
+          <tr>
+          <th class="border border-gray-300 px-4 py-2"></th>
+          <th class="border border-gray-300 px-4 py-2">Anteil</th>  
+          <th colspan="2" class="border border-gray-300 px-4 py-2 text-center">Übergabe</th>
+          <th colspan="2" class="border border-gray-300 px-4 py-2 text-center">Verteilung</th>
+          <th colspan="2" class="border border-gray-300 px-4 py-2 text-center">Speicherung</th>
+          <th colspan="2" class="border border-gray-300 px-4 py-2 text-center">Erzeugung</th>
+        </tr>
+        <tr>
+          <th class="border border-gray-300 px-4 py-2"></th>
+          <th class="border border-gray-300 px-4 py-2">A<sub>h,m</sub> / A<br>aus Planung</th>
+          <th class="border border-gray-300 px-4 py-2 text-center">β<sub>h,ce</sub> =<br>(Q<sub>h,b</sub> / t<sub>h,m</sub> · Φ<sub>h,max</sub>) · 1000</th>
+          <th class="border border-gray-300 px-4 py-2 text-center">e<sub>h,ce</sub><br>aus Tabellen<br>20 - 25</th>
+          <th class="border border-gray-300 px-4 py-2 text-center">β<sub>h,d</sub> =<br>β<sub>h,ce</sub> · e<sub><sub>h,ce</sub> · f<sub>hydr</sub></th>
+          <th class="border border-gray-300 px-4 py-2 text-center">e<sub>h,d</sub><br>aus Tabellen<br>30 - 36</th>
+          <th class="border border-gray-300 px-4 py-2 text-center">β<sub>h,s</sub> =<br>β<sub>h,d</sub> · e<sub>h,d</sub></th>
+          <th class="border border-gray-300 px-4 py-2 text-center">e<sub>h,s</sub><br>aus Tabellen<br>50-52</th>
+          <th class="border border-gray-300 px-4 py-2 text-center">β<sub>h,g</sub> =<br>β<sub>h,s · e<sub>h,s</sub></sub></th>
+          <th class="border border-gray-300 px-4 py-2 text-center">e<sub>h,g</sub><br>für Kessel aus<br>Tabellen 77-81</th>
+        </tr>
+      </thead>
+      <tbody>
+        {#each result.ErgebnisseAufwandsZahlenBelastungHeizung as system, index}
+        <tr class="text-center">
+          <td class="border border-gray-300 px-4 py-2">{system.Bezeichnung}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100">{Math.round(system.VersorgteFlaeche*100)/100}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(system.mittlereBelastungUebergabeHeizung*1000)/1000}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100">{Math.round(system.AufwandsZahlUebergabeHeizung*1000)/1000}</td>
+          <td class="border-2 border-gray-600 px-4 py-2">{Math.round(system.mittlereBelastungVerteilungHeizung*1000)/1000}</td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+        </tr>
+        {/each}
+        <tr>
+          <th colspan="10" class="px-4 py-2 text-center"></th>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 text-center">A<sub>w,m</sub> / A<br>[%]<br>aus Planung</td>
+          <td class="border border-gray-300 px-4 py-2 text-center"></td>
+          <td class="border border-gray-300 px-4 py-2 text-center">e<sub>w,ce</sub><br>aus Tabelle<br>29</td>
+          <td class="border border-gray-300 px-4 py-2 text-center"></td>
+          <td class="border border-gray-300 px-4 py-2 text-center">e<sub>w,d</sub><br>aus Tabellen<br>42-44</td>
+          <td class="border border-gray-300 px-4 py-2 text-center"></td>
+          <td class="border border-gray-300 px-4 py-2 text-center">e<sub>w,s</sub><br>aus Tabellen<br>55-57</td>
+          <td class="border border-gray-300 px-4 py-2 text-center"></td>
+          <td class="border border-gray-300 px-4 py-2 text-center">e<sub>w,g</sub><br>aus<br>Tabellen 59-81</td>
+        </tr>
+        <tr class="h-10">
+          <td class="border border-gray-300 px-4 py-2">TWW 1</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100"></td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+        </tr>
+        <tr class="h-10">
+          <td class="border border-gray-300 px-4 py-2">TWW 2</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100"></td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 text-center">A<sub>rv,m</sub> / A<br>[%]<br>aus Planung</td>
+          <td class="border border-gray-300 px-4 py-2 text-center"></td>
+          <td class="border border-gray-300 px-4 py-2 text-center">e<sub>rv,ce</sub><br>aus Tabelle<br>27</td>
+          <td class="border border-gray-300 px-4 py-2 text-center"></td>
+          <td class="border border-gray-300 px-4 py-2 text-center">e<sub>rv,d</sub><br>aus Tabellen<br>47</td>
+          <td class="border border-gray-300 px-4 py-2 text-center"></td>
+          <td class="border border-gray-300 px-4 py-2 text-center">e<sub>rv,s</sub><br>aus Tabellen<br>50-52, 55-57</td>
+          <td class="border border-gray-300 px-4 py-2 text-center"></td>
+          <td class="border border-gray-300 px-4 py-2 text-center">e<sub>rv,g</sub><br>aus<br>Tabellen </td>120-138,135
+        </tr>
+        <tr class="h-10">
+          <td class="border border-gray-300 px-4 py-2">Lüftung</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100"></td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+        </tr>
+        <tr class="h-10">
+          <td colspan="10" class="border border-gray-300 px-4 py-2">Treten unterschiedliche Übergabesysteme und/oder 
+            unterschiedliche Verteilsysteme in dem gleichen Gebäude auf, wird zur Aufteilung des Bedarfs die Fläche 
+            als Bezugsgröße herangezogen und mehrere Zeilen für die Anlagentechnik angelegt:
+            <b>Q<sub>b,m</sub> = Q<sub>b</sub> &middot;
+            A<sub>ce,m</sub> / A </b><br><br>
+            Wenn kein Pufferspeicher vorhanden ist: <b>e<sub>h,s</sub> = 1</b><br><br>
+            Zu beachten bei vorhandenem Pufferspeicher:<br>
+            <b>β<sub>h,g</sub> = 1</b> und die Aufwandszahl für Verteilung muss korrigiert werden: 
+            <b>e<sub>h,d,korr</sub> = (e<sub>h,d</sub> - 1) · (8760/t<sub>h,r,L</sub>) + 1</b> (t<sub>h,r,L</sub> siehe Tabelle 13)<br><br>
+            Handelt es sich bei den Wärmeerzeugern um Kessel, sind noch folgende zwei Korrekturen vorzunehmen:<br><br>
+            Korrektur der Aufwandszahl für Erzeugung für Heizung mit: 
+            <b>e<sub>h,g,korr</sub> = (e<sub>h,g</sub> - 1) &middot; t<sub>a</sub> / t<sub>h,rL</sub> + 1</b><br>
+            Korrektur der Aufwandszahl für Erzeugung für Trinkwarmwassererwärmung: 
+            <b>e<sub>w,g,korr</sub> = (e<sub>w,g</sub> - 1) &middot; t<sub>a</sub> / t<sub>h,rL</sub> + 1</b>
+          </td>
+        </tr>
+      </tbody>
+    </table>
+  </div>

src/components/Tabellen/A15AufwandszahlenGesamtErzeugernutzWaerme.svelte

@@ -0,0 +1,323 @@
+<script lang="ts">
+    import { A15BerechnungAufwandszahlenGesamtErzeugernutzWaerme } from "#lib/Berechnungen/BedarfsausweisWohnen/A15BerechnungAufwandszahlenGesamtErzeugernutzWaerme.js";
+ 
+   $: result = A15BerechnungAufwandszahlenGesamtErzeugernutzWaerme();
+ 
+ 
+</script>
+
+
+<div class="overflow-x-auto mt-16">
+    <table class="table-auto border-collapse border border-gray-300 w-full text-sm">
+      <thead>
+        <tr class="bg-gray-200 text-left">
+          <th colspan="7" class="border border-gray-300 p-2">
+            <h2>Tabelle A.15 — Anlage gesamt</h2>
+          </th>
+          <tr class="text-center">
+            <tr class="bg-gray-200 text-left">
+              <th colspan="7" class="border border-gray-300 p-2 text-xl">
+                Berechnung der Aufwandszahlen (gesamt) und Erzeugernutzwärmeabgabe
+              </th>
+            </tr> 
+          <tr>
+            <th class="border border-gray-300 px-4 py-2">Nutzenergie-<br>bedarf</th>  
+            <th class="border border-gray-300 px-4 py-2">Übergabe</th>
+            <th class="border border-gray-300 px-4 py-2">Verteilung</th>
+            <th class="border border-gray-300 px-4 py-2">Speicherung</th>
+            <th class="border border-gray-300 px-4 py-2">
+              Flächenbezogene<br>Erzeugernutzwärmeabgabe
+            </th>
+            <th class="border border-gray-300 px-4 py-2">Erzeugung</th>
+            <th class="border border-gray-300 px-4 py-2">Gesamt</th>
+          </tr>
+          <tr>
+            <td class="border border-gray-300 px-4 py-2 text-center">Q<sub>h,nutz,m</sub> =<br>Q<sub>h,b</sub> · A<sub>h,m</sub><sub> / A</sub><br>[kWh/a]<br>aus Tabelle A.12, A.14</td>
+            <th class="border border-gray-300 px-4 py-2">e<sub>ce</sub></th>
+            <th class="border border-gray-300 px-4 py-2">e<sub>d</sub></th>
+            <th class="border border-gray-300 px-4 py-2">e<sub>s</sub></th>
+            <th class="border border-gray-300 px-4 py-2">
+              q<sub>outg</sub><sup>a</sup> = Q<sub>nutz</sub> / A<sub>NGF</sub> &middot; e<sub>ce</sub> &middot; e<sub>d</sub> &middot; e<sub>s</sub>
+            <br>[kWh/m²a]</th>
+            <th class="border border-gray-300 px-4 py-2">e<sub>g</sub></th>
+            <th class="border border-gray-300 px-4 py-2">
+              e<sub>ges</sub> = e<sub>ce</sub> &middot; e<sub>d</sub> &middot; e<sub>s</sub> &middot; e<sub>g</sub>
+            </th>
+          </tr>
+      </thead>
+      
+      <tbody>
+        <tr class="h-10">
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+        </tr>
+        <tr class="h-10">
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+        </tr>
+        <tr class="h-10">
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+        </tr>
+        <tr class="h-10">
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+        </tr>
+      </tbody>
+
+      <thead>
+        <tr>
+          <th colspan="7" class="border border-gray-300 px-4 py-2"></th>
+        </tr>
+        <tr>
+          <th class="border border-gray-300 px-4 py-2"></th>
+          <th class="border border-gray-300 px-4 py-2">Deckungsanteil erneuerbare Energie (Abschnitt 6.6.1.1)</th>
+          <th class="border border-gray-300 px-4 py-2">Deckungsanteil Erzeuger (Tabelle 75)</th>
+          <th class="border border-gray-300 px-4 py-2">Endenergie (brennwertbezogen)</th>
+          <th class="border border-gray-300 px-4 py-2">Umrechnungsfaktor für die Endenergie</th>
+          <th class="border border-gray-300 px-4 py-2">Primärenergiefaktor</th>
+          <th class="border border-gray-300 px-4 py-2">Primärenergie (heizwertbezogen)</th>
+        </tr>
+        <tr>
+          <th class="border border-gray-300 px-4 py-2"></th>
+          <th class="border border-gray-300 px-4 py-2">K<sub>EE</sub></th>
+          <th class="border border-gray-300 px-4 py-2">K<sub>g</sub></th>
+          <th class="border border-gray-300 px-4 py-2">
+            Q<sub>f</sub> = Q<sub>nutz</sub> · e<sub>ges</sub> · (1 - K<sub>EE</sub>) · K<sub>g</sub>
+          </th>
+          <th class="border border-gray-300 px-4 py-2">f<sub>HS/HI</sub></th>
+          <th class="border border-gray-300 px-4 py-2">f<sub>p</sub></th>
+          <th class="border border-gray-300 px-4 py-2">
+            Q<sub>p</sub> = (Q<sub>f</sub> / f<sub>HS/HI</sub>) · f<sub>p</sub>
+          </th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr class="h-10">
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+        </tr>
+        <tr class="h-10">
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+        </tr>
+        <tr class="h-10">
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+        </tr>
+        <tr class="h-10">
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+        </tr>
+        <tr>
+          <th colspan="7" class="border border-gray-300 px-4 py-2"></th>
+        </tr>
+      </tbody>
+
+      <thead>
+        <tr class="bg-gray-200 text-left">
+          <tr class="text-center">
+            <tr class="bg-gray-300 text-left">
+              <th colspan="7" class="border border-gray-300 p-2 text-xl">
+                Berechnung der Hilfsenergie
+              </th>
+            </tr> 
+            <tr>
+              <th class="border border-gray-300 px-4 py-2"></th>
+              <th class="border border-gray-300 px-4 py-2">W<sub>ce</sub><br>[kWh/a]</th>
+              <th class="border border-gray-300 px-4 py-2">W<sub>d</sub><br>[kWh/a]</th>
+              <th class="border border-gray-300 px-4 py-2">W<sub>s</sub><br>[kWh/a]</th>
+              <th class="border border-gray-300 px-4 py-2"></th>
+              <th class="border border-gray-300 px-4 py-2">W<sub>g</sub><br>[kWh/a]</th>
+              <th class="border border-gray-300 px-4 py-2">
+                W<sub>ges</sub> = W<sub>ce</sub> + W<sub>d</sub> + W<sub>s</sub> + W<sub>g</sub><br>[kWh/a]
+              </th>
+            </tr>
+      </thead>
+      
+      <tbody>
+        <tr class="h-10">
+          <th class="border border-gray-300 px-4 py-2"></th>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+        </tr>
+        <tr class="h-10">
+          <th class="border border-gray-300 px-4 py-2"></th>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+        </tr>
+        <tr class="h-10">
+          <th class="border border-gray-300 px-4 py-2"></th>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+        </tr>
+        <tr class="h-10">
+          <th class="border border-gray-300 px-4 py-2"></th>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+        </tr>
+      </tbody>
+      <thead>
+        <tr>
+          <th colspan="7" class="border border-gray-300 px-4 py-2"></th>
+        </tr>
+        <tr>
+          <th class="border border-gray-300 px-4 py-2"></th>
+          <th class="border border-gray-300 px-4 py-2"></th>
+          <th class="border border-gray-300 px-4 py-2"></th>
+          <th class="border border-gray-300 px-4 py-2">W<sub>f</sub> = W<sub>ges</sub></th>
+          <th class="border border-gray-300 px-4 py-2">f<sub>HS/HI</sub></th>
+          <th class="border border-gray-300 px-4 py-2">f<sub>p</sub></th>
+          <th class="border border-gray-300 px-4 py-2">W<sub>p</sub> = (W<sub>f</sub> / f<sub>HS/HI</sub>) · f<sub>p</sub></th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr class="h-10">
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+        </tr>
+        <tr class="h-10">
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+        </tr>
+        <tr class="h-10">
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+        </tr>
+        <tr class="h-10">
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+        </tr>
+      </tbody>
+    </table>
+  </div>
+  <div class="overflow-x-auto mt-2">
+    <table class="table-auto border-collapse border border-gray-300 w-full text-left text-sm">
+      <thead class="bg-gray-300">
+        <tr>
+          <th colspan="6" class="border border-gray-300 p-2 text-xl">Berechnung der Kühlung</th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr>
+          <td class="border border-gray-300 px-4 py-2 w-1/12">Gekühlte<br>Nutzfläche</td>
+          <td class="border border-gray-300 px-4 py-2 w-1/12">A<sub>N,c</sub> [m²]</td>
+          <td class="border border-gray-300 px-4 py-2 w-1/12 bg-yellow-100"></td>
+          <td class="border border-gray-300 px-4 py-2 w-1/6">Flächenbezogener<br>Nutzenergiebedarf</td>
+          <td class="border border-gray-300 px-4 py-2 w-1/6">q<sub>rc,b</sub> [kWh/m²a]</td>
+          <td class="border border-gray-300 px-4 py-2 bg-yellow-100 w-1/6"></td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 px-4 py-2">Teilkühlfaktor</td>
+          <td class="border border-gray-300 px-4 py-2">
+            f<sub>c,part</sub> =<br>A<sub>N,c</sub> / A<sub>NGF</sub> [-]
+          </td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2">Flächenbezogener<br>Endenergiebedarf<br>mit Tabelle 144</td>
+          <td class="border border-gray-300 px-4 py-2">q<sub>rc,f</sub> =<br>q<sub>rc,0</sub> · q<sub>rc,b</sub> / 5 kWh/(m²·a)<br>[kWh/m²a]</td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 px-4 py-2">Ankühlfaktor<br>aus Tabelle 145</td>
+          <td class="border border-gray-300 px-4 py-2">f<sub>c,limit</sub> [-]</td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+          <td class="border border-gray-300 px-4 py-2">Jährlicher<br>Endenergiebedarf</td>
+          <td class="border border-gray-300 px-4 py-2">Q<sub>rc,f</sub> =<br>q<sub>rc,f</sub> · A<sub>N,c</sub> · f<sub>c,limit</sub><br>[kWh/m²a]</td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+        </tr>
+        <tr>
+          <td colspan="3" class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2">Hilfsenergiebedarf<br>mit Tabelle 146</td>
+          <td class="border border-gray-300 px-4 py-2">W<sub>rc</sub> = W<sub>pu</sub> + W<sub>fan</sub><br>+ W<sub>rc,ce</sub> + W<sub>c</sub> [kWh/a]</td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+        </tr>
+        <tr>
+          <td colspan="3" class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2">Primärenergiefaktor</td>
+          <td class="border border-gray-300 px-4 py-2">f<sub>p</sub> [-]</td>
+          <td class="border border-gray-300 px-4 py-2 bg-blue-100"></td>
+        </tr>
+        <tr>
+          <td colspan="3" class="border border-gray-300 px-4 py-2"></td>
+          <td class="border border-gray-300 px-4 py-2">Primärenergiebedarf</td>
+          <td class="border border-gray-300 px-4 py-2">Q<sub>P,rc</sub> =<br>(Q<sub>rc,f</sub> + W<sub>rc</sub>) · f<sub>p</sub> [kWh/a]</td>
+          <td class="border-2 border-gray-600 px-4 py-2"></td>
+        </tr>
+      </tbody>
+    </table>

src/components/Tabellen/A1AllgemeineAnlagenbeschreibung.svelte

@@ -0,0 +1,77 @@
+<script lang="ts">
+    import { A1BerechnungAllgemeineAnlagenbeschreibung } from "#lib/Berechnungen/BedarfsausweisWohnen/A1BerechnungAllgemeineAnlagenbeschreibung.js";
+ 
+   $: result = A1BerechnungAllgemeineAnlagenbeschreibung();
+ 
+ 
+</script>
+
+
+<div class="overflow-x-auto mt-16">
+    <table class="table-auto border-collapse border border-gray-300 w-full text-sm">
+      <!-- Tabellenkopf -->
+      <thead>
+        <tr class="bg-gray-200 text-left">
+          <th colspan="6" class="border border-gray-300 p-2">
+            <h2>Tabelle A.1 – Anlage allgemein – Anlagenbeschreibung</h2>
+          </th>
+        </tr>
+        <tr class="bg-yellow-100 text-left">
+          <th colspan="1" class="border border-gray-300 p-2 text-xl bg-white">Objekt:</th>
+          <th colspan="5" class="border border-gray-300 p-2"></th>
+        </tr>
+        <tr class="text-center">
+          <th class="border border-gray-300 p-2">Anlage</th>
+          <th class="border border-gray-300 p-2">Übergabe</th>
+          <th class="border border-gray-300 p-2">Verteilung</th>
+          <th class="border border-gray-300 p-2">Speicherung</th>
+          <th class="border border-gray-300 p-2">Erzeugung</th>
+        </tr>
+      </thead>
+  
+      <!-- Tabellenkörper -->
+      <tbody>
+        <tr class="bg-yellow-100 h-10">
+          <td class="border border-gray-300 p-2"></td>
+          <td class="border border-gray-300 p-2"></td>
+          <td class="border border-gray-300 p-2"></td>
+          <td class="border border-gray-300 p-2"></td>
+          <td class="border border-gray-300 p-2"></td>
+        </tr>
+        <tr class="bg-yellow-100 h-10">
+          <td class="border border-gray-300 p-2"></td>
+          <td class="border border-gray-300 p-2"></td>
+          <td class="border border-gray-300 p-2"></td>
+          <td class="border border-gray-300 p-2"></td>
+          <td class="border border-gray-300 p-2"></td>
+        </tr>
+        <tr class="bg-yellow-100 h-10">
+          <td class="border border-gray-300 p-2"></td>
+          <td class="border border-gray-300 p-2"></td>
+          <td class="border border-gray-300 p-2"></td>
+          <td class="border border-gray-300 p-2"></td>
+          <td class="border border-gray-300 p-2"></td>
+        </tr>
+        <tr class="bg-yellow-100 h-10">
+          <td class="border border-gray-300 p-2"></td>
+          <td class="border border-gray-300 p-2"></td>
+          <td class="border border-gray-300 p-2"></td>
+          <td class="border border-gray-300 p-2"></td>
+          <td class="border border-gray-300 p-2"></td>
+        </tr>
+        <tr class="bg-yellow-100 h-10">
+          <td class="border border-gray-300 p-2"></td>
+          <td class="border border-gray-300 p-2"></td>
+          <td class="border border-gray-300 p-2"></td>
+          <td class="border border-gray-300 p-2"></td>
+          <td class="border border-gray-300 p-2"></td>
+        </tr>
+        <tr class="bg-yellow-100 h-10">
+          <td class="border border-gray-300 p-2"></td>
+          <td class="border border-gray-300 p-2"></td>
+          <td class="border border-gray-300 p-2"></td>
+          <td class="border border-gray-300 p-2"></td>
+          <td class="border border-gray-300 p-2"></td>
+        </tr>
+      </tbody>
+    </table>

src/components/Tabellen/A2WaermequellenSolareEinstrahlungWintergarten.svelte

@@ -0,0 +1,220 @@
+<script lang="ts">
+    import { A7A2BerechnungWaermequellenSolareEinstrahlung } from "#lib/Berechnungen/BedarfsausweisWohnen/A7A2BerechnungWaermequellenSolareEinstrahlung.js";
+
+$: result = A7A2BerechnungWaermequellenSolareEinstrahlung();
+
+</script>
+
+<div class="overflow-x-auto mt-16">
+    <table class="table-auto border-collapse border border-gray-300 w-full text-sm">
+      <!-- Tabellenkopf -->
+      <thead>
+        <tr class="bg-gray-200 text-left">
+          <th colspan="6" class="border border-gray-300 p-2">
+            <h2>Tabelle A.2 – Gebäude – Wintergarten</h2>
+          </th>
+        </tr>
+        <tr class="bg-gray-200 text-left">
+          <th colspan="6" class="border border-gray-300 p-2 text-xl">
+            Solare Einstrahlung in den Wintergarten
+          </th>
+        </tr>
+      </thead>
+  
+     <!-- Tabellenkörper -->
+     <thead>
+        <tr class="bg-yellow-100 text-left">
+          <th class="border border-gray-300 p-2 w-4/12 bg-white">Orientierung</th>
+          {#each result.PlanungswerteBauteil as fenster, index}
+            <th class="border border-gray-300 p-2 w-1/12 text-center">{fenster.Orientierung}</th>
+          {/each}
+          <th class="border border-gray-300 p-2 w-2/12 bg-white text-center">Gesamtfläche</th>
+        </tr>
+      </thead>
+  
+      <!-- Tabellenkörper -->
+      <tbody>
+        <tr class="bg-yellow-100">
+          <td class="border border-gray-300 p-2 bg-white">Neigung</td>
+          {#each result.PlanungswerteBauteil as fenster, index}
+            <td class="border border-gray-300 p-2 text-center">{fenster.Neigung}</td>
+          {/each}
+          <td class="border border-gray-300 p-2 text-center bg-white">[m²]</td>
+        </tr>
+        <tr class="bg-yellow-100">
+          <td class="border border-gray-300 p-2 bg-white">Bauteilfläche A [m²] (1)</td>
+          {#each result.PlanungswerteBauteil as fenster, index}
+            <td class="border border-gray-300 p-2 text-center">{fenster.Flaeche}</td>
+          {/each}
+          <td class="border-2 border-gray-600 p-2 text-center bg-white">{Math.round(result.summeFlaeche*100)/100}</td>
+        </tr>
+        <tr class="bg-yellow-100">
+          <td class="border border-gray-300 p-2 bg-white">Gesamtenergiedurchlassgrad g (2)</td>
+          {#each result.PlanungswerteBauteil as fenster, index}
+            <td class="border border-gray-300 p-2 text-center">{fenster.GesamtEnergieDurchlassGrad}</td>
+          {/each}
+          <td class="border border-gray-300 p-2 text-center bg-white"></td>
+        </tr>
+        <tr class="bg-gray-100">
+          <td class="border border-gray-300 p-2 bg-white">Abm. Rahmenanteil F<sub>F</sub> (3)</td>
+          {#each result.PlanungswerteBauteil as fenster, index}
+            <td class="border border-gray-300 p-2 text-center">{fenster.RahmenAnteil}</td>
+          {/each}
+          <td class="border border-gray-300 p-2 text-center bg-white"></td>
+        </tr>
+        <tr class="bg-gray-100">
+          <td class="border border-gray-300 p-2 bg-white">Abm. Strahlungseinfluss F<sub>w</sub> (4)</td>
+          {#each result.PlanungswerteBauteil as fenster, index}
+            <td class="border border-gray-300 p-2 text-center">{fenster.StrahlungsEinfluss}</td>
+          {/each}
+          <td class="border border-gray-300 p-2 text-center bg-white"></td>
+        </tr>
+        <tr class="bg-gray-100">
+          <td class="border border-gray-300 p-2 bg-white ">Abm. Verschattung F<sub>s</sub> (5)</td>
+          {#each result.PlanungswerteBauteil as fenster, index}
+          <td class="border border-gray-300 p-2 text-center">{fenster.Verschattung}</td>
+        {/each}
+          <td class="border border-gray-300 p-2 text-center bg-white"></td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 p-2">wirks. Gesamtenergiedurchlassgrad<br>
+            g<sub>eff</sub> = g · F<sub>w</sub> · F<sub>s</sub><br>
+            (6) = (2) · (4) · (5)</td>
+          {#each result.ErgebnisseWirksamerGesamtEnergieDurchlassGrad as wert, index}
+            <td class="border-2 border-gray-600 p-2 text-center">{Math.round(wert * 100) / 100}</td>
+          {/each}
+          <td class="border border-gray-300 p-2 text-center bg-white"></td>
+        </tr>
+      </tbody>
+    </table>
+    <br>
+    <table class="table-auto border-collapse border border-gray-300 w-full text-sm">
+        <!-- Tabelle Kopf -->
+        <thead>
+          <tr class="text-center">
+            <th colspan="2" class="border border-gray-300 p-2 text-left">E<sub>sol</sub> aus Tabelle 17</th>
+            <th colspan="3" class="border border-gray-300 p-2 text-left">
+              Q<sub>S,tr</sub> = A ⋅ F<sub>F</sub> ⋅ g<sub>eff</sub>
+               ⋅ E<sub>sol</sub> </th>
+            <th colspan="7" class="border border-gray-300 p-2 text-left"></th> 
+          </tr>
+          <tr class="text-center">
+            <th class="border border-gray-300 p-2">Monat</th>
+            {#each result.ErgebnisseMonatsWerteJanuar as wert, index}
+            <th class="border border-gray-300 p-2">E<sub>sol</sub><br>[kWh/m²]<br></th>
+            <th class="border border-gray-300 p-2">Q<sub>str</sub><br>[kWh]</th>
+            {/each}
+            <th class="border border-gray-300 p-2">ΣQ<sub>str</sub><br>[kWh]</th>
+          </tr>
+        </thead>
+    
+        <!-- Tabelle Körper -->
+        <tbody>
+            <!-- Monatsdaten -->
+            <tr class="text-center">
+            <td class="border border-gray-300 p-2 text-center">Januar</td>
+            {#each result.ErgebnisseMonatsWerteJanuar as wert, index}
+              <td class="border border-gray-300 p-2 bg-blue-100">{Math.round(wert*100)/100}</td>
+              <td class="border-2 border-gray-600 p-2">{Math.round(result.ErgebnisseJanuar[index]*100)/100}</td>
+            {/each}
+            <td class="border-2 border-gray-600 p-2">{Math.round(result.summeErgebnisseJanuar * 100) / 100}</td>
+            </tr>
+            <tr class="text-center">
+            <td class="border border-gray-300 p-2 text-center">Februar</td>
+            {#each result.ErgebnisseMonatsWerteFebruar as wert, index}
+              <td class="border border-gray-300 p-2 bg-blue-100">{Math.round(wert*100)/100}</td>
+              <td class="border-2 border-gray-600 p-2">{Math.round(result.ErgebnisseFebruar[index]*100)/100}</td>
+            {/each}
+            <td class="border-2 border-gray-600 p-2">{Math.round(result.summeErgebnisseFebruar * 100) / 100}</td>
+            </tr>
+            <tr class="text-center">
+            <td class="border border-gray-300 p-2 text-center">März</td>
+            {#each result.ErgebnisseMonatsWerteMaerz as wert, index}
+              <td class="border border-gray-300 p-2 bg-blue-100">{Math.round(wert*100)/100}</td>
+              <td class="border-2 border-gray-600 p-2">{Math.round(result.ErgebnisseMaerz[index]*100)/100}</td>
+            {/each}
+            <td class="border-2 border-gray-600 p-2">{Math.round(result.summeErgebnisseMaerz * 100) / 100}</td>
+            </tr>
+            <tr class="text-center">
+            <td class="border border-gray-300 p-2 text-center">April</td>
+            {#each result.ErgebnisseMonatsWerteApril as wert, index}
+              <td class="border border-gray-300 p-2 bg-blue-100">{Math.round(wert*100)/100}</td>
+              <td class="border-2 border-gray-600 p-2">{Math.round(result.ErgebnisseApril[index]*100)/100}</td>
+            {/each}
+            <td class="border-2 border-gray-600 p-2">{Math.round(result.summeErgebnisseApril * 100) / 100}</td>
+            </tr>
+            <tr class="text-center">
+            <td class="border border-gray-300 p-2 text-center">Mai</td>
+            {#each result.ErgebnisseMonatsWerteMai as wert, index}
+              <td class="border border-gray-300 p-2 bg-blue-100">{Math.round(wert*100)/100}</td>
+              <td class="border-2 border-gray-600 p-2">{Math.round(result.ErgebnisseMai[index]*100)/100}</td>
+            {/each}
+            <td class="border-2 border-gray-600 p-2">{Math.round(result.summeErgebnisseMai * 100) / 100}</td>
+            </tr>
+            <tr class="text-center">
+            <td class="border border-gray-300 p-2 text-center">Juni</td>
+            {#each result.ErgebnisseMonatsWerteJuni as wert, index}
+              <td class="border border-gray-300 p-2 bg-blue-100">{Math.round(wert*100)/100}</td>
+              <td class="border-2 border-gray-600 p-2">{Math.round(result.ErgebnisseJuni[index]*100)/100}</td>
+            {/each}
+            <td class="border-2 border-gray-600 p-2">{Math.round(result.summeErgebnisseJuni * 100) / 100}</td>
+            </tr>
+            <tr class="text-center">
+            <td class="border border-gray-300 p-2 text-center">Juli</td>
+            {#each result.ErgebnisseMonatsWerteJuli as wert, index}
+              <td class="border border-gray-300 p-2 bg-blue-100">{Math.round(wert*100)/100}</td>
+              <td class="border-2 border-gray-600 p-2">{Math.round(result.ErgebnisseJuli[index]*100)/100}</td>
+            {/each}
+            <td class="border-2 border-gray-600 p-2">{Math.round(result.summeErgebnisseJuli * 100) / 100}</td>
+            </tr>
+            <tr class="text-center">
+            <td class="border border-gray-300 p-2 text-center">August</td>
+            {#each result.ErgebnisseMonatsWerteAugust as wert, index}
+              <td class="border border-gray-300 p-2 bg-blue-100">{Math.round(wert*100)/100}</td>
+              <td class="border-2 border-gray-600 p-2">{Math.round(result.ErgebnisseAugust[index]*100)/100}</td>
+            {/each}
+            <td class="border-2 border-gray-600 p-2">{Math.round(result.summeErgebnisseAugust * 100) / 100}</td>
+            </tr>
+            <tr class="text-center">
+            <td class="border border-gray-300 p-2 text-center">September</td>
+            {#each result.ErgebnisseMonatsWerteSeptember as wert, index}
+              <td class="border border-gray-300 p-2 bg-blue-100">{Math.round(wert*100)/100}</td>
+              <td class="border-2 border-gray-600 p-2">{Math.round(result.ErgebnisseSeptember[index]*100)/100}</td>
+            {/each}
+            <td class="border-2 border-gray-600 p-2">{Math.round(result.summeErgebnisseSeptember * 100) / 100}</td>
+            </tr>
+            <tr class="text-center">
+            <td class="border border-gray-300 p-2 text-center">Oktober</td>
+            {#each result.ErgebnisseMonatsWerteOktober as wert, index}
+              <td class="border border-gray-300 p-2 bg-blue-100">{Math.round(wert*100)/100}</td>
+              <td class="border-2 border-gray-600 p-2">{Math.round(result.ErgebnisseOktober[index]*100)/100}</td>
+            {/each}
+            <td class="border-2 border-gray-600 p-2">{Math.round(result.summeErgebnisseOktober * 100) / 100}</td>
+            </tr>
+            <tr class="text-center">
+            <td class="border border-gray-300 p-2 text-center">November</td>
+            {#each result.ErgebnisseMonatsWerteNovember as wert, index}
+              <td class="border border-gray-300 p-2 bg-blue-100">{Math.round(wert*100)/100}</td>
+              <td class="border-2 border-gray-600 p-2">{Math.round(result.ErgebnisseNovember[index]*100)/100}</td>
+            {/each}
+            <td class="border-2 border-gray-600 p-2">{Math.round(result.summeErgebnisseNovember * 100) / 100}</td>
+            </tr>
+            <tr class="text-center">
+            <td class="border border-gray-300 p-2 text-center">Dezember</td>
+            {#each result.ErgebnisseMonatsWerteDezember as wert, index}
+              <td class="border border-gray-300 p-2 bg-blue-100">{Math.round(wert*100)/100}</td>
+              <td class="border-2 border-gray-600 p-2">{Math.round(result.ErgebnisseDezember[index]*100)/100}</td>
+            {/each}
+            <td class="border-2 border-gray-600 p-2">{Math.round(result.summeErgebnisseDezember * 100) / 100}</td>
+            </tr>
+            <tr class="text-center">
+            <td class="border border-gray-300 p-2 font-bold text-center">Jahressumme</td>
+            {#each result.ErgebnisseMonatsWerteDezember as wert, index}
+            <td class="border border-gray-300 p-2"></td>
+            <td class="border border-gray-300 p-2"></td>
+            {/each}
+            <td class="border-2 border-gray-600 p-2 font-bold">{Math.round(result.summeErgebnisseJahr * 100) / 100}</td>
+          </tr>
+        </tbody>
+      </table>
+  </div>

src/components/Tabellen/A5WaermeTransferMaxStroemeBauteile.svelte

@@ -1,189 +1,7 @@
 <script lang="ts">
-   import { BerechnungWaermeTransferMaxStroemeBauteile } from "#lib/Berechnungen/BedarfsausweisWohnen/BerechnungWaermeTransferMaxStroemeBauteile.js";
+   import { A5BerechnungWaermeTransferMaxStroemeBauteile } from "#lib/Berechnungen/BedarfsausweisWohnen/A5BerechnungWaermeTransferMaxStroemeBauteile.js";
 
-let ObjektAdresse = "";
-let NettoGrundflaeche = 0;
-let minimaleAussentemperatur = 0;
-let innenTemperatur = 0;
-let ObjektBruttoVolumen = 0;
-let maximaleTemperaturDifferenz = 0;
-let LichteRaumHoehe = 0;
-let ObjektNettoVolumen = 0;
-let FaktorNettoVolumen = 0;
-let ObjektNettoVolumenAlternativ = 0;
-let HuellFlaechenVolumenVerhaeltnis = 0;
-let AussenWandFlaecheWest = 0;
-let WaermeDurchgangsKoeffizientAussenWandWest = 0;
-let WaermeTransferKoeffizientAussenwandWest = 0;
-let TemperaturKorrekturFaktorAussenwand = 0;
-let WaermeTransferKoeffizientAussenwandWestKorrektur = 0;
-let maximalerWaermestromAussenwandWest = 0;
-let AussenWandFlaecheSued = 0;
-let WaermeDurchgangsKoeffizientAussenWandSued = 0;
-let WaermeTransferKoeffizientAussenwandSued = 0;
-let WaermeTransferKoeffizientAussenwandSuedKorrektur = 0;
-let maximalerWaermestromAussenwandSued = 0;
-let AussenWandFlaecheNord = 0;
-let WaermeDurchgangsKoeffizientAussenWandNord = 0;
-let WaermeTransferKoeffizientAussenwandNord = 0;
-let WaermeTransferKoeffizientAussenwandNordKorrektur = 0;
-let maximalerWaermestromAussenwandNord = 0;
-let AussenWandFlaecheOst = 0;
-let WaermeDurchgangsKoeffizientAussenWandOst = 0;
-let WaermeTransferKoeffizientAussenwandOst = 0;
-let WaermeTransferKoeffizientAussenwandOstKorrektur = 0;
-let maximalerWaermestromAussenwandOst = 0;
-let FensterFlaecheWest = 0;
-let WaermeDurchgangsKoeffizientFensterWest = 0;
-let WaermeTransferKoeffizientFensterWest = 0;
-let TemperaturKorrekturFaktorFenster = 0;
-let WaermeTransferKoeffizientFensterWestKorrektur = 0;
-let maximalerWaermestromFensterWest = 0;
-let FensterFlaecheSued = 0;
-let WaermeDurchgangsKoeffizientFensterSued = 0;
-let WaermeTransferKoeffizientFensterSued = 0;
-let WaermeTransferKoeffizientFensterSuedKorrektur = 0;
-let maximalerWaermestromFensterSued = 0;
-let FensterFlaecheNord = 0;
-let WaermeDurchgangsKoeffizientFensterNord = 0;
-let WaermeTransferKoeffizientFensterNord = 0;
-let WaermeTransferKoeffizientFensterNordKorrektur = 0;
-let maximalerWaermestromFensterNord = 0;
-let FensterFlaecheOst = 0;
-let WaermeDurchgangsKoeffizientFensterOst = 0;
-let WaermeTransferKoeffizientFensterOst = 0;
-let WaermeTransferKoeffizientFensterOstKorrektur = 0;
-let maximalerWaermestromFensterOst = 0;
-let HaustuerFlaeche = 0;
-let WaermeDurchgangsKoeffizientHaustuer = 0;
-let WaermeTransferKoeffizientHaustuer = 0;
-let TemperaturKorrekturFaktorHaustuer = 0;
-let WaermeTransferKoeffizientHaustuerKorrektur = 0;
-let maximalerWaermestromHaustuer = 0;
-let FlachdachFlaeche = 0;
-let WaermeDurchgangsKoeffizientFlachdach = 0;
-let WaermeTransferKoeffizientFlachdach = 0;
-let TemperaturKorrekturFaktorFlachdach = 0;
-let WaermeTransferKoeffizientFlachdachKorrektur = 0;
-let maximalerWaermestromFlachdach = 0;
-let BodenplatteFlaeche = 0;
-let WaermeDurchgangsKoeffizientBodenplatte = 0;
-let WaermeTransferKoeffizientBodenplatte = 0;
-let TemperaturKorrekturFaktorBodenplatte = 0;
-let WaermeTransferKoeffizientBodenplatteKorrektur = 0;
-let maximalerWaermestromBodenplatte = 0;
-let GesamtHuellFlaeche = 0;
-let WaermeBrueckenZuschlag = 0;
-let WaermeTransferKoeffizientWaeremebruecken = 0;
-let maximalerWaermestromWaermebruecken = 0;
-let WaermeTransferKoeffizientGesamt = 0;
-let maximalerWaermestromGesamt = 0;
-
-
-
-$: {
-  const result = BerechnungWaermeTransferMaxStroemeBauteile()
-  maximaleTemperaturDifferenz = result.maximaleTemperaturDifferenz
-  LichteRaumHoehe = result.LichteRaumHoehe
-  
-  ObjektAdresse = result.ObjektAdresse
-  NettoGrundflaeche = result.NettoGrundflaeche
-  minimaleAussentemperatur = result.minimaleAussentemperatur
-  innenTemperatur = result.innenTemperatur
-  ObjektBruttoVolumen = result.ObjektBruttoVolumen
-  ObjektNettoVolumen = result.ObjektNettoVolumen
-  FaktorNettoVolumen = result.FaktorNettoVolumen
-  ObjektNettoVolumenAlternativ = result.ObjektNettoVolumenAlternativ
-
-  HuellFlaechenVolumenVerhaeltnis = result.HuellFlaechenVolumenVerhaeltnis
-  
-  AussenWandFlaecheWest = result.AussenWandFlaecheWest
-  WaermeDurchgangsKoeffizientAussenWandWest = result.WaermeDurchgangsKoeffizientAussenWandWest
-  WaermeTransferKoeffizientAussenwandWest = result.WaermeTransferKoeffizientAussenwandWest
-  TemperaturKorrekturFaktorAussenwand = result.TemperaturKorrekturFaktorAussenwand
-  WaermeTransferKoeffizientAussenwandWestKorrektur = result.WaermeTransferKoeffizientAussenwandWestKorrektur
-  maximalerWaermestromAussenwandWest = result.maximalerWaermestromAussenwandWest
-  
-  AussenWandFlaecheSued = result.AussenWandFlaecheSued
-  WaermeDurchgangsKoeffizientAussenWandSued = result.WaermeDurchgangsKoeffizientAussenWandSued
-  WaermeTransferKoeffizientAussenwandSued = result.WaermeTransferKoeffizientAussenwandSued
-  TemperaturKorrekturFaktorAussenwand = result.TemperaturKorrekturFaktorAussenwand
-  WaermeTransferKoeffizientAussenwandSuedKorrektur = result.WaermeTransferKoeffizientAussenwandSuedKorrektur
-  maximalerWaermestromAussenwandSued = result.maximalerWaermestromAussenwandSued
-  
-  AussenWandFlaecheNord = result.AussenWandFlaecheNord
-  WaermeDurchgangsKoeffizientAussenWandNord = result.WaermeDurchgangsKoeffizientAussenWandNord
-  WaermeTransferKoeffizientAussenwandNord = result.WaermeTransferKoeffizientAussenwandNord
-  TemperaturKorrekturFaktorAussenwand = result.TemperaturKorrekturFaktorAussenwand
-  WaermeTransferKoeffizientAussenwandNordKorrektur = result.WaermeTransferKoeffizientAussenwandNordKorrektur
-  maximalerWaermestromAussenwandNord = result.maximalerWaermestromAussenwandNord
-  
-  AussenWandFlaecheOst = result.AussenWandFlaecheOst
-  WaermeDurchgangsKoeffizientAussenWandOst = result.WaermeDurchgangsKoeffizientAussenWandOst
-  WaermeTransferKoeffizientAussenwandOst = result.WaermeTransferKoeffizientAussenwandOst
-  TemperaturKorrekturFaktorAussenwand = result.TemperaturKorrekturFaktorAussenwand
-  WaermeTransferKoeffizientAussenwandOstKorrektur = result.WaermeTransferKoeffizientAussenwandOstKorrektur
-  maximalerWaermestromAussenwandOst = result.maximalerWaermestromAussenwandOst
-  
-  FensterFlaecheWest = result.FensterFlaecheWest
-  WaermeDurchgangsKoeffizientFensterWest = result.WaermeDurchgangsKoeffizientFensterWest
-  WaermeTransferKoeffizientFensterWest = result.WaermeTransferKoeffizientFensterWest
-  TemperaturKorrekturFaktorFenster = result.TemperaturKorrekturFaktorFenster
-  WaermeTransferKoeffizientFensterWestKorrektur = result.WaermeTransferKoeffizientFensterWestKorrektur
-  maximalerWaermestromFensterWest = result.maximalerWaermestromFensterWest
- 
-  FensterFlaecheSued = result.FensterFlaecheSued
-  WaermeDurchgangsKoeffizientFensterSued = result.WaermeDurchgangsKoeffizientFensterSued
-  WaermeTransferKoeffizientFensterSued = result.WaermeTransferKoeffizientFensterSued
-  TemperaturKorrekturFaktorFenster = result.TemperaturKorrekturFaktorFenster
-  WaermeTransferKoeffizientFensterSuedKorrektur = result.WaermeTransferKoeffizientFensterSuedKorrektur
-  maximalerWaermestromFensterSued = result.maximalerWaermestromFensterSued
- 
-  FensterFlaecheNord = result.FensterFlaecheNord
-  WaermeDurchgangsKoeffizientFensterNord = result.WaermeDurchgangsKoeffizientFensterNord
-  WaermeTransferKoeffizientFensterNord = result.WaermeTransferKoeffizientFensterNord
-  TemperaturKorrekturFaktorFenster = result.TemperaturKorrekturFaktorFenster
-  WaermeTransferKoeffizientFensterNordKorrektur = result.WaermeTransferKoeffizientFensterNordKorrektur
-  maximalerWaermestromFensterNord = result.maximalerWaermestromFensterNord
-  
-  FensterFlaecheOst = result.FensterFlaecheOst
-  WaermeDurchgangsKoeffizientFensterOst = result.WaermeDurchgangsKoeffizientFensterOst
-  WaermeTransferKoeffizientFensterOst = result.WaermeTransferKoeffizientFensterOst
-  TemperaturKorrekturFaktorFenster = result.TemperaturKorrekturFaktorFenster
-  WaermeTransferKoeffizientFensterOstKorrektur = result.WaermeTransferKoeffizientFensterOstKorrektur
-  maximalerWaermestromFensterOst = result.maximalerWaermestromFensterOst
-  
-  HaustuerFlaeche = result.HaustuerFlaeche
-  WaermeDurchgangsKoeffizientHaustuer = result.WaermeDurchgangsKoeffizientHaustuer
-  WaermeTransferKoeffizientHaustuer = result.WaermeTransferKoeffizientHaustuer
-  TemperaturKorrekturFaktorHaustuer = result.TemperaturKorrekturFaktorHaustuer
-  WaermeTransferKoeffizientHaustuerKorrektur = result.WaermeTransferKoeffizientHaustuerKorrektur
-  maximalerWaermestromHaustuer = result.maximalerWaermestromHaustuer
-  
-  FlachdachFlaeche = result.FlachdachFlaeche
-  WaermeDurchgangsKoeffizientFlachdach = result.WaermeDurchgangsKoeffizientFlachdach
-  WaermeTransferKoeffizientFlachdach = result.WaermeTransferKoeffizientFlachdach
-  TemperaturKorrekturFaktorFlachdach = result.TemperaturKorrekturFaktorFlachdach
-  WaermeTransferKoeffizientFlachdachKorrektur = result.WaermeTransferKoeffizientFlachdachKorrektur
-  maximalerWaermestromFlachdach = result.maximalerWaermestromFlachdach
-
-  BodenplatteFlaeche = result.BodenplatteFlaeche
-  WaermeDurchgangsKoeffizientBodenplatte = result.WaermeDurchgangsKoeffizientBodenplatte
-  WaermeTransferKoeffizientBodenplatte = result.WaermeTransferKoeffizientBodenplatte
-  TemperaturKorrekturFaktorBodenplatte = result.TemperaturKorrekturFaktorBodenplatte
-  WaermeTransferKoeffizientBodenplatteKorrektur = result.WaermeTransferKoeffizientBodenplatteKorrektur
-  maximalerWaermestromBodenplatte = result.maximalerWaermestromBodenplatte
-
-  WaermeBrueckenZuschlag = result.WaermeBrueckenZuschlag
-
-  GesamtHuellFlaeche = result.GesamtHuellFlaeche
-
-  WaermeTransferKoeffizientWaeremebruecken = result.WaermeTransferKoeffizientWaeremebruecken
-  maximalerWaermestromWaermebruecken = result.maximalerWaermestromWaermebruecken
-
-  WaermeTransferKoeffizientGesamt = result.WaermeTransferKoeffizientGesamt
-  maximalerWaermestromGesamt = result.maximalerWaermestromGesamt
-}
+  $: result = A5BerechnungWaermeTransferMaxStroemeBauteile();
 
 </script>
 
@@ -209,50 +27,50 @@ $: {
       <tbody>
         <tr class="bg-yellow-100">
           <td colspan="1" class="border border-gray-300 p-2 text-left bg-white">Objekt:</td>
-          <td colspan="5" class="border border-gray-300 p-2 text-left">{ObjektAdresse}</td>
+          <td colspan="5" class="border border-gray-300 p-2 text-left">{result.ObjektAdresse}</td>
         </tr>
         <tr>
           <td class="border border-gray-300 p-2 w-2/6">Nettogrundfläche</td>
           <td class="border border-gray-300 p-2 w-1/6">A<sub>NGF</sub> [m²]</td>
-          <td class="border border-gray-300 p-2 w-1/6 bg-yellow-100">{NettoGrundflaeche}</td>
+          <td class="border border-gray-300 p-2 w-1/6 bg-yellow-100">{result.NettoGrundflaeche}</td>
           <td class="border border-gray-300 p-2">θ<sub>e,min</sub> [°C]</td>
-          <td class="border border-gray-300 p-2 bg-gray-100 text-center">{minimaleAussentemperatur}</td>
+          <td class="border border-gray-300 p-2 bg-gray-100 text-center">{result.minimaleAussentemperatur}</td>
           <td class="border border-gray-300 p-2" rowspan="2"></td>
         </tr>
         <tr>
           <td class="border border-gray-300 p-2">Lichte Raumhöhe</td>
           <td class="border border-gray-300 p-2">h<sub>G</sub> [m]</td>
-          <td class="border border-gray-300 p-2 w-1/6 bg-yellow-100">{LichteRaumHoehe}</td>
+          <td class="border border-gray-300 p-2 w-1/6 bg-yellow-100">{result.LichteRaumHoehe}</td>
           <td class="border border-gray-300 p-2">θ<sub>i,h,soll</sub> [°C]</td>
-          <td class="border border-gray-300 p-2 bg-gray-100 text-center">{innenTemperatur}</td>
+          <td class="border border-gray-300 p-2 bg-gray-100 text-center">{result.innenTemperatur}</td>
         </tr>
         <tr>
           <td class="border border-gray-300 p-2">Volumen (Innenmaß)</td>
           <td class="border border-gray-300 p-2">V = A<sub>NGF</sub> · h<sub>G</sub> [m³]</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(ObjektNettoVolumen*10)/10}</td>
+          <td class="border-2 border-gray-600 p-2">{Math.round(result.ObjektNettoVolumen*10)/10}</td>
           <td class="border border-gray-300 p-2">Δθ<sub>max</sub> = θ<sub>i,h,soll</sub> − θ<sub>e,min</sub></td>
-          <td class="border border-gray-300 p-2 bg-gray-100 text-center">{maximaleTemperaturDifferenz}</td>
+          <td class="border border-gray-300 p-2 bg-gray-100 text-center">{result.maximaleTemperaturDifferenz}</td>
         </tr>
         <tr>
           <td class="border border-gray-300 p-2">Volumen (Außenmaß)</td>
           <td class="border border-gray-300 p-2">V<sub>e</sub> [m³]</td>
-          <td class="border border-gray-300 p-2 w-1/6 bg-yellow-100">{ObjektBruttoVolumen}</td>
+          <td class="border border-gray-300 p-2 w-1/6 bg-yellow-100">{result.ObjektBruttoVolumen}</td>
           <td class="border border-gray-300 p-2"></td>
           <td class="border border-gray-300 p-2"></td>
         </tr>
         <tr>
           <td class="border border-gray-300 p-2">Faktor (kleine Gebäude: 0,76 / große Gebäude: 0,8)</td>
           <td class="border border-gray-300 p-2">n*</td>
-          <td class="border border-gray-300 p-2 w-1/6 bg-yellow-100">{FaktorNettoVolumen}</td>
+          <td class="border border-gray-300 p-2 w-1/6 bg-yellow-100">{result.FaktorNettoVolumen}</td>
           <td class="border border-gray-300 p-2"></td>
           <td class="border border-gray-300 p-2"></td>
         </tr>
         <tr>
           <td class="border border-gray-300 p-2">Volumen (Innenmaß) - alternativ</td>
           <td class="border border-gray-300 p-2 italic">V = n* · V<sub>e</sub> [m³]</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(ObjektNettoVolumenAlternativ*10)/10}</td>
+          <td class="border-2 border-gray-600 p-2">{Math.round(result.ObjektNettoVolumenAlternativ*10)/10}</td>
           <td class="border border-gray-300 p-2">A/V-Verhätnis [1/m]</td>
-          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(HuellFlaechenVolumenVerhaeltnis*1000)/1000}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.HuellFlaechenVolumenVerhaeltnis*1000)/1000}</td>
         </tr>
       </tbody>
     </table>
@@ -270,135 +88,19 @@ $: {
           <th class="border border-gray-300 p-2">maximaler Wärmestrom<br>Q̇<sub>T,i</sub> = H<sub>T,i</sub> · ΔΘ<sub>max</sub><br>(W)</th>
         </tr>
       </thead>
-  
       <!-- Tabellenkörper -->
       <tbody>
+        {#each result.ErgebnisseBauteile as bauteil, index}
         <tr class="text-center">
-          <td class="border border-gray-300 p-2" colspan="2">Außenwand West</td>
-          <td class="border border-gray-300 p-2 bg-yellow-100">{AussenWandFlaecheWest}</td>
-          <td class="border border-gray-300 p-2 bg-yellow-100">{WaermeDurchgangsKoeffizientAussenWandWest}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(WaermeTransferKoeffizientAussenwandWest*100)/100}</td>
-          <td class="border border-gray-300 p-2  bg-blue-100">{TemperaturKorrekturFaktorAussenwand}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(WaermeTransferKoeffizientAussenwandWestKorrektur*100)/100}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(maximalerWaermestromAussenwandWest)}</td>
-        </tr>
-        <tr class="text-center">
-          <td class="border border-gray-300 p-2" colspan="2">Außenwand Süd</td>
-          <td class="border border-gray-300 p-2 bg-yellow-100">{AussenWandFlaecheSued}</td>
-          <td class="border border-gray-300 p-2 bg-yellow-100">{WaermeDurchgangsKoeffizientAussenWandSued}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(WaermeTransferKoeffizientAussenwandSued*100)/100}</td>
-          <td class="border border-gray-300 p-2  bg-blue-100">{TemperaturKorrekturFaktorAussenwand}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(WaermeTransferKoeffizientAussenwandSuedKorrektur*100)/100}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(maximalerWaermestromAussenwandSued)}</td>
-        </tr>
-        <tr class="text-center">
-          <td class="border border-gray-300 p-2" colspan="2">Außenwand Nord</td>
-          <td class="border border-gray-300 p-2 bg-yellow-100">{AussenWandFlaecheNord}</td>
-          <td class="border border-gray-300 p-2 bg-yellow-100">{WaermeDurchgangsKoeffizientAussenWandNord}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(WaermeTransferKoeffizientAussenwandNord*100)/100}</td>
-          <td class="border border-gray-300 p-2  bg-blue-100">{TemperaturKorrekturFaktorAussenwand}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(WaermeTransferKoeffizientAussenwandNordKorrektur*100)/100}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(maximalerWaermestromAussenwandNord)}</td>
-        </tr>
-        <tr class="text-center">
-          <td class="border border-gray-300 p-2" colspan="2">Außenwand Ost</td>
-          <td class="border border-gray-300 p-2 bg-yellow-100">{AussenWandFlaecheOst}</td>
-          <td class="border border-gray-300 p-2 bg-yellow-100">{WaermeDurchgangsKoeffizientAussenWandOst}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(WaermeTransferKoeffizientAussenwandOst*100)/100}</td>
-          <td class="border border-gray-300 p-2  bg-blue-100">{TemperaturKorrekturFaktorAussenwand}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(WaermeTransferKoeffizientAussenwandOstKorrektur*100)/100}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(maximalerWaermestromAussenwandOst)}</td>
-        </tr>
-        <tr class="text-center">
-          <td class="border border-gray-300 p-2" colspan="2">Fenster West</td>
-          <td class="border border-gray-300 p-2 bg-yellow-100">{FensterFlaecheWest}</td>
-          <td class="border border-gray-300 p-2 bg-yellow-100">{WaermeDurchgangsKoeffizientFensterWest}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(WaermeTransferKoeffizientFensterWest*100)/100}</td>
-          <td class="border border-gray-300 p-2  bg-blue-100">{TemperaturKorrekturFaktorFenster}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(WaermeTransferKoeffizientFensterWestKorrektur*100)/100}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(maximalerWaermestromFensterWest)}</td>
-        </tr>
-        <tr class="text-center">
-          <td class="border border-gray-300 p-2" colspan="2">Fenster Süd</td>
-          <td class="border border-gray-300 p-2 bg-yellow-100">{FensterFlaecheSued}</td>
-          <td class="border border-gray-300 p-2 bg-yellow-100">{WaermeDurchgangsKoeffizientFensterSued}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(WaermeTransferKoeffizientFensterSued*100)/100}</td>
-          <td class="border border-gray-300 p-2  bg-blue-100">{TemperaturKorrekturFaktorFenster}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(WaermeTransferKoeffizientFensterSuedKorrektur*100)/100}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(maximalerWaermestromFensterSued)}</td>
-        </tr>
-        <tr class="text-center">
-          <td class="border border-gray-300 p-2" colspan="2">Fenster Nord</td>
-          <td class="border border-gray-300 p-2 bg-yellow-100">{FensterFlaecheNord}</td>
-          <td class="border border-gray-300 p-2 bg-yellow-100">{WaermeDurchgangsKoeffizientFensterNord}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(WaermeTransferKoeffizientFensterNord*100)/100}</td>
-          <td class="border border-gray-300 p-2  bg-blue-100">{TemperaturKorrekturFaktorFenster}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(WaermeTransferKoeffizientFensterNordKorrektur*100)/100}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(maximalerWaermestromFensterNord)}</td>
-        </tr>
-        <tr class="text-center">
-          <td class="border border-gray-300 p-2" colspan="2">Fenster Ost</td>
-          <td class="border border-gray-300 p-2 bg-yellow-100">{FensterFlaecheOst}</td>
-          <td class="border border-gray-300 p-2 bg-yellow-100">{WaermeDurchgangsKoeffizientFensterOst}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(WaermeTransferKoeffizientFensterOst*100)/100}</td>
-          <td class="border border-gray-300 p-2  bg-blue-100">{TemperaturKorrekturFaktorFenster}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(WaermeTransferKoeffizientFensterOstKorrektur*100)/100}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(maximalerWaermestromFensterOst)}</td>
-        </tr>
-        <tr class="text-center">
-          <td class="border border-gray-300 p-2" colspan="2">Fenstertür</td>
-          <td class="border border-gray-300 p-2 bg-yellow-100"></td>
-          <td class="border border-gray-300 p-2 bg-yellow-100"></td>
-          <td class="border-2 border-gray-600 p-2"></td>
-          <td class="border border-gray-300 p-2  bg-blue-100"></td>
-          <td class="border-2 border-gray-600 p-2"></td>
-          <td class="border-2 border-gray-600 p-2"></td>
-        </tr>
-        <tr class="text-center">
-          <td class="border border-gray-300 p-2" colspan="2">Haustür</td>
-          <td class="border border-gray-300 p-2 bg-yellow-100">{HaustuerFlaeche}</td>
-          <td class="border border-gray-300 p-2 bg-yellow-100">{WaermeDurchgangsKoeffizientHaustuer}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(WaermeTransferKoeffizientHaustuer*100)/100}</td>
-          <td class="border border-gray-300 p-2  bg-blue-100">{TemperaturKorrekturFaktorHaustuer}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(WaermeTransferKoeffizientHaustuerKorrektur*100)/100}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(maximalerWaermestromHaustuer)}</td>
-        </tr>
-        <tr class="text-center">
-            <td class="border border-gray-300 p-2" colspan="2">Flachdach</td>
-            <td class="border border-gray-300 p-2 bg-yellow-100">{FlachdachFlaeche}</td>
-            <td class="border border-gray-300 p-2 bg-yellow-100">{WaermeDurchgangsKoeffizientFlachdach}</td>
-            <td class="border-2 border-gray-600 p-2">{Math.round(WaermeTransferKoeffizientFlachdach*100)/100}</td>
-            <td class="border border-gray-300 p-2  bg-blue-100">{TemperaturKorrekturFaktorFlachdach}</td>
-            <td class="border-2 border-gray-600 p-2">{Math.round(WaermeTransferKoeffizientFlachdachKorrektur*100)/100}</td>
-            <td class="border-2 border-gray-600 p-2">{Math.round(maximalerWaermestromFlachdach)}</td>
-          </tr>
-        <tr class="text-center">
-          <td class="border border-gray-300 p-2" colspan="2">Oberste Geschossdecke</td>
-          <td class="border border-gray-300 p-2 bg-yellow-100"></td>
-          <td class="border border-gray-300 p-2 bg-yellow-100"></td>
-          <td class="border-2 border-gray-600 p-2"></td>
-          <td class="border border-gray-300 p-2  bg-blue-100"></td>
-          <td class="border-2 border-gray-600 p-2"></td>
-          <td class="border-2 border-gray-600 p-2"></td>
-        </tr>
-        <tr class="text-center">
-          <td class="border border-gray-300 p-2" colspan="2">Wand gegen Abseitenraum</td>
-          <td class="border border-gray-300 p-2 bg-yellow-100"></td>
-          <td class="border border-gray-300 p-2 bg-yellow-100"></td>
-          <td class="border-2 border-gray-600 p-2"></td>
-          <td class="border border-gray-300 p-2  bg-blue-100"></td>
-          <td class="border-2 border-gray-600 p-2"></td>
-          <td class="border-2 border-gray-600 p-2"></td>
-        </tr>
-        <tr class="text-center">
-            <td class="border border-gray-300 p-2" colspan="2">Bodenplatte</td>
-            <td class="border border-gray-300 p-2 bg-yellow-100">{BodenplatteFlaeche}</td>
-            <td class="border border-gray-300 p-2 bg-yellow-100">{WaermeDurchgangsKoeffizientBodenplatte}</td>
-            <td class="border-2 border-gray-600 p-2">{Math.round(WaermeTransferKoeffizientBodenplatte*100)/100}</td>
-            <td class="border border-gray-300 p-2  bg-blue-100">{TemperaturKorrekturFaktorBodenplatte}</td>
-            <td class="border-2 border-gray-600 p-2">{Math.round(WaermeTransferKoeffizientBodenplatteKorrektur*100)/100}</td>
-            <td class="border-2 border-gray-600 p-2">{Math.round(maximalerWaermestromBodenplatte)}</td>
+          <td class="border border-gray-300 p-2" colspan="2">{bauteil.Art} {bauteil.Orientierung}</td>
+          <td class="border border-gray-300 p-2 bg-yellow-100">{bauteil.Flaeche}</td>
+          <td class="border border-gray-300 p-2 bg-yellow-100">{bauteil.WaermeDurchgangsKoeffizient}</td>
+          <td class="border-2 border-gray-600 p-2">{Math.round(bauteil.WaermeTransferKoeffizient*100)/100}</td>
+          <td class="border border-gray-300 p-2  bg-blue-100">{bauteil.TemperaturKorrekturFaktor}</td>
+          <td class="border-2 border-gray-600 p-2">{Math.round(bauteil.WaermeTransferKoeffizientKorrektur*100)/100}</td>
+          <td class="border-2 border-gray-600 p-2">{Math.round(bauteil.maximalerWaermestrom)}</td>
         </tr>
+        {/each}
         <tr class="text-center">
           <td class="border border-gray-300 p-2 font-bold" colspan="2"></td>
           <td class="border border-gray-300 p-2"></td>
@@ -431,12 +133,12 @@ $: {
         </tr>
         <tr class="text-center">
           <td class="border border-gray-300 p-2" colspan="2">Berücksichtigung von Wärmebrücken</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(GesamtHuellFlaeche*100)/100}</td>
-          <td class="border border-gray-300 p-2 bg-blue-100">{WaermeBrueckenZuschlag}</td>
+          <td class="border-2 border-gray-600 p-2">{Math.round(result.GesamtHuellFlaeche*100)/100}</td>
+          <td class="border border-gray-300 p-2 bg-blue-100">{result.WaermeBrueckenZuschlag}</td>
           <td class="border border-gray-300 p-2"></td>
           <td class="border border-gray-300 p-2"></td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(WaermeTransferKoeffizientWaeremebruecken*100)/100}</td>
-          <td class="border-2 border-gray-600 p-2">{Math.round(maximalerWaermestromWaermebruecken)}</td>
+          <td class="border-2 border-gray-600 p-2">{Math.round(result.WaermeTransferKoeffizientWaeremebruecken*100)/100}</td>
+          <td class="border-2 border-gray-600 p-2">{Math.round(result.maximalerWaermestromWaermebruecken)}</td>
         </tr>
 
         <tr class="text-center">
@@ -463,8 +165,8 @@ $: {
           <td class="border-gray-300 p-2"></td>
           <td class="border-gray-300 p-2"></td>
           <td class="border-gray-300 p-2"></td>
-          <td class="border-2 border-gray-600 font-bold p-2">{Math.round(WaermeTransferKoeffizientGesamt*100)/100}</td>
-          <td class="border-2 border-gray-600 font-bold p-2">{Math.round(maximalerWaermestromGesamt)}</td>
+          <td class="border-2 border-gray-600 font-bold p-2">{Math.round(result.WaermeTransferKoeffizientBauteile*100)/100}</td>
+          <td class="border-2 border-gray-600 font-bold p-2">{Math.round(result.maximalerWaermestromBauteile)}</td>
         </tr>
         <tr class="text-center">
           <td class="border-gray-300 p-2" colspan="2"></td>

src/components/Tabellen/A5Waermetransferkoeffizienten.svelte

@@ -0,0 +1,253 @@
+<script lang="ts">
+	import { BedarfsausweisWohnenClient } from "#components/Ausweis/types.js";
+
+	export let ausweis: BedarfsausweisWohnenClient;
+</script>
+
+<div class="overflow-x-auto mt-16">
+
+	<table class="table-auto border-collapse border border-gray-300 w-full text-sm">
+		<!-- Tabellenüberschrift -->
+		<thead>
+			<tr class="bg-gray-200 text-left">
+				<th colspan="6" class="border border-gray-300 p-2 text-left">
+					<h2>Tabelle A.5 — Gebäude – Berechnung Wärmetransferkoeffizienten und maximaler Wärmeströme</h2>
+				</th>
+			</tr>
+			<tr class="bg-gray-200 text-left">
+				<th colspan="6" class="border border-gray-300 p-2 text-left text-xl">
+					Wärmesenken
+				</th>
+			</tr>
+		</thead>
+
+		<!-- Objektdaten -->
+		<tbody>
+			<tr class="bg-yellow-100">
+				<td colspan="1" class="border border-gray-300 p-2 text-left bg-white">Objekt:</td>
+				<td colspan="5" class="border border-gray-300 p-2 text-left"></td>
+			</tr>
+			<tr>
+				<td class="border border-gray-300 p-2 w-2/6">Nettogrundfläche</td>
+				<td class="border border-gray-300 p-2 w-1/6">A<sub>NGF</sub> [m²]</td>
+				<td class="border border-gray-300 p-2 w-1/6 bg-yellow-100"></td>
+				<td class="border border-gray-300 p-2">θ<sub>e,min</sub> [°C]</td>
+				<td class="border border-gray-300 p-2 bg-gray-100 text-center">−12</td>
+				<td class="border border-gray-300 p-2" rowspan="2"></td>
+			</tr>
+			<tr>
+				<td class="border border-gray-300 p-2">Lichte Raumhöhe</td>
+				<td class="border border-gray-300 p-2">h<sub>G</sub> [m]</td>
+				<td class="border border-gray-300 p-2 w-1/6 bg-yellow-100"></td>
+				<td class="border border-gray-300 p-2">θ<sub>i,h,soll</sub> [°C]</td>
+				<td class="border border-gray-300 p-2 bg-gray-100 text-center">20</td>
+			</tr>
+			<tr>
+				<td class="border border-gray-300 p-2">Volumen (Innenmaß)</td>
+				<td class="border border-gray-300 p-2">V = A<sub>NGF</sub> · h<sub>G</sub> [m³]</td>
+				<td class="border-2 border-gray-600 p-2"></td>
+				<td class="border border-gray-300 p-2">Δθ<sub>max</sub> = θ<sub>i,h,soll</sub> − θ<sub>e,min</sub></td>
+				<td class="border border-gray-300 p-2 bg-gray-100 text-center">32</td>
+			</tr>
+			<tr>
+				<td class="border border-gray-300 p-2">Volumen (Außenmaß)</td>
+				<td class="border border-gray-300 p-2">V<sub>e</sub> [m³]</td>
+				<td class="border border-gray-300 p-2 w-1/6 bg-yellow-100"></td>
+				<td class="border border-gray-300 p-2"></td>
+				<td class="border border-gray-300 p-2"></td>
+			</tr>
+			<tr>
+				<td class="border border-gray-300 p-2">Faktor (kleine Gebäude: 0,76 / große Gebäude: 0,8)</td>
+				<td class="border border-gray-300 p-2">n*</td>
+				<td class="border border-gray-300 p-2 w-1/6 bg-yellow-100"></td>
+				<td class="border border-gray-300 p-2"></td>
+				<td class="border border-gray-300 p-2"></td>
+			</tr>
+			<tr>
+				<td class="border border-gray-300 p-2">Volumen (Innenmaß)</td>
+				<td class="border border-gray-300 p-2 italic">V = n* · V<sub>e</sub> [m³]</td>
+				<td class="border-2 border-gray-600 p-2"></td>
+				<td class="border border-gray-300 p-2">A/V-Verhätnis [1/m]</td>
+				<td class="border-2 border-gray-600 p-2"></td>
+			</tr>
+		</tbody>
+	</table>
+	<br>
+	<table class="table-auto border-collapse border border-gray-300 w-full text-sm">
+		<!-- Tabellenkopf -->
+		<thead>
+			<tr class="text-center">
+				<th class="border border-gray-300 p-2" colspan="2">Bauteil</th>
+				<th class="border border-gray-300 p-2">Fläche<br>A<sub>i</sub> (m²)</th>
+				<th class="border border-gray-300 p-2">Wärmedurchgangs-<br>koeffizient U<sub>i</sub><br>(W/m²·K)</th>
+				<th class="border border-gray-300 p-2">H<sub>T,i*</sub><br>= U<sub>i</sub> · A<sub>i</sub><br>(W/K)</th>
+				<th class="border border-gray-300 p-2">F<sub>xi</sub><br>aus Tabelle C.3/C.4</th>
+				<th class="border border-gray-300 p-2">H<sub>T,i</sub><br>= U<sub>i</sub> · A<sub>i</sub> · F<sub>xi</sub><br>(W/K)</th>
+				<th class="border border-gray-300 p-2">maximaler Wärmestrom<br>Q̇<sub>T,i</sub> = H<sub>T,i</sub> · ΔΘ<sub>max</sub><br>(W)</th>
+			</tr>
+		</thead>
+
+		<!-- Tabellenkörper -->
+		<tbody>
+			<tr class="text-center">
+				<td class="border border-gray-300 p-2" colspan="2">Außenwand</td>
+				<td class="border border-gray-300 p-2 bg-yellow-100"></td>
+				<td class="border border-gray-300 p-2 bg-yellow-100"></td>
+				<td class="border-2 border-gray-600 p-2"></td>
+				<td class="border border-gray-300 p-2  bg-blue-100"></td>
+				<td class="border-2 border-gray-600 p-2"></td>
+				<td class="border-2 border-gray-600 p-2"></td>
+			</tr>
+			<tr class="text-center">
+				<td class="border border-gray-300 p-2" colspan="2">Fenster</td>
+				<td class="border border-gray-300 p-2 bg-yellow-100"></td>
+				<td class="border border-gray-300 p-2 bg-yellow-100"></td>
+				<td class="border-2 border-gray-600 p-2"></td>
+				<td class="border border-gray-300 p-2  bg-blue-100"></td>
+				<td class="border-2 border-gray-600 p-2"></td>
+				<td class="border-2 border-gray-600 p-2"></td>
+			</tr>
+			<tr class="text-center">
+				<td class="border border-gray-300 p-2" colspan="2">Fenstertür</td>
+				<td class="border border-gray-300 p-2 bg-yellow-100"></td>
+				<td class="border border-gray-300 p-2 bg-yellow-100"></td>
+				<td class="border-2 border-gray-600 p-2"></td>
+				<td class="border border-gray-300 p-2  bg-blue-100"></td>
+				<td class="border-2 border-gray-600 p-2"></td>
+				<td class="border-2 border-gray-600 p-2"></td>
+			</tr>
+			<tr class="text-center">
+				<td class="border border-gray-300 p-2" colspan="2">Haustür</td>
+				<td class="border border-gray-300 p-2 bg-yellow-100"></td>
+				<td class="border border-gray-300 p-2 bg-yellow-100"></td>
+				<td class="border-2 border-gray-600 p-2"></td>
+				<td class="border border-gray-300 p-2  bg-blue-100"></td>
+				<td class="border-2 border-gray-600 p-2"></td>
+				<td class="border-2 border-gray-600 p-2"></td>
+			</tr>
+			<tr class="text-center">
+				<td class="border border-gray-300 p-2" colspan="2">Dach</td>
+				<td class="border border-gray-300 p-2 bg-yellow-100"></td>
+				<td class="border border-gray-300 p-2 bg-yellow-100"></td>
+				<td class="border-2 border-gray-600 p-2"></td>
+				<td class="border border-gray-300 p-2  bg-blue-100"></td>
+				<td class="border-2 border-gray-600 p-2"></td>
+				<td class="border-2 border-gray-600 p-2"></td>
+			</tr>
+			<tr class="text-center">
+				<td class="border border-gray-300 p-2" colspan="2">Oberste Geschossdecke</td>
+				<td class="border border-gray-300 p-2 bg-yellow-100"></td>
+				<td class="border border-gray-300 p-2 bg-yellow-100"></td>
+				<td class="border-2 border-gray-600 p-2"></td>
+				<td class="border border-gray-300 p-2  bg-blue-100"></td>
+				<td class="border-2 border-gray-600 p-2"></td>
+				<td class="border-2 border-gray-600 p-2"></td>
+			</tr>
+			<tr class="text-center">
+				<td class="border border-gray-300 p-2" colspan="2">Wand gegen Abseitenraum</td>
+				<td class="border border-gray-300 p-2 bg-yellow-100"></td>
+				<td class="border border-gray-300 p-2 bg-yellow-100"></td>
+				<td class="border-2 border-gray-600 p-2"></td>
+				<td class="border border-gray-300 p-2  bg-blue-100"></td>
+				<td class="border-2 border-gray-600 p-2"></td>
+				<td class="border-2 border-gray-600 p-2"></td>
+			</tr>
+			<tr class="text-center">
+				<td class="border border-gray-300 p-2" colspan="2">Kellerdecke / Fußboden zum Erdreich</td>
+				<td class="border border-gray-300 p-2 bg-yellow-100"></td>
+				<td class="border border-gray-300 p-2 bg-yellow-100"></td>
+				<td class="border-2 border-gray-600 p-2"></td>
+				<td class="border border-gray-300 p-2  bg-blue-100"></td>
+				<td class="border-2 border-gray-600 p-2"></td>
+				<td class="border-2 border-gray-600 p-2"></td>
+			</tr>
+			<tr class="text-center">
+				<td class="border border-gray-300 p-2 font-bold" colspan="2">Summen</td>
+				<td class="border-2 border-gray-600 p-2"></td>
+				<td class="border border-gray-300 p-2"></td>
+				<td class="border border-gray-300 p-2"></td>
+				<td class="border border-gray-300 p-2"></td>
+				<td class="border-2 border-gray-600 p-2"></td>
+				<td class="border border-gray-300 p-2"></td>
+			</tr>
+			<tr class="text-center">
+				<td class="p-2" colspan="2"></td>
+				<td class="p-2"></td>
+				<td class="p-2"></td>
+				<td class="p-2"></td>
+				<td class="p-2"></td>
+				<td class="p-2"></td>
+				<td class="p-2"></td>
+			</tr>
+			<tr class="text-center">
+				<td class="p-2" colspan="2"></td>
+				<td class="p-2">Gesamthüllfläche
+					A = ∑<sub>i</sub> A<sub>i</sub> [m²]</td>
+				<td class="p-2">Wärmebrückenzuschlag<br> ΔU<sub>WB</sub> [W/m²K]
+					aus C.5</td>
+				<td class="p-2">
+					H<sub>T,WB</sub> = ΔU<sub>WB</sub> · A [W/K]</td>
+				<td class="p-2"></td>
+				<td class="p-2"></td>
+				<td class="p-2"></td>
+			</tr>
+			<tr class="text-center">
+				<td class="border border-gray-300 p-2" colspan="2">Berücksichtigung von Wärmebrücken</td>
+				<td class="border border-gray-300 p-2 bg-yellow-100"></td>
+				<td class="border border-gray-300 p-2 bg-blue-100"></td>
+				<td class="border-2 border-gray-600 p-2"></td>
+				<td class="border border-gray-300 p-2"></td>
+				<td class="border border-gray-300 p-2"></td>
+				<td class="border border-gray-300 p-2"></td>
+			</tr>
+
+			<tr class="text-center">
+				<td class="p-2" colspan="2"></td>
+				<td class="p-2"></td>
+				<td class="p-2"></td>
+				<td class="p-2"></td>
+				<td class="p-2"></td>
+				<td class="p-2"></td>
+				<td class="p-2"></td>
+			</tr>
+			<tr class="text-center">
+				<td class="p-2" colspan="2"></td>
+				<td class="p-2">H<sub>T,ges</sub> = ∑ H<sub>Ti</sub> + H<sub>T,WB</sub> [W/K]</td>
+				<td class="p-2"></td>
+				<td class="p-2"></td>
+				<td class="p-2"></td>
+				<td class="p-2"></td>
+				<td class="p-2"></td>
+			</tr>
+			<tr class="text-left">
+				<td class="border border-gray-300 font-bold p-2" colspan="2">Wärmetransferkoeffizient für Transmission</td>
+				<td class="border-2 border-gray-600 p-2"></td>
+				<td class="border border-gray-300 p-2"></td>
+				<td class="border border-gray-300 p-2"></td>
+				<td class="border border-gray-300 p-2"></td>
+				<td class="border border-gray-300 p-2"></td>
+				<td class="border border-gray-300 p-2"></td>
+			</tr>
+
+			<tr class="text-center">
+				<td class="p-2" colspan="2"></td>
+				<td class="p-2">Q̇<sub>T</sub> = H<sub>T,ges</sub> · ΔΘ<sub>max</sub> [W]</td>
+				<td class="p-2"></td>
+				<td class="p-2"></td>
+				<td class="p-2"></td>
+				<td class="p-2"></td>
+				<td class="p-2"></td>
+			</tr>
+			<tr class="text-left">
+				<td class="border border-gray-300 font-bold p-2" colspan="2">maximaler Wärmestrom</td>
+				<td class="border-2 border-gray-600 p-2"></td>
+				<td class="border border-gray-300 p-2"></td>
+				<td class="border border-gray-300 p-2"></td>
+				<td class="border border-gray-300 p-2"></td>
+				<td class="border border-gray-300 p-2"></td>
+				<td class="border border-gray-300 p-2"></td>
+			</tr>
+
+		</tbody>
+	</table>
+</div>

src/components/Tabellen/A6WaermeTransferMaxStroemeGesamt.svelte

@@ -1,19 +1,12 @@
 <script lang="ts">
-    import { BerechnungWaermeTransferMaxStroemeBauteile } from "#lib/Berechnungen/BedarfsausweisWohnen/BerechnungWaermeTransferMaxStroemeBauteile.js";
-    import { BedarfsausweisWohnenClient, GebaeudeAufnahmeClient } from "#components/Ausweis/types.js";
+    import { A6BerechnungWaermeTransferMaxStroemeLueftungGesamt } from "#lib/Berechnungen/BedarfsausweisWohnen/A6BerechnungWaermeTransferMaxStroemeLueftungGesamt.js";
+    import { BedarfsausweisWohnenClient, AufnahmeClient } from "#components/Ausweis/types.js";
   
     export let ausweis: BedarfsausweisWohnenClient;
-    export let gebaeude_aufnahme: GebaeudeAufnahmeClient;
+    export let gebaeude_aufnahme: AufnahmeClient;
 
 // Berechnete Werte aus A5
-
-let ObjektNettoVolumenAlternativ = 0;   
-
-
-$: {
-  const result = BerechnungWaermeTransferMaxStroemeBauteile()
-  ObjektNettoVolumenAlternativ = result.ObjektNettoVolumenAlternativ
-}
+$: result = A6BerechnungWaermeTransferMaxStroemeLueftungGesamt();
 
 </script>
 
@@ -58,11 +51,11 @@ $: {
         <!-- Zeile für Lüftung -->
         <tr>
           <td class="border border-gray-300 p-2 text-center">Lüftung</td>
-          <td class="border border-gray-300 p-2 bg-blue-100 text-center"></td>
-          <td class="border border-gray-300 p-2 text-center bg-yellow-100">{Math.round(ObjektNettoVolumenAlternativ*10)/10}</td>
+          <td class="border border-gray-300 p-2 bg-blue-100 text-center">{Math.round(result.GesamtLuftwechselN*1000)/1000}</td>
+          <td class="border border-gray-300 p-2 text-center bg-yellow-100">{Math.round(result.ObjektNettoVolumenAlternativ*10)/10}</td>
           <td class="border border-gray-300 p-2 text-center bg-gray-200">0,34</td>
-          <td class="border-2 border-gray-600 p-2 text-center"></td>
-          <td class="border-2 border-gray-600 p-2 text-center"></td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeTransferKoeffizientLueftungN*100)/100}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.maximalerWaermestromLueftungN)}</td>
         </tr>
         <!-- Summenzeile
         <tr class="">
@@ -100,8 +93,8 @@ $: {
             </tr>
             <tr>
               <td class="border border-gray-300 p-2 font-bold text-center">Gesamtsummen</td>
-              <td class="border-2 border-gray-600 p-2"></td>
-              <td class="border-2 border-gray-600 p-2"></td>
+              <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeTransferKoeffizientGesamt*100)/100}</td>
+              <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.maximalerWaermestromGesamt)}</td>
             </tr>
           </tbody>
         </table>
@@ -110,7 +103,7 @@ $: {
               <!-- Tabellenkopf -->
               <thead>
                 <tr class="text-center">
-                  <th colspan="3" class="border border-gray-300 p-2">Maximale Heizlast</th>
+                  <th colspan="3" class="border border-gray-300 p-2">Maximale Heizlast und flächenbezugene Heizlast</th>
                 </tr>
                 <tr class="text-center">
                   <th class="border border-gray-300 p-2">Beschreibung</th>
@@ -139,9 +132,19 @@ $: {
                   <td colspan="2" class="border border-gray-300 p-4 text-center">Φ<sub>h,max</sub> (W)</td>
                 </tr>
                 <tr>
-                  <td class="border border-gray-300 p-2 text-center font-bold w-1/3">Flächenbezogene Heizlast</td>
+                  <td class="border border-gray-300 p-4 text-left font-bold w-1/3">Maximale Heizlast</td>
+                  <td class="border border-gray-300 p-2 text-center w-1/3"></td>
+                  <td class="border-2 border-gray-600 p-2 text-center w-1/3">{Math.round(result.maximaleHeizlast)}</td>
+                </tr>
+                <tr>
+                  <td class="p-2 text-left font-bold w-1/3"></td>
+                  <td class="p-2 text-center w-1/3"></td>
+                  <td class="p-2 text-center w-1/3"></td>
+                </tr>
+                <tr>
+                  <td class="border border-gray-300 p-4 text-left font-bold w-1/3">Flächenbezogene Heizlast</td>
                   <td class="border border-gray-300 p-2 text-center w-1/3"> φ<sub>h,max</sub> = Φ<sub>h,max</sub> / A<sub>NGF</sub> (W/m²)</td>
-                  <td class="border-2 border-gray-600 p-2 text-center w-1/3"></td>
+                  <td class="border-2 border-gray-600 p-2 text-center w-1/3">{Math.round(result.FlaechgenbezogeneHeizlast*100)/100}</td>
                 </tr>
               </tbody>
             </table>
@@ -179,7 +182,7 @@ $: {
                   <tr class="h-10">
                     <td class="p-2"></td>
                     <td class="p-2"></td>
-                    <td class="border-2 border-gray-600 p-2 text-center"></td>
+                    <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.ZeitKonstante*100)/100}</td>
                   </tr>
                 </tbody>
               </table>

src/components/Tabellen/A7WaermequellenSolareEinstrahlung.svelte

@@ -0,0 +1,220 @@
+<script lang="ts">
+    import { A7A2BerechnungWaermequellenSolareEinstrahlung } from "#lib/Berechnungen/BedarfsausweisWohnen/A7A2BerechnungWaermequellenSolareEinstrahlung.js";
+
+$: result = A7A2BerechnungWaermequellenSolareEinstrahlung();
+
+</script>
+
+<div class="overflow-x-auto mt-16">
+    <table class="table-auto border-collapse border border-gray-300 w-full text-sm">
+      <!-- Tabellenkopf -->
+      <thead>
+        <tr class="bg-gray-200 text-left">
+          <th colspan="6" class="border border-gray-300 p-2">
+            <h2>Tabelle A.7 — Gebäude – Berechnung Wärmequellen durch solare Einstrahlung</h2>
+          </th>
+        </tr>
+        <tr class="bg-gray-200 text-left">
+          <th colspan="6" class="border border-gray-300 p-2 text-xl">
+            Solare Einstrahlung für transparente Flächen
+          </th>
+        </tr>
+      </thead>
+  
+      <!-- Tabellenkörper -->
+      <thead>
+        <tr class="bg-yellow-100 text-left">
+          <th class="border border-gray-300 p-2 w-4/12 bg-white">Orientierung</th>
+          {#each result.PlanungswerteBauteil as fenster, index}
+            <th class="border border-gray-300 p-2 w-1/12 text-center">{fenster.Orientierung}</th>
+          {/each}
+          <th class="border border-gray-300 p-2 w-2/12 bg-white text-center">Gesamtfläche</th>
+        </tr>
+      </thead>
+  
+      <!-- Tabellenkörper -->
+      <tbody>
+        <tr class="bg-yellow-100">
+          <td class="border border-gray-300 p-2 bg-white">Neigung</td>
+          {#each result.PlanungswerteBauteil as fenster, index}
+            <td class="border border-gray-300 p-2 text-center">{fenster.Neigung}</td>
+          {/each}
+          <td class="border border-gray-300 p-2 text-center bg-white">[m²]</td>
+        </tr>
+        <tr class="bg-yellow-100">
+          <td class="border border-gray-300 p-2 bg-white">Bauteilfläche A [m²] (1)</td>
+          {#each result.PlanungswerteBauteil as fenster, index}
+            <td class="border border-gray-300 p-2 text-center">{fenster.Flaeche}</td>
+          {/each}
+          <td class="border-2 border-gray-600 p-2 text-center bg-white">{Math.round(result.summeFlaeche*100)/100}</td>
+        </tr>
+        <tr class="bg-yellow-100">
+          <td class="border border-gray-300 p-2 bg-white">Gesamtenergiedurchlassgrad g (2)</td>
+          {#each result.PlanungswerteBauteil as fenster, index}
+            <td class="border border-gray-300 p-2 text-center">{fenster.GesamtEnergieDurchlassGrad}</td>
+          {/each}
+          <td class="border border-gray-300 p-2 text-center bg-white"></td>
+        </tr>
+        <tr class="bg-gray-100">
+          <td class="border border-gray-300 p-2 bg-white">Abm. Rahmenanteil F<sub>F</sub> (3)</td>
+          {#each result.PlanungswerteBauteil as fenster, index}
+            <td class="border border-gray-300 p-2 text-center">{fenster.RahmenAnteil}</td>
+          {/each}
+          <td class="border border-gray-300 p-2 text-center bg-white"></td>
+        </tr>
+        <tr class="bg-gray-100">
+          <td class="border border-gray-300 p-2 bg-white">Abm. Strahlungseinfluss F<sub>w</sub> (4)</td>
+          {#each result.PlanungswerteBauteil as fenster, index}
+            <td class="border border-gray-300 p-2 text-center">{fenster.StrahlungsEinfluss}</td>
+          {/each}
+          <td class="border border-gray-300 p-2 text-center bg-white"></td>
+        </tr>
+        <tr class="bg-gray-100">
+          <td class="border border-gray-300 p-2 bg-white ">Abm. Verschattung F<sub>s</sub> (5)</td>
+          {#each result.PlanungswerteBauteil as fenster, index}
+          <td class="border border-gray-300 p-2 text-center">{fenster.Verschattung}</td>
+        {/each}
+          <td class="border border-gray-300 p-2 text-center bg-white"></td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 p-2">wirks. Gesamtenergiedurchlassgrad<br>
+            g<sub>eff</sub> = g · F<sub>w</sub> · F<sub>s</sub><br>
+            (6) = (2) · (4) · (5)</td>
+          {#each result.ErgebnisseWirksamerGesamtEnergieDurchlassGrad as wert, index}
+            <td class="border-2 border-gray-600 p-2 text-center">{Math.round(wert * 100) / 100}</td>
+          {/each}
+          <td class="border border-gray-300 p-2 text-center bg-white"></td>
+        </tr>
+      </tbody>
+    </table>
+<br>
+      <table class="table-auto border-collapse border border-gray-300 w-full text-sm">
+        <!-- Tabelle Kopf -->
+        <thead>
+          <tr class="text-center">
+            <th colspan="2" class="border border-gray-300 p-2 text-left">E<sub>sol</sub> aus Tabelle 17</th>
+            <th colspan="3" class="border border-gray-300 p-2 text-left">
+              Q<sub>S,tr</sub> = A ⋅ F<sub>F</sub> ⋅ g<sub>eff</sub>
+               ⋅ E<sub>sol</sub> </th>
+            <th colspan="7" class="border border-gray-300 p-2 text-left"></th> 
+          </tr>
+          <tr class="text-center">
+            <th class="border border-gray-300 p-2">Monat</th>
+            {#each result.ErgebnisseMonatsWerteJanuar as wert, index}
+            <th class="border border-gray-300 p-2">E<sub>sol</sub><br>[kWh/m²]<br></th>
+            <th class="border border-gray-300 p-2">Q<sub>str</sub><br>[kWh]</th>
+            {/each}
+            <th class="border border-gray-300 p-2">ΣQ<sub>str</sub><br>[kWh]</th>
+          </tr>
+        </thead>
+    
+        <!-- Tabelle Körper -->
+        <tbody>
+            <!-- Monatsdaten -->
+            <tr class="text-center">
+            <td class="border border-gray-300 p-2 text-center">Januar</td>
+            {#each result.ErgebnisseMonatsWerteJanuar as wert, index}
+              <td class="border border-gray-300 p-2 bg-blue-100">{Math.round(wert*100)/100}</td>
+              <td class="border-2 border-gray-600 p-2">{Math.round(result.ErgebnisseJanuar[index]*100)/100}</td>
+            {/each}
+            <td class="border-2 border-gray-600 p-2">{Math.round(result.summeErgebnisseJanuar * 100) / 100}</td>
+            </tr>
+            <tr class="text-center">
+            <td class="border border-gray-300 p-2 text-center">Februar</td>
+            {#each result.ErgebnisseMonatsWerteFebruar as wert, index}
+              <td class="border border-gray-300 p-2 bg-blue-100">{Math.round(wert*100)/100}</td>
+              <td class="border-2 border-gray-600 p-2">{Math.round(result.ErgebnisseFebruar[index]*100)/100}</td>
+            {/each}
+            <td class="border-2 border-gray-600 p-2">{Math.round(result.summeErgebnisseFebruar * 100) / 100}</td>
+            </tr>
+            <tr class="text-center">
+            <td class="border border-gray-300 p-2 text-center">März</td>
+            {#each result.ErgebnisseMonatsWerteMaerz as wert, index}
+              <td class="border border-gray-300 p-2 bg-blue-100">{Math.round(wert*100)/100}</td>
+              <td class="border-2 border-gray-600 p-2">{Math.round(result.ErgebnisseMaerz[index]*100)/100}</td>
+            {/each}
+            <td class="border-2 border-gray-600 p-2">{Math.round(result.summeErgebnisseMaerz * 100) / 100}</td>
+            </tr>
+            <tr class="text-center">
+            <td class="border border-gray-300 p-2 text-center">April</td>
+            {#each result.ErgebnisseMonatsWerteApril as wert, index}
+              <td class="border border-gray-300 p-2 bg-blue-100">{Math.round(wert*100)/100}</td>
+              <td class="border-2 border-gray-600 p-2">{Math.round(result.ErgebnisseApril[index]*100)/100}</td>
+            {/each}
+            <td class="border-2 border-gray-600 p-2">{Math.round(result.summeErgebnisseApril * 100) / 100}</td>
+            </tr>
+            <tr class="text-center">
+            <td class="border border-gray-300 p-2 text-center">Mai</td>
+            {#each result.ErgebnisseMonatsWerteMai as wert, index}
+              <td class="border border-gray-300 p-2 bg-blue-100">{Math.round(wert*100)/100}</td>
+              <td class="border-2 border-gray-600 p-2">{Math.round(result.ErgebnisseMai[index]*100)/100}</td>
+            {/each}
+            <td class="border-2 border-gray-600 p-2">{Math.round(result.summeErgebnisseMai * 100) / 100}</td>
+            </tr>
+            <tr class="text-center">
+            <td class="border border-gray-300 p-2 text-center">Juni</td>
+            {#each result.ErgebnisseMonatsWerteJuni as wert, index}
+              <td class="border border-gray-300 p-2 bg-blue-100">{Math.round(wert*100)/100}</td>
+              <td class="border-2 border-gray-600 p-2">{Math.round(result.ErgebnisseJuni[index]*100)/100}</td>
+            {/each}
+            <td class="border-2 border-gray-600 p-2">{Math.round(result.summeErgebnisseJuni * 100) / 100}</td>
+            </tr>
+            <tr class="text-center">
+            <td class="border border-gray-300 p-2 text-center">Juli</td>
+            {#each result.ErgebnisseMonatsWerteJuli as wert, index}
+              <td class="border border-gray-300 p-2 bg-blue-100">{Math.round(wert*100)/100}</td>
+              <td class="border-2 border-gray-600 p-2">{Math.round(result.ErgebnisseJuli[index]*100)/100}</td>
+            {/each}
+            <td class="border-2 border-gray-600 p-2">{Math.round(result.summeErgebnisseJuli * 100) / 100}</td>
+            </tr>
+            <tr class="text-center">
+            <td class="border border-gray-300 p-2 text-center">August</td>
+            {#each result.ErgebnisseMonatsWerteAugust as wert, index}
+              <td class="border border-gray-300 p-2 bg-blue-100">{Math.round(wert*100)/100}</td>
+              <td class="border-2 border-gray-600 p-2">{Math.round(result.ErgebnisseAugust[index]*100)/100}</td>
+            {/each}
+            <td class="border-2 border-gray-600 p-2">{Math.round(result.summeErgebnisseAugust * 100) / 100}</td>
+            </tr>
+            <tr class="text-center">
+            <td class="border border-gray-300 p-2 text-center">September</td>
+            {#each result.ErgebnisseMonatsWerteSeptember as wert, index}
+              <td class="border border-gray-300 p-2 bg-blue-100">{Math.round(wert*100)/100}</td>
+              <td class="border-2 border-gray-600 p-2">{Math.round(result.ErgebnisseSeptember[index]*100)/100}</td>
+            {/each}
+            <td class="border-2 border-gray-600 p-2">{Math.round(result.summeErgebnisseSeptember * 100) / 100}</td>
+            </tr>
+            <tr class="text-center">
+            <td class="border border-gray-300 p-2 text-center">Oktober</td>
+            {#each result.ErgebnisseMonatsWerteOktober as wert, index}
+              <td class="border border-gray-300 p-2 bg-blue-100">{Math.round(wert*100)/100}</td>
+              <td class="border-2 border-gray-600 p-2">{Math.round(result.ErgebnisseOktober[index]*100)/100}</td>
+            {/each}
+            <td class="border-2 border-gray-600 p-2">{Math.round(result.summeErgebnisseOktober * 100) / 100}</td>
+            </tr>
+            <tr class="text-center">
+            <td class="border border-gray-300 p-2 text-center">November</td>
+            {#each result.ErgebnisseMonatsWerteNovember as wert, index}
+              <td class="border border-gray-300 p-2 bg-blue-100">{Math.round(wert*100)/100}</td>
+              <td class="border-2 border-gray-600 p-2">{Math.round(result.ErgebnisseNovember[index]*100)/100}</td>
+            {/each}
+            <td class="border-2 border-gray-600 p-2">{Math.round(result.summeErgebnisseNovember * 100) / 100}</td>
+            </tr>
+            <tr class="text-center">
+            <td class="border border-gray-300 p-2 text-center">Dezember</td>
+            {#each result.ErgebnisseMonatsWerteDezember as wert, index}
+              <td class="border border-gray-300 p-2 bg-blue-100">{Math.round(wert*100)/100}</td>
+              <td class="border-2 border-gray-600 p-2">{Math.round(result.ErgebnisseDezember[index]*100)/100}</td>
+            {/each}
+            <td class="border-2 border-gray-600 p-2">{Math.round(result.summeErgebnisseDezember * 100) / 100}</td>
+            </tr>
+            <tr class="text-center">
+            <td class="border border-gray-300 p-2 font-bold text-center">Jahressumme</td>
+            {#each result.ErgebnisseMonatsWerteDezember as wert, index}
+            <td class="border border-gray-300 p-2"></td>
+            <td class="border border-gray-300 p-2"></td>
+            {/each}
+            <td class="border-2 border-gray-600 p-2 font-bold">{Math.round(result.summeErgebnisseJahr * 100) / 100}</td>
+          </tr>
+        </tbody>
+      </table>
+    </div>

src/components/Tabellen/A8WaermequellenAnlagentechnikHeizung.svelte

@@ -0,0 +1,179 @@
+<script lang="ts">
+ import { A8BerechnungWaermequellenAusAnlagentechnikHeizung } from "#lib/Berechnungen/BedarfsausweisWohnen/A8BerechnungWaermequellenAusAnlagentechnikHeizung.js";
+
+$: result = A8BerechnungWaermequellenAusAnlagentechnikHeizung();
+
+</script>
+
+
+<div class="overflow-x-auto mt-16">
+    <table class="table-auto border-collapse border border-gray-300 w-full text-sm">
+      <!-- Tabellenkopf -->
+      <thead>
+        <tr class="bg-gray-200 text-left">
+          <th colspan="8" class="border border-gray-300 p-2">
+            <h2>Tabelle A.8 — Heizung – Berechnung der monatlichen Wärmequellen aus Anlagentechnik Heizung</h2>
+          </th>
+        </tr>
+        <tr class="text-center">
+          <th class="border border-gray-300 p-2">Monat</th>
+          <th class="border border-gray-300 p-2">Tage im Monat <br> d<sub>mth</sub> (1)</th>
+          <th class="border border-gray-300 p-2">P<sub>h,sink</sub> [W]<br>aus Tabelle A.12<br>(2)</th>
+          <th class="border border-gray-300 p-2">(Q<sub>l</sub> + 0,5 · Q<sub>str</sub>) · f<sub>um</sub> [W]<br>Werte zur Berechnung aus Tabelle A.11<br>(3)</th>
+          <th class="border border-gray-300 p-2">P<sup>*</sup><sub>h,sink</sub> [W]<br>(4) = [(2)-(3);0]</th>
+          <th class="border border-gray-300 p-2">Mittlere Belastung <br> β<sub>e,m</sub><br>aus Tabelle 9 / Tabelle 11<br>(5)</th>
+          <th class="border border-gray-300 p-2">β<sub>e,m</sub> / β<sub>e,max</sub><br>(6)</th>
+          <th class="border border-gray-300 p-2">Wärmequellen Anlagentechnik Q<sub>l,source,h</sub> [kWh]<br>(8) = (4) · (6) · (7)/f<sub>um</sub></th>
+        </tr>
+        <tr class="text-center">
+          <th colspan="6" class="border border-gray-300 p-2"></th>
+          <th colspan="1" class="border border-gray-300 p-2"></th>
+          <th colspan="1" class="border border-gray-300 p-2"> (7) = f<sub>A-H</sub> aus Tabelle 141</th>
+          <tr class="text-center h-10">
+            <th colspan="6" class="border border-gray-300 p-2"></th>
+            <th colspan="1" class="border border-gray-300 p-2"></th>
+            <th colspan="1" class="border border-gray-300 p-2 bg-blue-100">{result.FaktorNutzbareWaerme}</th>
+          </tr>
+    
+      </thead>
+  
+      <!-- Tabellenkörper -->
+      <tbody>
+        <!-- Monatszeilen -->
+        <tr>
+          <td class="border border-gray-300 p-2 text-center">Januar</td>
+          <td class="border border-gray-300 p-2 text-center bg-gray-100">{result.TageMonat.Januar}</td>
+          <td class="border border-gray-300 p-2 text-center bg-yellow-100">{Math.round(result.waermeSenken.Januar)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenGesamtJanuar)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.waermeSenkenBereinigtJanuar)}</td>
+          <td class="border border-gray-300 p-2 text-center bg-blue-100">{Math.round(result.belastungsgrade.Januar*1000)/1000}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.belastungsgradeBereinigt.Januar*1000)/1000}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenAnlagentechnikHeizungJanuar)}</td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 p-2 text-center">Februar</td>
+          <td class="border border-gray-300 p-2 text-center bg-gray-100">{result.TageMonat.Februar}</td>
+          <td class="border border-gray-300 p-2 text-center bg-yellow-100">{Math.round(result.waermeSenken.Februar)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenGesamtFebruar)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.waermeSenkenBereinigtFebruar)}</td>
+          <td class="border border-gray-300 p-2 text-center bg-blue-100">{Math.round(result.belastungsgrade.Februar*1000)/1000}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.belastungsgradeBereinigt.Februar*1000)/1000}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenAnlagentechnikHeizungFebruar)}</td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 p-2 text-center">März</td>
+          <td class="border border-gray-300 p-2 text-center bg-gray-100">{result.TageMonat.März}</td>
+          <td class="border border-gray-300 p-2 text-center bg-yellow-100">{Math.round(result.waermeSenken.März)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenGesamtMaerz)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.waermeSenkenBereinigtMaerz)}</td>
+          <td class="border border-gray-300 p-2 text-center bg-blue-100">{Math.round(result.belastungsgrade.März*1000)/1000}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.belastungsgradeBereinigt.März*1000)/1000}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenAnlagentechnikHeizungMaerz)}</td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 p-2 text-center">April</td>
+          <td class="border border-gray-300 p-2 text-center bg-gray-100">{result.TageMonat.April}</td>
+          <td class="border border-gray-300 p-2 text-center bg-yellow-100">{Math.round(result.waermeSenken.April)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenGesamtApril)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.waermeSenkenBereinigtApril)}</td>
+          <td class="border border-gray-300 p-2 text-center bg-blue-100">{Math.round(result.belastungsgrade.April*1000)/1000}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.belastungsgradeBereinigt.April*1000)/1000}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenAnlagentechnikHeizungApril)}</td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 p-2 text-center">Mai</td>
+          <td class="border border-gray-300 p-2 text-center bg-gray-100">{result.TageMonat.Mai}</td>
+          <td class="border border-gray-300 p-2 text-center bg-yellow-100">{Math.round(result.waermeSenken.Mai)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenGesamtMai)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.waermeSenkenBereinigtMai)}</td>
+          <td class="border border-gray-300 p-2 text-center bg-blue-100">{Math.round(result.belastungsgrade.Mai*1000)/1000}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.belastungsgradeBereinigt.Mai*1000)/1000}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenAnlagentechnikHeizungMai)}</td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 p-2 text-center">Juni</td>
+          <td class="border border-gray-300 p-2 text-center bg-gray-100">{result.TageMonat.Juni}</td>
+          <td class="border border-gray-300 p-2 text-center bg-yellow-100">{Math.round(result.waermeSenken.Juni)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenGesamtJuni)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.waermeSenkenBereinigtJuni)}</td>
+          <td class="border border-gray-300 p-2 text-center bg-blue-100">{Math.round(result.belastungsgrade.Juni*1000)/1000}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.belastungsgradeBereinigt.Juni*1000)/1000}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenAnlagentechnikHeizungJuni)}</td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 p-2 text-center">Juli</td>
+          <td class="border border-gray-300 p-2 text-center bg-gray-100">{result.TageMonat.Juli}</td>
+          <td class="border border-gray-300 p-2 text-center bg-yellow-100">{Math.round(result.waermeSenken.Juli)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenGesamtJuli)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.waermeSenkenBereinigtJuli)}</td>
+          <td class="border border-gray-300 p-2 text-center bg-blue-100">{Math.round(result.belastungsgrade.Juli*1000)/1000}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.belastungsgradeBereinigt.Juli*1000)/1000}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenAnlagentechnikHeizungJuli)}</td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 p-2 text-center">August</td>
+          <td class="border border-gray-300 p-2 text-center bg-gray-100">{result.TageMonat.August}</td>
+          <td class="border border-gray-300 p-2 text-center bg-yellow-100">{Math.round(result.waermeSenken.August)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenGesamtAugust)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.waermeSenkenBereinigtAugust)}</td>
+          <td class="border border-gray-300 p-2 text-center bg-blue-100">{Math.round(result.belastungsgrade.August*1000)/1000}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.belastungsgradeBereinigt.August*1000)/1000}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenAnlagentechnikHeizungAugust)}</td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 p-2 text-center">September</td>
+          <td class="border border-gray-300 p-2 text-center bg-gray-100">{result.TageMonat.September}</td>
+          <td class="border border-gray-300 p-2 text-center bg-yellow-100">{Math.round(result.waermeSenken.September)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenGesamtSeptember)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.waermeSenkenBereinigtSeptember)}</td>
+          <td class="border border-gray-300 p-2 text-center bg-blue-100">{Math.round(result.belastungsgrade.September*1000)/1000}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.belastungsgradeBereinigt.September*1000)/1000}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenAnlagentechnikHeizungSeptember)}</td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 p-2 text-center">Oktober</td>
+          <td class="border border-gray-300 p-2 text-center bg-gray-100">{result.TageMonat.Oktober}</td>
+          <td class="border border-gray-300 p-2 text-center bg-yellow-100">{Math.round(result.waermeSenken.Oktober)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenGesamtOktober)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.waermeSenkenBereinigtOktober)}</td>
+          <td class="border border-gray-300 p-2 text-center bg-blue-100">{Math.round(result.belastungsgrade.Oktober*1000)/1000}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.belastungsgradeBereinigt.Oktober*1000)/1000}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenAnlagentechnikHeizungOktober)}</td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 p-2 text-center">November</td>
+          <td class="border border-gray-300 p-2 text-center bg-gray-100">{result.TageMonat.November}</td>
+          <td class="border border-gray-300 p-2 text-center bg-yellow-100">{Math.round(result.waermeSenken.November)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenGesamtNovember)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.waermeSenkenBereinigtNovember)}</td>
+          <td class="border border-gray-300 p-2 text-center bg-blue-100">{Math.round(result.belastungsgrade.November*1000)/1000}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.belastungsgradeBereinigt.November*1000)/1000}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenAnlagentechnikHeizungNovember)}</td>
+        </tr>
+        <tr>
+          <td class="border border-gray-300 p-2 text-center">Dezember</td>
+          <td class="border border-gray-300 p-2 text-center bg-gray-100">{result.TageMonat.Dezember}</td>
+          <td class="border border-gray-300 p-2 text-center bg-yellow-100">{Math.round(result.waermeSenken.Dezember)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenGesamtDezember)}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.waermeSenkenBereinigtDezember)}</td>
+          <td class="border border-gray-300 p-2 text-center bg-blue-100">{Math.round(result.belastungsgrade.Dezember*1000)/1000}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.belastungsgradeBereinigt.Dezember*1000)/1000}</td>
+          <td class="border-2 border-gray-600 p-2 text-center">{Math.round(result.WaermeQuellenAnlagentechnikHeizungDezember)}</td>
+        </tr>
+       
+        <!-- Zusatzzeile -->
+        <tr>
+          <td colspan="5" class="border border-gray-300 p-2 text-left font-bold">
+          </td>
+          <td colspan="1" class="border border-gray-300 p-2 text-center font-bold">
+            β<sub>e,max</sub> = {Math.round(result.maxBelastungsgrad*1000)/1000}  (5)
+          </td>
+          <td colspan="1" class="border border-gray-300 p-2 text-center font-bold">
+          </td>
+          <td colspan="1" class="border border-gray-300 p-2 text-center font-bold">
+            f<sub>um</sub> = 1000 / (24 · d<sub>mth</sub>)
+          </td>
+        </tr>
+      </tbody>
+    </table>
+  </div>

src/components/Tabellen/A9NutzenergiebedarfTrinkwarmwasser.svelte

@@ -1,18 +1,19 @@
 <script lang="ts"> 
-	import { BedarfsausweisWohnenClient, GebaeudeAufnahmeClient } from "#components/Ausweis/types.js";
+	import { BedarfsausweisWohnenClient, AufnahmeClient } from "#components/Ausweis/types.js";
 
 	export let ausweis: BedarfsausweisWohnenClient;
-	export let gebaeude_aufnahme: GebaeudeAufnahmeClient;
+	export let gebaeude_aufnahme: AufnahmeClient;
 
-	import { berechnungNutzenergiebedarfTrinkwarmwasser } from "#lib/Berechnungen/BedarfsausweisWohnen/BerechnungNutzenergiebedarfTrinkwarmwasser.js";
+	import { A9BerechnungNutzenergiebedarfTrinkwarmwasser } from "#lib/Berechnungen/BedarfsausweisWohnen/A9BerechnungNutzenergiebedarfTrinkwarmwasser.js";
 
-	let trinkwasserWaermebedarf = 0, flaechenBezogenerWaermebedarf = 0, bezugsflaeche = 0
+	let trinkwasserWaermebedarf = 0, flaechenBezogenerWaermebedarf = 0, bezugsflaeche = 0, trinkwasserWaermebedarfJahr = 0
 
 	$: {
-		const result = berechnungNutzenergiebedarfTrinkwarmwasser(ausweis, gebaeude_aufnahme)
+		const result = A9BerechnungNutzenergiebedarfTrinkwarmwasser(ausweis, gebaeude_aufnahme)
 		trinkwasserWaermebedarf = result.trinkwasserWaermebedarf
 		flaechenBezogenerWaermebedarf = result.flaechenBezogenerWaermebedarf
 		bezugsflaeche = result.bezugsflaeche
+		trinkwasserWaermebedarfJahr = result.trinkwasserWaermebedarfJahr
 	}
 </script>
 
@@ -32,7 +33,7 @@
 				</tr>
 			<tr class="text-center h-10">
 					<th class="w-1/4 border border-gray-300 p-2 bg-yellow-100">
-						<input type="number" bind:value={gebaeude_aufnahme.nutzflaeche}>
+						{bezugsflaeche}
 					</th>
 					<th class="w-1/4 border border-gray-300 p-2 bg-blue-100">{flaechenBezogenerWaermebedarf}</th>
 				</tr>
@@ -48,62 +49,62 @@
 			<tr>
 				<td class="w-1/4 border border-gray-300 p-2 text-center">Januar</td>
 				<td class="w-1/4 border border-gray-300 p-2 text-center bg-gray-100">31</td>
-				<td class="border-2 border-gray-600 p-2 text-center">{Math.round(trinkwasserWaermebedarf / 365 * 31)}</td>
+				<td class="border-2 border-gray-600 p-2 text-center">{Math.round(trinkwasserWaermebedarf.Januar)}</td>
 			</tr>
 			<tr>
 				<td class="w-1/4 border border-gray-300 p-2 text-center">Februar</td>
 				<td class="w-1/4 border border-gray-300 p-2 text-center bg-gray-100">28</td>
-				<td class="border-2 border-gray-600 p-2 text-center">{Math.round(trinkwasserWaermebedarf / 365 * 28)}</td>
+				<td class="border-2 border-gray-600 p-2 text-center">{Math.round(trinkwasserWaermebedarf.Februar)}</td>
 			</tr>
 			<tr>
 				<td class="w-1/4 border border-gray-300 p-2 text-center">März</td>
 				<td class="w-1/4 border border-gray-300 p-2 text-center bg-gray-100">31</td>
-				<td class="border-2 border-gray-600 p-2 text-center">{Math.round(trinkwasserWaermebedarf / 365 * 31)}</td>
+				<td class="border-2 border-gray-600 p-2 text-center">{Math.round(trinkwasserWaermebedarf.Maerz)}</td>
 			</tr>
 			<tr>
 				<td class="w-1/4 border border-gray-300 p-2 text-center">April</td>
 				<td class="w-1/4 border border-gray-300 p-2 text-center bg-gray-100">30</td>
-				<td class="border-2 border-gray-600 p-2 text-center">{Math.round(trinkwasserWaermebedarf / 365 * 30)}</td>
+				<td class="border-2 border-gray-600 p-2 text-center">{Math.round(trinkwasserWaermebedarf.April)}</td>
 			</tr>
 			<tr>
 				<td class="w-1/4 border border-gray-300 p-2 text-center">Mai</td>
 				<td class="w-1/4 border border-gray-300 p-2 text-center bg-gray-100">31</td>
-				<td class="border-2 border-gray-600 p-2 text-center">{Math.round(trinkwasserWaermebedarf / 365 * 31)}</td>
+				<td class="border-2 border-gray-600 p-2 text-center">{Math.round(trinkwasserWaermebedarf.Mai)}</td>
 			</tr>
 			<tr>
 				<td class="w-1/4 border border-gray-300 p-2 text-center">Juni</td>
 				<td class="w-1/4 border border-gray-300 p-2 text-center bg-gray-100">30</td>
-				<td class="border-2 border-gray-600 p-2 text-center">{Math.round(trinkwasserWaermebedarf / 365 * 30)}</td>
+				<td class="border-2 border-gray-600 p-2 text-center">{Math.round(trinkwasserWaermebedarf.Juni)}</td>
 			</tr>
 			<tr>
 				<td class="w-1/4 border border-gray-300 p-2 text-center">Juli</td>
 				<td class="w-1/4 border border-gray-300 p-2 text-center bg-gray-100">31</td>
-				<td class="border-2 border-gray-600 p-2 text-center">{Math.round(trinkwasserWaermebedarf / 365 * 31)}</td>
+				<td class="border-2 border-gray-600 p-2 text-center">{Math.round(trinkwasserWaermebedarf.Juli)}</td>
 			</tr>
 			<tr>
 				<td class="w-1/4 border border-gray-300 p-2 text-center">August</td>
 				<td class="w-1/4 border border-gray-300 p-2 text-center bg-gray-100">31</td>
-				<td class="border-2 border-gray-600 p-2 text-center">{Math.round(trinkwasserWaermebedarf / 365 * 31)}</td>
+				<td class="border-2 border-gray-600 p-2 text-center">{Math.round(trinkwasserWaermebedarf.August)}</td>
 			</tr>
 			<tr>
 				<td class="w-1/4 border border-gray-300 p-2 text-center">September</td>
 				<td class="w-1/4 border border-gray-300 p-2 text-center bg-gray-100">30</td>
-				<td class="border-2 border-gray-600 p-2 text-center">{Math.round(trinkwasserWaermebedarf / 365 * 30)}</td>
+				<td class="border-2 border-gray-600 p-2 text-center">{Math.round(trinkwasserWaermebedarf.September)}</td>
 			</tr>
 			<tr>
 				<td class="w-1/4 border border-gray-300 p-2 text-center">Oktober</td>
 				<td class="w-1/4 border border-gray-300 p-2 text-center bg-gray-100">31</td>
-				<td class="border-2 border-gray-600 p-2 text-center">{Math.round(trinkwasserWaermebedarf / 365 * 31)}</td>
+				<td class="border-2 border-gray-600 p-2 text-center">{Math.round(trinkwasserWaermebedarf.Oktober)}</td>
 			</tr>
 			<tr>
 				<td class="w-1/4 border border-gray-300 p-2 text-center">November</td>
 				<td class="w-1/4 border border-gray-300 p-2 text-center bg-gray-100">30</td>
-				<td class="border-2 border-gray-600 p-2 text-center">{Math.round(trinkwasserWaermebedarf / 365 * 30)}</td>
+				<td class="border-2 border-gray-600 p-2 text-center">{Math.round(trinkwasserWaermebedarf.November)}</td>
 			</tr>
 			<tr>
 				<td class="w-1/4 border border-gray-300 p-2 text-center">Dezember</td>
 				<td class="w-1/4 border border-gray-300 p-2 text-center bg-gray-100">31</td>
-				<td class="border-2 border-gray-600 p-2 text-center">{Math.round(trinkwasserWaermebedarf / 365 * 31)}</td>
+				<td class="border-2 border-gray-600 p-2 text-center">{Math.round(trinkwasserWaermebedarf.Dezember)}</td>
 			</tr>
 			<!-- Summenzeile -->
 			<tr>
@@ -113,7 +114,7 @@
 					Jahressumme Q<sub>w,b</sub> [kWh/a]
 				</td>
 				<td colspan="1" class="border-2 border-gray-600 p-2 text-center font-bold">
-					{trinkwasserWaermebedarf}
+					{Math.round(trinkwasserWaermebedarfJahr)}
 				</td>
 			</tr>
 			<!-- Fußzeile -->

src/components/Tickets/TicketPopup.svelte

@@ -1,6 +1,5 @@
 <script lang="ts">
-	import { addNotification } from "#components/Notifications/shared";
-	import { client } from "src/trpc";
+	import { api } from "astro-typesafe-api/client";
 	import { getClose } from "svelte-dialogs";
 
 	const close = getClose();
@@ -8,7 +7,7 @@
 	async function createTicket(e: SubmitEvent) {
 		e.preventDefault();
 		try {
-			await client.v1.tickets.erstellen.mutate({
+			await api.ticket.PUT.fetch({
 				beschreibung: description,
 				email: email,
 				metadata: {

src/components/UploadImages.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import HelpLabel from "#labels/HelpLabel.svelte";
+	import HelpLabel from "#components/labels/HelpLabel.svelte";
 	import type { BedarfsausweisWohnen, Enums, VerbrauchsausweisGewerbe } from "@ibcornelsen/database/client";
 
 	export let max: number = 2;
@@ -7,11 +7,11 @@
 	export let name: string = ""
 
 	// Array of base64 encoded images read into the input.
-	import { GebaeudeClient, UploadedGebaeudeBild, VerbrauchsausweisWohnenClient } from "./Ausweis/types.js";
+	import { ObjektClient, UploadedGebaeudeBild, VerbrauchsausweisWohnenClient } from "./Ausweis/types.js";
 
 	export let images: UploadedGebaeudeBild[] = [];
 	export let ausweis: VerbrauchsausweisWohnenClient | VerbrauchsausweisGewerbe | BedarfsausweisWohnen;
-	export let gebaeude: GebaeudeClient;
+	export let gebaeude: ObjektClient;
 	export let kategorie: Enums.BilderKategorie;
 
 	function getAllImages(this: HTMLInputElement) {

src/components/Verbrauchsausweis/audits/BedarfsausweisBenoetigt.ts

@@ -1,6 +1,6 @@
-import { GebaeudeAufnahmeClient, VerbrauchsausweisWohnenClient } from "#components/Ausweis/types.js";
+import { AufnahmeClient, VerbrauchsausweisWohnenClient } from "#components/Ausweis/types.js";
 
-export function auditBedarfsausweisBenoetigt(ausweis: VerbrauchsausweisWohnenClient, gebaeude: GebaeudeAufnahmeClient): boolean {
+export function auditBedarfsausweisBenoetigt(ausweis: VerbrauchsausweisWohnenClient, gebaeude: AufnahmeClient): boolean {
 	if (ausweis.ausstellgrund == "Neubau" || ausweis.ausstellgrund == "Modernisierung") {
 		return true;
 	}

src/components/Verbrauchsausweis/audits/EndEnergie.ts

@@ -1,19 +1,19 @@
-import { GebaeudeClient, VerbrauchsausweisWohnenClient, GebaeudeAufnahmeClient } from "#components/Ausweis/types.js";
+import { ObjektClient, VerbrauchsausweisWohnenClient, AufnahmeClient } from "#components/Ausweis/types.js";
 import { AuditType, hidden } from "./hidden.js";
 import { endEnergieVerbrauchVerbrauchsausweis_2016 } from "#lib/Berechnungen/VerbrauchsausweisWohnen/VerbrauchsausweisWohnen_2016.js";
 import { getKlimafaktoren } from "#lib/Klimafaktoren.js";
 
-export async function auditEndEnergie(ausweis: VerbrauchsausweisWohnenClient, gebaeude: GebaeudeClient, gebaeude_aufnahme_allgemein: GebaeudeAufnahmeClient): Promise<boolean> {
+export async function auditEndEnergie(ausweis: VerbrauchsausweisWohnenClient, gebaeude: ObjektClient, aufnahme: AufnahmeClient): Promise<boolean> {
     if (hidden.has(AuditType.END_ENERGIE)) {
         return false;
     }
     //sobald Fläche, Klimafaktoren und alle Verbrauchsjahre eingegeben wurden.
-    if (gebaeude_aufnahme_allgemein){
-        if (gebaeude_aufnahme_allgemein.flaeche && ausweis.verbrauch_1 && ausweis.verbrauch_2 && ausweis.verbrauch_3) {
+    if (aufnahme){
+        if (aufnahme.flaeche && ausweis.verbrauch_1 && ausweis.verbrauch_2 && ausweis.verbrauch_3) {
             try {
                 const response = await getKlimafaktoren(ausweis.startdatum, gebaeude.plz);
                 // Alle Klimfaktoren konnten abgefragt werden.
-                const eevva = await endEnergieVerbrauchVerbrauchsausweis_2016({...ausweis, gebaeude_aufnahme_allgemein: {...gebaeude_aufnahme_allgemein, gebaeude_stammdaten: gebaeude}});
+                const eevva = await endEnergieVerbrauchVerbrauchsausweis_2016({...ausweis, aufnahme: {...aufnahme, objekt: gebaeude}});
                 if (eevva){
                     if (eevva?.endEnergieVerbrauchGesamt <= 45 || eevva?.endEnergieVerbrauchGesamt >= 500) {
                         return true;

src/components/Verbrauchsausweis/audits/HeizungGebaeudeBaujahr.ts

@@ -1,7 +1,7 @@
-import { GebaeudeAufnahmeClient } from "#components/Ausweis/types.js";
+import { AufnahmeClient } from "#components/Ausweis/types.js";
 import { AuditType, hidden } from "../audits/hidden.js";
 
-export function auditHeizungGebaeudeBaujahr(gebaeude: GebaeudeAufnahmeClient): boolean {
+export function auditHeizungGebaeudeBaujahr(gebaeude: AufnahmeClient): boolean {
 	if ((gebaeude.baujahr_heizung && gebaeude.baujahr_heizung.length > 0) && (gebaeude.baujahr_gebaeude && gebaeude.baujahr_gebaeude.length > 0)) {
 		return gebaeude.baujahr_heizung[0] > 1500 &&
 	gebaeude.baujahr_gebaeude[0] > 1500 &&

src/components/Verbrauchsausweis/audits/HeizungJuengerDreiJahre.ts

@@ -1,7 +1,7 @@
-import { GebaeudeAufnahmeClient } from "#components/Ausweis/types.js";
+import { AufnahmeClient } from "#components/Ausweis/types.js";
 import { AuditType, hidden } from "../audits/hidden.js";
 
-export function auditHeizungJuengerDreiJahre(gebaeude: GebaeudeAufnahmeClient): boolean {
+export function auditHeizungJuengerDreiJahre(gebaeude: AufnahmeClient): boolean {
 
 	if (gebaeude.baujahr_heizung && gebaeude.baujahr_heizung.length > 0) {
 		if (!hidden.has(AuditType.HEIZUNG_JUENGER_DREI_JAHRE)) {

src/components/Verbrauchsausweis/audits/KlimaFaktoren.ts

@@ -1,8 +1,8 @@
-import { GebaeudeClient, VerbrauchsausweisWohnenClient } from "#components/Ausweis/types.js";
+import { ObjektClient, VerbrauchsausweisWohnenClient } from "#components/Ausweis/types.js";
 import { AuditType, hidden } from "./hidden.js";
 import { getKlimafaktoren } from "#lib/Klimafaktoren.js";
 
-export async function auditKlimaFaktoren(ausweis: VerbrauchsausweisWohnenClient, gebaeude: GebaeudeClient): Promise<boolean> {
+export async function auditKlimaFaktoren(ausweis: VerbrauchsausweisWohnenClient, gebaeude: ObjektClient): Promise<boolean> {
 	if (hidden.has(AuditType.KLIMA_FAKTOREN)) {
 		return false;
 	}

src/components/Verbrauchsausweis/audits/LeerStand.ts

@@ -1,7 +1,7 @@
-import { GebaeudeAufnahmeClient } from "#components/Ausweis/types.js";
+import { AufnahmeClient } from "#components/Ausweis/types.js";
 import { AuditType, hidden } from "./hidden.js";
 
-export function auditLeerStand(gebaeude: GebaeudeAufnahmeClient): boolean {
+export function auditLeerStand(gebaeude: AufnahmeClient): boolean {
 	if (gebaeude.leerstand && !hidden.has(AuditType.LEER_STAND)) {
 		return (
 			(gebaeude.leerstand > 30)

src/components/Verbrauchsausweis/audits/PlzNichtErkannt.ts

@@ -1,14 +1,14 @@
-import { GebaeudeAufnahmeClient } from "#components/Ausweis/types.js";
-import { client } from "src/trpc.js";
+import { ObjektClient } from "#components/Ausweis/types.js";
 import { memoize } from "src/lib/Memoization.js";
 import { AuditType, hidden } from "../audits/hidden.js";
+import { api } from "astro-typesafe-api/client";
 
 export const auditPlzNichtErkannt = memoize(
-	async (gebaeude: GebaeudeAufnahmeClient) => {
+	async (gebaeude: ObjektClient) => {
 		if (gebaeude.plz) {
 			if (gebaeude.plz.length == 5) {
 				try {
-					const result = await client.v1.postleitzahlen.query({
+					const result = await api.postleitzahlen.GET.fetch({
 						plz: gebaeude.plz,
 						limit: 1,
 					});

src/components/Verbrauchsausweis/audits/VerbrauchAbweichung.ts

@@ -1,7 +1,7 @@
-import { GebaeudeAufnahmeClient, GebaeudeClient, VerbrauchsausweisWohnenClient } from "#components/Ausweis/types.js";
+import { AufnahmeClient, ObjektClient, VerbrauchsausweisWohnenClient } from "#components/Ausweis/types.js";
 import { AuditType, hidden } from "./hidden.js";
 
-export function auditVerbrauchAbweichung(ausweis: VerbrauchsausweisWohnenClient, gebaeude: GebaeudeAufnahmeClient): number[] {
+export function auditVerbrauchAbweichung(ausweis: VerbrauchsausweisWohnenClient, gebaeude: AufnahmeClient): number[] {
 	if (gebaeude.leerstand && (gebaeude.leerstand > 0)) {
 		return [];
 	}

src/components/Verbrauchsausweis/audits/WohnFlaeche.ts

@@ -1,7 +1,7 @@
-import { GebaeudeAufnahmeClient } from "#components/Ausweis/types.js";
+import { AufnahmeClient } from "#components/Ausweis/types.js";
 import { AuditType, hidden } from "./hidden.js";
 
-export function auditWohnFlaeche(gebaeude: GebaeudeAufnahmeClient ): boolean {
+export function auditWohnFlaeche(gebaeude: AufnahmeClient ): boolean {
 	if (gebaeude.einheiten && gebaeude.flaeche ) {
         if (!hidden.has(AuditType.WOHN_FLAECHE)){
 			return (

src/components/Verbrauchsausweis/audits/WohnflaecheGroesserGesamtflaeche.ts

@@ -1,7 +1,7 @@
-import { GebaeudeAufnahmeClient } from "#components/Ausweis/types.js";
+import { AufnahmeClient } from "#components/Ausweis/types.js";
 import { AuditType, hidden } from "../audits/hidden.js";
 
-export function auditWohnflaecheGroesserGesamtflaeche(gebaeude: GebaeudeAufnahmeClient ): boolean {
+export function auditWohnflaecheGroesserGesamtflaeche(gebaeude: AufnahmeClient ): boolean {
 	if (gebaeude.flaeche && gebaeude.nutzflaeche){
         return (gebaeude.flaeche > gebaeude.nutzflaeche && !hidden.has(AuditType.WOHNFLAECHE_GROESSER_GESAMTFLAECHE));
     }

src/components/Verbrauchsausweis/audits/ZeitraumAktuell.ts

@@ -1,7 +1,7 @@
-import { GebaeudeClient, VerbrauchsausweisWohnenClient } from "#components/Ausweis/types.js";
+import { ObjektClient, VerbrauchsausweisWohnenClient } from "#components/Ausweis/types.js";
 import { AuditType, hidden } from "./hidden.js";
 
-export function auditZeitraumAktuell(ausweis: VerbrauchsausweisWohnenClient, gebaeude: GebaeudeClient): boolean {
+export function auditZeitraumAktuell(ausweis: VerbrauchsausweisWohnenClient, gebaeude: ObjektClient): boolean {
 	if (hidden.has(AuditType.ZEITRAUM_AKTUELL)) {
 		return false;
 	}

src/components/Verbrauchsausweis/audits/hidden.ts

@@ -10,5 +10,6 @@ export enum AuditType {
 	WARM_WASSER,
 	LEER_STAND,
 	END_ENERGIE,
-	WOHNFLAECHE_GROESSER_GESAMTFLAECHE
+	WOHNFLAECHE_GROESSER_GESAMTFLAECHE,
+	PLZ_NICHT_ERKANNT
 }

src/components/design/footer/ORG_Footer.astro

@@ -1,8 +0,0 @@
----
-const currentYear = new Date().getFullYear();
----
-
-<div class="flex flex-row justify-between px-4 items-center bg-primary py-2 mt-auto">
-	<a class="text-white font-medium text-lg" href="/impressum">Impressum und Datenschutz</a>
-	<a class="text-white font-medium text-lg" href="/">© {currentYear} IB Cornelsen Hamburg.</a>
-</div>

src/components/design/header/AusweisHeader.astro

@@ -1,5 +1,5 @@
 ---
-import HeaderLogin from "#header/HeaderLogin.svelte";
+import HeaderLogin from "#components/design/header/HeaderLogin.svelte";
 ---
 
 <header id="header">

src/components/design/header/Header.astro

@@ -1,5 +1,5 @@
 ---
-import HeaderLogin from "#header/HeaderLogin.svelte";
+import HeaderLogin from "#components/design/header/HeaderLogin.svelte";
 ---
 
 <header id="header">

src/components/design/header/HeaderLogin.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { loginClient } from "#lib/login";
+	import { loginClient } from "#lib/login.js";
 	import { CrossCircled } from "radix-svelte-icons";
 	import { fade } from "svelte/transition";
 

src/components/design/header/ORG_Header.astro

@@ -1,67 +0,0 @@
----
-import { validateAccessTokenServer } from "#server/lib/validateAccessToken";
-import ThemeController from "./ThemeController.svelte";
-
-const valid = await validateAccessTokenServer(Astro)
-
-const lightTheme = Astro.cookies.get("theme")?.value === "light";
----
-
-<header>
-	<a class="hidden md:block w-full h-48 bg-base-200" href="/">
-		<img
-			src="/images/header/header-bg.jpg"
-			class="w-full h-full object-cover"
-			alt="Hintergrund - Rollen Architektenpapier"
-		/>
-			<img
-				src="/images/header/logo-big.svg"
-				class="absolute top-4 right-0 w-[464px]"
-				alt="IBCornelsen - Logo"
-			/>
-			<h2
-				class="text-secondary font-semibold text-2xl absolute top-8 right-4"
-			>
-				Energieausweis online erstellen
-			</h2>
-			<h2
-				class="text-primary font-semibold text-xl absolute top-16 right-4"
-			>
-				Energieausweise nach aktueller GEG
-			</h2>
-	</a>
-
-	<div class="px-4 flex flex-row w-full md:justify-end items-center bg-primary">
-		<a
-			class="header-button hidden md:block"
-			href="/energieausweis-erstellen/verbrauchsausweis-erstellen"
-			>Energieausweis erstellen</a
-		>
-		<a class="header-button hidden md:block" href="/kontakt"
-			>Kontakt</a
-		>
-		<a class="header-button hidden md:block" href="/agb">AGB</a>
-			{
-				valid ? (
-					<a class="header-button" href="/dashboard">
-						Profil
-					</a>
-				) : (
-					<a class="header-button" href="/auth/login">
-						Login
-					</a>
-				)
-			}
-			<ThemeController lightTheme={lightTheme} client:load />
-			<a class="hamburger_menu"
-				><img src="/images/hamburger.png" width="22" alt="hamburger" /></a
-			>
-		</div>
-</header>
-
-
-<style>
-	.header-button {
-		@apply px-4 py-2 text-primary-content font-medium text-lg tracking-normal hover:bg-secondary h-full;
-	}
-</style>

src/components/design/sidebars/SidebarLeft.astro

@@ -1,7 +1,7 @@
 ---
-import CardNavigation from "#sidebarCards/cardNavigation.svelte";
-import CardPriceiInfo from "#sidebarCards/cardPriceiInfo.svelte";
-import CardProduktSidebar from "#sidebarCards/CardProduktSidebar.svelte";
+import NavigationCard from "#components/design/sidebars/cards/NavigationCard.svelte";
+import CardPriceiInfo from "#components/design/sidebars/cards/cardPriceiInfo.svelte";
+import CardProduktSidebar from "#components/design/sidebars/cards/CardProduktSidebar.svelte";
 
 import { PRICES } from "#lib/constants";
 ---
@@ -9,7 +9,7 @@ import { PRICES } from "#lib/constants";
 
 <div class="">
 
-<CardNavigation client:load/>
+<NavigationCard client:load/>
 
 <CardProduktSidebar art="Verbrauchsausweis Gewerbe" price={PRICES.VerbrauchsausweisGewerbe[0]}></CardProduktSidebar>
 <CardPriceiInfo />

src/components/design/sidebars/SidebarRight.astro

@@ -1,7 +1,7 @@
 ---
-import CardContact from "#sidebarCards/cardContact.svelte";
-import CardPriceiInfo from "#sidebarCards/cardPriceiInfo.svelte";
-import CardProduktSidebar from "#sidebarCards/CardProduktSidebar.svelte";
+import CardContact from "#components/design/sidebars/cards/ContactCard.svelte";
+import CardPriceiInfo from "#components/design/sidebars/cards/cardPriceiInfo.svelte";
+import CardProduktSidebar from "#components/design/sidebars/cards/CardProduktSidebar.svelte";
 
 import { PRICES } from "#lib/constants";
 ---

src/components/design/sidebars/cards/ContactCard.svelte

@@ -1,4 +1,4 @@
-<div id ="cardContact" class="box card">
+<div class="box card">
 	
 	<div class="grid grid-cols-[max-content,1fr] gap-x-2 border-b-[1px] pb-2 mb-4">
 		

src/components/design/sidebars/cards/LoginCard.svelte

@@ -23,7 +23,6 @@
 </script>
 
 <div
-	id="cardLogin"
 	class="box card"
 >
 	<div class="grid">

src/components/design/sidebars/cards/NavigationCard.svelte

@@ -0,0 +1,455 @@
+<script lang="ts">
+	let innerWidth: number;
+
+	function dropdown() {
+		if (innerWidth < 1024) {
+			const check_element = this.lastChild;
+
+			const rotate_list = document.querySelectorAll(".dd-symbol-clone");
+			const rotate_element = this.childNodes[0].children[0];
+
+			var first_check = check_element.classList.contains(
+				"show-dropdown-content"
+			);
+			const nodeList = document.querySelectorAll(".dropdown-content");
+
+			if (first_check == true) {
+				check_element.classList.remove("show-dropdown-content");
+				rotate_element.classList.toggle("rotate-symbol");
+			} else {
+				for (let i = 0; i < nodeList.length; i++) {
+					const element = nodeList[i];
+					element.classList.remove("show-dropdown-content");
+				}
+				for (let i = 0; i < rotate_list.length; i++) {
+					const element = rotate_list[i];
+					element.classList.remove("rotate-symbol");
+				}
+
+				check_element.classList.add("show-dropdown-content");
+				rotate_element.classList.add("rotate-symbol");
+			}
+		}
+	}
+
+	function hover() {
+		if (innerWidth > 1024) {
+			const check_element = this.firstChild.lastChild;
+			check_element.style.visibility = "visible";
+		}
+	}
+
+	function hoverout() {
+		if (innerWidth > 1024) {
+			const check_element = this.firstChild.lastChild;
+			check_element.style.visibility = "hidden";
+		}
+	}
+
+	function hamburger() {
+		const nodeList = document.querySelectorAll(".dropdown-content");
+		for (let i = 0; i < nodeList.length; i++) {
+			nodeList[i].classList.remove("show-dropdown-content");
+		}
+		var element = document.getElementById("cardNavigation");
+		element.classList.toggle("hidden");
+
+		const spans = this.children;
+		var first_check = spans[0].classList.contains("hamburger-swing-0");
+
+		if (first_check == true) {
+			for (let i = 0; i < spans.length; i++) {
+				spans[i].classList.remove("hamburger-swing-" + i);
+			}
+			const rotate_list = document.querySelectorAll(".dd-symbol");
+			for (let i = 0; i < rotate_list.length; i++) {
+				rotate_list[i].classList.remove("rotate-symbol");
+			}
+		} else {
+			for (let i = 0; i < spans.length; i++) {
+				spans[i].classList.add("hamburger-swing-" + i);
+			}
+		}
+	}
+</script>
+
+<svelte:window bind:innerWidth />
+
+<div
+	class="hamburger_menu py-1 px-2 bg-secondary
+            xs:px-4
+            lg:hidden"
+>
+	<div
+		id="hamburger"
+		on:click={hamburger}
+		on:keydown={hamburger}
+		class="cursor-pointer"
+	>
+		<span></span>
+		<span></span>
+		<span></span>
+	</div>
+</div>
+
+<nav
+	id="cardNavigation"
+	class="cardNavigation box hidden relative ring-0 md:ring-2 ring-primary/50 rounded-tr-none lg:block mb-0 lg:mb-5"
+>
+	<div class="nav-element bg-secondary/5 py-1 pl-2 text-xs font-bold">
+		Jetzt bestellen
+	</div>
+
+	<div class="nav-element">
+		<a class="no-dropdown nav-element-child" href="/welcher-energieausweis/"
+			>Welcher Energieausweis?</a
+		>
+	</div>
+
+	<!-- svelte-ignore a11y-mouse-events-have-key-events -->
+	<div
+		class="nav-element dropdown lg:dropdown-right"
+		on:click={dropdown}
+		on:keydown={dropdown}
+		on:mouseover={hover}
+		on:mouseleave={hoverout}
+	>
+		{#if innerWidth > 1023}
+			<a href={undefined} class="nav-element-child"
+				>Energieausweis erstellen<span class="dd-symbol-clone">❯</span
+				><span class="dd-symbol">❯</span></a
+			>
+		{:else}
+			<a href={undefined} class="nav-element-child"
+				>Energieausweis erstellen<span class="dd-symbol-clone">❯</span
+				><span class="dd-symbol">❯</span></a
+			>
+		{/if}
+
+		<ul class="dropdown-content energieasusweis-erstellen">
+			{#if innerWidth < 1023}
+				<li>
+					<a href="/energieausweis-erstellen"
+						>Energieausweis erstellen</a
+					>
+				</li>
+			{/if}
+			<li>
+				<a
+					href="/energieausweis-erstellen/verbrauchsausweis-wohngebaeude/"
+					>Verbrauchsausweis erstellen</a
+				>
+			</li>
+			<li>
+				<a href="/energieausweis-erstellen/bedarfsausweis-wohngebaeude/"
+					>Bedarfsausweis erstellen</a
+				>
+			</li>
+			<li>
+				<a href="/energieausweis-erstellen/verbrauchsausweis-gewerbe/"
+					>Verbrauchsausweis Gewerbe erstellen</a
+				>
+			</li>
+		</ul>
+	</div>
+
+	<!-- svelte-ignore a11y-mouse-events-have-key-events -->
+	<div
+		class="nav-element dropdown lg:dropdown-right"
+		on:click={dropdown}
+		on:keydown={dropdown}
+		on:mouseover={hover}
+		on:mouseleave={hoverout}
+	>
+		{#if innerWidth > 1023}
+			<a href={undefined} class="nav-element-child"
+				>Angebot anfragen<span class="dd-symbol-clone">❯</span><span
+					class="dd-symbol">❯</span
+				></a
+			>
+		{:else}
+			<a href={undefined} class="nav-element-child"
+				>Angebot anfragen<span class="dd-symbol-clone">❯</span><span
+					class="dd-symbol">❯</span
+				></a
+			>
+		{/if}
+
+		<ul class="dropdown-content angebot-anfragen">
+			{#if innerWidth < 1023}
+				<li>
+					<a href="/energieausweis-erstellen">Angebot anfragen</a>
+				</li>
+			{/if}
+			<li>
+				<a
+					href="/energieausweis-erstellen/verbrauchsausweis-wohngebaeude/"
+					>Bedarfsausweis Gewerbe anfragen</a
+				>
+			</li>
+			<li>
+				<a href="/energieausweis-erstellen/bedarfsausweis-wohngebaeude/"
+					>GEG Nachweis Wohnen anfragen</a
+				>
+			</li>
+			<li>
+				<a href="/energieausweis-erstellen/verbrauchsausweis-gewerbe/"
+					>GEG Nachweis Gewerbe anfragen</a
+				>
+			</li>
+		</ul>
+	</div>
+
+	<div class="nav-element">
+		<a class="no-dropdown nav-element-child" href="/sanierungsfahrplan"
+			>Sanierungsfahrplan (iSFP)</a
+		>
+	</div>
+
+	<div class="nav-element bg-secondary/5 py-1 pl-2 text-xs font-bold">
+		Produkte & Preise
+	</div>
+
+	<!-- svelte-ignore a11y-mouse-events-have-key-events -->
+	<div
+		class="nav-element dropdown lg:dropdown-right"
+		on:click={dropdown}
+		on:keydown={dropdown}
+		on:mouseover={hover}
+		on:mouseleave={hoverout}
+	>
+		<a href={undefined} class="nav-element-child"
+			>Verbrauchsausweis<span class="dd-symbol-clone">❯</span><span
+				class="dd-symbol">❯</span
+			></a
+		>
+		<ul class="dropdown-content verbrauchsausweis">
+			{#if innerWidth < 1023}
+				<li><a href="index">Verbrauchsausweis</a></li>
+			{/if}
+			<li><a href="index">Verbrauchsausweis Wohngebäude</a></li>
+			<li><a href="index">Verbrauchsausweis online erstellen</a></li>
+			<li><a href="index">Häufige Fragen zum Verbrauchsausweis</a></li>
+			<li>
+				<a href="index">Statistiken zum Verbrauchsausweis Wohngebäude</a
+				>
+			</li>
+			<li><a href="index">Verbrauchsausweis Gewerbe</a></li>
+			<li>
+				<a href="index">Verbrauchsausweis Gewerbe online erstellen</a>
+			</li>
+			<li>
+				<a href="index">Häufige Fragen zum Verbrauchsausweis Gewerbe</a>
+			</li>
+			<li>
+				<a href="index">Statistiken zum Verbrauchsausweis Gewerbe</a>
+			</li>
+		</ul>
+	</div>
+
+	<!-- svelte-ignore a11y-mouse-events-have-key-events -->
+	<div
+		class="nav-element dropdown lg:dropdown-right"
+		on:click={dropdown}
+		on:keydown={dropdown}
+		on:mouseover={hover}
+		on:mouseleave={hoverout}
+	>
+		<a href={undefined} class="nav-element-child"
+			>Bedarfsausweis<span class="dd-symbol-clone">❯</span><span
+				class="dd-symbol">❯</span
+			></a
+		>
+		<ul class="dropdown-content bedarfsausweis">
+			{#if innerWidth < 1023}
+				<li><a href="index">Bedarfsausweis</a></li>
+			{/if}
+			<li><a href="index">Bedarfsausweis Wohngebäude</a></li>
+			<li><a href="index">Bedarfsausweis online erstellen</a></li>
+			<li><a href="index">Häufige Fragen zum Bedarfsausweis</a></li>
+			<li>
+				<a href="index">Statistiken zum Bedarfsausweis Wohngebäude</a>
+			</li>
+			<li><a href="index">Bedarfsausweis Gewerbe</a></li>
+			<li><a href="index">Bedarfsausweis Gewerbe online erstellen</a></li>
+			<li>
+				<a href="index">Häufige Fragen zum Bedarfsausweis Gewerbe</a>
+			</li>
+			<li><a href="index">Statistiken zum Bedarfsausweis Gewerbe</a></li>
+		</ul>
+	</div>
+
+	<div class="nav-element">
+		<a class="no-dropdown nav-element-child" href="/sanierungsfahrplan"
+			>Sanierungsfahrplan</a
+		>
+	</div>
+
+	<!-- svelte-ignore a11y-mouse-events-have-key-events -->
+	<div
+		class="nav-element dropdown lg:dropdown-right"
+		on:click={dropdown}
+		on:keydown={dropdown}
+		on:mouseover={hover}
+		on:mouseleave={hoverout}
+	>
+		<a href={undefined} class="nav-element-child"
+			>Energieausweis<span class="dd-symbol-clone">❯</span><span
+				class="dd-symbol">❯</span
+			></a
+		>
+		<ul class="dropdown-content energieausweis">
+			{#if innerWidth < 1023}
+				<li><a href="index">Energieausweis</a></li>
+			{/if}
+			<li><a href="index">Energieausweis Pflicht</a></li>
+			<li><a href="index">Energieausweis Kosten</a></li>
+			<li><a href="index">Energieausweis Haus</a></li>
+		</ul>
+	</div>
+
+	<div class="nav-element">
+		<a
+			class="no-dropdown nav-element-child"
+			href="/energieausweis-aussteller">Energieberater finden</a
+		>
+	</div>
+
+	<div class="nav-element bg-secondary/5 py-1 pl-2 text-xs font-bold">
+		FAQ & Hilfe
+	</div>
+
+	<!-- svelte-ignore a11y-mouse-events-have-key-events -->
+	<div
+		class="nav-element dropdown lg:dropdown-right"
+		on:click={dropdown}
+		on:keydown={dropdown}
+		on:mouseover={hover}
+		on:mouseleave={hoverout}
+	>
+		{#if innerWidth > 1023}
+			<a href="/bestellprozess-energieausweis" class="nav-element-child"
+				>Bestellprozess Energieausweis<span class="dd-symbol-clone"
+					>❯</span
+				><span class="dd-symbol">❯</span></a
+			>
+		{:else}
+			<a href="/bestellprozess-energieausweis" class="nav-element-child"
+				>Bestellprozess Energieausweis<span class="dd-symbol-clone"
+					>❯</span
+				><span class="dd-symbol">❯</span></a
+			>
+		{/if}
+
+		<ul class="dropdown-content bestellprozess-energieausweis">
+			{#if innerWidth < 1023}
+				<li>
+					<a href="/bestellprozess-energieausweis"
+						>Bestellprozess Energieausweis</a
+					>
+				</li>
+			{/if}
+			<li>
+				<a
+					href="/bestellprozess-energieausweis/merkblatt-verbrauchsausweis-wohnen/"
+					>Merkblatt Verbrauchsausweis Wohnen</a
+				>
+			</li>
+			<li>
+				<a href="/energieausweis-erstellen/bedarfsausweis-wohngebaeude/"
+					>Merkblatt Bedarfsausweis Wohnen</a
+				>
+			</li>
+			<li>
+				<a href="/energieausweis-erstellen/verbrauchsausweis-gewerbe/"
+					>Merkblatt Verbrauchsausweis Gewerbe</a
+				>
+			</li>
+		</ul>
+	</div>
+
+	<div class="nav-element">
+		<a class="no-dropdown nav-element-child" href="/geg/"
+			>Gebäudeenergiegesetz (GEG)</a
+		>
+	</div>
+
+	<div class="nav-element">
+		<a class="no-dropdown nav-element-child" href="/enev-zusammenfassung/"
+			>EnEV Zusammenfassung - Archiv</a
+		>
+	</div>
+
+	<div class="nav-element">
+		<a class="no-dropdown nav-element-child" href="/faq/">FAQ</a>
+	</div>
+
+	<div class="nav-element">
+		<a class="no-dropdown nav-element-child" href="/glossar/">Glossar</a>
+	</div>
+
+	<div class="nav-element">
+		<a class="no-dropdown nav-element-child" href="/kundenbewertungen/"
+			>Kundenbewertungen</a
+		>
+	</div>
+	<div class="nav-element">
+		<a
+			class="no-dropdown nav-element-child lg:!rounded-b-lg xl:!rounded-b-xl"
+			href="/fuer-entwickler/">Für Entwickler</a
+		>
+	</div>
+</nav>
+
+<style lang="scss">
+	.dd-symbol::before {
+		content: "❯";
+		font-size: 0.95rem;
+		position: absolute;
+		top: 0px;
+		left: -7px;
+		animation-name: flim;
+		animation-duration: 2s;
+		animation-iteration-count: infinite;
+	}
+
+	.dd-symbol {
+		visibility: hidden;
+	}
+
+	.dd-symbol::after {
+		content: "❯";
+		font-size: 0.95rem;
+		position: absolute;
+		top: 0px;
+		right: -7px;
+		animation-name: flim;
+		animation-duration: 2s;
+		animation-delay: 1s;
+		animation-iteration-count: infinite;
+	}
+
+	@keyframes flim {
+		0% {
+			opacity: 0;
+		}
+		16.66% {
+			opacity: 0.25;
+		}
+		33.32% {
+			opacity: 0.5;
+		}
+		49.98% {
+			opacity: 0.75;
+		}
+		66.64% {
+			opacity: 0.5;
+		}
+		83.33% {
+			opacity: 0.25;
+		}
+		100% {
+			opacity: 0;
+		}
+	}
+</style>

src/components/design/sidebars/cards/cardNavigation.svelte

@@ -1,286 +0,0 @@
-<script>
-
-let innerWidth
-
-function dropdown(){
-
-const innerWidth = window.innerWidth;
-if(innerWidth<1024){
-   
-    const check_element     = this.lastChild;
-    
-    const rotate_list       = document.querySelectorAll(".dd-symbol-clone");
-    const rotate_element    = this.childNodes[0].children[0];
-
-    var first_check = check_element.classList.contains("show-dropdown-content");
-    const nodeList = document.querySelectorAll(".dropdown-content");
-    
-    if(first_check == true){
-    check_element.classList.remove("show-dropdown-content");
-    rotate_element.classList.toggle("rotate-symbol");
-    
-    }else{
-      for (let i = 0; i < nodeList.length; i++) {
-        const element = nodeList[i];
-        element.classList.remove("show-dropdown-content");
-        
-      }
-      for (let i = 0; i < rotate_list.length; i++) {
-        const element = rotate_list[i];
-        element.classList.remove("rotate-symbol");
-      }
-
-    check_element.classList.add("show-dropdown-content");
-    rotate_element.classList.add("rotate-symbol");
-    }
-  }
-
-}
-
-function hover(){
-const innerWidth = window.innerWidth;
-if(innerWidth>1024){
-    const check_element     = this.firstChild.lastChild;
-    check_element.style.visibility = "visible";
-  }
-}
-
-function hoverout(){
-const innerWidth = window.innerWidth;
-if(innerWidth>1024){
-    const check_element     = this.firstChild.lastChild;
-    check_element.style.visibility = "hidden";
-  }
-}
-
-  function hamburger(){
-    const nodeList = document.querySelectorAll(".dropdown-content");
-    for (let i = 0; i < nodeList.length; i++) {
-    nodeList[i].classList.remove("show-dropdown-content");}
-    var element = document.getElementById("cardNavigation");
-    element.classList.toggle("hidden");
-
-    const spans = this.children;
-    var first_check = spans[0].classList.contains("hamburger-swing-0");
-    
-    if(first_check == true){
-      for (let i = 0; i < spans.length; i++)
-      {spans[i].classList.remove("hamburger-swing-"+i);} 
-      const rotate_list     = document.querySelectorAll(".dd-symbol");
-      for (let i = 0; i < rotate_list.length; i++)
-      {rotate_list[i].classList.remove("rotate-symbol");}     
-      }else{
-      for (let i = 0; i < spans.length; i++)
-      {spans[i].classList.add("hamburger-swing-"+i);} }
-}
-</script>
-
-<svelte:window bind:innerWidth />
-
-
-<div class="hamburger_menu py-1 px-2 bg-secondary
-            xs:px-4
-            lg:hidden">
-
-              <div id="hamburger" on:click={hamburger} on:keydown={hamburger} class="cursor-pointer">
-                <span></span>
-                <span></span>
-                <span></span>
-              </div>
-</div>
-
-
-
-<nav id="cardNavigation" class="cardNavigation box hidden relative ring-0 md:ring-2 ring-primary/50 rounded-tr-none lg:block mb-0 lg:mb-5"> 
-
-  <div class="nav-element bg-secondary/5 py-1 pl-2 text-xs font-bold">Jetzt bestellen</div>
-
-  <div class="nav-element">
-    <a class="no-dropdown nav-element-child" href="/welcher-energieausweis/">Welcher Energieausweis?</a>
-  </div>
-
-  <!-- svelte-ignore a11y-mouse-events-have-key-events -->
-  <div class="nav-element dropdown lg:dropdown-right" on:click={dropdown} on:keydown={dropdown} on:mouseover={hover} on:mouseleave={hoverout}>
-    {#if innerWidth > 1023}
-    <a href={undefined} class="nav-element-child" >Energieausweis erstellen<span class="dd-symbol-clone">❯</span><span class="dd-symbol">❯</span></a>
-    {:else}
-    <a href={undefined} class="nav-element-child">Energieausweis erstellen<span class="dd-symbol-clone">❯</span><span class="dd-symbol">❯</span></a>
-    {/if}
-    
-    <ul class="dropdown-content energieasusweis-erstellen">
-      {#if innerWidth < 1023}
-      <li><a href="/energieausweis-erstellen">Energieausweis erstellen</a></li>
-      {/if}
-      <li><a href="/energieausweis-erstellen/verbrauchsausweis-wohngebaeude/">Verbrauchsausweis erstellen</a></li>
-      <li><a href="/energieausweis-erstellen/bedarfsausweis-wohngebaeude/">Bedarfsausweis erstellen</a></li>
-      <li><a href="/energieausweis-erstellen/verbrauchsausweis-gewerbe/">Verbrauchsausweis Gewerbe erstellen</a></li>
-    </ul>
-  </div>
-
-  <!-- svelte-ignore a11y-mouse-events-have-key-events -->
-  <div class="nav-element dropdown lg:dropdown-right" on:click={dropdown} on:keydown={dropdown} on:mouseover={hover} on:mouseleave={hoverout}>
-    {#if innerWidth > 1023}
-    <a href={undefined} class="nav-element-child" >Angebot anfragen<span class="dd-symbol-clone">❯</span><span class="dd-symbol">❯</span></a>
-    {:else}
-    <a href={undefined} class="nav-element-child">Angebot anfragen<span class="dd-symbol-clone">❯</span><span class="dd-symbol">❯</span></a>
-    {/if}
-    
-    <ul class="dropdown-content angebot-anfragen">
-      {#if innerWidth < 1023}
-      <li><a href="/energieausweis-erstellen">Angebot anfragen</a></li>
-      {/if}
-      <li><a href="/energieausweis-erstellen/verbrauchsausweis-wohngebaeude/">Bedarfsausweis Gewerbe anfragen</a></li>
-      <li><a href="/energieausweis-erstellen/bedarfsausweis-wohngebaeude/">GEG Nachweis Wohnen anfragen</a></li>
-      <li><a href="/energieausweis-erstellen/verbrauchsausweis-gewerbe/">GEG Nachweis Gewerbe anfragen</a></li>
-    </ul>
-  </div>
-
-  <div class="nav-element">
-    <a class="no-dropdown nav-element-child" href="/sanierungsfahrplan">Sanierungsfahrplan (iSFP)</a>
-    </div>
-
-  <div class="nav-element bg-secondary/5 py-1 pl-2 text-xs font-bold">Produkte & Preise</div>
-
-<!-- svelte-ignore a11y-mouse-events-have-key-events -->
-<div class="nav-element dropdown lg:dropdown-right" on:click={dropdown} on:keydown={dropdown} on:mouseover={hover} on:mouseleave={hoverout}>
-  <a href={undefined} class="nav-element-child">Verbrauchsausweis<span class="dd-symbol-clone">❯</span><span class="dd-symbol">❯</span></a>
-    <ul class="dropdown-content verbrauchsausweis">
-      {#if innerWidth < 1023}
-      <li><a href="index">Verbrauchsausweis</a></li>
-      {/if}
-      <li><a href="index">Verbrauchsausweis Wohngebäude</a></li>
-      <li><a href="index">Verbrauchsausweis online erstellen</a></li>
-      <li><a href="index">Häufige Fragen zum Verbrauchsausweis</a></li>
-      <li><a href="index">Statistiken zum Verbrauchsausweis Wohngebäude</a></li>
-      <li><a href="index">Verbrauchsausweis Gewerbe</a></li>
-      <li><a href="index">Verbrauchsausweis Gewerbe online erstellen</a></li>
-      <li><a href="index">Häufige Fragen zum Verbrauchsausweis Gewerbe</a></li>
-      <li><a href="index">Statistiken zum Verbrauchsausweis Gewerbe</a></li>
-  </div>
-
-<!-- svelte-ignore a11y-mouse-events-have-key-events -->
-<div class="nav-element dropdown lg:dropdown-right" on:click={dropdown} on:keydown={dropdown} on:mouseover={hover} on:mouseleave={hoverout}>
-  <a href={undefined} class="nav-element-child">Bedarfsausweis<span class="dd-symbol-clone">❯</span><span class="dd-symbol">❯</span></a>
-    <ul class="dropdown-content bedarfsausweis">
-      {#if innerWidth < 1023}
-      <li><a href="index">Bedarfsausweis</a></li>
-      {/if}
-      <li><a href="index">Bedarfsausweis Wohngebäude</a></li>
-      <li><a href="index">Bedarfsausweis online erstellen</a></li>
-      <li><a href="index">Häufige Fragen zum Bedarfsausweis</a></li>
-      <li><a href="index">Statistiken zum Bedarfsausweis Wohngebäude</a></li>
-      <li><a href="index">Bedarfsausweis Gewerbe</a></li>
-      <li><a href="index">Bedarfsausweis Gewerbe online erstellen</a></li>
-      <li><a href="index">Häufige Fragen zum Bedarfsausweis Gewerbe</a></li>
-      <li><a href="index">Statistiken zum Bedarfsausweis Gewerbe</a></li>
-    </ul>
-</div>
-
-<div class="nav-element">
-  <a class="no-dropdown nav-element-child" href="/sanierungsfahrplan">Sanierungsfahrplan</a>
-  </div>
-
-<!-- svelte-ignore a11y-mouse-events-have-key-events -->
-<div class="nav-element dropdown lg:dropdown-right" on:click={dropdown} on:keydown={dropdown} on:mouseover={hover} on:mouseleave={hoverout}>
-  <a href={undefined} class="nav-element-child">Energieausweis<span class="dd-symbol-clone">❯</span><span class="dd-symbol">❯</span></a>
-  <ul class="dropdown-content energieausweis">
-    {#if innerWidth < 1023}
-    <li><a href="index">Energieausweis</a></li>
-    {/if}
-    <li><a href="index">Energieausweis Pflicht</a></li>
-    <li><a href="index">Energieausweis Kosten</a></li>
-    <li><a href="index">Energieausweis Haus</a></li>
-  </ul>
-</div>
-
-<div class="nav-element">
-  <a class="no-dropdown nav-element-child" href="/energieausweis-aussteller">Energieberater finden</a>
-  </div>
-
-<div class="nav-element bg-secondary/5 py-1 pl-2 text-xs font-bold">FAQ & Hilfe</div>
-
- <!-- svelte-ignore a11y-mouse-events-have-key-events -->
- <div class="nav-element dropdown lg:dropdown-right" on:click={dropdown} on:keydown={dropdown} on:mouseover={hover} on:mouseleave={hoverout}>
-  {#if innerWidth > 1023}
-  <a href="/bestellprozess-energieausweis" class="nav-element-child" >Bestellprozess Energieausweis<span class="dd-symbol-clone">❯</span><span class="dd-symbol">❯</span></a>
-  {:else}
-  <a href="/bestellprozess-energieausweis" class="nav-element-child">Bestellprozess Energieausweis<span class="dd-symbol-clone">❯</span><span class="dd-symbol">❯</span></a>
-  {/if}
-
-<ul class="dropdown-content bestellprozess-energieausweis">
-  {#if innerWidth < 1023}
-  <li><a href="/bestellprozess-energieausweis">Bestellprozess Energieausweis</a></li>
-  {/if}
-  <li><a href="/bestellprozess-energieausweis/merkblatt-verbrauchsausweis-wohnen/">Merkblatt Verbrauchsausweis Wohnen</a></li>
-  <li><a href="/energieausweis-erstellen/bedarfsausweis-wohngebaeude/">Merkblatt Bedarfsausweis Wohnen</a></li>
-  <li><a href="/energieausweis-erstellen/verbrauchsausweis-gewerbe/">Merkblatt Verbrauchsausweis Gewerbe</a></li>
-</ul>
-</div>
-
-<div class="nav-element">
-  <a class="no-dropdown nav-element-child" href="/geg/">Gebäudeenergiegesetz (GEG)</a>
-  </div>
-
-<div class="nav-element">
-<a class="no-dropdown nav-element-child" href="/enev-zusammenfassung/">EnEV Zusammenfassung - Archiv</a>
-</div>
-
-<div class="nav-element">
-  <a class="no-dropdown nav-element-child" href="/faq/">FAQ</a>
-  </div>
-
-<div class="nav-element">
-  <a class="no-dropdown nav-element-child" href="/glossar/">Glossar</a>
-  </div>
-
-<div class="nav-element">
-<a class="no-dropdown nav-element-child" href="/kundenbewertungen/">Kundenbewertungen</a>
-</div>
-<div class="nav-element">
-  <a class="no-dropdown nav-element-child lg:!rounded-b-lg xl:!rounded-b-xl"href="/fuer-entwickler/">Für Entwickler</a>
-</div>
-
-
-</nav>
-
-
-<style lang="scss">
-
-.dd-symbol::before{
-  content:'❯';
-  font-size:0.95rem;
-  position:absolute;
-  top:0px;
-  left:-7px;
-  animation-name: flim;
-  animation-duration: 2s;
-  animation-iteration-count: infinite;
-}
-
-.dd-symbol{visibility: hidden;}
-
-.dd-symbol::after{
-  content:'❯';
-  font-size:0.95rem;
-  position:absolute;
-  top:0px;
-  right:-7px;
-  animation-name: flim;
-  animation-duration: 2s;
-  animation-delay: 1s;
-  animation-iteration-count: infinite;
-}
-
-  @keyframes flim{
-  0%   {opacity: 0;}
-  16.66%  {opacity: 0.25;}
-  33.32%  {opacity: 0.5;}
-  49.98%  {opacity: 0.75;}
-  66.64% {opacity: 0.5;}
-  83.33% {opacity: 0.25;}
-  100% {opacity: 0;}
-}
-
-
-
-</style>

src/components/design/sidebars/left/ORG_SidebarLeft.astro

@@ -1,253 +0,0 @@
-<div class="flex flex-col gap-6">
-	<nav>
-		<div class="nav-card">
-			<div class="card-menu-option dropdown dropdown-right dropdown-hover">
-				<a href="/energieausweis-erstellen/verbrauchsausweis-wohnen"
-					>Energieausweis erstellen</a
-				>
-				<div class="dropdown-content">
-					<a href="/energieausweis-erstellen/verbrauchsausweis-wohnen">Verbrauchsausweis erstellen</a>
-					<a href="/bedarfsausweis">Bedarfsausweis erstellen</a>
-					<a href="/energieausweis-erstellen/verbrauchsausweis-gewerbe"
-						>Verbrauchsausweis Gewerbe erstellen</a
-					>
-					<a href="/bedarfsausweis-gewerbe"
-						>Bedarfsausweis Gewerbe anfragen</a
-					>
-				</div>
-			</div>
-			<a class="card-menu-option" href="/welcher-energieausweis"
-				>Welcher Energieausweis ?</a
-			>
-			<div class="card-menu-option dropdown dropdown-right dropdown-hover">
-				<a href="/energieausweis-erstellen/verbrauchsausweis-wohnen">Verbrauchsausweis</a>
-				<div class="dropdown-content">
-					<a
-						href="/energieausweis-erstellen/verbrauchsausweis-wohnenverbrauchsausweis-wohngebaeude"
-						>Verbrauchsausweis Wohngebäude</a
-					>
-					<a
-						href="/energieausweis-erstellen/verbrauchsausweis-erstellen"
-						>Verbrauchsausweis online erstellen</a
-					>
-					<a
-						href="/energieausweis-erstellen/verbrauchsausweis-wohnenhaeufige-fragen-zum-verbrauchsausweis"
-						>Häufige Fragen zum Verbrauchsausweis</a
-					>
-					<a
-						href="/energieausweis-erstellen/verbrauchsausweis-wohnenstatistiken-zum-verbrauchsausweis"
-						>Statistiken zum Verbrauchsausweis Wohngebäude</a
-					>
-					<hr class="nav-hr" />
-					<a href="/energieausweis-erstellen/verbrauchsausweis-wohnenverbrauchsausweis-gewerbe"
-						>Verbrauchsausweis Gewerbe</a
-					>
-					<a
-						href="/energieausweis-erstellen/verbrauchsausweis-gewerbe-erstellen"
-						>Verbrauchsausweis Gewerbe online erstellen</a
-					>
-					<a
-						href="/energieausweis-erstellen/verbrauchsausweis-wohnenhaeufige-fragen-zum-verbrauchsausweis-gewerbe"
-						>Häufige Fragen zum Verbrauchsausweis Gewerbe</a
-					>
-					<a
-						href="/energieausweis-erstellen/verbrauchsausweis-wohnenstatistiken-zum-verbrauchsausweis-gewerbe"
-						>Statistiken zum Verbrauchsausweis Gewerbe</a
-					>
-				</div>
-			</div>
-			<div class="card-menu-option dropdown dropdown-right dropdown-hover">
-				<a href="/bedarfsausweis/">Bedarfsausweis</a>
-				<div class="dropdown-content">
-					<a href="/bedarfsausweis/bedarfsausweis-wohngebaeude"
-						>Bedarfsausweis Wohngebäude</a
-					>
-					<a
-						href="/energieausweis-erstellen/bedarfsausweis-erstellen"
-						>Bedarfsausweis online erstellen</a
-					>
-					<a
-						href="/bedarfsausweis/haeufige-fragen-zum-bedarfsausweis"
-						>Häufige Fragen zum Bedarfsausweis</a
-					>
-					<a href="/bedarfsausweis/statistiken-zum-bedarfsausweis"
-						>Statistiken zum Bedarfsausweis Wohngebäude</a
-					>
-					<hr class="nav-hr" />
-					<a href="/bedarfsausweis/bedarfsausweis-gewerbe"
-						>Bedarfsausweis Gewerbe</a
-					>
-					<a
-						href="/energieausweis-erstellen/bedarfsausweis-gewerbe-anfragen"
-						>Bedarfsausweis Gewerbe anfragen</a
-					>
-					<a
-						href="/bedarfsausweis/haeufige-fragen-zum-bedarfsausweis-gewerbe"
-						>Häufige Fragen zum Bedarfsausweis Gewerbe</a
-					>
-				</div>
-			</div>
-			<div class="card-menu-option dropdown dropdown-right dropdown-hover">
-				<a href="/">Energieausweis</a>
-				<div class="dropdown-content">
-					<a href="/energieausweis-pflicht"
-						>Energieausweis Pflicht</a
-					>
-					<a href="/energieausweis-kosten"
-						>Energieausweis Kosten</a
-					>
-					<a href="/energieausweis-haus">Energieausweis Haus</a>
-				</div>
-			</div>
-			<a class="card-menu-option" href="/enev-zusammenfassung"
-				>EnEV Zusammenfassung - Archiv</a
-			>
-			<a class="card-menu-option" href="/energieausweis-aussteller"
-				>Energieausweis Aussteller</a
-			>
-			<a class="card-menu-option" href="/kundenbewertungen"
-				>Kundenbewertungen</a
-			>
-			<a class="card-menu-option" href="/faq">FAQ</a>
-			<a class="card-menu-option" href="/developers">Für Entwickler</a>
-		</div>
-	</nav>
-
-	<div class="infoCard">
-		<div class="flex-column align-center">
-			<img
-				src="/images/right-sidebar/ing-niedersachsen.png"
-				alt="Mitglied Ingenieurkammer Niedersachen"
-				style="height: 150px;margin-bottom: 25px; width: auto;"
-			/>
-			<img
-				src="/images/right-sidebar/mitglied-haendlerbund.png"
-				alt="Mitglied im Händlerbund"
-				style="width:auto;
-"
-			/>
-		</div>
-	</div>
-	<div class="infoCard">
-		<div class="heading1">Was wird der Energieausweis kosten?</div>
-		<hr style="margin-bottom:15px;" />
-		<ul>
-			<li>Verbrauchsausweis Wohngebäude<br />45€ inkl. MwSt.<hr /></li>
-			<li>Bedarfsausweis Wohngebäude<br />75€ inkl. MwSt.<hr /></li>
-			<li>Verbrauchsausweis Gewerbe<br />65€ inkl. MwSt.<hr /></li>
-			<li>Bedarfsausweis Gewerbe<br />ab 300€ inkl. MwSt.<hr /></li>
-			<li>EnEV-Nachweis Wohngebäude<br />ab 400€ inkl. MwSt.<hr /></li>
-			<li>EnEV-Nachweis Gewerbe<br />ab 450€ inkl. MwSt.</li>
-		</ul>
-		<hr />
-	</div>
-	<div class="infoCard">
-		<div class="heading1">Zahlungsoptionen</div>
-		<hr style="margin-bottom:15px;" />
-		<p style="text-align:center; font-size: 1.1em;">
-			Ihre online Zahlungen werden sicher über eine SSL Verschlüsselung
-			abgewickelt.
-		</p>
-		<hr style="margin-bottom:15px;" />
-		<div class="align-center">
-			<img
-				src="/images/left-sidebar/payment.png"
-				alt="Bezahloptionen - Paypal, Visa, Kreditkarte..."
-			/>
-		</div>
-	</div>
-</div>
-
-<style>
-	.nav-card {
-		@apply rounded-lg w-full flex flex-col shadow-md border border-base-300;
-	}
-
-	.infoCard {
-		@apply bg-base-200 border-base-300 rounded-lg border p-4 shadow-md;
-	}
-
-	.dropdown-content > .card-menu-option,
-	.dropdown-content > a {
-		@apply block w-[350px] bg-base-200 border text-lg px-4 py-2 border-base-300;
-	}
-
-	.dropdown-content > a:first-child {
-		@apply rounded-tr-lg rounded-tl-lg;
-	}
-
-	.dropdown-content > a:last-child {
-		@apply rounded-br-lg rounded-bl-lg;
-	}
-
-	.dropdown-content > .card-menu-option:hover,
-	.dropdown-content > a:hover {
-		background-color: #444f94 !important;
-		color: #fff !important;
-	}
-
-	.dropdown-content {
-		@apply absolute bg-base-200 left-full top-[-1px] shadow-md z-10 hidden rounded-lg;
-	}
-
-	.dropdown:hover > .dropdown-content {
-		@apply block;
-	}
-
-	.dropdown::after {
-		content: "\276F";
-		position: absolute;
-		top: 20px;
-		right: 10px;
-		font-size: 14px;
-		font-weight: 300;
-		transform: translate(0, -50%) rotate(0deg);
-		transition: transform 0.25s;
-	}
-
-	.dropdown {
-		position: relative;
-	}
-
-	.dropdown-content:hover {
-		display: none;
-	}
-
-	.dropdown::after {
-		content: "\276F";
-		font-size: 14px;
-		font-weight: 300;
-		position: absolute;
-		right: 10px;
-		top: 20px;
-		transform: translate(0, -50%) rotate(0deg);
-		transition: transform 0.25s;
-	}
-
-	.card-menu-option {
-		@apply bg-base-200 border-b border-base-300 text-base-content text-lg py-2.5 px-5 select-none no-underline w-auto cursor-pointer;
-	}
-
-	.nav-card .card-menu-option:first-child {
-		@apply rounded-tr-lg rounded-tl-lg;
-	}
-
-	.nav-card .card-menu-option:last-child {
-		@apply rounded-br-lg rounded-bl-lg;
-	}
-
-	.nav-card .card-menu-option a {
-		@apply text-base-content;
-		text-decoration: none;
-	}
-
-	.nav-card .card-menu-option:hover > a {
-		color: #fff;
-	}
-
-	.nav-card .card-menu-option:hover {
-		background-color: #ff7d26;
-		color: #fff;
-		text-decoration: none;
-	}
-</style>

src/components/design/sidebars/right/ORG_SidebarRight.astro

@@ -1,144 +0,0 @@
----
-import { validateAccessTokenServer } from "#server/lib/validateAccessToken";
-import SidebarWidgetLogin from "./SidebarWidgetLogin.svelte";
-import SidebarWidgetProfile from "./SidebarWidgetProfile.svelte"
-
-const loggedin = await validateAccessTokenServer(Astro)
----
-
-<div class="flex flex-col gap-4">
-	{ !loggedin ? 
-		<SidebarWidgetLogin client:load></SidebarWidgetLogin> : <SidebarWidgetProfile></SidebarWidgetProfile>}
-
-	<div class="infoCard">
-		<h2 style="font-weight: bold; font-size: 1.2em; color: #3A4AB5;">
-			Rufen Sie uns an<br /> Wir sind gerne für Sie da
-		</h2>
-		<hr style="margin-bottom:15px;" />
-		<div class="flex-row justify-between">
-			<div class="flex-column align-left">
-				<p>Telefonische Beratung unter</p>
-				<h2 style="font-weight: bold; font-size: 1.2em; color: #3A4AB5;">
-					<a href="tel:+4940209339850">040 / 209 339 850</a>
-				</h2>
-			</div>
-			<img
-				src="/images/right-sidebar/telefon-1.png"
-				style="width:70px; height: 73px;"
-				alt="Telefon - Rufen sie uns an."
-			/>
-		</div>
-	</div>
-
-	<div class="infoCard">
-		<h2 style="font-weight: bold; font-size: 1.2em; color: #3A4AB5;">
-			Bitte bewerten Sie uns!
-		</h2>
-		<hr style="margin-bottom:15px;" />
-		<div
-			class="review-widget_net"
-			data-uuid="d908c994-f1f2-4ab6-bad1-b2d3538086e7"
-			data-template="7"
-			data-filter=""
-			data-lang="de"
-			data-theme="light"
-		>
-			<a href="https://www.review-widget.net/" target="_blank" rel="noopener"
-				><img
-					src="https://grwapi.net/assets/spinner/spin.svg"
-					title="Google Review Widget"
-					alt="Review Widget"
-				/></a>
-		</div><script async src="https://grwapi.net/widget.min.js"></script>
-		<hr />
-	</div>
-
-	<div class="infoCard">
-		<h2 style="font-weight: bold; font-size: 1.2em; color: #3A4AB5;">
-			Verbrauchsausweis für Wohngebäude
-		</h2>
-		<hr style="margin-bottom:15px;" />
-		<div class="flex-column align-center">
-			<img
-				src="/images/right-sidebar/wohnhaus-1.png"
-				alt="Verbrauchsausweis ab 45€ für Wohngebäude."
-			/>
-			<a
-				href="/energieausweis-erstellen/verbrauchsausweis-erstellen"
-				class="large-button">Jetzt Verbrauchsausweis erstellen</a
-			>
-		</div>
-	</div>
-
-	<div class="infoCard">
-		<h2 style="font-weight: bold; font-size: 1.2em; color: #3A4AB5;">
-			Welche Häuser benötigen einen Energieausweis?
-		</h2>
-		<hr style="margin-bottom:15px;" />
-		<ul>
-			<li>Wohngebäude &gt; 50m² mit dauerhaftem Aufenthalt<hr /></li>
-			<li>Nichtwohngebäude &gt; 50m² mit dauerhaftem Aufenthalt<hr /></li>
-			<li>Beheizte Gebäude &gt; 50m²<hr /></li>
-			<li>Neubauten<hr /></li>
-			<li>Anbauten &gt; 50 m²<hr /></li>
-			<li>Sanierung mit Austausch der Heizungsanlage</li>
-		</ul>
-		<hr />
-	</div>
-	<div class="infoCard">
-		<h2 style="font-weight: bold; font-size: 1.2em; color: #3A4AB5;">
-			Bedarfsausweis für Wohngebäude
-		</h2>
-		<hr style="margin-bottom:15px;" />
-		<div class="flex-column align-center">
-			<img
-				src="/images/right-sidebar/wohnhaus-ba-1.png"
-				alt="Bedarfsausweis ab 75€ für Wohngebäude"
-			/>
-			<a
-				href="/energieausweis-erstellen/bedarfsausweis-erstellen"
-				class="large-button">Jetzt Bedarfsausweis erstellen</a
-			>
-		</div>
-	</div>
-	<div class="infoCard">
-		<h2 style="font-weight: bold; font-size: 1.2em; color: #3A4AB5;">
-			Welcher Energieausweis ist der richtige?
-		</h2>
-		<hr style="margin-bottom:15px;" />
-		<ul>
-			<li>
-				Verbrauchsausweis bei Vermietung, Verkauf und Aushang (Baujahr nach 1977
-				bzw. saniert).<hr />
-			</li>
-			<li>
-				Bedarfsausweis bei Neubau, Sanierung, Erweiterung und
-				Fördermittelantrag.
-			</li>
-		</ul>
-		<hr />
-	</div>
-	<div class="infoCard">
-		<h2 style="font-weight: bold; font-size: 1.2em; color: #3A4AB5;">
-			Verbrauchsausweis für Gewerbe
-		</h2>
-		<hr style="margin-bottom:15px;" />
-		<div class="flex-column align-center">
-			<img
-				src="/images/right-sidebar/gewerbe-1.png"
-				alt="Verbrauchsausweis Gewerbe für 65€"
-			/>
-			<a
-				href="/energieausweis-erstellen/verbrauchsausweis-gewerbe-erstellen"
-				class="large-button">Jetzt Verbrauchsausweis erstellen</a
-			>
-		</div>
-	</div>
-</div>
-
-
-<style>
-	.infoCard {
-		@apply bg-base-200 rounded-lg border border-base-300 p-4 shadow-md;
-	}
-</style>

src/components/design/sidebars/right/SidebarRight_1.astro

@@ -1,25 +0,0 @@
----
-import Login from "#sidebarCards/cardlogin_1.svelte";
-import Contact from "#sidebarCards/cardcontact.svelte";
-import Review from "#sidebarCards/cardreview.svelte";
-import VApromo from "#sidebarCards/cardVApromo.svelte";
-import VAGpromo from "#sidebarCards/cardVAGpromo.svelte";
-import BApromo from "#sidebarCards/cardBApromo.svelte";
-import BAGpromo from "#sidebarCards/cardBAGpromo.svelte";
----
-
-<div class="hidden
-            xl:flex xl:flex-col xl:grow
-            ">
-            
-    <Login client:load />
-    <Contact client:load />
-    <Review client:load />
-    <VApromo client:load />
-    <VAGpromo client:load />
-    <BApromo client:load />
-    <BAGpromo client:load />
-</div>
-
-
-</div>

src/components/labels/StromVerbrauchsHelpLabel.svelte

@@ -3,7 +3,7 @@
 
 	export let addYear: number;
 	export let heizquelle: number;
-	export let gebaeude_aufnahme_allgemein;
+	export let aufnahme;
 	export let ausweis;
 </script>