302 lines
7.9 KiB
Svelte
302 lines
7.9 KiB
Svelte
<script lang="ts">
|
|
import ProgressBar from "#components/Ausweis/Progressbar.svelte";
|
|
import type { Bezahlmethoden } from "@ibcornelsen/database/client";
|
|
import { Enums } from "@ibcornelsen/database/client";
|
|
import { dialogs } from "svelte-dialogs";
|
|
import LoginDialog from "#components/LoginDialog.svelte";
|
|
import { PRICES } from "#lib/constants.js";
|
|
import {
|
|
BenutzerClient,
|
|
VerbrauchsausweisWohnenClient,
|
|
} from "#components/Ausweis/types.js";
|
|
import { validateAccessTokenClient } from "src/client/lib/validateAccessToken.js";
|
|
import { client } from "src/trpc.js";
|
|
|
|
export let user: BenutzerClient;
|
|
export let ausweis: VerbrauchsausweisWohnenClient;
|
|
|
|
let services = [
|
|
{
|
|
name: "Qualitätsdruck per Post (zusätzlich zur PDF Version) für 9€ inkl. MwSt.",
|
|
id: Enums.Service.Qualitaetsdruck,
|
|
price: 9,
|
|
selected: false,
|
|
},
|
|
{
|
|
name: "Aushang (für öffentliche Gebäude gesetzlich vorgeschrieben) für 10€ inkl. MwSt.",
|
|
id: Enums.Service.Aushang,
|
|
price: 10,
|
|
selected: false,
|
|
},
|
|
{
|
|
name: "Same Day Service (Bestellung Werktags vor 12:00 Uhr - Ausstellung bis 18:00 Uhr am gleichen Tag) für 29€ inkl. MwSt.",
|
|
id: Enums.Service.SameDay,
|
|
price: 29,
|
|
selected: false,
|
|
},
|
|
{
|
|
name: "Telefonische Energieeffizienzberatung für 75€ inkl. MwSt.",
|
|
id: Enums.Service.Telefonberatung,
|
|
price: 75,
|
|
selected: false,
|
|
},
|
|
];
|
|
|
|
export let selectedPaymentType: Bezahlmethoden =
|
|
Enums.Bezahlmethoden.paypal;
|
|
|
|
let prices: number[] = [];
|
|
|
|
if (ausweis.gebaeude_aufnahme_allgemein.ausweisart) {
|
|
prices = PRICES[ausweis.gebaeude_aufnahme_allgemein.ausweisart];
|
|
}
|
|
|
|
let basePrice: number = prices[0];
|
|
|
|
$: price =
|
|
basePrice +
|
|
services.reduce(
|
|
(acc, service) => (service.selected && acc + service.price) || acc,
|
|
0
|
|
);
|
|
|
|
async function speichern(e: SubmitEvent) {
|
|
e.preventDefault();
|
|
|
|
// Um einen Ausweis zu speichern müssen wir eingeloggt sein, andernfalls wird die API den call ablehnen.
|
|
// Wir prüfen also ob wir eingeloggt sind und leiten den Nutzer ggf. auf die Login Seite weiter.
|
|
if (!(await validateAccessTokenClient())) {
|
|
// TOOD: Auf Dialog umstellen.
|
|
const loggedIn = await dialogs.modal(LoginDialog);
|
|
|
|
if (!loggedIn) {
|
|
return false;
|
|
}
|
|
}
|
|
|
|
// Falls der Ausweis noch keine benutzer_id hat müssen wir ihn claimen, damit er dem jetzigen Nutzer zugewiesen wird...
|
|
await client.v1.verbrauchsausweisWohnen.claim.mutate({
|
|
uid: ausweis.uid,
|
|
});
|
|
|
|
window.location.href = `/kaufabschluss?uid=${ausweis.uid}`;
|
|
}
|
|
</script>
|
|
|
|
<div class="w-full px-8">
|
|
<div class="flex flex-row gap-8 items-center mb-8 w-full">
|
|
<div class="flex flex-col w-full">
|
|
<h1>Verbrauchsausweis erstellen - 45€</h1>
|
|
<ProgressBar progress={50} />
|
|
</div>
|
|
</div>
|
|
|
|
<form on:submit={speichern}>
|
|
<div class="grid grid-cols-[1.5fr_2fr] gap-4">
|
|
<div
|
|
class="rounded-lg border p-4 border-base-300 bg-base-100 flex flex-col gap-4"
|
|
>
|
|
<div class="flex flex-col gap-2 test-box">
|
|
<strong>A - Prüfung der Ausweisart</strong>
|
|
<div>
|
|
<span>Vermietung, Verkauf oder sonstiges</span>
|
|
<span
|
|
>Baujahr Heizung nicht kleiner als Baujahr Gebäude</span
|
|
><span
|
|
>Baujahr nach 1977 oder saniert oder mehr als 4
|
|
Wohneinheiten</span
|
|
><span>Heizung min. 3 Jahre alt</span><span
|
|
>Verbrauchsausweis zulässig</span
|
|
>
|
|
</div>
|
|
</div>
|
|
<div class="flex flex-col gap-2 test-box">
|
|
<strong
|
|
>B - Prüfung der Adresse, Wohnfläche, Keller und Dach</strong
|
|
>
|
|
<div>
|
|
<span>PLZ gültig</span><span>Klimafaktorern</span><span
|
|
>Wohnfläche passt zu Wohneinheiten</span
|
|
>
|
|
</div>
|
|
</div>
|
|
<div class="flex flex-col gap-2 test-box">
|
|
<strong>C - Prüfung der Verbrauchsangaben</strong>
|
|
<div>
|
|
<span>Verbrauchsmenge schlüssig</span><span
|
|
>Verbrauchsabweichung im Rahmen</span
|
|
><span>Endenergieverbrauch schlüssig</span>
|
|
</div>
|
|
</div>
|
|
<div class="flex flex-col gap-2 test-box">
|
|
<strong
|
|
>D - Prüfung Warmwasser und alternative
|
|
Energieversorgung</strong
|
|
>
|
|
<div>
|
|
<span>Warmwasseranteil schlüssig</span>
|
|
</div>
|
|
</div>
|
|
<div class="flex flex-col gap-2 test-box">
|
|
<strong
|
|
>E - Prüfung von Gebäudetyp, Lüftung, Kühlung und
|
|
Leerstand</strong
|
|
>
|
|
<div>
|
|
<span>Leerstand nicht größer als 30%</span>
|
|
</div>
|
|
</div>
|
|
<div class="flex flex-col gap-2 test-box">
|
|
<strong
|
|
>F - Prüfung des Sanierungsstandes und der Gebäudebilder</strong
|
|
>
|
|
<div>
|
|
<span>Mindestens ein Bild pro Abschnitt vorhanden</span
|
|
><span>Angaben zum Sanierungsstand vorhanden</span><span
|
|
>Bei Baujahr vor 1978 Dach oder Geschossdecke min.
|
|
12 cm gedämmt</span
|
|
>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<div
|
|
class="rounded-lg border p-4 border-base-300 bg-base-100 flex flex-col"
|
|
>
|
|
<table>
|
|
<tr>
|
|
<td><strong>Produkt:</strong></td>
|
|
<td><div class="py-2">Verbrauchsausweis</div></td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>Beschreibung:</strong></td>
|
|
<td>
|
|
<div class="py-2">
|
|
Registrierung beim DiBt<br />
|
|
Prüfung durch Diplom Ingenieur<br />
|
|
Energieausweis Vorschau als PDF<br />
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Netto-Preis</td>
|
|
<td
|
|
><div class="py-2">
|
|
{(price * 0.81).toFixed(2) + "€"}
|
|
</div></td
|
|
>
|
|
</tr>
|
|
<tr>
|
|
<td>19% gesetzl. MwSt.</td>
|
|
<td
|
|
><div class="py-2">
|
|
{(price * 0.19).toFixed(2) + "€"}
|
|
</div></td
|
|
>
|
|
</tr>
|
|
<hr />
|
|
<tr>
|
|
<td>Preis inkl. MwSt.</td>
|
|
<td
|
|
><div class="py-2">
|
|
<strong>{price + "€"}</strong>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
<h3 class="font-semibold mt-8">
|
|
Hiermit bestelle ich folgende Version des Energieausweises:
|
|
</h3>
|
|
<div
|
|
class="rounded-lg border p-4 border-base-300 bg-base-100 flex flex-col"
|
|
>
|
|
<table>
|
|
<tr>
|
|
<td
|
|
>Verbrauchsausweis online für {prices[0]} € inkl.
|
|
MwSt. als PDF per E-Mail</td
|
|
>
|
|
<td
|
|
><input
|
|
type="radio"
|
|
class="radio radio-secondary"
|
|
bind:group={basePrice}
|
|
value={prices[0]}
|
|
name="Preis"
|
|
checked
|
|
/>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td
|
|
>Verbrauchsausweis online inkl. Beratung für {prices[1]}
|
|
€ inkl. MwSt. als PDF per E-Mail</td
|
|
>
|
|
<td
|
|
><input
|
|
type="radio"
|
|
class="radio radio-secondary"
|
|
bind:group={basePrice}
|
|
value={prices[1]}
|
|
name="Preis"
|
|
/>
|
|
</td>
|
|
</tr><tr>
|
|
<td
|
|
>Verbrauchsausweis offline für {prices[2]} € inkl.
|
|
MwSt. als PDF per E-Mail (Sie schicken uns 3 Verbrauchsabrechnungen)</td
|
|
>
|
|
<td
|
|
><input
|
|
type="radio"
|
|
class="radio radio-secondary"
|
|
bind:group={basePrice}
|
|
value={prices[2]}
|
|
name="Preis"
|
|
/></td
|
|
>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
|
|
<h3 class="font-semibold mt-8">Zusatzleistungen</h3>
|
|
<div
|
|
class="rounded-lg border p-4 border-base-300 bg-base-100 flex flex-col"
|
|
>
|
|
<table>
|
|
{#each services as service}
|
|
<tr>
|
|
<td>{service.name}</td>
|
|
<td
|
|
><input
|
|
type="checkbox"
|
|
class="checkbox checkbox-secondary"
|
|
bind:checked={service.selected}
|
|
/>
|
|
</td>
|
|
</tr>
|
|
{/each}
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="flex flex-row justify-between">
|
|
<!-- TODO: Zurück implementieren -->
|
|
<button class="btn btn-secondary mt-4">Zurück</button>
|
|
<div class="flex flex-row gap-4">
|
|
<!-- TODO: Speichern implementieren -->
|
|
<button class="btn btn-secondary mt-4">Speichern</button>
|
|
<button class="btn btn-secondary mt-4">Zum Kaufabschluss</button
|
|
>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<style>
|
|
.test-box div {
|
|
@apply flex flex-col gap-1.5;
|
|
}
|
|
</style>
|