diff options
Diffstat (limited to 'src/routes/grocery')
| -rw-r--r-- | src/routes/grocery/[id]/+page.svelte | 216 |
1 files changed, 109 insertions, 107 deletions
diff --git a/src/routes/grocery/[id]/+page.svelte b/src/routes/grocery/[id]/+page.svelte index 6588ec0..1aa28b4 100644 --- a/src/routes/grocery/[id]/+page.svelte +++ b/src/routes/grocery/[id]/+page.svelte @@ -19,129 +19,131 @@ let qualityScore = $state(''); </script> -<form - class="form-card" - method="POST" - action="?/update" - use:enhance={() => { - return async ({ update }) => { - await update({ reset: false }); - }; - }} -> - <label> - <span class="form-label">Nom</span> - <input class="form-input" type="text" name="name" bind:value={name} /> - </label> - <label> - <span class="form-label">Catégorie</span> - <select class="form-select" name="category_id" bind:value={categoryId}> - <option value={-1}>—</option> - {#each data.categories as cat (cat.id)} - <option value={cat.id}>{cat.name}</option> - {/each} - </select> - </label> - <button class="btn-primary" type="submit" - >{saved ? '✓ Enregistré' : 'Enregistrer'}</button +<main> + <form + class="form-card" + method="POST" + action="?/update" + use:enhance={() => { + return async ({ update }) => { + await update({ reset: false }); + }; + }} > -</form> - -<hr /> - -<h2>Références</h2> - -<form class="form-card" method="POST" action="?/add" use:enhance> - <label> - <span class="form-label">Référence</span> - <input - class="form-input" - type="text" - name="reference" - bind:value={reference} - placeholder="ex. Carte Noire" - autocomplete="off" - /> - </label> - <div class="ref-row"> <label> - <span class="form-label">Prix</span> - <input - class="form-input" - type="number" - name="price" - bind:value={price} - placeholder="5.99" - step="0.01" - /> + <span class="form-label">Nom</span> + <input class="form-input" type="text" name="name" bind:value={name} /> </label> <label> - <span class="form-label">Unité</span> - <select class="form-select" name="unit" bind:value={unit}> - <option value="€/kg">€/kg</option> - <option value="€/L">€/L</option> - <option value="€/u">€/u</option> + <span class="form-label">Catégorie</span> + <select class="form-select" name="category_id" bind:value={categoryId}> + <option value={-1}>—</option> + {#each data.categories as cat (cat.id)} + <option value={cat.id}>{cat.name}</option> + {/each} </select> </label> + <button class="btn-primary" type="submit" + >{saved ? '✓ Enregistré' : 'Enregistrer'}</button + > + </form> + + <hr /> + + <h2>Références</h2> + + <form class="form-card" method="POST" action="?/add" use:enhance> <label> - <span class="form-label">Note</span> + <span class="form-label">Référence</span> <input class="form-input" - type="number" - name="quality_score" - bind:value={qualityScore} - placeholder="0–100" - min="0" - max="100" + type="text" + name="reference" + bind:value={reference} + placeholder="ex. Carte Noire" + autocomplete="off" /> </label> - </div> - <button class="btn-primary" type="submit">Ajouter une référence</button> -</form> + <div class="ref-row"> + <label> + <span class="form-label">Prix</span> + <input + class="form-input" + type="number" + name="price" + bind:value={price} + placeholder="5.99" + step="0.01" + /> + </label> + <label> + <span class="form-label">Unité</span> + <select class="form-select" name="unit" bind:value={unit}> + <option value="€/kg">€/kg</option> + <option value="€/L">€/L</option> + <option value="€/u">€/u</option> + </select> + </label> + <label> + <span class="form-label">Note</span> + <input + class="form-input" + type="number" + name="quality_score" + bind:value={qualityScore} + placeholder="0–100" + min="0" + max="100" + /> + </label> + </div> + <button class="btn-primary" type="submit">Ajouter une référence</button> + </form> -{#if form?.error} - <p class="error">{form.error}</p> -{/if} + {#if form?.error} + <p class="error">{form.error}</p> + {/if} -<form method="POST" action="?/delete" use:enhance> - <ul class="item-list item-list--wide"> - {#each data?.references ?? [] as ref (ref.id)} - <li class="item-row item-row--ref"> - <div class="ref-info"> - <strong>{ref.reference}</strong> - {#if ref.price} - <span class="ref-detail" - >{ref.price.toFixed(2)}{ref.unit ? ` ${ref.unit}` : ''}</span - > - {/if} - {#if ref.qualityScore != null} - <span class="ref-detail">Note : {ref.qualityScore}/100</span> - {/if} - </div> - <button - class="btn-ghost" - name="id" - value={ref.id} - type="submit" - aria-label="Supprimer" - > - × - </button> - </li> - {/each} - </ul> -</form> + <form method="POST" action="?/delete" use:enhance> + <ul class="item-list item-list--wide"> + {#each data?.references ?? [] as ref (ref.id)} + <li class="item-row item-row--ref"> + <div class="ref-info"> + <strong>{ref.reference}</strong> + {#if ref.price} + <span class="ref-detail" + >{ref.price.toFixed(2)}{ref.unit ? ` ${ref.unit}` : ''}</span + > + {/if} + {#if ref.qualityScore != null} + <span class="ref-detail">Note : {ref.qualityScore}/100</span> + {/if} + </div> + <button + class="btn-ghost" + name="id" + value={ref.id} + type="submit" + aria-label="Supprimer" + > + × + </button> + </li> + {/each} + </ul> + </form> -{#if (data?.references?.length ?? 0) === 0} - <p class="empty">Aucune référence</p> -{/if} + {#if (data?.references?.length ?? 0) === 0} + <p class="empty">Aucune référence</p> + {/if} -<form method="POST" action="?/deleteItem" use:enhance> - <input type="hidden" name="from" value={data.from} /> - <button type="submit" class="delete-item-btn">Supprimer l'article</button> -</form> + <form method="POST" action="?/deleteItem" use:enhance> + <input type="hidden" name="from" value={data.from} /> + <button type="submit" class="delete-item-btn">Supprimer l'article</button> + </form> -<a href={data.from} class="back-link">← Retour</a> + <a href={data.from} class="back-link">← Retour</a> +</main> <style> .ref-row { |