Dashboard Verbessert
This commit is contained in:
@@ -7,14 +7,57 @@
|
||||
} from "radix-svelte-icons";
|
||||
import { Tabs, Tab, TabList, TabPanel } from "../../components/Tabs";
|
||||
import { dialogs } from "../../../svelte-dialogs.config";
|
||||
import { BenutzerClient } from "#components/Ausweis/types";
|
||||
import { client } from "src/trpc";
|
||||
import { exclude } from "#lib/exclude";
|
||||
|
||||
function profilSpeichern() {
|
||||
dialogs.confirm({
|
||||
export let benutzer: BenutzerClient;
|
||||
|
||||
let passwort: string | undefined = undefined;
|
||||
let passwortVerify: string | undefined = undefined;
|
||||
async function profilSpeichern(e: SubmitEvent) {
|
||||
e.preventDefault()
|
||||
if (!passwort) {
|
||||
passwort = undefined
|
||||
} else {
|
||||
if (passwort.length < 8) {
|
||||
dialogs.alert({
|
||||
title: "Passwort zu kurz",
|
||||
text: "Das Passwort muss mindestens 8 Zeichen lang sein.",
|
||||
})
|
||||
return
|
||||
} else if (passwort !== passwortVerify) {
|
||||
dialogs.alert({
|
||||
title: "Passwörter stimmen nicht überein",
|
||||
text: "Die eingegebenen Passwörter stimmen nicht überein.",
|
||||
})
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
const response = await dialogs.confirm({
|
||||
title: "Profil speichern",
|
||||
text: "Möchtest du deine Änderungen speichern?",
|
||||
confirmButtonText: "Speichern",
|
||||
declineButtonText: "Abbrechen",
|
||||
})
|
||||
|
||||
if (!response) return;
|
||||
|
||||
const benutzerObjekt = exclude({
|
||||
...benutzer,
|
||||
passwort
|
||||
}, ["rolle"])
|
||||
|
||||
// Wir wollen die Rolle nicht mit übertragen.
|
||||
// Diese wird zwar sowieso rausgeschmissen aber sonst kommen wir nicht durch die Validation durch...
|
||||
await client.v1.benutzer.update.mutate(benutzerObjekt)
|
||||
|
||||
dialogs.success({
|
||||
title: "Profil gespeichert",
|
||||
text: "Deine Änderungen wurden erfolgreich gespeichert.",
|
||||
dismissButtonClass: "btn btn-success"
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -62,34 +105,51 @@
|
||||
>
|
||||
<TabPanel>
|
||||
<h2 class="text-2xl font-medium">Profil</h2>
|
||||
<div class="flex flex-col gap-4 my-4 max-w-2xl">
|
||||
<form class="flex flex-col gap-4 my-4 max-w-2xl" on:submit={profilSpeichern}>
|
||||
<div class="flex flex-row gap-4">
|
||||
<div class="flex flex-col">
|
||||
<span class="whitespace-nowrap">Vorname</span>
|
||||
<input type="password" class="input text-base-content font-medium" placeholder="Max">
|
||||
<input type="text" class="input text-base-content font-medium" placeholder="Max" bind:value={benutzer.vorname}>
|
||||
</div>
|
||||
<div class="flex flex-col">
|
||||
<span class="whitespace-nowrap">Nachname</span>
|
||||
<input type="password" class="input text-base-content font-medium" placeholder="Müller">
|
||||
<input type="text" class="input text-base-content font-medium" placeholder="Müller" bind:value={benutzer.name}>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-col">
|
||||
<span class="whitespace-nowrap">Email Adresse</span>
|
||||
<input type="text" class="input text-base-content font-medium" placeholder="name@email.com" value="zobhusdi@wo.tk">
|
||||
<input type="email" class="input text-base-content font-medium" placeholder="name@email.com" bind:value={benutzer.email}>
|
||||
</div>
|
||||
<div class="flex flex-col">
|
||||
<span class="whitespace-nowrap">Telefonnummer</span>
|
||||
<input type="phone" class="input text-base-content font-medium" placeholder="040 12345678" bind:value={benutzer.telefon}>
|
||||
</div>
|
||||
<div class="flex flex-row gap-4">
|
||||
<div class="flex flex-col">
|
||||
<span class="whitespace-nowrap">Adresse</span>
|
||||
<input type="text" class="input text-base-content font-medium" placeholder="Musterstraße 123" bind:value={benutzer.adresse}>
|
||||
</div>
|
||||
<div class="flex flex-col">
|
||||
<span class="whitespace-nowrap">PLZ</span>
|
||||
<input type="text" class="input text-base-content font-medium" placeholder="12345" bind:value={benutzer.plz}>
|
||||
</div>
|
||||
<div class="flex flex-col">
|
||||
<span class="whitespace-nowrap">Ort</span>
|
||||
<input type="text" class="input text-base-content font-medium" placeholder="Musterhausen" bind:value={benutzer.ort}>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-row gap-4">
|
||||
<div class="flex flex-col">
|
||||
<span class="whitespace-nowrap">Passwort</span>
|
||||
<input type="password" class="input text-base-content font-medium" placeholder="*********">
|
||||
<input type="password" class="input text-base-content font-medium" placeholder="*********" bind:value={passwort}>
|
||||
</div>
|
||||
<div class="flex flex-col">
|
||||
<span class="whitespace-nowrap">Passwort bestätigen</span>
|
||||
<input type="password" class="input text-base-content font-medium" placeholder="*********">
|
||||
<input type="password" class="input text-base-content font-medium" placeholder="*********" bind:value={passwortVerify}>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button class="btn btn-primary" on:click={profilSpeichern}>Speichern</button>
|
||||
<button class="btn btn-primary" type="submit">Speichern</button>
|
||||
</form>
|
||||
</TabPanel>
|
||||
<TabPanel>
|
||||
<h1>Panel Two</h1>
|
||||
|
||||
Reference in New Issue
Block a user