96 lines
2.2 KiB
Svelte
96 lines
2.2 KiB
Svelte
<script lang="ts">
|
|
import { addNotification } from "@ibcornelsen/ui";
|
|
import { client } from "src/trpc";
|
|
|
|
export let navigate: (target: string) => void;
|
|
export let onRegister: (response: { email: string, name: string, vorname: string }) => void;
|
|
let passwort: string;
|
|
let email: string;
|
|
let vorname: string;
|
|
let name: string;
|
|
|
|
async function signUp(e: SubmitEvent) {
|
|
e.preventDefault()
|
|
try {
|
|
const response = await client.v1.benutzer.erstellen.mutate({
|
|
email,
|
|
passwort,
|
|
vorname,
|
|
name,
|
|
});
|
|
|
|
onRegister({
|
|
email,
|
|
name,
|
|
vorname
|
|
})
|
|
} 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>
|
|
|
|
<form style="width:50%;margin: 0 auto" name="signup" on:submit={signUp}>
|
|
<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"
|
|
name="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"
|
|
name="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="email"
|
|
placeholder="Email"
|
|
name="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="********"
|
|
name="passwort"
|
|
class="px-2.5 py-1.5 rounded-lg border bg-gray-50"
|
|
bind:value={passwort}
|
|
required
|
|
/>
|
|
</div>
|
|
<button class="button" type="submit">Registrieren</button>
|
|
<div class="flex-row justify-between" style="margin-top: 10px">
|
|
<button on:click={() => navigate("login")}>Einloggen</button>
|
|
<a href="/user/passwort_vergessen">Passwort Vergessen?</a>
|
|
</div>
|
|
</div>
|
|
</form>
|