feat(portal-frontend): implement edit-applicant-details form with write-through disclaimer

Shared form for writeThrough and owned modes. Shows the ADR-002
disclaimer only in writeThrough mode (no client-side validation
stricter than legacy provides). Maps 400 ErrorsResponse to per-field
inline errors, 422/409 to a banner with the server's own text -
never a client-side switch over invariant names. Embedded in
case-detail with reload() on save so the actions block refreshes.
This commit is contained in:
eho
2026-07-31 08:59:55 +02:00
parent cebbf9f57a
commit 9e031da724
7 changed files with 317 additions and 2 deletions
@@ -0,0 +1,73 @@
<form (ngSubmit)="submit()">
@if (isWriteThrough) {
<p class="disclaimer" data-testid="write-through-disclaimer">
Gevalideerd door het legacy systeem — Angular voegt hier geen eigen validatie toe.
</p>
}
@if (banner) {
<p class="banner" data-testid="edit-details-banner">{{ banner }}</p>
}
<label>
Achternaam
<input type="text" name="surname" required [(ngModel)]="surname" />
</label>
@if (fieldErrors['surname']; as error) {
<p class="field-error" data-testid="field-error-surname">{{ error }}</p>
}
<label>
Voorletters
<input type="text" name="initials" required [(ngModel)]="initials" />
</label>
<label>
Straat
<input type="text" name="street" [(ngModel)]="street" />
</label>
<label>
Huisnummer
<input type="text" name="number" [(ngModel)]="number" />
</label>
@if (fieldErrors['address.number']; as error) {
<p class="field-error" data-testid="field-error-address.number">{{ error }}</p>
}
<label>
Postcode
<input type="text" name="postalCode" [(ngModel)]="postalCode" />
</label>
@if (fieldErrors['address.postalCode']; as error) {
<p class="field-error" data-testid="field-error-address.postalCode">{{ error }}</p>
}
<label>
Plaats
<input type="text" name="city" [(ngModel)]="city" />
</label>
<label>
E-mail
<input type="email" name="email" [(ngModel)]="email" />
</label>
@if (fieldErrors['email']; as error) {
<p class="field-error" data-testid="field-error-email">{{ error }}</p>
}
<label>
Telefoon
<input type="text" name="phone" [(ngModel)]="phone" />
</label>
@if (fieldErrors['phone']; as error) {
<p class="field-error" data-testid="field-error-phone">{{ error }}</p>
}
<label>
Voorkeurskanaal
<input type="text" name="preferredChannel" required [(ngModel)]="preferredChannel" />
</label>
<button type="submit">Opslaan</button>
</form>