Kundendaten
This commit is contained in:
Robert Jagtiani
@@ -1,5 +1,9 @@
|
||||
<script lang="ts">
|
||||
import PerformanceScore from "#components/Ausweis/PerformanceScore.svelte";
|
||||
import ProgressBar from "#components/Ausweis/Progressbar.svelte";
|
||||
import Pruefung from "#components/Ausweis/Pruefung.svelte";
|
||||
import ButtonZurueckSpeichernKaufabschluss from "#components/Ausweis/ButtonZurueckSpeichernKaufabschluss.svelte";
|
||||
|
||||
import type { Bezahlmethoden } from "@ibcornelsen/database/client";
|
||||
import { Enums } from "@ibcornelsen/database/client";
|
||||
import { dialogs } from "svelte-dialogs";
|
||||
@@ -15,27 +19,34 @@
|
||||
export let user: BenutzerClient;
|
||||
export let ausweis: VerbrauchsausweisWohnenClient;
|
||||
|
||||
export let bereich;
|
||||
export let title;
|
||||
export let bullets;
|
||||
|
||||
let gebaeude_aufnahme_allgemein = ausweis.gebaeude_aufnahme_allgemein || {};
|
||||
let gebaeude = ausweis.gebaeude_aufnahme_allgemein?.gebaeude_stammdaten || {};
|
||||
|
||||
let services = [
|
||||
{
|
||||
name: "Qualitätsdruck per Post (zusätzlich zur PDF Version) für 9€ inkl. MwSt.",
|
||||
name: "Qualitätsdruck per Post (zusätzlich zur PDF Version)",
|
||||
id: Enums.Service.Qualitaetsdruck,
|
||||
price: 9,
|
||||
selected: false,
|
||||
},
|
||||
{
|
||||
name: "Aushang (für öffentliche Gebäude gesetzlich vorgeschrieben) für 10€ inkl. MwSt.",
|
||||
name: "Aushang (für öffentliche Gebäude gesetzlich vorgeschrieben)",
|
||||
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.",
|
||||
name: "Same Day Service <br>Bestellung Werktags vor 12:00 Uhr - Ausstellung bis 18:00 Uhr am gleichen Tag",
|
||||
id: Enums.Service.SameDay,
|
||||
price: 29,
|
||||
selected: false,
|
||||
},
|
||||
{
|
||||
name: "Telefonische Energieeffizienzberatung für 75€ inkl. MwSt.",
|
||||
name: "Telefonische Energieeffizienzberatung",
|
||||
id: Enums.Service.Telefonberatung,
|
||||
price: 75,
|
||||
selected: false,
|
||||
@@ -83,219 +94,240 @@
|
||||
}
|
||||
</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>
|
||||
<div id="skala" class="bg-white grid grid-cols-1 gap-x-8 gap-y-4 p-4
|
||||
|
||||
<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>
|
||||
2xl:grid-cols-2 2xl:gap-x-8
|
||||
">
|
||||
|
||||
<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 id="performance-box" class="w-full box relative px-4 order-2 2xl:order-1 self-stretch grid grid-cols-1">
|
||||
<PerformanceScore
|
||||
bind:ausweis
|
||||
bind:gebaeude_aufnahme_allgemein
|
||||
bind:gebaeude
|
||||
/>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.test-box div {
|
||||
@apply flex flex-col gap-1.5;
|
||||
<div id="progress-box" class="w-full box relative px-4 py-3 text-center order-1 2xl:order-2 self-stretch">
|
||||
|
||||
<h1 class="text-secondary text-3xl m-0">Energiesausweis erstellen</h1>
|
||||
<h2 class="text-primary text-xl">Verbrauchsausweis Wohnen {PRICES.VerbrauchsausweisWohnen[0]} €</h2>
|
||||
<ProgressBar progress={50}
|
||||
/>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<form id="formInput-2" on:submit={speichern}>
|
||||
<div id="formular-box" class="formular-boxen ring-0">
|
||||
|
||||
<div class="grid grid-cols-[max-content_1fr] items-center justify-items-start gap-2 mb-6">
|
||||
<div class="formular-abschnitt1">€</div>
|
||||
<div class="formular-abschnitt2">Prüfung, Leistungsbeschreibung und Kosten</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="grid grid-cols-[2fr_3fr] gap-8">
|
||||
|
||||
<div class="bereich-box pr-12">
|
||||
|
||||
<Pruefung
|
||||
bereich="A"
|
||||
title="Prüfung der Ausweisart"
|
||||
bullets={[
|
||||
["Vermietung, Verkauf oder sonstiges.", false],
|
||||
["Baujahr Heizung nicht kleiner als Baujahr Gebäude.", false],
|
||||
["Baujahr nach 1977 oder saniert oder mehr als 4 Wohneinheiten", false],
|
||||
["Heizung min. 3 Jahre alt.", false],
|
||||
["Verbrauchsausweis zulässig.", false]
|
||||
]}>
|
||||
</Pruefung>
|
||||
|
||||
<Pruefung
|
||||
bereich="B"
|
||||
title="Prüfung der Adresse, Wohnfläche, Keller und Dach"
|
||||
bullets={[
|
||||
["PLZ gültig.", false],
|
||||
["Klimafaktorern.", false],
|
||||
["Wohnfläche passt zu Wohneinheiten", false]
|
||||
]}>
|
||||
</Pruefung>
|
||||
|
||||
<Pruefung
|
||||
bereich="C"
|
||||
title="Prüfung der Verbrauchsangaben"
|
||||
bullets={[
|
||||
["Verbrauchsmenge schlüssig.", false],
|
||||
["Verbrauchsabweichung im Rahmen.", false],
|
||||
["Endenergieverbrauch schlüssig", false]
|
||||
]}>
|
||||
</Pruefung>
|
||||
|
||||
<Pruefung
|
||||
bereich="D"
|
||||
title="Prüfung Warmwasser und alternative Energieversorgung"
|
||||
bullets={[
|
||||
["Warmwasseranteil schlüssig.", false],
|
||||
["Verbrauchsabweichung im Rahmen.", false],
|
||||
["Endenergieverbrauch schlüssig", false]
|
||||
]}>
|
||||
</Pruefung>
|
||||
|
||||
<Pruefung
|
||||
bereich="E"
|
||||
title="Prüfung von Gebäudetyp, Lüftung, Kühlung und Leerstand"
|
||||
bullets={[
|
||||
["Leerstand nicht größer als 30%.", false]
|
||||
]}>
|
||||
</Pruefung>
|
||||
|
||||
<Pruefung
|
||||
bereich="F"
|
||||
title="Prüfung des Sanierungsstandes und der Gebäudebilder"
|
||||
bullets={[
|
||||
["Mindestens ein Bild pro Abschnitt vorhanden.", false],
|
||||
["Angaben zum Sanierungsstand vorhanden.", false],
|
||||
["Bei Baujahr vor 1978 Dach oder Geschossdecke min. 12 cm gedämmt.", false]
|
||||
]}>
|
||||
</Pruefung>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="grid grid-rows-3 gap-y-6">
|
||||
|
||||
<div class="bereich-box bg-white ring-primary/50 ring-4" >
|
||||
|
||||
<div class="ProduktKostenTabelle">
|
||||
<div class="zeile">
|
||||
<div>Produkt</div><div>:</div><div>Verbrauchsausweis</div>
|
||||
</div>
|
||||
<div class="zeile">
|
||||
<div>Beschreibung</div><div>:</div>
|
||||
<div class="col-span-2">Registrierung beim DiBt<br />
|
||||
Prüfung durch Diplom Ingenieur<br />
|
||||
Energieausweis Vorschau als PDF<br />
|
||||
</div>
|
||||
</div>
|
||||
<div class="zeile betrag">
|
||||
<div>Netto-Preis</div><div>:</div><div class="text-right"><b>{(price * 0.81).toFixed(2) + " €"}</b></div>
|
||||
</div>
|
||||
<div class="zeile betrag">
|
||||
<div>19% gesetzl. MwSt.
|
||||
</div><div>:</div><div class="text-right"><b>{(price * 0.19).toFixed(2) + " €"}</b></div>
|
||||
</div>
|
||||
<div class="zeile betrag">
|
||||
<div><b>Preis inkl. MwSt.</b>
|
||||
</div><div>:</div><div class="text-right"><b>{price.toFixed(2) + " €"}</b></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div class="varianten bereich-box bg-white">
|
||||
<h3>Hiermit bestelle ich folgende Version des Energieausweises:</h3>
|
||||
|
||||
|
||||
|
||||
<div class="variante">
|
||||
|
||||
<input
|
||||
type="radio"
|
||||
bind:group={basePrice}
|
||||
value={prices[0]}
|
||||
name="Preis"
|
||||
checked
|
||||
/>
|
||||
<div class="text-right pr-4"><b>{prices[0]} €</b> inkl. MwSt.</div>
|
||||
<div>Verbrauchsausweis online als PDF per E-Mail</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="variante">
|
||||
|
||||
<input
|
||||
type="radio"
|
||||
bind:group={basePrice}
|
||||
value={prices[1]}
|
||||
name="Preis"
|
||||
/>
|
||||
<div class="text-right pr-4"><b>{prices[1]} €</b> inkl. MwSt.</div>
|
||||
<div>Verbrauchsausweis online inkl. Beratung als PDF per E-Mail</div>
|
||||
</div>
|
||||
|
||||
<div class="variante">
|
||||
|
||||
<input
|
||||
type="radio"
|
||||
bind:group={basePrice}
|
||||
value={prices[2]}
|
||||
name="Preis"
|
||||
/>
|
||||
<div class="text-right pr-4"><b>{prices[2]} €</b> inkl. MwSt.</div>
|
||||
<div>Verbrauchsausweis offline als PDF per E-Mail (Sie schicken uns 3 Verbrauchsabrechnungen)</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="zusaetze bereich-box bg-white">
|
||||
|
||||
<h3>Zusatzleistungen</h3>
|
||||
|
||||
{#each services as service}
|
||||
|
||||
<div class="zusatz">
|
||||
|
||||
<input
|
||||
type="checkbox"
|
||||
bind:checked={service.selected}
|
||||
/>
|
||||
<div class="text-right pr-6"><b>{@html service.price} €</b> inkl. Mwst</div>
|
||||
<div>{@html service.name}</div>
|
||||
|
||||
</div>
|
||||
{/each}
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<ButtonZurueckSpeichernKaufabschluss />
|
||||
|
||||
|
||||
</form>
|
||||
|
||||
|
||||
<style lang="postcss">
|
||||
h3{@apply text-[1.25rem] ml-0 font-bold mb-6}
|
||||
|
||||
.ProduktKostenTabelle{@apply block;
|
||||
.zeile{@apply grid grid-cols-[10rem_2rem_5rem_1fr];}
|
||||
.zeile:nth-child(3){@apply mt-6}
|
||||
.zeile:nth-child(5){@apply mt-6}
|
||||
.betrag{@apply font-bold text-[1.25rem]}
|
||||
}
|
||||
|
||||
.varianten{@apply block;
|
||||
.variante{@apply grid grid-cols-[40px_8rem_1fr] items-start pb-4;
|
||||
input{@apply mt-[5px]
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.zusaetze{@apply block;
|
||||
.zusatz{@apply grid grid-cols-[40px_8rem_1fr] items-start pb-3;
|
||||
input{@apply mt-[4px]
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user