refactor viewer-login page with error messages and validation

This commit is contained in:
2025-10-30 08:57:58 +01:00
parent e26b36121a
commit c857041e21
2 changed files with 22 additions and 45 deletions

View File

@@ -9,6 +9,7 @@
const vorgangToken = page.url.searchParams.get('vorgang');
</script>
{#if vorgangToken}
<div class="flex min-h-full flex-col justify-center px-6 py-12 lg:px-8">
<div class="sm:mx-auto sm:w-full sm:max-w-sm">
<img class="mx-auto h-10 w-auto" src="/Landeswappen_NI.svg" alt="Landeswappen Niedersachsen" />
@@ -20,8 +21,8 @@
<div class="w-full max-w-sm mx-auto">
<div class="relative mt-5 bg-gray-50 rounded-xl shadow-xl p-3 pt-1">
<div class="mt-10">
{#if vorgangToken}
<form action={ROUTE_NAMES.ANMELDUNG_GET_VORGANG_BY_TOKEN} method="POST">
<form method="POST">
<input type="hidden" name="vorgang-token" value={vorgangToken} />
<div class="mt-5">
<BaseInputField
@@ -33,48 +34,17 @@
error={form?.error?.message}
/>
</div>
{#if form?.message}
<p class="block text-sm leading-6 text-red-900 mt-2">{form.message}</p>
{/if}
<div class="flex justify-end pt-4">
<Button type="submit"><ArrowRight /></Button>
</div>
</form>
{:else}
<form action={ROUTE_NAMES.ANMELDUNG_LOGIN} method="POST">
<div>
<label for="user" class="text-sm font-medium leading-6 text-gray-900">Name</label>
<div class="mt-2">
<input
id="user"
name="user"
type="text"
autocomplete="email"
required
class="rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6"
/>
</div>
</div>
<div>
<label for="password" class="block text-sm font-medium leading-6 text-gray-900"
>Passwort</label
>
<div class="mt-2">
<input
id="password"
name="password"
type="password"
autocomplete="current-password"
required
class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6"
/>
</div>
</div>
<div class="flex justify-end">
<Button type="submit" class="mt-5">Anmelden</Button>
</div>
</form>
{/if}
</div>
</div>
</div>
</div>
{/if}