From 9a5dd6d6c02d06c063a2e3b7030e2cb197fb2ddd Mon Sep 17 00:00:00 2001 From: Thijn Date: Mon, 2 Dec 2024 11:47:26 +0100 Subject: [PATCH] added dropdown for geslacht --- src/entities/klanten/klanten.mock.ts | 2 +- src/entities/klanten/klanten.ts | 6 ++--- src/entities/klanten/klanten.types.ts | 2 +- src/modals/klanten/EditKlant.vue | 36 ++++++++++++++++++------- src/modals/klanten/SearchKlantModal.vue | 8 +++++- 5 files changed, 38 insertions(+), 16 deletions(-) diff --git a/src/entities/klanten/klanten.mock.ts b/src/entities/klanten/klanten.mock.ts index 842277e..95f3d62 100644 --- a/src/entities/klanten/klanten.mock.ts +++ b/src/entities/klanten/klanten.mock.ts @@ -10,7 +10,7 @@ export const mockKlantData = (): TKlant[] => [ achternaam: 'Doe', bsn: '1234567890', geboortedatum: '1990-01-01', - isMale: true, + geslacht: 'man', land: 'Nederland', telefoonnummer: '0612345678', emailadres: 'john.doe@example.com', diff --git a/src/entities/klanten/klanten.ts b/src/entities/klanten/klanten.ts index b3f7c4e..aa02342 100644 --- a/src/entities/klanten/klanten.ts +++ b/src/entities/klanten/klanten.ts @@ -11,7 +11,7 @@ export class Klant implements TKlant { public achternaam: string public bsn: string public geboortedatum: string - public isMale: boolean + public geslacht: "man" | "vrouw" | "overige" public land: string public telefoonnummer: string @@ -42,7 +42,7 @@ export class Klant implements TKlant { this.achternaam = source.achternaam || '' this.bsn = source.bsn || '' this.geboortedatum = source.geboortedatum || '' - this.isMale = source.isMale || false + this.geslacht = source.geslacht || null this.land = source.land || '' this.telefoonnummer = source.telefoonnummer || '' this.emailadres = source.emailadres || '' @@ -71,7 +71,7 @@ export class Klant implements TKlant { achternaam: z.string(), bsn: z.string(), geboortedatum: z.string(), - isMale: z.boolean(), + geslacht: z.enum(["man", "vrouw", "overige"]).or(z.null()), land: z.string(), telefoonnummer: z.string(), emailadres: z.string().email(), diff --git a/src/entities/klanten/klanten.types.ts b/src/entities/klanten/klanten.types.ts index 83c11bc..7d7c13b 100644 --- a/src/entities/klanten/klanten.types.ts +++ b/src/entities/klanten/klanten.types.ts @@ -8,7 +8,7 @@ export type TKlant = { achternaam: string; bsn: string; geboortedatum: string; - isMale: boolean; + geslacht: 'man' | 'vrouw' | 'overige'; land: string; telefoonnummer: string; emailadres: string; diff --git a/src/modals/klanten/EditKlant.vue b/src/modals/klanten/EditKlant.vue index 7f36202..c7c6e9c 100644 --- a/src/modals/klanten/EditKlant.vue +++ b/src/modals/klanten/EditKlant.vue @@ -47,13 +47,18 @@ import { klantStore, navigationStore } from '../../store/store.js' :disabled="loading" input-label="Geboortedatum" /> - - Is een man? - + + + @@ -180,7 +185,6 @@ import { NcNoteCard, NcSelect, NcDateTimePicker, - NcCheckboxRadioSwitch, } from '@nextcloud/vue' import { countries } from '../../data/countries.js' @@ -200,7 +204,6 @@ export default { NcNoteCard, NcSelect, NcDateTimePicker, - NcCheckboxRadioSwitch, // Icons ContentSaveOutline, Cancel, @@ -226,7 +229,7 @@ export default { achternaam: '', bsn: '', geboortedatum: '', - isMale: false, + geslacht: '', land: '', telefoonnummer: '', emailadres: '', @@ -252,6 +255,14 @@ export default { { value: 'organisatie', label: 'Organisatie' }, ], }, + sexOptions: { + options: [ + { value: 'man', label: 'Man' }, + { value: 'vrouw', label: 'Vrouw' }, + { value: 'overige', label: 'Overige' }, + ], + value: { value: 'man', label: 'Man' }, + }, } }, computed: { @@ -266,6 +277,8 @@ export default { const country = this.countryOptions.options.find((option) => option.id === klantStore.klantItem?.land) + const sex = this.sexOptions.options.find((option) => option.value === klantStore.klantItem?.geslacht) + if (klantStore.klantItem?.id) { this.klantItem = { ...klantStore.klantItem, @@ -275,7 +288,7 @@ export default { achternaam: klantStore.klantItem.achternaam || '', bsn: klantStore.klantItem.bsn || '', geboortedatum: klantStore.klantItem.geboortedatum ? new Date(klantStore.klantItem.geboortedatum) : '', - isMale: klantStore.klantItem.isMale || false, + geslacht: sex || { value: 'man', label: 'Man' }, land: country || '', telefoonnummer: klantStore.klantItem.telefoonnummer || '', emailadres: klantStore.klantItem.emailadres || '', @@ -313,7 +326,7 @@ export default { achternaam: '', bsn: '', geboortedatum: '', - isMale: false, + geslacht: '', land: '', telefoonnummer: '', emailadres: '', @@ -333,6 +346,8 @@ export default { subjectIdentificatie: '', subjectType: '', } + + this.sexOptions.value = { value: 'man', label: 'Man' } }, async editKlant() { this.loading = true @@ -343,6 +358,7 @@ export default { type: this.klantItem.type.value, geboortedatum: this.klantItem.geboortedatum !== '' && new Date(this.klantItem.geboortedatum).toISOString(), land: this.klantItem.land.id, + geslacht: this.sexOptions.value.value, }) this.success = true this.loading = false @@ -361,7 +377,7 @@ export default { diff --git a/src/modals/klanten/SearchKlantModal.vue b/src/modals/klanten/SearchKlantModal.vue index 2f575f9..f0721b9 100644 --- a/src/modals/klanten/SearchKlantModal.vue +++ b/src/modals/klanten/SearchKlantModal.vue @@ -99,7 +99,7 @@ import { klantStore } from '../../store/store.js'