Added Registerpage

This commit is contained in:
Jan Meinl
2026-04-12 15:45:18 +02:00
parent b47c9ce5db
commit bed5ee4179
2 changed files with 33 additions and 26 deletions
+8
View File
@@ -57,6 +57,14 @@ export class AppRoot extends LitElement {
return document.createElement('login-page'); return document.createElement('login-page');
}, },
}, },
{
path: '/register',
auth: 'public',
view: async () => {
await import('./pages/auth/register-page.js');
return document.createElement('register-page');
},
},
// ── Target Team (Code-geschützt) ───────────────────── // ── Target Team (Code-geschützt) ─────────────────────
{ {
+21 -22
View File
@@ -1,6 +1,5 @@
import { LitElement, html, css } from 'lit'; import { LitElement, html, css } from 'lit';
import { customElement, state } from 'lit/decorators.js'; import { customElement, state } from 'lit/decorators.js';
import { apiPost } from '../../api/api';
import '../../components/auth-card.ts'; import '../../components/auth-card.ts';
import '../../components/form-input.ts'; import '../../components/form-input.ts';
import '../../components/ui-button'; import '../../components/ui-button';
@@ -34,23 +33,30 @@ export class RegisterPage extends LitElement {
this.error = null; this.error = null;
this.loading = true; this.loading = true;
try { try {
await apiPost<{ id: number; name: string; email: string }>( //const response = await fetch('/api/auth/register', {
'/api/auth/register', const response = await fetch('http://127.0.0.1:8080/auth/register', {
{ method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
name: this.name, name: this.name,
email: this.email, email: this.email,
password: this.password, password: this.password,
}),
});
if (!response.ok) {
const err = await response.json().catch(() => null);
this.error = err?.message ?? 'Registration failed';
return;
} }
);
window.dispatchEvent( window.dispatchEvent(new CustomEvent('nav', {
new CustomEvent('nav', {
detail: { path: '/login' }, detail: { path: '/login' },
bubbles: true, bubbles: true,
composed: true, composed: true,
}) }));
); } catch {
} catch (e: any) { this.error = 'Netzwerkfehler. Bitte erneut versuchen.';
this.error = e.message || 'Registration failed';
} finally { } finally {
this.loading = false; this.loading = false;
} }
@@ -66,8 +72,7 @@ export class RegisterPage extends LitElement {
label="Name" label="Name"
placeholder="Your full name" placeholder="Your full name"
.value=${this.name} .value=${this.name}
@value-changed=${(e: CustomEvent) => @value-changed=${(e: CustomEvent) => (this.name = e.detail.value)}
(this.name = e.detail.value)}
></form-input> ></form-input>
<form-input <form-input
@@ -75,8 +80,7 @@ export class RegisterPage extends LitElement {
type="email" type="email"
placeholder="you@example.com" placeholder="you@example.com"
.value=${this.email} .value=${this.email}
@value-changed=${(e: CustomEvent) => @value-changed=${(e: CustomEvent) => (this.email = e.detail.value)}
(this.email = e.detail.value)}
></form-input> ></form-input>
<form-input <form-input
@@ -84,17 +88,12 @@ export class RegisterPage extends LitElement {
type="password" type="password"
placeholder="Choose a password" placeholder="Choose a password"
.value=${this.password} .value=${this.password}
@value-changed=${(e: CustomEvent) => @value-changed=${(e: CustomEvent) => (this.password = e.detail.value)}
(this.password = e.detail.value)}
></form-input> ></form-input>
<notify-bar type="error" .message=${this.error}></notify-bar> <notify-bar type="error" .message=${this.error}></notify-bar>
<ui-button <ui-button full ?disabled=${this.loading} @click=${this.handleRegister}>
full
?disabled=${this.loading}
@click=${this.handleRegister}
>
${this.loading ? 'Creating account...' : 'Create account'} ${this.loading ? 'Creating account...' : 'Create account'}
</ui-button> </ui-button>