Login Umgestaltung
This commit is contained in:
Moritz Utcke
@@ -1,4 +1,4 @@
|
||||
<button class="border-2 rounded-lg w-[30%] bg-white">
|
||||
<a class="border-2 rounded-lg w-[30%] bg-white text-center hover:shadow-md no-underline p-6" href="/pdf/ansichtsausweis">
|
||||
<img src="/images/ausweis.webp" alt="Ausweis" />
|
||||
<span class="text-black font-medium text-lg">Ansichtsausweis</span>
|
||||
</button>
|
||||
</a>
|
||||
|
||||
18
src/components/AusweisCard.svelte
Normal file
18
src/components/AusweisCard.svelte
Normal file
@@ -0,0 +1,18 @@
|
||||
<script lang="ts">
|
||||
import HorizontalDots from "./Icons/HorizontalDots.svelte";
|
||||
|
||||
export let id: string;
|
||||
export let strasse: string = "";
|
||||
export let plz: string = "";
|
||||
export let stadt: string = "";
|
||||
</script>
|
||||
|
||||
<div class="rounded-lg bg-white shadow-sm border px-4 py-1">
|
||||
<div class="flex flex-row justify-between items-center">
|
||||
<h3>{strasse}, {plz} {stadt}</h3>
|
||||
<button class="cursor-pointer">
|
||||
<HorizontalDots width={20} height={20}></HorizontalDots>
|
||||
</button>
|
||||
</div>
|
||||
<a href="/ausweis/{id}/cad">Gebäudeansicht</a>
|
||||
</div>
|
||||
@@ -1,4 +1,4 @@
|
||||
<button class="border-2 rounded-lg w-[30%] bg-white">
|
||||
<a class="border-2 rounded-lg w-[30%] bg-white text-center hover:shadow-md no-underline p-6" href="/pdf/datenblatt">
|
||||
<img src="/images/datenblatt.webp" alt="Datenblatt" />
|
||||
<span class="text-black font-medium text-lg">Datenblatt</span>
|
||||
</button>
|
||||
</a>
|
||||
|
||||
19
src/components/Icons/Home.svelte
Normal file
19
src/components/Icons/Home.svelte
Normal file
@@ -0,0 +1,19 @@
|
||||
<script lang="ts">
|
||||
export let width: number = 15;
|
||||
export let height: number = 15;
|
||||
export let fill: string = "currentColor";
|
||||
</script>
|
||||
|
||||
|
||||
<svg
|
||||
width={width}
|
||||
height={height}
|
||||
viewBox="0 0 15 15"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
><path
|
||||
d="M7.07926 0.222253C7.31275 -0.007434 7.6873 -0.007434 7.92079 0.222253L14.6708 6.86227C14.907 7.09465 14.9101 7.47453 14.6778 7.71076C14.4454 7.947 14.0655 7.95012 13.8293 7.71773L13 6.90201V12.5C13 12.7761 12.7762 13 12.5 13H2.50002C2.22388 13 2.00002 12.7761 2.00002 12.5V6.90201L1.17079 7.71773C0.934558 7.95012 0.554672 7.947 0.32229 7.71076C0.0899079 7.47453 0.0930283 7.09465 0.32926 6.86227L7.07926 0.222253ZM7.50002 1.49163L12 5.91831V12H10V8.49999C10 8.22385 9.77617 7.99999 9.50002 7.99999H6.50002C6.22388 7.99999 6.00002 8.22385 6.00002 8.49999V12H3.00002V5.91831L7.50002 1.49163ZM7.00002 12H9.00002V8.99999H7.00002V12Z"
|
||||
fill={fill}
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"></path></svg
|
||||
>
|
||||
19
src/components/Icons/HorizontalDots.svelte
Normal file
19
src/components/Icons/HorizontalDots.svelte
Normal file
@@ -0,0 +1,19 @@
|
||||
<script lang="ts">
|
||||
export let width: number = 15;
|
||||
export let height: number = 15;
|
||||
export let fill: string = "currentColor";
|
||||
</script>
|
||||
|
||||
<svg
|
||||
width={width}
|
||||
height={height}
|
||||
viewBox="0 0 15 15"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
><path
|
||||
d="M3.625 7.5C3.625 8.12132 3.12132 8.625 2.5 8.625C1.87868 8.625 1.375 8.12132 1.375 7.5C1.375 6.87868 1.87868 6.375 2.5 6.375C3.12132 6.375 3.625 6.87868 3.625 7.5ZM8.625 7.5C8.625 8.12132 8.12132 8.625 7.5 8.625C6.87868 8.625 6.375 8.12132 6.375 7.5C6.375 6.87868 6.87868 6.375 7.5 6.375C8.12132 6.375 8.625 6.87868 8.625 7.5ZM12.5 8.625C13.1213 8.625 13.625 8.12132 13.625 7.5C13.625 6.87868 13.1213 6.375 12.5 6.375C11.8787 6.375 11.375 6.87868 11.375 7.5C11.375 8.12132 11.8787 8.625 12.5 8.625Z"
|
||||
fill={fill}
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
/></svg
|
||||
>
|
||||
18
src/components/Icons/Settings.svelte
Normal file
18
src/components/Icons/Settings.svelte
Normal file
@@ -0,0 +1,18 @@
|
||||
<script lang="ts">
|
||||
export let width: number = 15;
|
||||
export let height: number = 15;
|
||||
export let fill: string = "currentColor";
|
||||
</script>
|
||||
|
||||
<svg
|
||||
width={width}
|
||||
height={height}
|
||||
viewBox="0 0 15 15"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
><path
|
||||
d="M7.07095 0.650238C6.67391 0.650238 6.32977 0.925096 6.24198 1.31231L6.0039 2.36247C5.6249 2.47269 5.26335 2.62363 4.92436 2.81013L4.01335 2.23585C3.67748 2.02413 3.23978 2.07312 2.95903 2.35386L2.35294 2.95996C2.0722 3.2407 2.0232 3.6784 2.23493 4.01427L2.80942 4.92561C2.62307 5.2645 2.47227 5.62594 2.36216 6.00481L1.31209 6.24287C0.924883 6.33065 0.650024 6.6748 0.650024 7.07183V7.92897C0.650024 8.32601 0.924883 8.67015 1.31209 8.75794L2.36228 8.99603C2.47246 9.375 2.62335 9.73652 2.80979 10.0755L2.2354 10.9867C2.02367 11.3225 2.07267 11.7602 2.35341 12.041L2.95951 12.6471C3.24025 12.9278 3.67795 12.9768 4.01382 12.7651L4.92506 12.1907C5.26384 12.377 5.62516 12.5278 6.0039 12.6379L6.24198 13.6881C6.32977 14.0753 6.67391 14.3502 7.07095 14.3502H7.92809C8.32512 14.3502 8.66927 14.0753 8.75705 13.6881L8.99505 12.6383C9.37411 12.5282 9.73573 12.3773 10.0748 12.1909L10.986 12.7653C11.3218 12.977 11.7595 12.928 12.0403 12.6473L12.6464 12.0412C12.9271 11.7604 12.9761 11.3227 12.7644 10.9869L12.1902 10.076C12.3768 9.73688 12.5278 9.37515 12.638 8.99596L13.6879 8.75794C14.0751 8.67015 14.35 8.32601 14.35 7.92897V7.07183C14.35 6.6748 14.0751 6.33065 13.6879 6.24287L12.6381 6.00488C12.528 5.62578 12.3771 5.26414 12.1906 4.92507L12.7648 4.01407C12.9766 3.6782 12.9276 3.2405 12.6468 2.95975L12.0407 2.35366C11.76 2.07292 11.3223 2.02392 10.9864 2.23565L10.0755 2.80989C9.73622 2.62328 9.37437 2.47229 8.99505 2.36209L8.75705 1.31231C8.66927 0.925096 8.32512 0.650238 7.92809 0.650238H7.07095ZM4.92053 3.81251C5.44724 3.44339 6.05665 3.18424 6.71543 3.06839L7.07095 1.50024H7.92809L8.28355 3.06816C8.94267 3.18387 9.5524 3.44302 10.0794 3.81224L11.4397 2.9547L12.0458 3.56079L11.1882 4.92117C11.5573 5.44798 11.8164 6.0575 11.9321 6.71638L13.5 7.07183V7.92897L11.932 8.28444C11.8162 8.94342 11.557 9.55301 11.1878 10.0798L12.0453 11.4402L11.4392 12.0462L10.0787 11.1886C9.55192 11.5576 8.94241 11.8166 8.28355 11.9323L7.92809 13.5002H7.07095L6.71543 11.932C6.0569 11.8162 5.44772 11.5572 4.92116 11.1883L3.56055 12.046L2.95445 11.4399L3.81213 10.0794C3.4431 9.55266 3.18403 8.94326 3.06825 8.2845L1.50002 7.92897V7.07183L3.06818 6.71632C3.18388 6.05765 3.44283 5.44833 3.81171 4.92165L2.95398 3.561L3.56008 2.95491L4.92053 3.81251ZM9.02496 7.50008C9.02496 8.34226 8.34223 9.02499 7.50005 9.02499C6.65786 9.02499 5.97513 8.34226 5.97513 7.50008C5.97513 6.65789 6.65786 5.97516 7.50005 5.97516C8.34223 5.97516 9.02496 6.65789 9.02496 7.50008ZM9.92496 7.50008C9.92496 8.83932 8.83929 9.92499 7.50005 9.92499C6.1608 9.92499 5.07513 8.83932 5.07513 7.50008C5.07513 6.16084 6.1608 5.07516 7.50005 5.07516C8.83929 5.07516 9.92496 6.16084 9.92496 7.50008Z"
|
||||
fill={fill}
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"></path></svg
|
||||
>
|
||||
@@ -1,5 +1,5 @@
|
||||
<script lang="ts">
|
||||
import cookie from "cookiejs"
|
||||
import cookie from "cookiejs";
|
||||
|
||||
let email: string;
|
||||
let password: string;
|
||||
@@ -9,11 +9,12 @@
|
||||
const response = await fetch("/api/login", {
|
||||
method: "POST",
|
||||
body: JSON.stringify({
|
||||
email, password
|
||||
})
|
||||
})
|
||||
email,
|
||||
password,
|
||||
}),
|
||||
});
|
||||
|
||||
const json = await response.json()
|
||||
const json = await response.json();
|
||||
|
||||
if (json.success == true) {
|
||||
cookie.set("token", json.data.token);
|
||||
@@ -23,49 +24,44 @@
|
||||
window.location.href = "/user";
|
||||
} else {
|
||||
hasError = true;
|
||||
setTimeout(() => (hasError = false), 3000);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<div style="width:50%;margin: 0 auto">
|
||||
<h1>Login:</h1>
|
||||
<div class="login_page">
|
||||
{#if hasError}
|
||||
<p>Das hat leider nicht geklappt, haben sie ihr Passwort und den Nutzernamen richtig eingegeben?</p>
|
||||
{/if}
|
||||
<div class="block_4" style="margin-top: 25px;">
|
||||
<h4 class="heading_3">Email</h4>
|
||||
<h1>Login</h1>
|
||||
<div class="flex flex-col gap-4">
|
||||
<div>
|
||||
<h4>Email</h4>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Email"
|
||||
name="email"
|
||||
class="formInput"
|
||||
bind:value={email}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div class="block_4">
|
||||
<h4 class="heading_3">Passwort</h4>
|
||||
<div>
|
||||
<h4>Passwort</h4>
|
||||
<input
|
||||
type="password"
|
||||
placeholder="********"
|
||||
name="password"
|
||||
class="formInput"
|
||||
bind:value={password}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div class="mt-2 flex flex-row justify-between">
|
||||
<button on:click={login}
|
||||
>Einloggen</button
|
||||
>
|
||||
<a class="button"
|
||||
href="/signup">Registrieren</a
|
||||
>
|
||||
</div>
|
||||
<button on:click={login}>Einloggen</button>
|
||||
{#if hasError}
|
||||
<p>
|
||||
Das hat leider nicht geklappt, haben sie ihr Passwort und den
|
||||
Nutzernamen richtig eingegeben?
|
||||
</p>
|
||||
{/if}
|
||||
<div class="flex-row justify-between" style="margin-top: 10px">
|
||||
<a href="/">Home</a>
|
||||
<a href="/signup">Registrieren</a>
|
||||
<a href="/user/passwort_vergessen">Passwort Vergessen?</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
10
src/components/PDF/PDFHeader.svelte
Normal file
10
src/components/PDF/PDFHeader.svelte
Normal file
@@ -0,0 +1,10 @@
|
||||
<div class="rounded-lg border-4 border-pdf-yellow-bright p-2">
|
||||
<div class="flex flex-row gap-2 items-end">
|
||||
<h1 class="text-4xl font-bold">ENERGIEAUSWEIS</h1>
|
||||
<span class="text-lg font-semibold">für Wohngebäude</span>
|
||||
</div>
|
||||
<p>
|
||||
gemäß den §§ 16 ff. Energieeinsparverordnung (EnEV) vom ¹ <span
|
||||
class="bg-gray-300 p-0.5">18. November 2013</span>
|
||||
</p>
|
||||
</div>
|
||||
15
src/components/PDF/PDFSectionHeader.svelte
Normal file
15
src/components/PDF/PDFSectionHeader.svelte
Normal file
@@ -0,0 +1,15 @@
|
||||
<script lang="ts">
|
||||
export let number: number;
|
||||
</script>
|
||||
|
||||
<div class="flex flex-row gap-2">
|
||||
<div
|
||||
class="bg-pdf-yellow-light rounded-lg w-full h-10 items-center justify-between flex flex-row px-2"
|
||||
>
|
||||
<slot></slot>
|
||||
</div>
|
||||
<span
|
||||
class="w-10 h-10 rounded-full border-pdf-yellow-bright border-4 bg-pdf-yellow-light flex items-center justify-center font-bold text-xl"
|
||||
>{number}</span
|
||||
>
|
||||
</div>
|
||||
25
src/components/UserSidebarLeft.astro
Normal file
25
src/components/UserSidebarLeft.astro
Normal file
@@ -0,0 +1,25 @@
|
||||
---
|
||||
import Settings from "~/components/Icons/Settings.svelte";
|
||||
import Home from "./Icons/Home.svelte";
|
||||
---
|
||||
|
||||
<div class="bg-violet-50 flex flex-col items-center justify-between py-8">
|
||||
<div>
|
||||
<a href="/">
|
||||
<Home width={25} height={25}></Home>
|
||||
</a>
|
||||
</div>
|
||||
<a href="/user/settings">
|
||||
<Settings width={25} height={25}></Settings>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
a {
|
||||
@apply p-1 rounded-lg transition-colors block;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
@apply bg-violet-100;
|
||||
}
|
||||
</style>
|
||||
@@ -201,7 +201,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 2-container-close -->
|
||||
|
||||
<hr />
|
||||
<div>
|
||||
<Label>C - Eingabe von 3 zusammenhängenden Verbrauchsjahren</Label>
|
||||
@@ -311,218 +311,104 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 2-container-close -->
|
||||
|
||||
<hr />
|
||||
<div>
|
||||
<label
|
||||
class="headline"
|
||||
id="headlineg"
|
||||
style="font-size:18px;text-align:left;"
|
||||
<Label
|
||||
>E - Eingabe von Gebäudetyp, Gebäudeteil, Lüftung,
|
||||
Kühlung und Leerstand</label
|
||||
Kühlung und Leerstand</Label
|
||||
>
|
||||
</div>
|
||||
<div>
|
||||
<div class="GRB">
|
||||
<div class="GRB grid grid-cols-5 gap-4">
|
||||
<!-- Gebäudetyp -->
|
||||
<div>
|
||||
<!-- Gebäudetyp -->
|
||||
<HelpLabel title="Gebäudetyp *">Bitte wählen Sie hier den Gebäudetyp aus. </HelpLabel>
|
||||
<div>
|
||||
<label class="control-label" for="objekt_typ"
|
||||
>Gebäudetyp * <span
|
||||
class="help1"
|
||||
data-toggle="tooltip"
|
||||
data-html="true"
|
||||
title="
|
||||
<div class='TT'>
|
||||
Bitte wählen Sie hier den Gebäudetyp aus.
|
||||
</div>"
|
||||
>
|
||||
<img
|
||||
src="FORM/img/question-mark.png"
|
||||
alt="question mark"
|
||||
class="mark20"
|
||||
/>
|
||||
</span>
|
||||
</label>
|
||||
<div>
|
||||
<select
|
||||
id="objekt_typ"
|
||||
name="objekt_typ"
|
||||
class="form-control vergleichswert CHECK"
|
||||
required
|
||||
autocomplete="off"
|
||||
data-msg="Pflichtfeld"
|
||||
>
|
||||
{#each buildingTypes as type}
|
||||
<option value={type}>{type}</option>
|
||||
{/each}
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Gebäudeteil -->
|
||||
<div>
|
||||
<label class="control-label"
|
||||
>Gebäudeteil *
|
||||
<span
|
||||
class="help1"
|
||||
data-toggle="tooltip"
|
||||
data-html="true"
|
||||
title="
|
||||
<div class='TT'>
|
||||
Bitte geben Sie hier den Gebäudeteil ein. In den meisten Fällen handelt es sich um das Gesamtgebäude. Sollte es sich allerdings um ein Gebäude mit mehr als 10% Gewerbeanteil handeln, so sollten 2 Ausweise erstellt werden. In diesem Fall wählen Sie Gebäudeteil 'Wohnen' bzw. Gebäudeteil 'Gewerbe'.
|
||||
</div>"
|
||||
>
|
||||
<img
|
||||
src="/energieausweis-erstellen/FORM/img/question-mark.png"
|
||||
alt="question mark"
|
||||
class="mark20"
|
||||
/>
|
||||
</span>
|
||||
</label>
|
||||
<div>
|
||||
<select
|
||||
id="IGeil"
|
||||
name="objekt_gebaeudeteil"
|
||||
class="form-control"
|
||||
required
|
||||
autocomplete="off"
|
||||
data-msg="Pflichtfeld"
|
||||
>
|
||||
<option>Bitte auswählen</option>
|
||||
<option value="Gesamtgebäude">
|
||||
Gesamtgebäude</option
|
||||
>
|
||||
<option value="Wohnen"> Wohnen</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Lüftung -->
|
||||
<div class="form-group col-md-2">
|
||||
<label
|
||||
class="control-label"
|
||||
for="lueftungskonzept"
|
||||
>Lüftung durch *
|
||||
<span
|
||||
class="help1"
|
||||
data-toggle="tooltip"
|
||||
data-html="true"
|
||||
title="
|
||||
<div class='TT'>
|
||||
Bitte geben Sie hier ein ob über die Fenster natürlich belüftet wird oder über eine Lüftungsanlage.
|
||||
</div>"
|
||||
>
|
||||
<img
|
||||
src="/energieausweis-erstellen/FORM/img/question-mark.png"
|
||||
alt="question mark"
|
||||
class="mark20"
|
||||
/>
|
||||
</span>
|
||||
</label>
|
||||
<div>
|
||||
<select
|
||||
id="lueftungskonzept"
|
||||
name="lueftungskonzept"
|
||||
class="form-control"
|
||||
required
|
||||
autocomplete="off"
|
||||
data-msg="Pflichtfeld"
|
||||
>
|
||||
<option> Bitte auswählen</option>
|
||||
<option value="Fensterlüftung">
|
||||
Fensterlüftung</option
|
||||
>
|
||||
<option value="Schachtlüftung">
|
||||
Schachtlüftung</option
|
||||
>
|
||||
<option
|
||||
value="Lüftungsanlage ohne Wärmerückgewinnung"
|
||||
>
|
||||
Lüftungsanlage ohne
|
||||
Wärmerückgewinnung</option
|
||||
>
|
||||
<option
|
||||
value="Lüftungsanlage mit Wärmerückgewinnung"
|
||||
>
|
||||
Lüftungsanlage mit
|
||||
Wärmerückgewinnung</option
|
||||
>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Lüftung -->
|
||||
<div class="form-group col-md-2">
|
||||
<label class="control-label" for="wird_gekuehlt"
|
||||
>Anlage Kühlung *
|
||||
<span
|
||||
class="help1"
|
||||
data-toggle="tooltip"
|
||||
data-html="true"
|
||||
title="
|
||||
<div class='TT'>
|
||||
Bitte geben Sie an ob das Gebäude im Sommer zusätzlich gekühlt wird.
|
||||
</div>"
|
||||
>
|
||||
<img
|
||||
src="/energieausweis-erstellen/FORM/img/question-mark.png"
|
||||
alt="question mark"
|
||||
class="mark20"
|
||||
/>
|
||||
</span>
|
||||
</label>
|
||||
<div>
|
||||
<select
|
||||
id="wird_gekuehlt"
|
||||
name="wird_gekuehlt"
|
||||
class="form-control"
|
||||
required
|
||||
autocomplete="off"
|
||||
data-msg="Pflichtfeld"
|
||||
>
|
||||
<option> Bitte auswählen</option>
|
||||
<option value="1"> vorhanden</option>
|
||||
<option value="0">
|
||||
nicht vorhanden</option
|
||||
>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Leerstand -->
|
||||
<div class="form-group col-md-2">
|
||||
<label class="control-label" for="leerstand"
|
||||
>Leerstand in %
|
||||
<span
|
||||
class="help1"
|
||||
data-toggle="tooltip"
|
||||
data-html="true"
|
||||
title="
|
||||
<div class='TT'>
|
||||
Bitte geben Sie hier den Leerstand in % des Gesamtzeitraumes (3 Jahre) ein. Zum Beispiel 4 Monate Leerstand in 36 Monaten wären dann ca. 11%.
|
||||
</div>"
|
||||
>
|
||||
<img
|
||||
src="/energieausweis-erstellen/FORM/img/question-mark.png"
|
||||
alt="question mark"
|
||||
class="mark20"
|
||||
/>
|
||||
</span>
|
||||
</label>
|
||||
<div>
|
||||
<input
|
||||
id="leerstand"
|
||||
name="leerstand"
|
||||
maxlength="2"
|
||||
class="form-control input-md zahlen"
|
||||
type="text"
|
||||
autocomplete="off"
|
||||
data-msg="Pflichtfeld"
|
||||
/>
|
||||
</div>
|
||||
<select
|
||||
name="objekt_typ"
|
||||
required
|
||||
>
|
||||
{#each buildingTypes as type}
|
||||
<option value={type}>{type}</option>
|
||||
{/each}
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Gebäudeteil -->
|
||||
<div>
|
||||
<HelpLabel title="Gebäudeteil *">Bitte geben Sie hier den Gebäudeteil ein. In den meisten Fällen handelt es sich um das Gesamtgebäude. Sollte es sich allerdings um ein Gebäude mit mehr als 10% Gewerbeanteil handeln, so sollten 2 Ausweise erstellt werden. In diesem Fall wählen Sie Gebäudeteil 'Wohnen' bzw. Gebäudeteil 'Gewerbe'.</HelpLabel>
|
||||
<div>
|
||||
<select
|
||||
name="objekt_gebaeudeteil"
|
||||
required
|
||||
>
|
||||
<option>Bitte auswählen</option>
|
||||
<option value="Gesamtgebäude">
|
||||
Gesamtgebäude</option
|
||||
>
|
||||
<option value="Wohnen"> Wohnen</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Lüftung -->
|
||||
<div class="form-group col-md-2">
|
||||
<HelpLabel title="Lüftung durch *">Bitte geben Sie hier ein ob über die Fenster natürlich belüftet wird oder über eine Lüftungsanlage.</HelpLabel>
|
||||
<div>
|
||||
<select
|
||||
name="lueftungskonzept"
|
||||
required
|
||||
>
|
||||
<option> Bitte auswählen</option>
|
||||
<option value="Fensterlüftung">
|
||||
Fensterlüftung</option
|
||||
>
|
||||
<option value="Schachtlüftung">
|
||||
Schachtlüftung</option
|
||||
>
|
||||
<option
|
||||
value="Lüftungsanlage ohne Wärmerückgewinnung"
|
||||
>
|
||||
Lüftungsanlage ohne
|
||||
Wärmerückgewinnung</option
|
||||
>
|
||||
<option
|
||||
value="Lüftungsanlage mit Wärmerückgewinnung"
|
||||
>
|
||||
Lüftungsanlage mit
|
||||
Wärmerückgewinnung</option
|
||||
>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Lüftung -->
|
||||
<div class="form-group col-md-2">
|
||||
<HelpLabel title="Anlage Kühlung *">Bitte geben Sie an ob das Gebäude im Sommer zusätzlich gekühlt wird.</HelpLabel>
|
||||
<div>
|
||||
<select
|
||||
name="wird_gekuehlt"
|
||||
required
|
||||
>
|
||||
<option>Bitte auswählen</option>
|
||||
<option value="1"> vorhanden</option>
|
||||
<option value="0">
|
||||
nicht vorhanden</option
|
||||
>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Leerstand -->
|
||||
<div class="form-group col-md-2">
|
||||
<HelpLabel title="Leerstand in %">Bitte geben Sie hier den Leerstand in % des Gesamtzeitraumes (3 Jahre) ein. Zum Beispiel 4 Monate Leerstand in 36 Monaten wären dann ca. 11%.</HelpLabel>
|
||||
<div>
|
||||
<input
|
||||
name="leerstand"
|
||||
maxlength="2"
|
||||
type="text"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 2-row-close -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- 2-container-close -->
|
||||
|
||||
<hr />
|
||||
<div class="form-group col-md-12">
|
||||
<Label
|
||||
|
||||
115
src/layouts/UserLayout.astro
Normal file
115
src/layouts/UserLayout.astro
Normal file
@@ -0,0 +1,115 @@
|
||||
---
|
||||
import UserSidebarLeft from "../components/UserSidebarLeft.astro";
|
||||
|
||||
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="en">
|
||||
<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>
|
||||
<main class="grid grid-cols-[80px,1fr] h-[100vh]">
|
||||
<UserSidebarLeft />
|
||||
<article>
|
||||
<slot />
|
||||
</article>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<style is:global>
|
||||
article {
|
||||
@apply px-8 py-6 w-full relative bg-white;
|
||||
box-shadow: rgb(162, 162, 162) 1px 1px 3px 1px;
|
||||
}
|
||||
|
||||
article h1 {
|
||||
@apply text-4xl font-normal my-4;
|
||||
}
|
||||
|
||||
article h2 {
|
||||
@apply text-2xl font-normal my-4;
|
||||
}
|
||||
|
||||
article h3 {
|
||||
@apply text-xl font-normal my-2;
|
||||
}
|
||||
|
||||
article a {
|
||||
@apply text-blue-700 font-medium text-lg;
|
||||
}
|
||||
</style>
|
||||
@@ -1,6 +1,6 @@
|
||||
import type { APIRoute } from "astro";
|
||||
import { success, MissingPropertyError, MissingEntityError, ActionFailedError, InvalidDataError, error } from "../../lib/APIResponse";
|
||||
import { validatePassword } from "../../lib/Password";
|
||||
import { success, MissingPropertyError, error } from "../../lib/APIResponse";
|
||||
import { validatePassword, hashPassword } from "../../lib/Password";
|
||||
import { User } from "../../lib/User";
|
||||
import moment from "moment";
|
||||
import { encodeToken } from "../../lib/JsonWebToken";
|
||||
|
||||
233
src/pages/pdf/ansichtsausweis.astro
Normal file
233
src/pages/pdf/ansichtsausweis.astro
Normal file
@@ -0,0 +1,233 @@
|
||||
---
|
||||
import moment from "moment";
|
||||
import Checkbox from "~/components/Checkbox.svelte";
|
||||
import PDFHeader from "~/components/PDF/PDFHeader.svelte";
|
||||
import PDFSectionHeader from "~/components/PDF/PDFSectionHeader.svelte";
|
||||
import PDFLayout from "~/layouts/PDFLayout.astro";
|
||||
---
|
||||
|
||||
<PDFLayout title="">
|
||||
<div class="flex flex-col gap-20">
|
||||
<div class="flex flex-col gap-2">
|
||||
<PDFHeader></PDFHeader>
|
||||
<PDFSectionHeader number={1}>
|
||||
<p class="text-xs">
|
||||
Gültig bis: <span
|
||||
>{
|
||||
moment().add("10", "years").format("DD. MMM. YYYY")
|
||||
}</span>
|
||||
</p>
|
||||
<p class="text-xs">Ausweis ID <span>1293819</span></p>
|
||||
<p class="text-xs">
|
||||
Registriernummer wird nach Zahlungseingang vergeben
|
||||
</p>
|
||||
</PDFSectionHeader>
|
||||
<div
|
||||
class="border-4 border-pdf-yellow-bright bg-pdf-yellow-light rounded-lg"
|
||||
>
|
||||
<h2>Gebäude</h2>
|
||||
<div class="flex flex-col">
|
||||
<div class="flex flex-row">
|
||||
<table>
|
||||
<tr>
|
||||
<td>Gebäudetyp</td>
|
||||
<td>Einfamilienhaus</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Adresse</td>
|
||||
<td>Mönckebergstraße, 22049 Hamburg</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Gebäudeteil</td>
|
||||
<td>Gesamtgebäude</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Baujahr Gebäude ³</td>
|
||||
<td>1962</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td
|
||||
>Baujahr Wärmeerzeuger <sup>3</sup>
|
||||
<sup>4</sup></td
|
||||
>
|
||||
<td>1974</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Anzahl Wohnungen</td>
|
||||
<td>1</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Gebäudenutzfläche (A<sub>N</sub>)</td>
|
||||
<td>
|
||||
<table>
|
||||
<tr>
|
||||
<td>182m²</td>
|
||||
<td
|
||||
class="flex flex-row items-center h-full w-full gap-2 pl-2"
|
||||
>
|
||||
<input type="checkbox" />
|
||||
nach § 19 EnEV aus der Wohnfläche ermittelt
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td
|
||||
>Wesentliche Energieträger für<br /> Heizung und
|
||||
Warmwasser <sup>3</sup></td
|
||||
>
|
||||
<td>Erdgas, BraunkohleBraunkohle, Strommix</td>
|
||||
</tr>
|
||||
</table>
|
||||
<div class="w-[35%]">
|
||||
<img src="" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<table></table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box">
|
||||
<h2>
|
||||
Hinweise zu den Angaben über die energetische Qualität des
|
||||
Gebäudes
|
||||
</h2>
|
||||
<div class="bg-white w-full">
|
||||
<p>
|
||||
Die energetische Qualität eines Gebäudes kann durch die
|
||||
Berechnung des <strong>Energiebedarfs</strong> unter Annahme
|
||||
von standardisierten Randbedingungen oder durch die Auswertung
|
||||
des <strong>Energieverbrauchs</strong> ermittelt werden. Als
|
||||
Bezugsfläche dient die energetische Gebäudenutzfläche nach der
|
||||
EnEV, die sich in der Regel von den allgemeinen Wohnflächenangaben
|
||||
unterscheidet. Die angegebenen Vergleichswerte sollen überschlägige
|
||||
Vergleiche ermöglichen (<strong
|
||||
>Erläuterungen - siehe Seite 5</strong
|
||||
>). Teil des Energieausweises sind die
|
||||
Modernisierungsempfehlungen (Seite 4).
|
||||
</p>
|
||||
<Checkbox checked={true}>
|
||||
Der Energieausweis wurde auf der Grundlage von Berechnungen
|
||||
des <strong>Energiebedarfs</strong> erstellt (Energiebedarfsausweis).
|
||||
Die Ergebnisse sind auf <strong>Seite 2</strong> dargestellt.
|
||||
Zusätzliche Informationen zum Verbrauch sind freiwillig.
|
||||
</Checkbox>
|
||||
<Checkbox checked={false}>
|
||||
Der Energieausweis wurde auf der Grundlage von Auswertungen
|
||||
des <strong>Energieverbrauchs</strong> erstellt (Energieverbrauchsausweis).
|
||||
Die Ergebnisse sind auf <strong>Seite 3</strong> dargestellt.
|
||||
</Checkbox>
|
||||
<div class="flex flex-row justify-between items-center w-[80%]">
|
||||
<p>Datenerhebung Bedarf/Verbrauch durch</p>
|
||||
<Checkbox checked={true}>Eigentümer</Checkbox>
|
||||
<Checkbox checked={false}>Aussteller</Checkbox>
|
||||
</div>
|
||||
<Checkbox>
|
||||
Dem Energieausweis sind zusätzliche Informationen zur
|
||||
energetischen Qualität beigefügt (freiwillige Angabe).
|
||||
</Checkbox>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box">
|
||||
<h2>Hinweise zur Verwendung des Energieausweises</h2>
|
||||
<p class="bg-white">
|
||||
Der Energieausweis dient lediglich der Information. Die Angaben
|
||||
im Energieausweis beziehen sich auf das gesamte Wohngebäude oder
|
||||
den oben bezeichneten Gebäudeteil. Der Energieausweis ist
|
||||
lediglich dafür gedacht, einen überschlägigen Vergleich von
|
||||
Gebäuden zu ermöglichen.
|
||||
</p>
|
||||
</div>
|
||||
<div class="flex flex-row gap-2">
|
||||
<div class="bg-pdf-yellow-light rounded-lg p-2 w-full h-20">
|
||||
<p>Aussteller:</p>
|
||||
</div>
|
||||
<div class="bg-pdf-yellow-light rounded-lg p-2 w-full h-20"></div>
|
||||
</div>
|
||||
<div class="flex flex-row flex-wrap">
|
||||
<p>
|
||||
<sup>1</sup> Datum der angewendeten EnEV, gegebenenfalls angewendeten
|
||||
Änderungsverordnung zur EnEV
|
||||
</p>
|
||||
<p>
|
||||
<sup>2</sup> Bei nicht rechtzeitiger Zuteilung der Registriernummer
|
||||
(§ 17 Absatz 4 Satz 4 und 5 EnEV) ist das Datum der Antragstellung
|
||||
einzutragen; die Registriernummer ist nach deren Eingang nachträglich
|
||||
einzusetzen.
|
||||
</p>
|
||||
<p><sup>3</sup> Mehrfachangaben möglich</p>
|
||||
<p><sup>4</sup> bei Wärmenetzen Baujahr der Übergabestation</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col gap-2">
|
||||
<PDFHeader></PDFHeader>
|
||||
<PDFSectionHeader number={2}>
|
||||
<p>Berechneter Energiebedarf des Gebäudes</p>
|
||||
</PDFSectionHeader>
|
||||
<div
|
||||
class="box"
|
||||
>
|
||||
<h2>Energiebedarf</h2>
|
||||
<div class="bg-white w-full flex flex-col">
|
||||
<div class="flex flex-col items-end text-center">
|
||||
<div class="flex flex-row">
|
||||
<span class="bg-gray-300 p-0.5">200</span>
|
||||
<span>kg/(m²a)</span>
|
||||
</div>
|
||||
<span>CO² Treibhausgas Emissionen</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</PDFLayout>
|
||||
|
||||
<style is:global>
|
||||
table {
|
||||
@apply w-full h-full;
|
||||
}
|
||||
|
||||
td > table td {
|
||||
@apply px-0 py-0 border-t-0 border-b-0;
|
||||
}
|
||||
|
||||
td:has(table) {
|
||||
@apply p-0;
|
||||
}
|
||||
|
||||
td > table td:first-child {
|
||||
@apply border-l-0;
|
||||
}
|
||||
|
||||
td > table td:last-child {
|
||||
@apply border-r-0;
|
||||
}
|
||||
|
||||
td {
|
||||
@apply border border-black px-1 text-xs py-0.5;
|
||||
}
|
||||
|
||||
td:not(:first-child) {
|
||||
@apply bg-white;
|
||||
}
|
||||
|
||||
h2 {
|
||||
@apply font-bold text-sm;
|
||||
}
|
||||
|
||||
p,
|
||||
label {
|
||||
@apply text-xs;
|
||||
}
|
||||
|
||||
.box {
|
||||
@apply border-4 border-pdf-yellow-bright bg-pdf-yellow-light rounded-lg;
|
||||
}
|
||||
|
||||
.box > * {
|
||||
@apply px-1 py-0.5;
|
||||
}
|
||||
</style>
|
||||
@@ -1,169 +0,0 @@
|
||||
---
|
||||
import moment from "moment";
|
||||
import Checkbox from "~/components/Checkbox.svelte";
|
||||
import PDFLayout from "~/layouts/PDFLayout.astro";
|
||||
|
||||
---
|
||||
|
||||
<PDFLayout title="">
|
||||
<div class="flex flex-col gap-2">
|
||||
<div class="rounded-lg border-4 border-pdf-yellow-bright p-2">
|
||||
<div class="flex flex-row gap-2 items-end">
|
||||
<h1 class="text-4xl font-bold">ENERGIEAUSWEIS</h1>
|
||||
<span class="text-lg font-semibold">für Wohngebäude</span>
|
||||
</div>
|
||||
<p>gemäß den §§ 16 ff. Energieeinsparverordnung (EnEV) vom ¹ <span class="bg-gray-300 p-0.5">18. November 2013</span></p>
|
||||
</div>
|
||||
<div class="flex flex-row gap-2">
|
||||
<div class="bg-pdf-yellow-light rounded-lg w-full h-10 items-center justify-between flex flex-row px-2">
|
||||
<p class="text-xs">Gültig bis: <span>{moment().add("10", "years").format("DD. MMM. YYYY")}</span></p>
|
||||
<p class="text-xs">Ausweis ID <span>1293819</span></p>
|
||||
<p class="text-xs">Registriernummer wird nach Zahlungseingang vergeben</p>
|
||||
</div>
|
||||
<span class="w-10 h-10 rounded-full border-pdf-yellow-bright border-4 bg-pdf-yellow-light flex items-center justify-center font-bold text-xl">1</span>
|
||||
</div>
|
||||
<div class="border-4 border-pdf-yellow-bright bg-pdf-yellow-light rounded-lg">
|
||||
<h2>Gebäude</h2>
|
||||
<div class="flex flex-col">
|
||||
<div class="flex flex-row">
|
||||
<table>
|
||||
<tr>
|
||||
<td>Gebäudetyp</td>
|
||||
<td>Einfamilienhaus</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Adresse</td>
|
||||
<td>Mönckebergstraße, 22049 Hamburg</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Gebäudeteil</td>
|
||||
<td>Gesamtgebäude</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Baujahr Gebäude ³</td>
|
||||
<td>1962</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Baujahr Wärmeerzeuger <sup>3</sup> <sup>4</sup></td>
|
||||
<td>1974</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Anzahl Wohnungen</td>
|
||||
<td>1</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Gebäudenutzfläche (A<sub>N</sub>)</td>
|
||||
<td>
|
||||
<table>
|
||||
<tr>
|
||||
<td>182m²</td>
|
||||
<td class="flex flex-row items-center h-full w-full gap-2 pl-2">
|
||||
<input type="checkbox">
|
||||
nach § 19 EnEV aus der Wohnfläche ermittelt
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Wesentliche Energieträger für<br> Heizung und Warmwasser <sup>3</sup></td>
|
||||
<td>Erdgas, BraunkohleBraunkohle, Strommix</td>
|
||||
</tr>
|
||||
</table>
|
||||
<div class="w-[35%]">
|
||||
<img src="" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<table>
|
||||
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box">
|
||||
<h2>Hinweise zu den Angaben über die energetische Qualität des Gebäudes</h2>
|
||||
<div class="bg-white w-full">
|
||||
<p>Die energetische Qualität eines Gebäudes kann durch die Berechnung des <strong>Energiebedarfs</strong> unter Annahme von
|
||||
standardisierten Randbedingungen oder durch die Auswertung des <strong>Energieverbrauchs</strong> ermittelt werden. Als Bezugsfläche dient die energetische Gebäudenutzfläche nach der EnEV, die sich in der Regel von den allgemeinen
|
||||
Wohnflächenangaben unterscheidet. Die angegebenen Vergleichswerte sollen überschlägige Vergleiche ermöglichen (<strong>Erläuterungen - siehe Seite 5</strong>). Teil des Energieausweises sind die Modernisierungsempfehlungen (Seite 4).</p>
|
||||
<Checkbox checked={true}>
|
||||
Der Energieausweis wurde auf der Grundlage von Berechnungen des <strong>Energiebedarfs</strong> erstellt (Energiebedarfsausweis). Die Ergebnisse sind auf <strong>Seite 2</strong> dargestellt. Zusätzliche Informationen zum Verbrauch sind freiwillig.
|
||||
</Checkbox>
|
||||
<Checkbox checked={false}>
|
||||
Der Energieausweis wurde auf der Grundlage von Auswertungen des <strong>Energieverbrauchs</strong> erstellt (Energieverbrauchsausweis). Die Ergebnisse sind auf <strong>Seite 3</strong> dargestellt.
|
||||
</Checkbox>
|
||||
<div class="flex flex-row justify-between items-center w-[80%]">
|
||||
<p>Datenerhebung Bedarf/Verbrauch durch</p>
|
||||
<Checkbox checked={true}>
|
||||
Eigentümer
|
||||
</Checkbox>
|
||||
<Checkbox checked={false}>
|
||||
Aussteller
|
||||
</Checkbox>
|
||||
</div>
|
||||
<Checkbox>Dem Energieausweis sind zusätzliche Informationen zur energetischen Qualität beigefügt (freiwillige Angabe).</Checkbox>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box">
|
||||
<h2>Hinweise zur Verwendung des Energieausweises</h2>
|
||||
<p class="bg-white">Der Energieausweis dient lediglich der Information. Die Angaben im Energieausweis beziehen sich auf das
|
||||
gesamte Wohngebäude oder den oben bezeichneten Gebäudeteil. Der Energieausweis ist lediglich dafür gedacht,
|
||||
einen überschlägigen Vergleich von Gebäuden zu ermöglichen.</p>
|
||||
</div>
|
||||
<div class="flex flex-row gap-2">
|
||||
<div class="bg-pdf-yellow-light rounded-lg p-2 w-full h-20">
|
||||
<p>Aussteller:</p>
|
||||
</div>
|
||||
<div class="bg-pdf-yellow-light rounded-lg p-2 w-full h-20">
|
||||
<p>Aussteller:</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</PDFLayout>
|
||||
|
||||
<style is:global>
|
||||
table {
|
||||
@apply w-full h-full;
|
||||
}
|
||||
|
||||
td > table td {
|
||||
@apply px-0 py-0 border-t-0 border-b-0;
|
||||
}
|
||||
|
||||
td:has(table) {
|
||||
@apply p-0;
|
||||
}
|
||||
|
||||
td > table td:first-child {
|
||||
@apply border-l-0;
|
||||
}
|
||||
|
||||
td > table td:last-child {
|
||||
@apply border-r-0;
|
||||
}
|
||||
|
||||
td {
|
||||
@apply border border-black px-1 text-xs py-0.5;
|
||||
}
|
||||
|
||||
td:not(:first-child) {
|
||||
@apply bg-white;
|
||||
}
|
||||
|
||||
h2 {
|
||||
@apply font-bold text-sm;
|
||||
}
|
||||
|
||||
p, label {
|
||||
@apply text-xs;
|
||||
}
|
||||
|
||||
.box {
|
||||
@apply border-4 border-pdf-yellow-bright bg-pdf-yellow-light rounded-lg;
|
||||
}
|
||||
|
||||
.box > * {
|
||||
@apply px-1 py-0.5;
|
||||
}
|
||||
</style>
|
||||
@@ -1,8 +1,9 @@
|
||||
---
|
||||
import moment from "moment";
|
||||
import Layout from "../../layouts/Layout.astro"
|
||||
import { decodeToken } from "../../lib/JsonWebToken";
|
||||
import { User } from "../../lib/User";
|
||||
import UserLayout from "~/layouts/UserLayout.astro";
|
||||
import AusweisCard from "~/components/AusweisCard.svelte";
|
||||
|
||||
const token = Astro.cookies.get("token").value;
|
||||
const expires = Astro.cookies.get("expires").number();
|
||||
@@ -25,15 +26,15 @@ if (!user) {
|
||||
|
||||
---
|
||||
|
||||
<Layout title="Dashboard">
|
||||
<div class="profile_container">
|
||||
<div><h1>Willkommen zurück <b>{user.username}</b></h1>
|
||||
<div id="searchBoxContainer" class="flex-row" style="gap: 5px; margin: 10px 0;"></div>
|
||||
<UserLayout title="Dashboard">
|
||||
<h1>Willkommen zurück <b>{user.email}</b></h1>
|
||||
|
||||
<h2>Ihre Ausweise</h2>
|
||||
<div class="overflow-x-auto grid grid-flow-row grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4">
|
||||
<AusweisCard strasse="Götheborgstraße 12" plz="21030" stadt="Hamburg"></AusweisCard>
|
||||
<AusweisCard strasse="Götheborgstraße 12" plz="21030" stadt="Hamburg"></AusweisCard>
|
||||
<AusweisCard strasse="Götheborgstraße 12" plz="21030" stadt="Hamburg"></AusweisCard>
|
||||
<AusweisCard strasse="Götheborgstraße 12" plz="21030" stadt="Hamburg"></AusweisCard>
|
||||
<AusweisCard strasse="Götheborgstraße 12" plz="21030" stadt="Hamburg"></AusweisCard>
|
||||
</div>
|
||||
<div class="flex-column" style="gap: 10px;">
|
||||
<a href="/user/settings" class="button">Account Details Ändern</a>
|
||||
<a href="/logout" class="button">Ausloggen</a>
|
||||
</div>
|
||||
<div class='login-container' id="items-container"></div>
|
||||
</div>
|
||||
</Layout>
|
||||
</UserLayout>
|
||||
Reference in New Issue
Block a user