Files
online-energieausweis/src/components/LoginView.svelte
2023-04-14 15:30:52 +04:00

71 lines
1.6 KiB
Svelte

<script lang="ts">
import cookie from "cookiejs"
let email: string;
let password: string;
let hasError: boolean;
async function login() {
const response = await fetch("/api/login", {
method: "POST",
body: JSON.stringify({
email, password
})
})
const json = await response.json()
if (json.success == true) {
cookie.set("token", json.data.token);
cookie.set("expires", json.data.expires);
localStorage.setItem("token", json.data.token);
localStorage.setItem("expires", json.data.expires);
window.location.href = "/user";
} else {
hasError = true;
}
}
</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>
<input
type="text"
placeholder="Email"
name="email"
class="formInput"
bind:value={email}
required
/>
</div>
<div class="block_4">
<h4 class="heading_3">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>
<div class="flex-row justify-between" style="margin-top: 10px">
<a href="/">Home</a>
<a href="/user/passwort_vergessen">Passwort Vergessen?</a>
</div>
</div>
</div>