Spaces:
Running
Running
File size: 2,029 Bytes
edcd76e 2b4c12e edcd76e | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 | <script lang="ts">
import { enhance } from '$app/forms';
import type { PublicUser } from '$lib/domain/types';
import type { FieldErrors, SettlementField, SettlementFormValues } from '$lib/forms/types';
import FormError from './FormError.svelte';
let {
members,
currency,
values,
errors = {},
version,
submitLabel
}: {
members: PublicUser[];
currency: string;
values: SettlementFormValues;
errors?: FieldErrors<SettlementField>;
version?: number;
submitLabel: string;
} = $props();
</script>
<form method="POST" use:enhance class="space-y-4">
{#if version !== undefined}<input type="hidden" name="version" value={version} />{/if}
<div class="grid grid-cols-2 gap-3">
<div>
<label for="from">Who paid</label>
<select id="from" name="from" value={values.from}>
<option value="">Choose…</option>
{#each members as m (m.id)}<option value={m.id}>{m.displayName}</option>{/each}
</select>
<FormError message={errors.from} />
</div>
<div>
<label for="to">Who received</label>
<select id="to" name="to" value={values.to}>
<option value="">Choose…</option>
{#each members as m (m.id)}<option value={m.id}>{m.displayName}</option>{/each}
</select>
<FormError message={errors.to} />
</div>
</div>
<div class="grid grid-cols-2 gap-3">
<div>
<label for="amount">Amount ({currency})</label>
<input
id="amount"
name="amount"
inputmode="decimal"
placeholder="0.00"
required
value={values.amount}
/>
<FormError message={errors.amount} />
</div>
<div>
<label for="date">Date</label>
<input id="date" name="date" type="date" required value={values.date} />
<FormError message={errors.date} />
</div>
</div>
<div>
<label for="note">Note (optional)</label>
<input id="note" name="note" maxlength="2000" value={values.note} />
</div>
<FormError message={errors.form} />
<button type="submit" class="w-full rounded-lg bg-green-700 py-3 font-semibold text-white"
>{submitLabel}</button
>
</form>
|