add personal address

This commit is contained in:
fabien committed 2026-08-18 23:57:08 +02:00
1 parent 50d1ba630e
commit d2a153536f
17 files changed
+239 -50

No files matched your search

@@ -2,17 +2,24 @@
import { SvelteMap } from 'svelte/reactivity';
import type { PageProps } from './$types';
import { type User } from '$lib/types/api'
import type { User, Address } from '$lib/types/api'
import { userApi } from '$lib/api/endpoints/user'
import FormError from '$lib/components/FormError.svelte';
import { applyTheme, themeToLocalStorage } from '$lib/ui/themeswitcher';
import { validateEmail } from '$lib/utilities/validators'
import { onMount } from 'svelte';
let { data }: PageProps = $props();
let form : User = $state(data.me)
let addresses : Address[] = $state([] as Address[])
let newAddress : Address = $state({} as Address)
let errors = new SvelteMap<string,string>()
onMount(async ()=> {
addresses = await userApi.listAddresses(form.id)
})
$effect(()=>{
themeToLocalStorage(form.theme)
applyTheme()
@@ -36,6 +43,21 @@
}
}
const handleAddAddress = () => {
userApi.createAddress(form.id, newAddress)
.then((data)=>{
addresses.push(data)
newAddress = {} as Address
})
.catch((error)=>{ console.log(error) })
}
const handleDeleteAddress = (id: string) => {
userApi.deleteAddress(form.id,id).then(()=>{
addresses = addresses.filter((a)=> a.id!=id)
}).catch((error)=>{console.log(error)})
}
</script>
<div class="mb-4 formgroup">
@@ -106,4 +128,30 @@
<div class="mb-4 formgroup">
<h2>Canaux de communication</h2>
{#each addresses as address (address.id) }
<div class="m-2">
<div class="bg-stone-600 rounded flex inline px-2 py-1">
<span>{address.type} : </span>
<span class="font-bold">{address.address}</span>
<button class="ml-4 pointer" onclick={()=>{handleDeleteAddress(address.id)}}>X</button>
</div>
</div>
{/each}
<div class="flex gap-2 mt-6">
<div>
<select bind:value={newAddress.type} class="textinput">
<option>Email</option>
<option>Telegram</option>
<option>Whatsapp</option>
</select>
</div>
<div class="flex-1">
<input type="text" bind:value={newAddress.address} class="textinput" />
</div>
<div>
<button class="bt" onclick={handleAddAddress}>Ajouter</button>
</div>
</div>
</div>
@@ -31,6 +31,12 @@
if (!validateEmail(form.email)) {
errors.set("email","Adresse email invalide !")
}
if (!form.firstname) {
errors.set("firstname","Le prénom est obligatoire !")
}
if (!form.lastname) {
errors.set("lastname","Le nom est obligatoire !")
}
if (form.password!==form.verifPassword) {
errors.set("verifPassword","Les mots de pass ne correspondent pas.")
}
+1 -1
View File
@@ -28,7 +28,7 @@ h2 {
@apply cursor-pointer;
}
.bt {
@apply cursor-pointer rounded bg-stone-200 px-4 py-2 hover:bg-stone-300 dark:bg-stone-800 dark:hover:bg-stone-700;
@apply cursor-pointer rounded bg-stone-200 px-4 py-1 hover:bg-stone-300 dark:bg-stone-800 dark:hover:bg-stone-700;
}
.menuitem {
@apply text-stone-800 text-stone-950 dark:text-stone-300 hover:dark:text-stone-50;