IBCornelsen/online-energieausweis
1
0
Fork 0
Code Issues 272 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

Bugfixes und Verbesserungen

Browse Source 
Fast alle gelisteten Probleme in https://trello.com/c/GKZotNZV werden hiermit behoben.
This commit is contained in:
Moritz Utcke
2024-03-12 12:20:18 +07:00
parent 80d62ffdc2
commit 39f4435386
8 changed files with 106 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/Ausweis/AusweisPreviewContainer.svelte
View File

@@ -13,10 +13,8 @@
VerbrauchsausweisWohnenClient,
} from "./types";
export let ausweis:
| VerbrauchsausweisWohnenClient;
export let ausweis: VerbrauchsausweisWohnenClient;
export let gebaeude: GebaeudeClient;
export let images: UploadedGebaeudeBild[] = [];
</script>

11
src/components/Ausweis/BilderZusatzsysteme.svelte
View File

@@ -5,10 +5,6 @@
import DaemmungImage from "./DaemmungImage.svelte";
import FensterImage from "./FensterImage.svelte";
import Label from "../Label.svelte";
import type {
BedarfsausweisWohnen,
VerbrauchsausweisGewerbe,
} from "@ibcornelsen/database/client";
import {
GebaeudeAufnahmeClient,
GebaeudeClient,
@@ -18,10 +14,7 @@
export let gebaeude: GebaeudeClient;
export let gebaeude_aufnahme_allgemein: GebaeudeAufnahmeClient;
export let ausweis:
| VerbrauchsausweisWohnenClient
| VerbrauchsausweisGewerbe
| BedarfsausweisWohnen;
export let ausweis: VerbrauchsausweisWohnenClient
export let images: UploadedGebaeudeBild[];
</script>
@@ -388,4 +381,4 @@
als PDF anschauen</Label
>
<AusweisPreviewContainer {ausweis} {gebaeude} />
<AusweisPreviewContainer bind:images bind:ausweis bind:gebaeude />

77
src/components/Ausweis/PerformanceScore.svelte
View File

@@ -1,17 +1,31 @@
<script lang="ts">
import { endEnergieVerbrauchVerbrauchsausweis_2016 } from "#lib/Berechnungen/VerbrauchsausweisWohnen/VerbrauchsausweisWohnen_2016";
import ThickArrowDown from "radix-svelte-icons/src/lib/icons/ThickArrowDown.svelte";
import { BedarfsausweisWohnenClient, GebaeudeAufnahmeClient, GebaeudeClient, VerbrauchsausweisGewerbeClient, VerbrauchsausweisWohnenClient } from "./types";
import {
BedarfsausweisWohnenClient,
GebaeudeAufnahmeClient,
GebaeudeClient,
VerbrauchsausweisGewerbeClient,
VerbrauchsausweisWohnenClient,
} from "./types";
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;
let maxPerformance = 250;
/**
* We use linear interpolation to scale the value between the given boundaries.
*/
function centerValueBetweenBoundaries(value: number, newMinimum: number, newMaximum: number, oldMinimum: number = 0, oldMaximum: number = 100): number {
*/
function centerValueBetweenBoundaries(
value: number,
newMinimum: number,
newMaximum: number,
oldMinimum: number = 0,
oldMaximum: number = 100
): number {
// Calculate the center point of the current range
const center = (oldMinimum + oldMaximum) / 2;
@@ -31,33 +45,62 @@
const scaledValue = shiftedValue * scalingFactor;
// Shift the scaled value back to the center of the new range
const centeredValue = scaledValue + ((newMaximum + newMinimum) / 2);
const centeredValue = scaledValue + (newMaximum + newMinimum) / 2;
return centeredValue;
}
let translation_1 = 0;
let translation_2 = 0;
$: {
(async () => {
const result = (await endEnergieVerbrauchVerbrauchsausweis_2016(ausweis));
const result = await endEnergieVerbrauchVerbrauchsausweis_2016({
...ausweis,
gebaeude_aufnahme_allgemein: {
...gebaeude_aufnahme_allgemein,
gebaeude_stammdaten: gebaeude,
},
});
console.log(result, ausweis);
if (!result) {
return
return;
}
//const primaerEnergieVerbrauch = (await ausweis.primaerEnergieBedarf);
translation_1 = Math.max(0, Math.min(100, result.endEnergieVerbrauchGesamt / maxPerformance * 100))
//translation_2 = Math.max(0, Math.min(100, primaerEnergieVerbrauch / maxPerformance * 100))
})()
translation_1 = Math.max(
0,
Math.min(
100,
(result.endEnergieVerbrauchGesamt / maxPerformance) * 100
)
);
translation_2 = Math.max(0, Math.min(100, result.primaerEnergieVerbrauchGesamt / maxPerformance * 100))
})();
}
</script>
<div class="w-full rounded-lg border-[#ffcc03] border-2 relative p-2">
<img src="/images/SKALA-910.png" alt="Energieeffizienz Skala">
<ThickArrowDown size={28} class="fill-base-content absolute top-1 transition-left duration-1000 ease-in-out"
style="left: {translation_1}%; transform: translateX({centerValueBetweenBoundaries(translation_1, 50, -150, 0, 100)}%)" />
<ThickArrowUp size={28} class="fill-base-content absolute bottom-1 transition-left duration-1000 ease-in-out"
style="left: {translation_2}%; transform: translateX({centerValueBetweenBoundaries(translation_2, 50, -150, 0, 100)}%)" />
<img src="/images/SKALA-910.png" alt="Energieeffizienz Skala" />
<ThickArrowDown
size={28}
class="fill-base-content absolute top-1 transition-left duration-1000 ease-in-out"
style="left: {translation_1}%; transform: translateX({centerValueBetweenBoundaries(
translation_1,
50,
-150,
0,
100
)}%)"
/>
<ThickArrowUp
size={28}
class="fill-base-content absolute bottom-1 transition-left duration-1000 ease-in-out"
style="left: {translation_2}%; transform: translateX({centerValueBetweenBoundaries(
translation_2,
50,
-150,
0,
100
)}%)"
/>
</div>

14
src/components/Ausweis/Verbrauch.svelte
View File

@@ -4,7 +4,6 @@
import Label from "../Label.svelte";
import fuelList from "./brennstoffListe";
import { auditVerbrauchAbweichung } from "../Verbrauchsausweis/audits/VerbrauchAbweichung";
import type { VerbrauchsausweisGewerbe } from "@ibcornelsen/database/client";
import { GebaeudeAufnahmeClient, GebaeudeClient, VerbrauchsausweisWohnenClient } from "./types";
// Wir dürfen bis zu 4.5 Jahre alte Klimafaktoren benutzen, also nehmen wir alle Monate seitdem und generieren daraus die Auswahl.
@@ -43,7 +42,7 @@
export let gebaeude: GebaeudeClient;
export let gebaeude_aufnahme_allgemein: GebaeudeAufnahmeClient;
export let ausweis: VerbrauchsausweisWohnenClient | VerbrauchsausweisGewerbe;
export let ausweis: VerbrauchsausweisWohnenClient;
const fuelMap: Record<string, string[]> = {};
for (const fuel of fuelList) {
@@ -53,8 +52,8 @@
}
let month = ausweis.startdatum?.getMonth() || moment().month();
let year = ausweis.startdatum?.getFullYear() || moment().subtract(3, "years").year();
let month = ausweis.startdatum?.getMonth() || null;
let year = ausweis.startdatum?.getFullYear() || null;
$: {
if (typeof month === "number" && typeof year === "number") {
@@ -192,8 +191,11 @@
<option value={date.month}>{monthNames[date.month]}</option>
{/each}
{:else}
{#each availableDates as date}
<option value={date.month}>{monthNames[date.month]}</option>
{#each Array.from(availableDates.reduce((a,c) => {
a.add(c.month);
return a;
}, new Set())) as month}
<option value={month}>{monthNames[month]}</option>
{/each}
{/if}
</select>

2
src/components/Ausweis/types.ts
View File

@@ -4,7 +4,7 @@ import { inferProcedureInput, inferProcedureOutput } from "@trpc/server";
export type UploadedGebaeudeBild = inferProcedureOutput<
AppRouter["v1"]["verbrauchsausweisWohnen"]["get"]
>["gebaeude_aufnahme_allgemein"]["gebaeude_stammdaten"]["gebaeude_bilder"][0];
>["gebaeude_aufnahme_allgemein"]["gebaeude_stammdaten"]["gebaeude_bilder"][0] & { base64?: string };
/**

2
src/components/ImageGrid.svelte
View File

@@ -21,7 +21,7 @@
{#if image.kategorie == kategorie}
<div class="relative group">
<img
src={image.base64 ? image.base64 : `"/bilder/${image.uid}.webp"`}
src={image.base64 ? image.base64 : `/bilder/${image.uid}.webp`}
alt={kategorie}
class="h-full rounded-lg border-2 group-hover:contrast-50 object-cover transition-all"
/>

6
src/modules/Ausweise/VerbrauchsausweisWohnenModule.svelte
View File

@@ -102,7 +102,7 @@
<Progressbar progress={0} />
</div>
<PerformanceScore bind:ausweis />
<PerformanceScore bind:ausweis bind:gebaeude_aufnahme_allgemein bind:gebaeude />
</div>
<form on:submit={ausweisAbschicken} name="ausweis" data-test="ausweis">
@@ -384,7 +384,7 @@
Bitte wählen Sie hier den Gebäudetyp aus.
</HelpLabel>
<div>
<select name="gebaeudetyp" data-test="gebaeudetyp" required>
<select name="gebaeudetyp" data-test="gebaeudetyp" bind:value={gebaeude_aufnahme_allgemein.gebaeudetyp} required>
<option disabled>Bitte auswählen</option>
<option value="Einfamilienhaus">Einfamilienhaus</option>
<option value="Freistehendes Einfamilienhaus"
@@ -423,7 +423,7 @@
'Gewerbe'.
</HelpLabel>
<div>
<select name="gebaeudeteil" data-test="gebaeudeteil" required>
<select name="gebaeudeteil" data-test="gebaeudeteil" bind:value={gebaeude_aufnahme_allgemein.gebaeudeteil} required>
<option disabled>Bitte auswählen</option>
<option value="Gesamtgebäude">Gesamtgebäude</option>
<option value="Wohnen">Wohnen</option>

46
src/modules/KaufabschlussModule.svelte
View File

@@ -2,11 +2,7 @@
import ZipSearch from "../components/PlzSuche.svelte";
import Label from "../components/Label.svelte";
import type {
BedarfsausweisWohnen,
Benutzer,
Bezahlmethoden,
VerbrauchsausweisGewerbe,
VerbrauchsausweisWohnen,
} from "@ibcornelsen/database/client";
import { Enums } from "@ibcornelsen/database/client";
import PaymentOption from "#components/PaymentOption.svelte";
@@ -15,6 +11,7 @@
import type { AppRouter } from "@ibcornelsen/api";
import CheckoutItem from "#components/CheckoutItem.svelte";
import { BenutzerClient, VerbrauchsausweisWohnenClient } from "#components/Ausweis/types";
import { PRICES } from "#lib/constants";
export let user: BenutzerClient;
export let ausweis:
@@ -22,7 +19,18 @@
// TODO: überarbeiten und zu inferProcedureOutput machen
let rechnung: inferProcedureInput<
AppRouter["v1"]["rechnungen"]["erstellen"]
> = {};
> = {
email: user.email,
empfaenger: user.vorname + " " + user.name,
strasse: user.adresse,
plz: user.plz,
ort: user.ort,
versand_empfaenger: user.vorname + " " + user.name,
versand_strasse: user.adresse,
versand_plz: user.plz,
versand_ort: user.ort,
telefon: user.telefon,
};
let services = [
{
@@ -54,15 +62,12 @@
export let selectedPaymentType: Bezahlmethoden =
Enums.Bezahlmethoden.paypal;
let agbAkzeptiert: boolean;
let datenschutzAkzeptiert: boolean;
async function createPayment(e: SubmitEvent) {
e.preventDefault();
const response = await client.v1.rechnungen.erstellen.mutate({
...rechnung,
ausweisart: ausweis.gebaeude_aufnahme_allgemein.ausweisart,
ausweisart: Enums.Ausweisart.VerbrauchsausweisWohnen,
uid: ausweis.uid,
bezahlmethode: selectedPaymentType,
services: services
@@ -72,9 +77,16 @@
window.location.href = response.checkout_url;
}
const priceTotal = services.reduce((acc, service) => {
if (service.selected) {
return acc + service.price;
}
return acc;
}, 0) + PRICES[Enums.Ausweisart.VerbrauchsausweisWohnen][0];
</script>
<div class="grid grid-cols-[2fr_1fr] gap-4 h-full">
<form class="grid grid-cols-[2fr_1fr] gap-4 h-full" on:submit={createPayment}>
<div>
<h3 class="font-semibold">Ansprechpartner</h3>
<div class="rounded-lg border p-4 border-base-300 bg-base-100">
@@ -348,23 +360,23 @@
<div class="mt-auto">
<hr />
<div class="flex flex-row items-center justify-between">
<span class="opacity-75 text-sm">Brutto</span>
<span class="font-semibold text-sm">45€</span>
<span class="opacity-75 text-sm">Netto</span>
<span class="font-semibold text-sm">{priceTotal * 0.81}€</span>
</div>
<div class="flex flex-row items-center justify-between">
<span class="opacity-75 text-sm">Netto</span>
<span class="font-semibold text-sm">45€</span>
<span class="opacity-75 text-sm">19% MwSt</span>
<span class="font-semibold text-sm">{priceTotal * 0.19}€</span>
</div>
<hr />
<div class="flex flex-row items-center justify-between">
<span class="opacity-75 text-sm">Gesamt</span>
<span class="font-semibold text-sm">45€</span>
<span class="font-semibold text-sm">{priceTotal}€</span>
</div>
<p class="mt-8">Mit dem Klick auf "Bestellung Bestätigen" akzeptieren sie unsere <a href="/agb">AGB</a> und <a href="/impressum">Datenschutzbestimmungen</a>. Sie werden zu ihrem ausgewählten Bezahlprovider weitergeleitet, nach Bezahlung werden sie automatisch zu unserem Portal zurückgeleitet.</p>
<button class="btn btn-secondary w-full mt-4" disabled
<button class="btn btn-secondary w-full mt-4"
>Bestellung Bestätigen</button
>
</div>
</div>
</div>
</div>
</form>