Merge remote-tracking branch 'origin/main' into Jens

.gitignore

@@ -30,5 +30,5 @@ bun.lockb
 public/fonts/
 
 *.Identifier
-
-src/lib/Berechnungen/BedarfsausweisWohnen/18599-Tabellenverfahren-Wohngebaeude-komplett-ocr.pdf
+
+src/lib/Berechnungen/BedarfsausweisWohnen/18599-Tabellenverfahren-Wohngebaeude-komplett-ocr.pdf

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"
     },
-  },
+  }
 });

cypress/e2e/VerbrauchsausweisWohnen/erstellen.cy.ts

@@ -1,282 +0,0 @@
-import fuelList from "#components/Ausweis/brennstoffListe";
-import { faker } from "@faker-js/faker";
-import { Enums } from "@ibcornelsen/database/client";
-import "cypress-file-upload"
-
-describe("Verbrauchsausweis erstellen Schritt 1", () => {
-	it("erstellt einen neuen Verbrauchsausweis Wohngebäude.", () => {
-		cy.visit("/energieausweis-erstellen/verbrauchsausweis-wohnen");
-
-		cy.wait(1000);
-
-		// Wir überprüfen, ob alle Ausstelgründe vorhanden sind, diese sollten genau so viele sein wie in der Datenbank vorhanden sind.
-		cy.get("input[name='ausstellgrund']")
-			.should("have.length", Object.values(Enums.Ausstellgrund).length)
-			.eq(
-				faker.number.int({
-					min: 0,
-					max: Object.values(Enums.Ausstellgrund).length - 1,
-				})
-			)
-			.check();
-
-		// Jetzt Füllen wir das Baujahr vom Gebäude aus.
-		cy.get("input[name='baujahr_gebaeude']")
-			.should("have.attr", "type", "number")
-			.type(
-				faker.number.int({ min: 1900, max: 2021 }).toString() +
-					"{enter}",
-				{ delay: 50 }
-			);
-
-		// Jetzt Füllen wir das Baujahr der Heizung aus.
-		cy.get("input[name='baujahr_heizung']")
-			.should("have.attr", "type", "number")
-			.type(
-				faker.number.int({ min: 1900, max: 2021 }).toString() +
-					"{enter}",
-				{ delay: 50 }
-			);
-
-		// Anzahl Einheiten
-		cy.get("input[name='einheiten']")
-			.should("have.attr", "type", "number")
-			.type(faker.number.int({ min: 1, max: 5 }).toString());
-
-		// Sanierungsstatus
-		cy.get("select[name='saniert']").select(
-			Math.random() > 0.5 ? "true" : "false"
-		);
-
-		// Adresse
-		cy.get("input[name='adresse']").type(faker.location.streetAddress());
-
-		// Postleitzahl
-		cy.get("input[name='plz']").type(
-			faker.location.zipCode({
-				format: "#####",
-			})
-		);
-
-		// TODO: Ort - Dieser wird aus der Datenbank abgefragt, wir müssen also warten, bis der Dropdown da ist.
-
-		// Flaeche
-		cy.get("input[name='flaeche']")
-			.should("have.attr", "type", "number")
-			.type(faker.number.int({ min: 50, max: 1000 }).toString());
-
-		// Nutzflaeche
-		cy.get("input[name='nutzflaeche']")
-			.should("have.attr", "type", "number")
-			.type(faker.number.int({ min: 50, max: 1000 }).toString());	
-
-		// Keller
-		cy.get("select[name='keller']").find("option:not([disabled])").should("have.length", Object.values(Enums.Heizungsstatus).length).parent().select(faker.number.int({
-			max: Object.values(Enums.Heizungsstatus).length,
-			min: 1
-		}));
-
-		// Dachgeschoss
-		cy.get("select[name='dachgeschoss']").find("option:not([disabled])").should("have.length", Object.values(Enums.Heizungsstatus).length).parent().select(faker.number.int({
-			max: Object.values(Enums.Heizungsstatus).length,
-			min: 1
-		}));
-
-		// Brennstoff und Einheit 1
-		const brennstoffKombo = fuelList[faker.number.int({ min: 0, max: fuelList.length - 1 })];
-
-		cy.get("select[name='brennstoff_1']").select(brennstoffKombo[0]);
-		cy.get("select[name='einheit_1']").select(brennstoffKombo[1]);
-
-		// Verbrauchszeitraum
-		cy.get("select[name='energieverbrauch_zeitraum_monat']").select(faker.number.int({ min: 1, max: 12 }).toString());
-		cy.get("select[name='energieverbrauch_zeitraum_jahr']").select(faker.number.int({ min: 2018, max: 2019 }).toString());
-
-		// Verbrauch
-		cy.get("input[name='verbrauch_1']").type(faker.number.int({ min: 4000, max: 15000 }).toString());
-		cy.get("input[name='verbrauch_2']").type(faker.number.int({ min: 4000, max: 15000 }).toString());
-		cy.get("input[name='verbrauch_3']").type(faker.number.int({ min: 4000, max: 15000 }).toString());
-
-		
-		const zusaetzlicheHeizquelle = Math.random() > 0.5;
-
-		if (zusaetzlicheHeizquelle) {
-			cy.get("input[name='zusaetzliche_heizquelle']").check();
-
-			// Brennstoff und Einheit 2
-			const brennstoffKombo2 = fuelList[faker.number.int({ min: 0, max: fuelList.length - 1 })];
-
-			cy.get("select[name='brennstoff_2']").select(brennstoffKombo2[0]);
-			cy.get("select[name='einheit_2']").select(brennstoffKombo2[1]);
-
-			// Verbrauch
-			cy.get("input[name='verbrauch_4']").type(faker.number.int({ min: 4000, max: 15000 }).toString());
-			cy.get("input[name='verbrauch_5']").type(faker.number.int({ min: 4000, max: 15000 }).toString());
-			cy.get("input[name='verbrauch_6']").type(faker.number.int({ min: 4000, max: 15000 }).toString());
-		}
-
-		// Warmwasser enthalten und bekannt
-		const warmwasserEnthalten = Math.random() > 0.5;
-		const anteilBekannt = Math.random() > 0.5;
-
-		if (warmwasserEnthalten) {
-			cy.get("input[name='warmwasser_enthalten']").check();			
-
-			if (anteilBekannt) {
-				// Der Anteil ist bekannt, wir müssen ihn also angeben.
-				cy.get("input[name='warmwasser_anteil_bekannt']").check();
-
-				cy.get("input[name='anteil_warmwasser_1']").type(faker.number.int({ min: 0, max: 50 }).toString());
-
-				if (zusaetzlicheHeizquelle) {
-					// Zusätzliche Heizquelle existiert, also müssen wir auch hier den Anteil angeben.
-					cy.get("input[name='anteil_warmwasser_2']").type(faker.number.int({ min: 0, max: 50 }).toString());
-				}
-			}
-		}
-
-		// Alternative Energieversorgungssysteme
-		if (Math.random() > 0.5) cy.get("input[name='alternative_heizung']").check();
-		if (Math.random() > 0.5) cy.get("input[name='alternative_warmwasser']").check();
-		if (Math.random() > 0.5) cy.get("input[name='alternative_lueftung']").check();
-		if (Math.random() > 0.5) cy.get("input[name='alternative_kuehlung']").check();
-
-		// Gebäudetyp
-		cy.get("select[name='gebaeudetyp']").then(($dropdown) => {
-			const options = $dropdown.find('option');
-			// Select the option at the random index
-			cy.get("select[name='gebaeudetyp']").select(options.eq(faker.number.int({ min: 1, max: options.length - 1 })).val() as string);
-		});
-
-		// Gebäudeteil
-		cy.get("select[name='gebaeudeteil']").then(($dropdown) => {
-			const options = $dropdown.find('option');
-			// Select the option at the random index
-			cy.get("select[name='gebaeudeteil']").select(options.eq(faker.number.int({ min: 1, max: options.length - 1 })).val() as string);
-		});
-
-		// Lüftung
-		cy.get("select[name='lueftung']").then(($dropdown) => {
-			const options = $dropdown.find('option');
-			// Select the option at the random index
-			cy.get("select[name='lueftung']").select(options.eq(faker.number.int({ min: 1, max: options.length - 1 })).val() as string);
-		});
-
-		// Kühlung
-		cy.get("select[name='kuehlung']").then(($dropdown) => {
-			const options = $dropdown.find('option');
-			// Select the option at the random index
-			cy.get("select[name='kuehlung']").select(options.eq(faker.number.int({ min: 1, max: options.length - 1 })).val() as string);
-		});
-
-		// Leerstand
-		cy.get("input[name='leerstand']").should("have.attr", "type", "number").type(faker.number.int({ min: 0, max: 30 }).toString());
-
-		// Heizungsanlage Daten
-		if (Math.random() > 0.5) cy.get("input[name='zentralheizung']").check();
-		if (Math.random() > 0.5) cy.get("input[name='einzelofen']").check();
-		if (Math.random() > 0.5) cy.get("input[name='durchlauf_erhitzer']").check();
-		if (Math.random() > 0.5) cy.get("input[name='standard_kessel']").check();
-		if (Math.random() > 0.5) cy.get("input[name='solarsystem_warmwasser']").check();
-		if (Math.random() > 0.5) cy.get("input[name='waermepumpe']").check();
-		if (Math.random() > 0.5) cy.get("input[name='niedertemperatur_kessel']").check();
-		if (Math.random() > 0.5) cy.get("input[name='brennwert_kessel']").check();
-		if (Math.random() > 0.5) cy.get("input[name='warmwasser_rohre_gedaemmt']").check();
-		if (Math.random() > 0.5) cy.get("input[name='heizungsrohre_gedaemmt']").check();
-		if (Math.random() > 0.5) cy.get("input[name='zirkulation']").check();
-		if (Math.random() > 0.5) cy.get("input[name='raum_temperatur_regler']").check();
-
-		// Heizungsanlage Bilder
-		cy.get("input[name='heizung_image']").should("have.attr", "type", "file").attachFile("images/heizungsanlage/1.jpeg", { subjectType: "input" });
-		cy.get("input[name='heizung_image']").should("have.attr", "type", "file").attachFile("images/heizungsanlage/2.jpeg", { subjectType: "input" });
-
-		// Fenster Daten
-		if (Math.random() > 0.5) cy.get("input[name='einfach_verglasung']").check();
-		if (Math.random() > 0.5) cy.get("input[name='doppel_verglasung']").check();
-		if (Math.random() > 0.5) cy.get("input[name='isolier_verglasung']").check();
-		if (Math.random() > 0.5) cy.get("input[name='dreifach_verglasung']").check();
-		if (Math.random() > 0.5) cy.get("input[name='fenster_dicht']").check();
-		if (Math.random() > 0.5) cy.get("input[name='fenster_teilweise_undicht']").check();
-		if (Math.random() > 0.5) cy.get("input[name='tueren_dicht']").check();
-		if (Math.random() > 0.5) cy.get("input[name='tueren_undicht']").check();
-		if (Math.random() > 0.5) cy.get("input[name='rolllaeden_kaesten_gedaemmt']").check();
-
-		// Fenster Bilder
-		cy.get("input[name='fenster_image']").should("have.attr", "type", "file").attachFile("images/fenster/1.jpeg", { subjectType: "input" });
-		cy.get("input[name='fenster_image']").should("have.attr", "type", "file").attachFile("images/fenster/2.jpeg", { subjectType: "input" });
-
-		// Wärmedämmung Daten
-		if (Math.random() > 0.5) cy.get("input[name='aussenwand_gedaemmt']").check();
-		if (Math.random() > 0.5) cy.get("input[name='keller_wand_gedaemmt']").check();
-		if (Math.random() > 0.5) cy.get("input[name='keller_decke_gedaemmt']").check();
-		if (Math.random() > 0.5) cy.get("input[name='dachgeschoss_gedaemmt']").check();
-		if (Math.random() > 0.5) cy.get("input[name='oberste_geschossdecke_gedaemmt']").check();
-		if (Math.random() > 0.5) cy.get("input[name='oberste_geschossdecke_min_12cm_gedaemmt']").check();
-
-		// Wärmedämmung Bilder
-		cy.get("input[name='daemmung_image']").should("have.attr", "type", "file").attachFile("images/daemmung/1.jpeg", { subjectType: "input" });
-		cy.get("input[name='daemmung_image']").should("have.attr", "type", "file").attachFile("images/daemmung/2.jpeg", { subjectType: "input" });
-
-		// Gebäude Bild
-		cy.get("input[name='gebaeude_image']").should("have.attr", "type", "file").attachFile("images/gebaeude/1.jpeg", { subjectType: "input" });
-
-		// Jetzt können wir den Verbrauchsausweis erstellen.
-		cy.get("form[name='ausweis'] button[type='submit']").click({ force: true });
-
-		// Wir sind nicht eingeloggt also sollte jetzt ein Login Screen erscheinen.
-		// Wir klicken auf registrieren und erstellen einen neuen Benutzer, danach loggen wir uns mit diesem ein.
-		cy.get("button[name='registrieren']").click();
-
-		const email = faker.internet.email();
-		const passwort = "test1234";
-		const vorname = faker.person.firstName();
-		const nachname = faker.person.lastName();
-
-		cy.get("form[name='signup'] input[name='email']").should("be.visible").should("have.attr", "type", "email").type(email);
-		cy.get("form[name='signup'] input[name='passwort']").should("be.visible").should("have.attr", "type", "password").type(passwort);
-		cy.get("form[name='signup'] input[name='vorname']").should("be.visible").should("have.attr", "type", "text").type(vorname);
-		cy.get("form[name='signup'] input[name='nachname']").should("be.visible").should("have.attr", "type", "text").type(nachname);
-
-		cy.get("form[name='signup'] button[type='submit']").click();
-
-		// Wir sind jetzt registriert und können uns nun einloggen.
-		// Die Email sollte automatisch eingetragen sein, da wir uns gerade registriert haben.
-		cy.get("form[name='login'] input[name='email']").should("be.visible").should("have.attr", "type", "email").should("contain.value", email);
-		cy.get("form[name='login'] input[name='passwort']").should("be.visible").should("have.attr", "type", "password").type(passwort);
-
-		cy.get("form[name='login'] button[type='submit']").click();
-
-		// Der Ausweis sollte jetzt schon erstellt worden sein und wir sollten auf die kundendaten seite weitergeleitet worden sein.
-		cy.url().should("contain", "/kundendaten");
-
-		cy.wait(1000)
-
-		// Wir füllen jetzt die Kundendaten aus.
-		cy.get("select[name='anrede']").select(Math.random() > 0.5 ? "Herr" : "Frau");
-		cy.get("input[name='vorname']").should("contain.value", vorname);
-		cy.get("input[name='name']").should("contain.value", nachname);
-		cy.get("input[name='email']").should("contain.value", email);
-		cy.get("input[name='telefon']").type(faker.phone.number());
-		
-		cy.get("input[name='rechnung_empfaenger']").type(`${vorname} ${nachname}`);
-		cy.get("input[name='rechnung_strasse']").type(faker.location.streetAddress());
-		// TODO: Random Plz generieren, allerdings muss die auch in der Datenbank vorhanden sein...
-		cy.get("input[name='rechnung_plz']").type("2103");
-		// Jetzt sollte der PLZ Container erscheinen, dort klicken wir einfach das erste Element an.
-		cy.get("div[data-test='plz-container']").children().first().click();
-		cy.get("input[name='rechnung_telefon']").type(faker.phone.number());
-		cy.get("input[name='rechnung_email']").type(faker.internet.email());
-		cy.get("button[data-test='paypal']").click();
-
-		// Datenschutz und AGB akzeptieren, dann schicken wir das Formular ab.
-		cy.get("input[name='agb-akzeptieren']").check()
-		cy.get("input[name='datenschutz-akzeptieren']").check()
-		cy.get("button[type='submit']").click();
-
-		cy.origin('https://www.mollie.com', () => {
-			// Jetzt sind wir auf der Mollie Seite, dort wählen wir den "paid" status aus
-			cy.get("input[type='radio'][name='final_state'][value='paid']").check();
-			// Da wird unser Test fehlschlagen, da die localhost domain von Mollie aus nicht erreichbar ist.
-		})
-	});	
-});

package.json

@@ -1,82 +1,93 @@
-{
-  "name": "online-energieausweis",
-  "version": "0.0.1",
-  "license": "GPL V3.0",
-  "type": "module",
-  "scripts": {
-    "dev": "bun astro dev",
-    "build": "bun astro build",
-    "preview": "bun astro preview",
-    "astro": "astro",
-    "test:e2e": "cypress run",
-    "test:unit": "bun test",
-    "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"
-  },
-  "private": true,
-  "dependencies": {
-    "@astrojs/mdx": "^3.1.9",
-    "@astrojs/node": "^8.3.4",
-    "@astrojs/svelte": "^2.2.0",
-    "@astrojs/tailwind": "^3.1.3",
-    "@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",
-    "@trpc/client": "^10.45.2",
-    "@trpc/server": "^10.45.2",
-    "astro": "^4.16.10",
-    "body-scroll-lock": "^4.0.0-beta.0",
-    "buffer": "^6.0.3",
-    "bun": "^1.1.34",
-    "csvtojson": "^2.0.10",
-    "express": "^4.21.1",
-    "flag-icons": "^6.15.0",
-    "fontkit": "^2.0.4",
-    "js-cookie": "^3.0.5",
-    "js-interpolate": "^1.3.2",
-    "moment": "^2.30.1",
-    "moment-timezone": "^0.5.46",
-    "pdf-lib": "^1.17.1",
-    "postcss-nested": "^7.0.2",
-    "radix-svelte-icons": "^1.0.0",
-    "sass": "^1.80.6",
-    "svelte": "^3.59.2",
-    "svelte-dialogs": "^1.2.2",
-    "svelte-preprocess": "^5.1.4",
-    "svelte-ripple-action": "^1.0.6",
-    "tailwindcss": "^3.4.14",
-    "trpc-openapi": "^1.2.0",
-    "uuid": "^9.0.1",
-    "zod": "^3.23.8"
-  },
-  "devDependencies": {
-    "@faker-js/faker": "^8.4.1",
-    "@rollup/plugin-dsv": "^3.0.5",
-    "@tailwindcss/typography": "^0.5.15",
-    "@types/body-scroll-lock": "^3.1.2",
-    "@types/express": "^5.0.0",
-    "@types/fontkit": "^2.0.7",
-    "@types/js-cookie": "^3.0.6",
-    "@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",
-    "cypress-file-upload": "^5.0.8",
-    "daisyui": "^4.12.14",
-    "eslint": "~8.15.0",
-    "eslint-config-prettier": "8.1.0",
-    "postcss": "^8.4.49",
-    "postcss-import": "^16.1.0",
-    "postcss-nesting": "^13.0.1",
-    "prettier": "^2.8.8",
-    "typescript": "^4.9.5"
-  }
-}
+{
+  "name": "online-energieausweis",
+  "version": "0.0.1",
+  "license": "GPL V3.0",
+  "type": "module",
+  "scripts": {
+    "dev": "bun astro dev",
+    "build": "bun astro build",
+    "preview": "bun astro preview",
+    "astro": "astro",
+    "test:e2e": "cypress run",
+    "test:unit": "bun test",
+    "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",
+    "openapi:generate": "bun astro-typesafe-api generate"
+  },
+  "private": true,
+  "dependencies": {
+    "@astrojs/mdx": "^3.1.9",
+    "@astrojs/node": "^8.3.4",
+    "@astrojs/svelte": "^2.2.0",
+    "@astrojs/tailwind": "^3.1.3",
+    "@ibcornelsen/api": "link:@ibcornelsen/api",
+    "@ibcornelsen/database": "link:@ibcornelsen/database",
+    "@ibcornelsen/ui": "^0.0.2",
+    "@mollie/api-client": "^3.7.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.17",
+    "astro-typesafe-api": "link:astro-typesafe-api",
+    "body-scroll-lock": "^4.0.0-beta.0",
+    "buffer": "^6.0.3",
+    "bun": "^1.1.45",
+    "csvtojson": "^2.0.10",
+    "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",
+    "pdf-lib": "^1.17.1",
+    "postcss-nested": "^7.0.2",
+    "radix-svelte-icons": "^1.0.0",
+    "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.17",
+    "trpc-openapi": "^1.2.0",
+    "uuid": "^9.0.1",
+    "zod": "^3.24.1"
+  },
+  "devDependencies": {
+    "@faker-js/faker": "^8.4.1",
+    "@rollup/plugin-dsv": "^3.0.5",
+    "@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/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.45",
+    "cypress": "^13.17.0",
+    "cypress-file-upload": "^5.0.8",
+    "cypress-vite": "^1.6.0",
+    "daisyui": "^4.12.23",
+    "eslint": "~8.15.0",
+    "eslint-config-prettier": "8.1.0",
+    "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,22 @@
+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"),
+    "auth/access-token": await import("../src/pages/api/auth/access-token.ts"),
+    "auth/refresh-token": await import("../src/pages/api/auth/refresh-token.ts"),
+    "bedarfsausweis-wohnen": await import("../src/pages/api/bedarfsausweis-wohnen/index.ts"),
+    "bilder/[uid]": await import("../src/pages/api/bilder/[uid].ts"),
+    "objekt": await import("../src/pages/api/objekt/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,65 +1,95 @@
-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) {
-	if (images.length == 0) {
-		return images;
-	}
+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 }[];
+  // 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;
+  }[];
 
-	if (imagesToUpload.length == 0) {
-		return images;
-	}
+  if (imagesToUpload.length == 0) {
+    return images;
+  }
 
-	// Alle Bilder hochladen
-	const notification = addNotification({
-		dismissable: false,
-		message: "Bilder hochladen.",
-		subtext: `${imagesToUpload.length} Bilder werden hochgeladen, bitte haben sie Geduld.`,
-		timeout: 0,
-		type: "info"
-	})
-	for (let i = 0; i < imagesToUpload.length; i++) {
-		const image = imagesToUpload[i];
+  // Alle Bilder hochladen
+  const notification = addNotification({
+    dismissable: false,
+    message: "Bilder hochladen.",
+    subtext: `${imagesToUpload.length} Bilder werden hochgeladen, bitte haben sie Geduld.`,
+    timeout: 0,
+    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({
-					base64: image.base64,
-					kategorie: image.kategorie as Enums.BilderKategorie,
-					gebaeude_uid
-				})
-	
-				image.uid = response.uid
-			}
+    try {
+      if (image.update) {
+        await api.bilder._uid.PATCH.fetch({
+          base64: image.base64,
+          kategorie: image.kategorie as Enums.BilderKategorie,
+        }, {
+					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)}`
+					}
+				});
 
-			updateNotification(notification, {
-				dismissable: true,
-				message: "Bild hochgeladen.",
-				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"
-			})
-		}
-	}
+        image.uid = response.uid;
+      }
 
-	return images;
-}
+      updateNotification(notification, {
+        dismissable: true,
+        message: "Bild hochgeladen.",
+        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",
+      });
+    }
+  }
+
+  return images;
+}

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,133 @@
-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";
+// import { addNotification } from "@ibcornelsen/ui";
 
 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
+			},
+			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)}`
+			}
+		})
 
-			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.
-		}
-	} 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,
-						},
-					},
-				});
-
-			images = await bilderHochladen(images, response.gebaeude_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({
-					ausweis,
-				}),
-			});
-			// TODO: Ticket mit Fehldermeldung abschicken.
-		}
+		objekt.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",
-	});
+
+
+	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 {
+		const { uid } = await api.aufnahme.PUT.fetch({
+			aufnahme,
+			uid_objekt: objekt.uid
+		}, {
+			headers: {
+				"Authorization": `Bearer ${Cookies.get(API_ACCESS_TOKEN_COOKIE_NAME)}`
+			}
+		})
+
+		aufnahme.uid = uid
+	}
+
+	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 {
+		await api["verbrauchsausweis-wohnen"].PUT.fetch({
+			ausweis,
+			uid_aufnahme: aufnahme.uid
+		}, {
+			headers: {
+				"Authorization": `Bearer ${Cookies.get(API_ACCESS_TOKEN_COOKIE_NAME)}`
+			}
+		})
+	}
+
+	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/AusweisPreviewContainer.svelte

@@ -1,8 +1,8 @@
 <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,

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";
 
@@ -18,14 +16,14 @@
 		VerbrauchsausweisWohnenClient,
 	} from "./types.js";
 
-	export let gebaeude: GebaeudeClient;
+	export let objekt: GebaeudeClient;
 	export let ausweis:
 		| VerbrauchsausweisWohnenClient
 		| VerbrauchsausweisGewerbeClient
 		| BedarfsausweisWohnenClient;
-	export let gebaeude_aufnahme_allgemein: GebaeudeAufnahmeClient;
+	export let aufnahme: GebaeudeAufnahmeClient;
 
-	export let Energieausweis;
+	export let ausweisart: Enums.Ausweisart;
 </script>
 
 <div id="ausweisart" class="bereich-box grid
@@ -69,11 +67,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 +83,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 +159,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 +178,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 +218,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 +256,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/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";
@@ -19,7 +19,7 @@
 	import SanierungsOption from "#components/Ausweis/SanierungsOption.svelte";
 
 	export let gebaeude: GebaeudeClient;
-	export let gebaeude_aufnahme_allgemein: GebaeudeAufnahmeClient;
+	export let aufnahme: GebaeudeAufnahmeClient;
 	export let ausweis: VerbrauchsausweisWohnenClient;
 	export let images: UploadedGebaeudeBild[];
 </script>
@@ -37,18 +37,18 @@ xl:grid-cols-2 xl:gap-x-8 xl:gap-y-8
 
 ">
 
-<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.photovotaik}></SanierungsOption>
 
 </div>
 
@@ -86,7 +86,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 +97,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 +108,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 +119,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 +130,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 +141,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 +152,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 +163,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 +174,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 +207,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 +218,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 +229,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 +240,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 +251,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 +262,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,12 +1,13 @@
 <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;
 
@@ -26,10 +27,10 @@
 		<div class="">
 			<AusweisWeiter
 				bind:ausweis
-				bind:images
+				bind:bilder
 				bind:user
-				bind:gebaeude
-				bind:gebaeude_aufnahme_allgemein
+				bind:objekt
+				bind:aufnahme
 			></AusweisWeiter>
 		</div>
 

src/components/Ausweis/ButtonZurueckSpeichernKaufabschluss.svelte

@@ -1,13 +1,13 @@
 <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>

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">
@@ -46,9 +48,9 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 <div class="input-noHelp">
 	<Inputlabel title="PLZ *"></Inputlabel>
 	
-	<ZipSearch 
-		bind:zip={gebaeude_aufnahme_allgemein.plz}
-		bind:city={gebaeude_aufnahme_allgemein.ort}
+	<ZipSearch
+		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/LueftungundLeerstand.svelte

@@ -1,9 +1,9 @@
 <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 gebaeude_aufnahme_allgemein: GebaeudeAufnahmeClient;
+    export let aufnahme: GebaeudeAufnahmeClient;
 
 </script>
 
@@ -25,7 +25,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 +53,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,7 +76,7 @@ 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>
@@ -109,7 +109,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,5 +1,5 @@
 <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,
@@ -7,12 +7,12 @@
 		GebaeudeClient,
 		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: GebaeudeAufnahmeClient;
+	export let objekt: GebaeudeClient;
 
 	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 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">
+	<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"
+			>
 				<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>
+		{/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}
-
-</style>
+	.check {
+		@apply self-center font-bold text-green-700;
+	}
+	.check-no {
+		@apply self-center font-bold text-red-700;
+	}
+</style>

src/components/Ausweis/SanierungsOption.svelte

@@ -1,5 +1,5 @@
 <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;

src/components/Ausweis/SanierungszustandFensterTueren.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 FensterImage from "./FensterImage.svelte";
     
@@ -16,7 +16,7 @@
             import SanierungsOption from "#components/Ausweis/SanierungsOption.svelte"
     
         export let gebaeude: GebaeudeClient;
-        export let gebaeude_aufnahme_allgemein: GebaeudeAufnahmeClient;
+        export let aufnahme: GebaeudeAufnahmeClient;
         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,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";
 
@@ -17,7 +17,7 @@
         import SanierungsOption from "#components/Ausweis/SanierungsOption.svelte"
     
         export let gebaeude: GebaeudeClient;
-        export let gebaeude_aufnahme_allgemein: GebaeudeAufnahmeClient;
+        export let aufnahme: GebaeudeAufnahmeClient;
         export let ausweis: VerbrauchsausweisWohnenClient
         export let images: UploadedGebaeudeBild[];
     
@@ -33,18 +33,18 @@
     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 <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="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.photovotaik}></SanierungsOption>
     </div>
     
@@ -74,7 +74,7 @@
                     ><input
                         type="checkbox"
                         class="checkbox"
-                        name="aussenwand_gedaemmt"
+                        name="aussenwand_gedaemmt"
                         bind:checked={aufnahme.aussenwand_gedaemmt}
                         value="AWD"
                     />Außenwand gedämmt</label
@@ -85,7 +85,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
@@ -96,7 +96,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
@@ -107,7 +107,7 @@
                     ><input
                         type="checkbox"
                         class="checkbox"
-                        name="dachgeschoss_gedaemmt"
+                        name="dachgeschoss_gedaemmt"
                         bind:checked={aufnahme.dachgeschoss_gedaemmt}
                         value="DGD"
                     />Dachgeschoss gedämmt</label
@@ -118,7 +118,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
@@ -129,7 +129,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/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";
 
@@ -17,7 +17,7 @@
             import SanierungsOption from "#components/Ausweis/SanierungsOption.svelte"
     
         export let gebaeude: GebaeudeClient;
-        export let gebaeude_aufnahme_allgemein: GebaeudeAufnahmeClient;
+        export let aufnahme: GebaeudeAufnahmeClient;
         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"
 	
 
@@ -21,7 +21,7 @@
 	import { addNotification } from "#components/Notifications/shared.js";
 
 	export let gebaeude: GebaeudeClient;
-	export let gebaeude_aufnahme_allgemein: GebaeudeAufnahmeClient;
+	export let aufnahme: GebaeudeAufnahmeClient;
 	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")) {
@@ -232,7 +232,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 +264,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 +304,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 +332,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 +360,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,7 +412,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}
@@ -446,13 +446,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>
@@ -486,7 +486,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 +513,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 +540,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({
-				uid: ausweis.uid
+			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/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/Notifications/RawNotification.svelte

@@ -4,6 +4,29 @@
 	import { fly } from "svelte/transition";
 
 	export let notification: Partial<Notification> & { uid: string };
+
+	function focusSelector() {
+		const element = document.querySelector(notification.selector as string) as HTMLElement | null;
+
+		if (!element) {
+			return
+		}
+
+		element.classList.add("bg-red-300")
+
+		element.scrollIntoView({
+			behavior: "smooth",
+			block: "center",
+			inline: "center"
+		})
+
+		element.focus()
+		deleteNotification(notification.uid)
+
+		setTimeout(() => {
+			element?.classList.remove("bg-red-300")
+		}, 3000)
+	}
 </script>
 
 <div
@@ -15,32 +38,7 @@
 >
 	<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);
-
-				if (!element) {
-					return
-				}
-
-				element.classList.add("bg-red-300")
-
-				element.scrollIntoView({
-					behavior: "smooth",
-					block: "center",
-					inline: "center"
-				})
-
-				element.focus()
-				deleteNotification(notification.uid)
-
-				setTimeout(() => {
-					element?.classList.remove("bg-red-300")
-				}, 3000)
-			}} class="p-1.5 border rounded-lg" title="Anzeigen"><OpenInNewWindow size={18}></OpenInNewWindow></button>
+			<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/A12BerechnungNutzenergiebedarf.svelte

@@ -0,0 +1,229 @@
+<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-left">
+		<thead>
+			<tr class="bg-gray-200 text-left">
+				<th colspan="12" class="border border-gray-300 p-2">
+					<h2>Tabelle A.12 — Heizung – Berechnung des Nutzenergiebedarfs</h2>
+				</th>
+			</tr>
+			<tr class="text-center">
+				<tr class="bg-gray-200 text-left">
+					<th colspan="12" class="border border-gray-300 p-2 text-xl">
+						Heizbedarf des Wohngebäudes
+					</th>
+				</tr> 
+				<th colspan="1" class="border border-gray-300 p-2">min. Außen-<br>temperatur<br>&#952;<sub>e,min</sub> [°C]</th>
+				<th colspan="1" class="border border-gray-300 p-2">Innen-<br>temperatur<br>&#952;<sub>i,h,soll</sub> [°C]</th>
+				<th colspan="2" class="border border-gray-300 p-2">maximaler Wärmestrom<br>Q̇<sub>ges</sub> [W]<br>aus Tabelle A.6 (1)</th>
+				<th colspan="8" 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-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="8" class="border border-gray-300 p-2"></th>
+				</tr>
+		<tr>
+		<th class="border border-gray-300 px-2 py-1">Tage im Monat<br>d<sub>mth</sub> [d]</th>
+		 <th class="border border-gray-300 px-2 py-1">Bilanzinnen-<br>temperatur<br>&#952;<sub>i,h</sub> [°C]<br>aus Tabelle 8 (EFH) bzw. 10 (MFH)</th>
+		 <th class="border border-gray-300 px-2 py-1">mittlere Außen-<br>temp.<br>&#952;<sub>e,m</sub> [°C]</th>
+		 <th class="border border-gray-300 px-2 py-1">Mittlere Belastung<br>&#946;<sub>e,m</sub><br>aus Tabelle 9 bzw. 11 (2)</th>
+		 <th class="border border-gray-300 px-2 py-1">P<sub>h,sink</sub> = Q̇<sub>ges</sub> · (&#952;<sub>i,h</sub> - &#952;<sub>e,min</sub>) / (&#952;<sub>i,h,soll</sub> - &#952;<sub>e,min</sub>) · &#946;<sub>e,m</sub> [W] (3)</th>
+		 <th class="border border-gray-300 px-2 py-1">P<sub>h,source</sub> = P<sub>i,ges</sub><br>aus Tabelle A.11 (4)</th>
+		 <th class="border border-gray-300 px-2 py-1">&#947;<sub>m</sub> = P<sub>h,source</sub> / P<sub>h,sink</sub><br>(5) = (4) / (3)</th>
+		 <th class="border border-gray-300 px-2 py-1">&#951;<sub>m</sub> = f(γ) aus Tabelle 18<br>(6)</th>
+		 <th class="border border-gray-300 px-2 py-1">(7) = max[1 - (5) · (6);0]</th>
+		 <th class="border border-gray-300 px-2 py-1">&#946;<sub>m</sub><br>(8) = (2) · (7)</th>
+		 <th class="border border-gray-300 px-2 py-1">t<sub>h,m</sub> [h] (9)</th>
+		 <th class="border border-gray-300 px-2 py-1">Q<sub>h,b</sub> [kWh] (10)</th>
+		</tr>
+	</thead>
+	<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"></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"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border border-gray-300 px-2 py-1 bg-yellow-100"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border border-gray-300 px-2 py-1 bg-blue-100"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></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"></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"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border border-gray-300 px-2 py-1 bg-yellow-100"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border border-gray-300 px-2 py-1 bg-blue-100"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></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"></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"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border border-gray-300 px-2 py-1 bg-yellow-100"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border border-gray-300 px-2 py-1 bg-blue-100"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></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"></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"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border border-gray-300 px-2 py-1 bg-yellow-100"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border border-gray-300 px-2 py-1 bg-blue-100"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></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"></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"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border border-gray-300 px-2 py-1 bg-yellow-100"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border border-gray-300 px-2 py-1 bg-blue-100"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></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"></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"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border border-gray-300 px-2 py-1 bg-yellow-100"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border border-gray-300 px-2 py-1 bg-blue-100"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></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"></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"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border border-gray-300 px-2 py-1 bg-yellow-100"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border border-gray-300 px-2 py-1 bg-blue-100"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></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"></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"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border border-gray-300 px-2 py-1 bg-yellow-100"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border border-gray-300 px-2 py-1 bg-blue-100"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></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"></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"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border border-gray-300 px-2 py-1 bg-yellow-100"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border border-gray-300 px-2 py-1 bg-blue-100"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></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"></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"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border border-gray-300 px-2 py-1 bg-yellow-100"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border border-gray-300 px-2 py-1 bg-blue-100"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></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"></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"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border border-gray-300 px-2 py-1 bg-yellow-100"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border border-gray-300 px-2 py-1 bg-blue-100"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></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"></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"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border border-gray-300 px-2 py-1 bg-yellow-100"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border border-gray-300 px-2 py-1 bg-blue-100"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></td>
+			<td class="border-2 border-gray-600 px-2 py-1"></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>
+		</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>
+			<th colspan="1" class="border border-gray-300 p-2"></th>
+			<th colspan="1" class="border border-gray-300 p-2"></th>
+		</tr>
+	</tbody>
+</table>
+</div>

src/components/Tabellen/A1AnlagenBeschreibung.svelte

@@ -0,0 +1,75 @@
+<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">
+		<!-- 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>
+</div>

src/components/Tabellen/A2Wintergarten.svelte

@@ -0,0 +1,296 @@
+<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">
+		<!-- 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>
+				<th class="border border-gray-300 p-2 w-1/12"></th>
+				<th class="border border-gray-300 p-2 w-1/12"></th>
+				<th class="border border-gray-300 p-2 w-1/12"></th>
+				<th class="border border-gray-300 p-2 w-1/12"></th>
+				<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>
+				<td class="border border-gray-300 p-2 text-center"></td>
+				<td class="border border-gray-300 p-2 text-center"></td>
+				<td class="border border-gray-300 p-2 text-center"></td>
+				<td class="border border-gray-300 p-2 text-center"></td>
+				<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<sub>ue</sub> [m²] (1)</td>
+				<td class="border border-gray-300 p-2 text-center"></td>
+				<td class="border border-gray-300 p-2 text-center"></td>
+				<td class="border border-gray-300 p-2 text-center"></td>
+				<td class="border border-gray-300 p-2 text-center"></td>
+				<td class="border-2 border-gray-600 p-2 text-center bg-white"></td>
+			</tr>
+			<tr class="bg-yellow-100">
+				<td class="border border-gray-300 p-2 bg-white">Gesamtenergiedurchlassgrad g<sub>ue</sub> (2)</td>
+				<td class="border border-gray-300 p-2 text-center"></td>
+				<td class="border border-gray-300 p-2 text-center"></td>
+				<td class="border border-gray-300 p-2 text-center"></td>
+				<td class="border border-gray-300 p-2 text-center"></td>
+				<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,ue</sub> (3)</td>
+				<td class="border border-gray-300 p-2 text-center">0,9</td>
+				<td class="border border-gray-300 p-2 text-center">0,9</td>
+				<td class="border border-gray-300 p-2 text-center">0,9</td>
+				<td class="border border-gray-300 p-2 text-center">0,9</td>
+				<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,ue</sub> (4)</td>
+				<td class="border border-gray-300 p-2 text-center">0,9</td>
+				<td class="border border-gray-300 p-2 text-center">0,9</td>
+				<td class="border border-gray-300 p-2 text-center">0,9</td>
+				<td class="border border-gray-300 p-2 text-center">0,9</td>
+				<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,ue</sub> (5)</td>
+				<td class="border border-gray-300 p-2 text-center">0,9</td>
+				<td class="border border-gray-300 p-2 text-center">0,9</td>
+				<td class="border border-gray-300 p-2 text-center">0,9</td>
+				<td class="border border-gray-300 p-2 text-center">0,9</td>
+				<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,ue</sub> = g<sub>ue</sub> · F<sub>w,ue</sub> · F<sub>s,ue</sub><br>
+					(6) = (2) · (4) · (5)</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"></td>
+				<td class="border-2 border-gray-600 p-2 text-center"></td>
+				<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">
+		<!-- Tabellenkopf -->
+		<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<sub>ue</sub> ⋅ F<sub>F,ue</sub> ⋅ g<sub>eff,ue</sub>
+					 ⋅ E<sub>sol</sub></th>
+				<th colspan="6" class="border border-gray-300 p-2 text-left">Φ<sub>S,u</sub> = ∑ Q<sub>S,tr</sub> ⋅ 1000 (24 ⋅ d<sub>mth</sub>)</th> 
+			</tr>
+			<tr class="text-center">
+				<th class="border border-gray-300 p-2 w-1/12">Tage im Monat<br>(7)</th>
+				<th class="border border-gray-300 p-2 w-1/12">E<sub>sol</sub><br>[kWh/m²]<br>(8)</th>
+				<th class="border border-gray-300 p-2 w-1/12">Q<sub>S,tr</sub><br>[kWh]<br>(9) = (1) ⋅ (3) ⋅ (6) ⋅ (8)</th>
+				<th class="border border-gray-300 p-2 w-1/12">E<sub>sol</sub><br>[kWh/m²]<br>(10)</th>
+				<th class="border border-gray-300 p-2 w-1/12">Q<sub>S,tr</sub><br>[kWh]<br>(11) = (1) ⋅ (3) ⋅ (6) ⋅ (10)</th>
+				<th class="border border-gray-300 p-2 w-1/12">E<sub>sol</sub><br>[kWh/m²]<br>(12)</th>
+				<th class="border border-gray-300 p-2 w-1/12">Q<sub>S,tr</sub><br>[kWh]<br>(13) = (1) ⋅ (3) ⋅ (6) ⋅ (12)</th>
+				<th class="border border-gray-300 p-2 w-1/12">E<sub>sol</sub><br>[kWh/m²]<br>(14)</th>
+				<th class="border border-gray-300 p-2 w-1/12">Q<sub>S,tr</sub><br>[kWh]<br>(15) = (1) ⋅ (3) ⋅ (6) ⋅ (14)</th>
+				<th class="border border-gray-300 p-2 w-1/12">ΣQ<sub>S,tr</sub><br>[kWh]<br>(16) = (9) + (11) + (13) + (15)</th>
+				<th class="border border-gray-300 p-2 w-1/12">Φ<sub>S,u</sub><br>[W]<br>(17) = (16) ⋅ 1000 / [24] ⋅ (7)</th>
+			</tr>
+		</thead>
+
+		<!-- Tabellenkörper -->
+		<tbody>
+			<tr class="text-center">
+				<td class="border border-gray-300 p-2">31</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 bg-blue-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 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>
+				<td class="border-2 border-gray-600 p-2"></td>
+			</tr>
+			<tr class="text-center">
+				<td class="border border-gray-300 p-2">28</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 bg-blue-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 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>
+				<td class="border-2 border-gray-600 p-2"></td>
+			</tr>
+			<tr class="text-center">
+				<td class="border border-gray-300 p-2">31</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 bg-blue-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 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>
+				<td class="border-2 border-gray-600 p-2"></td>
+			</tr>
+			<tr class="text-center">
+				<td class="border border-gray-300 p-2">30</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 bg-blue-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 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>
+				<td class="border-2 border-gray-600 p-2"></td>
+			</tr>
+			<tr class="text-center">
+				<td class="border border-gray-300 p-2">31</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 bg-blue-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 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>
+				<td class="border-2 border-gray-600 p-2"></td>
+			</tr>
+			<tr class="text-center">
+				<td class="border border-gray-300 p-2">30</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 bg-blue-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 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>
+				<td class="border-2 border-gray-600 p-2"></td>
+			</tr>
+			<tr class="text-center">
+				<td class="border border-gray-300 p-2">31</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 bg-blue-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 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>
+				<td class="border-2 border-gray-600 p-2"></td>
+			</tr>
+			<tr class="text-center">
+				<td class="border border-gray-300 p-2">31</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 bg-blue-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 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>
+				<td class="border-2 border-gray-600 p-2"></td>
+			</tr>
+			<tr class="text-center">
+				<td class="border border-gray-300 p-2">30</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 bg-blue-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 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>
+				<td class="border-2 border-gray-600 p-2"></td>
+			</tr>
+			<tr class="text-center">
+				<td class="border border-gray-300 p-2">31</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 bg-blue-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 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>
+				<td class="border-2 border-gray-600 p-2"></td>
+			</tr>
+			<tr class="text-center">
+				<td class="border border-gray-300 p-2">30</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 bg-blue-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 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>
+				<td class="border-2 border-gray-600 p-2"></td>
+			</tr>
+			<tr class="text-center">
+				<td class="border border-gray-300 p-2">31</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 bg-blue-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 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>
+				<td class="border-2 border-gray-600 p-2"></td>
+			</tr>
+			<tr class="text-center">
+				<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>
+				<td class="p-2"></td>
+				<td class="p-2"></td>
+				<td class="border border-gray-300 p-2">Jahressumme</td>
+				<td class="border-2 border-gray-600 p-2"></td>
+				<td class="p-2"></td>
+			</tr>
+		</tbody>
+	</table>
+</div>

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/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/Verbrauchsausweis/audits/EndEnergie.ts

@@ -3,17 +3,17 @@ 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: GebaeudeClient, aufnahme: GebaeudeAufnahmeClient): 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/PlzNichtErkannt.ts

@@ -1,14 +1,14 @@
-import { GebaeudeAufnahmeClient } from "#components/Ausweis/types.js";
-import { client } from "src/trpc.js";
+import { GebaeudeClient } 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: GebaeudeClient) => {
 		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/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>
 

src/components/labels/VerbrauchsHelpLabel.svelte

@@ -3,21 +3,21 @@
 
 	export let addYear: number;
 	export let heizquelle: number;
-	export let gebaeude_aufnahme_allgemein;
+	export let aufnahme;
 	export let ausweis;
 </script>
 
 {#if ausweis.startdatum}
 	Bitte geben Sie Ihren
 	{#if heizquelle == 1}
-		{#if gebaeude_aufnahme_allgemein.brennstoff_1}<b>
-				{gebaeude_aufnahme_allgemein.brennstoff_1}
+		{#if aufnahme.brennstoff_1}<b>
+				{aufnahme.brennstoff_1}
 			</b>{/if}
 		Verbrauch {#if ausweis.einheit_1}
 			in <b>{ausweis.einheit_1} </b>{/if}
 	{:else if heizquelle == 2}
-		{#if gebaeude_aufnahme_allgemein.brennstoff_2}<b>
-				{gebaeude_aufnahme_allgemein.brennstoff_2}
+		{#if aufnahme.brennstoff_2}<b>
+				{aufnahme.brennstoff_2}
 			</b>{/if}
 		Verbräuche {#if ausweis.einheit_2}
 			in <b>{ausweis.einheit_2} </b>{/if}

src/cypress/e2e/VerbrauchsausweisWohnen/erstellen.cy.ts

@@ -0,0 +1,286 @@
+import fuelList from "#components/Ausweis/brennstoffListe.js";
+import { faker } from "@faker-js/faker";
+import { Enums } from "@ibcornelsen/database/client";
+
+import "cypress-file-upload"
+
+describe("Verbrauchsausweis erstellen Schritt 1", () => {
+	it("erstellt einen neuen Verbrauchsausweis Wohngebäude.", () => {
+		cy.visit("/energieausweis-erstellen/verbrauchsausweis-wohngebaeude");
+
+		console.log(Enums);
+		
+		
+		// cy.wait(1000);
+
+		// // Wir überprüfen, ob alle Ausstelgründe vorhanden sind, diese sollten genau so viele sein wie in der Datenbank vorhanden sind.
+		// cy.get("input[name='ausstellgrund']")
+		// 	.should("have.length", Object.values(Enums.Ausstellgrund).length)
+		// 	.eq(
+		// 		faker.number.int({
+		// 			min: 0,
+		// 			max: Object.values(Enums.Ausstellgrund).length - 1,
+		// 		})
+		// 	)
+		// 	.check();
+
+		// // Jetzt Füllen wir das Baujahr vom Gebäude aus.
+		// cy.get("input[name='baujahr_gebaeude']")
+		// 	.should("have.attr", "type", "number")
+		// 	.type(
+		// 		faker.number.int({ min: 1900, max: 2021 }).toString() +
+		// 			"{enter}",
+		// 		{ delay: 50 }
+		// 	);
+
+		// // Jetzt Füllen wir das Baujahr der Heizung aus.
+		// cy.get("input[name='baujahr_heizung']")
+		// 	.should("have.attr", "type", "number")
+		// 	.type(
+		// 		faker.number.int({ min: 1900, max: 2021 }).toString() +
+		// 			"{enter}",
+		// 		{ delay: 50 }
+		// 	);
+
+		// // Anzahl Einheiten
+		// cy.get("input[name='einheiten']")
+		// 	.should("have.attr", "type", "number")
+		// 	.type(faker.number.int({ min: 1, max: 5 }).toString());
+
+		// // Sanierungsstatus
+		// cy.get("select[name='saniert']").select(
+		// 	Math.random() > 0.5 ? "true" : "false"
+		// );
+
+		// // Adresse
+		// cy.get("input[name='adresse']").type(faker.location.streetAddress());
+
+		// // Postleitzahl
+		// cy.get("input[name='plz']").type(
+		// 	faker.location.zipCode({
+		// 		format: "#####",
+		// 	})
+		// );
+
+		// // TODO: Ort - Dieser wird aus der Datenbank abgefragt, wir müssen also warten, bis der Dropdown da ist.
+
+		// // Flaeche
+		// cy.get("input[name='flaeche']")
+		// 	.should("have.attr", "type", "number")
+		// 	.type(faker.number.int({ min: 50, max: 1000 }).toString());
+
+		// // Nutzflaeche
+		// cy.get("input[name='nutzflaeche']")
+		// 	.should("have.attr", "type", "number")
+		// 	.type(faker.number.int({ min: 50, max: 1000 }).toString());	
+
+		// // Keller
+		// cy.get("select[name='keller']").find("option:not([disabled])").should("have.length", Object.values(Enums.Heizungsstatus).length).parent().select(faker.number.int({
+		// 	max: Object.values(Enums.Heizungsstatus).length,
+		// 	min: 1
+		// }));
+
+		// // Dachgeschoss
+		// cy.get("select[name='dachgeschoss']").find("option:not([disabled])").should("have.length", Object.values(Enums.Heizungsstatus).length).parent().select(faker.number.int({
+		// 	max: Object.values(Enums.Heizungsstatus).length,
+		// 	min: 1
+		// }));
+
+		// // Brennstoff und Einheit 1
+		// const brennstoffKombo = fuelList[faker.number.int({ min: 0, max: fuelList.length - 1 })];
+
+		// cy.get("select[name='brennstoff_1']").select(brennstoffKombo[0]);
+		// cy.get("select[name='einheit_1']").select(brennstoffKombo[1]);
+
+		// // Verbrauchszeitraum
+		// cy.get("select[name='energieverbrauch_zeitraum_monat']").select(faker.number.int({ min: 1, max: 12 }).toString());
+		// cy.get("select[name='energieverbrauch_zeitraum_jahr']").select(faker.number.int({ min: 2018, max: 2019 }).toString());
+
+		// // Verbrauch
+		// cy.get("input[name='verbrauch_1']").type(faker.number.int({ min: 4000, max: 15000 }).toString());
+		// cy.get("input[name='verbrauch_2']").type(faker.number.int({ min: 4000, max: 15000 }).toString());
+		// cy.get("input[name='verbrauch_3']").type(faker.number.int({ min: 4000, max: 15000 }).toString());
+
+		
+		// const zusaetzlicheHeizquelle = Math.random() > 0.5;
+
+		// if (zusaetzlicheHeizquelle) {
+		// 	cy.get("input[name='zusaetzliche_heizquelle']").check();
+
+		// 	// Brennstoff und Einheit 2
+		// 	const brennstoffKombo2 = fuelList[faker.number.int({ min: 0, max: fuelList.length - 1 })];
+
+		// 	cy.get("select[name='brennstoff_2']").select(brennstoffKombo2[0]);
+		// 	cy.get("select[name='einheit_2']").select(brennstoffKombo2[1]);
+
+		// 	// Verbrauch
+		// 	cy.get("input[name='verbrauch_4']").type(faker.number.int({ min: 4000, max: 15000 }).toString());
+		// 	cy.get("input[name='verbrauch_5']").type(faker.number.int({ min: 4000, max: 15000 }).toString());
+		// 	cy.get("input[name='verbrauch_6']").type(faker.number.int({ min: 4000, max: 15000 }).toString());
+		// }
+
+		// // Warmwasser enthalten und bekannt
+		// const warmwasserEnthalten = Math.random() > 0.5;
+		// const anteilBekannt = Math.random() > 0.5;
+
+		// if (warmwasserEnthalten) {
+		// 	cy.get("input[name='warmwasser_enthalten']").check();			
+
+		// 	if (anteilBekannt) {
+		// 		// Der Anteil ist bekannt, wir müssen ihn also angeben.
+		// 		cy.get("input[name='warmwasser_anteil_bekannt']").check();
+
+		// 		cy.get("input[name='anteil_warmwasser_1']").type(faker.number.int({ min: 0, max: 50 }).toString());
+
+		// 		if (zusaetzlicheHeizquelle) {
+		// 			// Zusätzliche Heizquelle existiert, also müssen wir auch hier den Anteil angeben.
+		// 			cy.get("input[name='anteil_warmwasser_2']").type(faker.number.int({ min: 0, max: 50 }).toString());
+		// 		}
+		// 	}
+		// }
+
+		// // Alternative Energieversorgungssysteme
+		// if (Math.random() > 0.5) cy.get("input[name='alternative_heizung']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='alternative_warmwasser']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='alternative_lueftung']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='alternative_kuehlung']").check();
+
+		// // Gebäudetyp
+		// cy.get("select[name='gebaeudetyp']").then(($dropdown) => {
+		// 	const options = $dropdown.find('option');
+		// 	// Select the option at the random index
+		// 	cy.get("select[name='gebaeudetyp']").select(options.eq(faker.number.int({ min: 1, max: options.length - 1 })).val() as string);
+		// });
+
+		// // Gebäudeteil
+		// cy.get("select[name='gebaeudeteil']").then(($dropdown) => {
+		// 	const options = $dropdown.find('option');
+		// 	// Select the option at the random index
+		// 	cy.get("select[name='gebaeudeteil']").select(options.eq(faker.number.int({ min: 1, max: options.length - 1 })).val() as string);
+		// });
+
+		// // Lüftung
+		// cy.get("select[name='lueftung']").then(($dropdown) => {
+		// 	const options = $dropdown.find('option');
+		// 	// Select the option at the random index
+		// 	cy.get("select[name='lueftung']").select(options.eq(faker.number.int({ min: 1, max: options.length - 1 })).val() as string);
+		// });
+
+		// // Kühlung
+		// cy.get("select[name='kuehlung']").then(($dropdown) => {
+		// 	const options = $dropdown.find('option');
+		// 	// Select the option at the random index
+		// 	cy.get("select[name='kuehlung']").select(options.eq(faker.number.int({ min: 1, max: options.length - 1 })).val() as string);
+		// });
+
+		// // Leerstand
+		// cy.get("input[name='leerstand']").should("have.attr", "type", "number").type(faker.number.int({ min: 0, max: 30 }).toString());
+
+		// // Heizungsanlage Daten
+		// if (Math.random() > 0.5) cy.get("input[name='zentralheizung']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='einzelofen']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='durchlauf_erhitzer']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='standard_kessel']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='solarsystem_warmwasser']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='waermepumpe']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='niedertemperatur_kessel']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='brennwert_kessel']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='warmwasser_rohre_gedaemmt']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='heizungsrohre_gedaemmt']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='zirkulation']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='raum_temperatur_regler']").check();
+
+		// // Heizungsanlage Bilder
+		// cy.get("input[name='heizung_image']").should("have.attr", "type", "file").attachFile("images/heizungsanlage/1.jpeg", { subjectType: "input" });
+		// cy.get("input[name='heizung_image']").should("have.attr", "type", "file").attachFile("images/heizungsanlage/2.jpeg", { subjectType: "input" });
+
+		// // Fenster Daten
+		// if (Math.random() > 0.5) cy.get("input[name='einfach_verglasung']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='doppel_verglasung']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='isolier_verglasung']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='dreifach_verglasung']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='fenster_dicht']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='fenster_teilweise_undicht']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='tueren_dicht']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='tueren_undicht']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='rolllaeden_kaesten_gedaemmt']").check();
+
+		// // Fenster Bilder
+		// cy.get("input[name='fenster_image']").should("have.attr", "type", "file").attachFile("images/fenster/1.jpeg", { subjectType: "input" });
+		// cy.get("input[name='fenster_image']").should("have.attr", "type", "file").attachFile("images/fenster/2.jpeg", { subjectType: "input" });
+
+		// // Wärmedämmung Daten
+		// if (Math.random() > 0.5) cy.get("input[name='aussenwand_gedaemmt']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='keller_wand_gedaemmt']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='keller_decke_gedaemmt']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='dachgeschoss_gedaemmt']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='oberste_geschossdecke_gedaemmt']").check();
+		// if (Math.random() > 0.5) cy.get("input[name='oberste_geschossdecke_min_12cm_gedaemmt']").check();
+
+		// // Wärmedämmung Bilder
+		// cy.get("input[name='daemmung_image']").should("have.attr", "type", "file").attachFile("images/daemmung/1.jpeg", { subjectType: "input" });
+		// cy.get("input[name='daemmung_image']").should("have.attr", "type", "file").attachFile("images/daemmung/2.jpeg", { subjectType: "input" });
+
+		// // Gebäude Bild
+		// cy.get("input[name='gebaeude_image']").should("have.attr", "type", "file").attachFile("images/gebaeude/1.jpeg", { subjectType: "input" });
+
+		// // Jetzt können wir den Verbrauchsausweis erstellen.
+		// cy.get("form[name='ausweis'] button[type='submit']").click({ force: true });
+
+		// // Wir sind nicht eingeloggt also sollte jetzt ein Login Screen erscheinen.
+		// // Wir klicken auf registrieren und erstellen einen neuen Benutzer, danach loggen wir uns mit diesem ein.
+		// cy.get("button[name='registrieren']").click();
+
+		// const email = faker.internet.email();
+		// const passwort = "test1234";
+		// const vorname = faker.person.firstName();
+		// const nachname = faker.person.lastName();
+
+		// cy.get("form[name='signup'] input[name='email']").should("be.visible").should("have.attr", "type", "email").type(email);
+		// cy.get("form[name='signup'] input[name='passwort']").should("be.visible").should("have.attr", "type", "password").type(passwort);
+		// cy.get("form[name='signup'] input[name='vorname']").should("be.visible").should("have.attr", "type", "text").type(vorname);
+		// cy.get("form[name='signup'] input[name='nachname']").should("be.visible").should("have.attr", "type", "text").type(nachname);
+
+		// cy.get("form[name='signup'] button[type='submit']").click();
+
+		// // Wir sind jetzt registriert und können uns nun einloggen.
+		// // Die Email sollte automatisch eingetragen sein, da wir uns gerade registriert haben.
+		// cy.get("form[name='login'] input[name='email']").should("be.visible").should("have.attr", "type", "email").should("contain.value", email);
+		// cy.get("form[name='login'] input[name='passwort']").should("be.visible").should("have.attr", "type", "password").type(passwort);
+
+		// cy.get("form[name='login'] button[type='submit']").click();
+
+		// // Der Ausweis sollte jetzt schon erstellt worden sein und wir sollten auf die kundendaten seite weitergeleitet worden sein.
+		// cy.url().should("contain", "/kundendaten");
+
+		// cy.wait(1000)
+
+		// // Wir füllen jetzt die Kundendaten aus.
+		// cy.get("select[name='anrede']").select(Math.random() > 0.5 ? "Herr" : "Frau");
+		// cy.get("input[name='vorname']").should("contain.value", vorname);
+		// cy.get("input[name='name']").should("contain.value", nachname);
+		// cy.get("input[name='email']").should("contain.value", email);
+		// cy.get("input[name='telefon']").type(faker.phone.number());
+		
+		// cy.get("input[name='rechnung_empfaenger']").type(`${vorname} ${nachname}`);
+		// cy.get("input[name='rechnung_strasse']").type(faker.location.streetAddress());
+		// // TODO: Random Plz generieren, allerdings muss die auch in der Datenbank vorhanden sein...
+		// cy.get("input[name='rechnung_plz']").type("2103");
+		// // Jetzt sollte der PLZ Container erscheinen, dort klicken wir einfach das erste Element an.
+		// cy.get("div[data-test='plz-container']").children().first().click();
+		// cy.get("input[name='rechnung_telefon']").type(faker.phone.number());
+		// cy.get("input[name='rechnung_email']").type(faker.internet.email());
+		// cy.get("button[data-test='paypal']").click();
+
+		// // Datenschutz und AGB akzeptieren, dann schicken wir das Formular ab.
+		// cy.get("input[name='agb-akzeptieren']").check()
+		// cy.get("input[name='datenschutz-akzeptieren']").check()
+		// cy.get("button[type='submit']").click();
+
+		// cy.origin('https://www.mollie.com', () => {
+		// 	// Jetzt sind wir auf der Mollie Seite, dort wählen wir den "paid" status aus
+		// 	cy.get("input[type='radio'][name='final_state'][value='paid']").check();
+		// 	// Da wird unser Test fehlschlagen, da die localhost domain von Mollie aus nicht erreichbar ist.
+		// })
+	});	
+});

src/cypress/e2e/auth/index.cy.ts

@@ -1,4 +1,4 @@
-import { API_ACCESS_TOKEN_COOKIE_NAME, API_REFRESH_TOKEN_COOKIE_NAME } from "#lib/constants";
+import { API_ACCESS_TOKEN_COOKIE_NAME, API_REFRESH_TOKEN_COOKIE_NAME } from "#lib/constants.js";
 import {faker} from "@faker-js/faker";
 
 describe('Benutzer Authentifizierung', () => {
@@ -11,6 +11,8 @@ describe('Benutzer Authentifizierung', () => {
 	it("erstellt einen Nutzer und leitet auf die Login Seite weiter", () => {
 		cy.visit("/auth/signup")
 
+		cy.wait(1000)
+
 		cy.get('input[name="email"]').type(email)
 		cy.get('input[name="passwort"]').type(password)
 		cy.get('input[name="vorname"]').type(name)
@@ -24,12 +26,14 @@ describe('Benutzer Authentifizierung', () => {
 	it("meldet einen Nutzer an und leitet auf die Startseite weiter", () => {
 		cy.visit("/auth/login")
 
+		cy.wait(1000)
+
 		cy.get('input[name="email"]').type(email)
 		cy.get('input[name="passwort"]').type(password)
 
 		cy.get('button[type="submit"]').click()
 
-		cy.url().should("include", "/user")
+		cy.url().should("include", "/dashboard")
 
 		// Wir sollten nun einen Access Token und Refresh Token in unseren Cookies sehen.
 		cy.getCookie(API_ACCESS_TOKEN_COOKIE_NAME).should("exist")

src/cypress/support/component.ts

@@ -14,7 +14,7 @@
 // ***********************************************************
 
 // Import commands.js using ES2015 syntax:
-import './commands'
+import './commands.js'
 
 // Alternatively you can use CommonJS syntax:
 // require('./commands')

src/env.d.ts

@@ -1,4 +1,12 @@
 /// <reference path="../.astro/types.d.ts" />
 /// <reference types="astro/client" />
+/// <reference types="../.astro/astro-typesafe-api.d.ts" />
+
 
 /// <reference path="../.astro-i18n/generated.d.ts" />
+/// <reference path="../.astro/astro-typesafe-api.d.ts" />
+
+
+declare module "*.csv" {
+	export default <{ [key: string]: any }>Array;
+} 

src/layouts/AusweisLayoutDaten.astro

@@ -2,9 +2,9 @@
 import "../style/global.css";
 import "../style/formular.css";
 import "../../svelte-dialogs.config"
-import Header from "#header/AusweisHeader.astro";
-import Footer from "#footer/Footer.astro";
-import SidebarLeft from "#sidebarLeft/SidebarLeft.astro";
+import Header from "#components/design/header/AusweisHeader.astro";
+import Footer from "#components/design/footer/Footer.astro";
+import SidebarLeft from "#components/design/sidebars/SidebarLeft.astro";
 import { NotificationWrapper } from "@ibcornelsen/ui";
 
 export interface Props {

src/layouts/AusweisLayoutPruefung.astro

@@ -2,9 +2,9 @@
 import "../style/global.css";
 import "../style/formular.css";
 import "../../svelte-dialogs.config"
-import Header from "#header/AusweisHeader.astro";
-import Footer from "#footer/Footer.astro";
-import SidebarLeft from "#sidebarLeft/SidebarLeft.astro";
+import Header from "#components/design/header/AusweisHeader.astro";
+import Footer from "#components/design/footer/Footer.astro";
+import SidebarLeft from "#components/design/sidebars/SidebarLeft.astro";
 import { NotificationWrapper } from "@ibcornelsen/ui";
 
 export interface Props {

src/layouts/BlankLayout.astro

@@ -1,7 +1,5 @@
 ---
-import i18next from "i18next";
 
-import "../style/global.scss";
 import { NotificationWrapper } from "@ibcornelsen/ui";
 
 export interface Props {
@@ -37,7 +35,7 @@ const schema = JSON.stringify({
 ---
 
 <!DOCTYPE html>
-<html lang={i18next.language}>
+<html lang="de">
 	<head>
 		<meta charset="UTF-8" />
 		<meta name="viewport" content="width=device-width" />

src/layouts/Layout.astro

@@ -1,10 +1,10 @@
 ---
 import "../style/global.css";
 import "../../svelte-dialogs.config"
-import Header from "#header/Header.astro";
-import Footer from "#footer/Footer.astro";
-import SidebarLeft from "#sidebarLeft/SidebarLeft.astro";
-import SidebarRight from "#sidebarRight/SidebarRight.astro";
+import Header from "#components/design/header/Header.astro";
+import Footer from "#components/design/footer/Footer.astro";
+import SidebarLeft from "#components/design/sidebars/SidebarLeft.astro";
+import SidebarRight from "#components/design/sidebars/SidebarRight.astro";
 import { NotificationWrapper } from "@ibcornelsen/ui";
 
 export interface Props {

src/layouts/Layout_1.astro

@@ -1,63 +0,0 @@
----
-import "../style/global.css";
-import "../../svelte-dialogs.config"
-import Header from "#header/Header_1.astro";
-import Footer from "#footer/Footer.astro";
-import SidebarLeft from "#sidebarLeft/SidebarLeft.astro";
-import SidebarRight from "#sidebarRight/SidebarRight_1.astro";
-import { NotificationWrapper } from "@ibcornelsen/ui";
-
-export interface Props {
-	title: string;
-}
-
-const { title } = Astro.props;
-
----
-
-<!DOCTYPE html>
-<html lang="de">
-	<head>
-		<meta charset="UTF-8" />
-		<meta name="viewport" content="width=device-width" />
-		<link rel="icon" type="image/svg+xml" href="/favicon.jpg" />
-		<meta
-			name="description"
-			content="✅ Jetzt Ihren Energieausweis online erstellen. Erhalten Sie Ihren online Energieausweis rechtssicher und nach aktueller GEG (vormals EnEV) vom Diplom Ingenieur geprüft."
-		/>
-		<title>
-			{title || "Energieausweis online erstellen - Online Energieausweis"}
-		</title>
-	</head>
-
-	<body>
-	<container class="w-full max-w-[1920px]">
-		
-		<Header />
-
-		<main
-			class="w-full p-0 grid
-			sm:grid-cols-[minmax(1fr,1fr)] sm:gap-1 sm:px-0 
-			md:grid-cols-[minmax(1fr,1fr)] md:gap-2 md:px-0
-			lg:grid-cols-[minmax(250px,250px)1fr] lg:gap-3 lg:p-3
-			xl:grid-cols-[minmax(350px,350px)1fr] xl:gap-4 xl:p-4
-			2xl:grid-cols-[minmax(350px,350px)1fr_minmax(350px,350px)] 2xl:gap-5 2xl:p-5
-		">
-
-		<SidebarLeft />
-		
-		<article class="box grow rounded-tl-none">
-		<slot />
-		</article>
-		
-		<SidebarRight />
-
-		</main>
-	
-		<Footer />
-		<NotificationWrapper client:load />
-	</container>
-	</body>
-</html>
-
-

src/layouts/MinimalLayout.astro

@@ -1,5 +1,4 @@
 ---
-import i18next from "i18next";
 
 import "#style/global.css";
 import "../../svelte-dialogs.config"
@@ -42,7 +41,7 @@ const lightTheme = Astro.cookies.get("theme")?.value === "light";
 ---
 
 <!DOCTYPE html>
-<html lang={i18next.language}>
+<html lang="de">
 	<head>
 		<meta charset="UTF-8" />
 		<meta name="viewport" content="width=device-width" />

src/layouts/ORG_Layout.astro

@@ -1,154 +0,0 @@
----
-import i18next from "i18next";
-
-import "../style/UMBE_global.css";
-import "#style/global.css";
-import "../../svelte-dialogs.config"
-import Footer from "../components/Footer.astro";
-import Header from "../components/Header.astro";
-import SidebarLeft from "../components/SidebarLeft.astro";
-import SidebarRight from "../components/SidebarRight.astro";
-import { NotificationWrapper } from "@ibcornelsen/ui";
-import TicketPopup from "../components/Tickets/TicketButton.svelte"
-
-export interface Props {
-	title: string;
-}
-
-const { title } = Astro.props;
-
-const schema = JSON.stringify({
-	"@context": "http://schema.org",
-	"@type": "Corporation",
-	name: "IB Cornelsen",
-	alternateName: "online-energieausweis.org",
-	url: "https://online-energieausweis.org",
-	logo: "https://online-energieausweis.org/ib-cornelsen.png",
-	address: {
-		"@type": "PostalAddress",
-		streetAddress: "Katendeich 5A",
-		addressLocality: "Hamburg",
-		postalCode: "21035",
-		addressCountry: "Deutschland",
-		email: "info@online-energieausweis.org",
-	},
-	contactPoint: {
-		"@type": "ContactPoint",
-		telephone: "+49-040-209339850",
-		faxNumber: "+49-040-209339859",
-		contactType: "customer service",
-		areaServed: "DE",
-		availableLanguage: "German",
-	},
-});
----
-
-<!DOCTYPE html>
-<html lang={i18next.language}>
-	<head>
-		<meta charset="UTF-8" />
-		<meta name="viewport" content="width=device-width" />
-		<script type="application/ld+json" set:html={schema}></script>
-		<link rel="icon" type="image/svg+xml" href="/favicon.jpg" />
-
-		<meta
-			name="description"
-			content="✅ Jetzt Ihren Energieausweis online erstellen. Erhalten Sie Ihren online Energieausweis rechtssicher und nach aktueller GEG (vormals EnEV) vom Diplom Ingenieur geprüft."
-		/>
-		<link rel="canonical" href="https://online-energieausweis.org/" />
-
-		<meta property="og:locale" content="de_DE" />
-		<meta property="og:type" content="website" />
-		<meta
-			property="og:title"
-			content="Energieausweis online erstellen - Online Energieausweis"
-		/>
-		<meta
-			property="og:description"
-			content="✅ Jetzt Ihren Energieausweis online erstellen. Erhalten Sie Ihren online Energieausweis rechtssicher und nach aktueller GEG (vormals EnEV) vom Diplom Ingenieur geprüft."
-		/>
-		<meta property="og:url" content="https://online-energieausweis.org/" />
-		<meta
-			property="og:site_name"
-			content="Energieausweis online erstellen"
-		/>
-
-		<meta name="twitter:card" content="summary_large_image" />
-		<meta
-			name="twitter:description"
-			content="✅ Jetzt Ihren Energieausweis online erstellen. Erhalten Sie Ihren online Energieausweis rechtssicher und nach aktueller GEG (vormals EnEV) vom Diplom Ingenieur geprüft."
-		/>
-		<meta
-			name="twitter:title"
-			content="Energieausweis online erstellen - Online Energieausweis"
-		/>
-		<meta
-			name="twitter:image"
-			content="https://online-energieausweis.org/images/energieausweis-online-erstellen.jpg"
-		/>
-		<title>
-			{title || "Energieausweis online erstellen - Online Energieausweis"}
-		</title>
-	</head>
-
-	<body>
-		<Header />
-		<main
-			class="lg:grid gap-6 md:p-6 lg:grid-cols-[2fr,6fr,2fr] max-w-[1920px] w-full bg-base-100"
-		>
-			<SidebarLeft />
-			<article class="w-full max-w-full bg-base-200 border border-base-300">
-				<slot />
-			</article>
-			<div class="hidden lg:block">
-				<SidebarRight />
-			<div>
-		</main>
-		<Footer />
-		<NotificationWrapper client:load />
-		<TicketPopup client:load />
-	</body>
-</html>
-
-<style is:global lang="scss">
-
-	:root {
-		@apply bg-base-100 text-base-content;
-	}
-
-	article {
-		@apply rounded-lg w-full shadow-md border;
-	}
-
-	.mainContent {
-		p, h1, h2, h3, h4, h5, h6 {
-			@apply text-base-content;
-		}
-	}
-
-	body {
-		min-height: 100vh;
-	}
-
-	.button {
-		@apply px-8 py-2 bg-secondary rounded-lg text-white font-medium hover:shadow-lg transition-all hover:underline active:bg-blue-900 text-center cursor-pointer;
-		color: #fff !important;
-	}
-
-	h3 {
-		@apply text-xl font-medium mt-6 mb-4;
-	}
-
-	input {
-		@apply py-1.5 px-4 w-full rounded-lg outline-none text-lg text-slate-700 border bg-gray-50 transition-colors;
-	}
-
-	input:hover,
-	input:focus {
-		@apply bg-gray-100;
-	}
-
-	label {
-		@apply text-base font-semibold;
-	}
-</style>

src/layouts/UserLayout.astro

@@ -1,5 +1,4 @@
 ---
-import i18next from "i18next";
 
 import "#style/global.css";
 import "../../svelte-dialogs.config"
@@ -54,7 +53,7 @@ let lightTheme = Astro.cookies.get("theme")?.value === "light";
 ---
 
 <!DOCTYPE html>
-<html lang={i18next.language}>
+<html lang="de">
 	<head>
 		<meta charset="UTF-8" />
 		<meta name="viewport" content="width=device-width" />

src/layouts/WidgetLayout_1.astro

@@ -1,23 +0,0 @@
----
-
----
-
-<!DOCTYPE html>
-<html lang="de">
-	<head>
-		<meta charset="UTF-8" />
-		<meta name="viewport" content="width=device-width" />
-		<link rel="icon" type="image/svg+xml" href="/favicon.jpg" />
-		<meta
-			name="description"
-			content="IB Cornelsen - Widget"
-		/>
-		<title>
-			IB Cornelsen - Widget
-		</title>
-	</head>
-
-	<body>
-		<slot />
-	</body>
-</html>

src/layouts/cadLayout.astro

@@ -1,10 +1,10 @@
 ---
 import "../style/global.css";
 import "../../svelte-dialogs.config"
-import Header from "#header/Header.astro";
-import Footer from "#footer/Footer.astro";
-import SidebarLeft from "#sidebarLeft/SidebarLeft.astro";
-import SidebarRight from "#sidebarRight/SidebarRight.astro";
+import Header from "#components/design/header/Header.astro";
+import Footer from "#components/design/footer/Footer.astro";
+import SidebarLeft from "#components/design/sidebars/SidebarLeft.astro";
+import SidebarRight from "#components/design/sidebars/SidebarRight.astro";
 import { NotificationWrapper } from "@ibcornelsen/ui";
 
 export interface Props {

src/lib/APIResponse.ts

@@ -1,38 +0,0 @@
-import type { ZodError } from "zod";
-
-export function success(data: any = {}) {
-	return new Response(JSON.stringify({
-		success: true,
-		data
-	}))
-}
-
-export function error(errors: any[]) {
-	return new Response(JSON.stringify({
-		success: false,
-		errors
-	}))
-}
-
-export function MissingPropertyError(properties: string[]) {
-	return error(properties.map(property => {
-		return `Missing property '${property}' in request body.`
-	}));
-}
-
-/**
- * Signalisiert ein fehlendes Objekt und gibt den Fehler als HTTP Response zurück.
- * @param name Der Name der Entität, die nicht gefunden werden konnte.
- * @returns {Response} HTTP Response Objekt
- */
-export function MissingEntityError(name: string): Response {
-	return error([`Missing entity, ${name} does not exist.`])
-}
-
-export function ActionFailedError(): Response {
-	return error(["Failed executing action, error encountered."]);
-}
-
-export function InvalidDataError(err: ZodError): Response {
-	return error(err.issues);
-}

src/lib/AusweisData.ts

@@ -10,7 +10,7 @@ export function convertAusweisData(
 	let pdfInputs: z.infer<typeof verbrauchsausweisWohnenPDFValidator> = {
 		...inputs,
 		pdf: {
-			"brennstoff": [inputs.gebaeude_aufnahme_allgemein?.brennstoff_1, inputs.gebaeude_aufnahme_allgemein?.brennstoff_2].filter(x => x).join(", ")
+			"brennstoff": [inputs.aufnahme?.brennstoff_1, inputs.aufnahme?.brennstoff_2].filter(x => x).join(", ")
 		}
 	}
 	let result = recursiveFlatten(inputs, "");

src/lib/Berechnungen/BedarfsausweisWohnen/A9BerechnungNutzenergiebedarfTrinkwarmwasser.ts

@@ -24,7 +24,9 @@ export function A9BerechnungNutzenergiebedarfTrinkwarmwasser(ausweis: Bedarfsaus
 
 	if (flaecheProEinheit < 10) {
 		flaechenBezogenerWaermebedarf =  16.5
-	} else if (flaecheProEinheit < 160) {
+	} else if (flaecheProEinheit >= 160) {
+		flaechenBezogenerWaermebedarf = 8.5
+	} else {
 		flaechenBezogenerWaermebedarf = linearInterpolation([{
 			x: 10,
 			y: 16
@@ -32,9 +34,6 @@ export function A9BerechnungNutzenergiebedarfTrinkwarmwasser(ausweis: Bedarfsaus
 			x: 150,
 			y: 9
 		}], flaecheProEinheit)
-		
-	} else {
-		flaechenBezogenerWaermebedarf = 8.5
 	}
 
 	// Q_w,b