Registrieren zum Speichern

src/lib/constants.ts

@@ -1,7 +1 @@
-import { createMollieClient } from "@mollie/api-client";
-
-export const API_ACCESS_TOKEN_COOKIE_NAME = "accessToken";
-// Mollie Payments
-export const TEST_MOLLIE_API_TOKEN = "test_jenmp2Pq3j3N6HeQxwx7qbHasWMdnx";
-
-export const mollieClient = createMollieClient({ apiKey: TEST_MOLLIE_API_TOKEN })
+export const API_ACCESS_TOKEN_COOKIE_NAME = "accessToken";

src/modules/EmbeddedLoginModule.svelte

@@ -49,7 +49,7 @@
 		</div>
 		<button class="button" on:click={login}>Einloggen</button>
 		<div class="flex-row justify-between" style="margin-top: 10px">
-			<a href="/signup">Registrieren</a>
+			<a href="/auth/embedded-signup">Registrieren</a>
 			<a href="/user/passwort_vergessen">Passwort Vergessen?</a>
 		</div>
 	</div>

src/modules/EmbeddedRegisterModule.svelte

@@ -0,0 +1,84 @@
+<script lang="ts">
+	import { addNotification } from "@ibcornelsen/ui";
+	import { client } from "src/trpc";
+
+	let passwort: string;
+	let email: string;
+	let vorname: string;
+	let name: string;
+
+	async function login() {
+		try {
+			const response = await client.v1.benutzer.erstellen.mutate({
+				email,
+				passwort,
+				vorname,
+				name,
+			});
+
+			window.location.href = "/auth/embedded-login";
+		} catch (e) {
+			addNotification({
+				message: "Ups...",
+				subtext:
+					"Da ist wohl etwas schiefgelaufen... Diese Email Adresse ist bereits in Benutzung, haben sie vielleicht bereits ein Konto bei uns?",
+				type: "error",
+				timeout: 0,
+				dismissable: true,
+			});
+		}
+	}
+</script>
+
+<div style="width:50%;margin: 0 auto">
+	<h1>Registrieren:</h1>
+	<div class="flex flex-col gap-4">
+		<div class="flex flex-row gap-4 w-full">
+			<div class="w-1/2">
+				<h4>Vorname</h4>
+				<input
+					type="text"
+					placeholder="Vorname"
+					class="px-2.5 py-1.5 rounded-lg border bg-gray-50"
+					bind:value={vorname}
+					required
+				/>
+			</div>
+			<div class="w-1/2">
+				<h4>Nachname</h4>
+				<input
+					type="text"
+					placeholder="Nachname"
+					class="px-2.5 py-1.5 rounded-lg border bg-gray-50"
+					bind:value={name}
+					required
+				/>
+			</div>
+		</div>
+		<div>
+			<h4>Email</h4>
+			<input
+				type="text"
+				placeholder="Email"
+				class="px-2.5 py-1.5 rounded-lg border bg-gray-50"
+				bind:value={email}
+				required
+			/>
+		</div>
+		<div>
+			<h4>Passwort</h4>
+			<input
+				type="password"
+				placeholder="********"
+				class="px-2.5 py-1.5 rounded-lg border bg-gray-50"
+				bind:value={passwort}
+				required
+			/>
+		</div>
+		<button class="button" on:click={login}>Registrieren</button>
+		<div class="flex-row justify-between" style="margin-top: 10px">
+			<a href="/auth/embedded-login">Einloggen</a>
+			<a href="/user/passwort_vergessen">Passwort Vergessen?</a>
+		</div>
+	</div>
+</div>

src/modules/KundendatenModule.svelte

@@ -18,7 +18,7 @@
 	let datenschutzAkzeptiert: boolean;
 
 	async function createPayment() {
-		const response = await client.v1.payments.create.mutate({
+		const response = await client.v1.rechnungen.erstellen.mutate({
 			ausweisart: "VerbrauchsausweisWohnen",
 			uid: ausweis.uid,
 			payment_method: selectedPaymentType,

src/pages/auth/embedded-signup.astro

@@ -0,0 +1,10 @@
+---
+import BlankLayout from "#layouts/BlankLayout.astro";
+import EmbeddedRegisterModule from "#modules/EmbeddedRegisterModule.svelte";
+
+const redirect = Astro.url.searchParams.get("redirect");
+---
+
+<BlankLayout title="Registrieren - IBCornelsen">
+	<EmbeddedRegisterModule client:only></EmbeddedRegisterModule>
+</BlankLayout>