From 21b728de5e6c0de7b96849b71fa61fdfd8edcd57 Mon Sep 17 00:00:00 2001
From: Remko <remko@conduction.nl>
Date: Fri, 6 Dec 2024 12:39:36 +0100
Subject: [PATCH] Cleanup

---
 src/entities/taak/taak.mock.ts              |  1 +
 src/entities/taak/taak.ts                   |  4 +-
 src/entities/taak/taak.types.ts             |  3 +-
 src/modals/medewerkers/EditMedewerker.vue   | 13 ++++-
 src/modals/taken/EditTaak.vue               |  4 +-
 src/views/medewerkers/MedewerkerDetails.vue | 10 ++--
 src/views/medewerkers/MedewerkerList.vue    |  9 +---
 src/views/taken/TaakDetails.vue             | 56 +++++++++++++++++++--
 8 files changed, 79 insertions(+), 21 deletions(-)

diff --git a/src/entities/taak/taak.mock.ts b/src/entities/taak/taak.mock.ts
index 979f181..c938903 100644
--- a/src/entities/taak/taak.mock.ts
+++ b/src/entities/taak/taak.mock.ts
@@ -13,6 +13,7 @@ export const mockTaakData = (): TTaak[] => [
 		toelichting: 'Deze taak omvat het uitvoeren van een gedetailleerde interne audit van de bedrijfsprocessen om te controleren of alle afdelingen voldoen aan de vastgestelde kwaliteitsnormen. De bevindingen worden gedocumenteerd en er worden aanbevelingen gedaan voor verbeteringen.',
 		actie: 'Voorbereiden van auditchecklist, uitvoeren van audits, rapporteren van bevindingen, aanbevelen van verbeteringen.',
 		klant: 'urn:uuid:6ec0bd7f-11c0-43da-975e-2a8ad9ebae0b',
+		medewerker: 'urn:uuid:6ec0bd7f-11c0-43da-975e-2a8ad9ebae0b',
 	},
 ]
 
diff --git a/src/entities/taak/taak.ts b/src/entities/taak/taak.ts
index 8f75c80..9e34c14 100644
--- a/src/entities/taak/taak.ts
+++ b/src/entities/taak/taak.ts
@@ -14,7 +14,7 @@ export class Taak implements TTaak {
 	public toelichting: string
 	public actie: string
 	public klant: string
-
+	public medewerker: string
 	constructor(source: TTaak) {
 		this.id = source.id || ''
 		this.title = source.title || ''
@@ -26,6 +26,7 @@ export class Taak implements TTaak {
 		this.toelichting = source.toelichting || ''
 		this.actie = source.actie || ''
 		this.klant = source.klant || ''
+		this.medewerker = source.medewerker || ''
 	}
 
 	public validate(): SafeParseReturnType<TTaak, unknown> {
@@ -40,6 +41,7 @@ export class Taak implements TTaak {
 			toelichting: z.string(),
 			actie: z.string(),
 			klant: z.string(),
+			medewerker: z.string(),
 		})
 
 		return schema.safeParse(this)
diff --git a/src/entities/taak/taak.types.ts b/src/entities/taak/taak.types.ts
index 141bd6f..f1dc534 100644
--- a/src/entities/taak/taak.types.ts
+++ b/src/entities/taak/taak.types.ts
@@ -10,5 +10,6 @@ export type TTaak = {
     onderwerp: string;
     toelichting: string;
     actie: string;
-    klant: string;
+	klant: string
+	medewerker: string
 }
diff --git a/src/modals/medewerkers/EditMedewerker.vue b/src/modals/medewerkers/EditMedewerker.vue
index 130d194..a9db1da 100644
--- a/src/modals/medewerkers/EditMedewerker.vue
+++ b/src/modals/medewerkers/EditMedewerker.vue
@@ -33,7 +33,7 @@ import { medewerkerStore, navigationStore } from '../../store/store.js'
 			<NcTextField :disabled="loading"
 				label="Email adres"
 				maxlength="255"
-				:value.sync="medewerkerItem.emailadres" />
+				:value.sync="medewerkerItem.email" />
 		</div>
 
 		<template #actions>
@@ -119,6 +119,17 @@ export default {
 			return this.medewerkerItems
 		},
 	},
+	mounted() {
+		if (medewerkerStore.medewerkerItem?.id) {
+			this.medewerkerItem = {
+				...medewerkerStore.medewerkerItem,
+				voornaam: medewerkerStore.medewerkerItem.voornaam || '',
+				tussenvoegsel: medewerkerStore.medewerkerItem.tussenvoegsel || '',
+				achternaam: medewerkerStore.medewerkerItem.achternaam || '',
+				email: medewerkerStore.medewerkerItem.email || '',
+			}
+		}
+	},
 	updated() {
 		if (navigationStore.modal === 'editMedewerker' && !this.hasUpdated) {
 
diff --git a/src/modals/taken/EditTaak.vue b/src/modals/taken/EditTaak.vue
index d138611..bc0df2d 100644
--- a/src/modals/taken/EditTaak.vue
+++ b/src/modals/taken/EditTaak.vue
@@ -55,7 +55,7 @@ import { taakStore, navigationStore, klantStore, medewerkerStore } from '../../s
 				</NcCheckboxRadioSwitch>
 
 				<div>
-					<NcSelect v-if="clientType !== 'medewerker' || (clientType === 'both' && !useMedewerkerInsteadOfKlant)"
+					<NcSelect v-if="(clientType !== 'medewerker' && (clientType !== 'both' || clientType === 'both' && !useMedewerkerInsteadOfKlant))"
 						v-bind="klanten"
 						v-model="klanten.value"
 						:user-select="true"
@@ -63,7 +63,7 @@ import { taakStore, navigationStore, klantStore, medewerkerStore } from '../../s
 						:loading="klantenLoading"
 						:disabled="loading" />
 
-					<NcSelect v-if="clientType !== 'klant' || (clientType === 'both' && useMedewerkerInsteadOfKlant)"
+					<NcSelect v-if="(clientType !== 'klant' && (clientType !== 'both' || clientType === 'both' && useMedewerkerInsteadOfKlant))"
 						v-bind="medewerkers"
 						v-model="medewerkers.value"
 						:user-select="true"
diff --git a/src/views/medewerkers/MedewerkerDetails.vue b/src/views/medewerkers/MedewerkerDetails.vue
index 76bf8f5..bbeb7ce 100644
--- a/src/views/medewerkers/MedewerkerDetails.vue
+++ b/src/views/medewerkers/MedewerkerDetails.vue
@@ -16,7 +16,7 @@ import { navigationStore, medewerkerStore, taakStore, berichtStore, zaakStore }
 						<template #icon>
 							<DotsHorizontal :size="20" />
 						</template>
-						<NcActionButton @click="navigationStore.setModal('editKlant')">
+						<NcActionButton @click="navigationStore.setModal('editMedewerker')">
 							<template #icon>
 								<Pencil :size="20" />
 							</template>
@@ -40,7 +40,7 @@ import { navigationStore, medewerkerStore, taakStore, berichtStore, zaakStore }
 							</template>
 							Zaak starten
 						</NcActionButton>
-						<NcActionButton @click="navigationStore.setDialog('deleteKlant')">
+						<NcActionButton @click="navigationStore.setDialog('deleteMedewerker')">
 							<template #icon>
 								<TrashCanOutline :size="20" />
 							</template>
@@ -51,8 +51,10 @@ import { navigationStore, medewerkerStore, taakStore, berichtStore, zaakStore }
 				<span> {{ medewerkerStore.medewerkerItem.subject }} </span>
 
 				<div class="gridContent">
-					<b>Email adres:</b>
-					<p>{{ medewerkerStore.medewerkerItem.emailadres }}</p>
+					<div>
+						<b>Email adres:</b>
+						<p>{{ medewerkerStore.medewerkerItem.email }}</p>
+					</div>
 				</div>
 			</div>
 		</div>
diff --git a/src/views/medewerkers/MedewerkerList.vue b/src/views/medewerkers/MedewerkerList.vue
index f6c5bde..b43f6f4 100644
--- a/src/views/medewerkers/MedewerkerList.vue
+++ b/src/views/medewerkers/MedewerkerList.vue
@@ -44,7 +44,7 @@ import { navigationStore, medewerkerStore } from '../../store/store.js'
 							:size="44" />
 					</template>
 					<template #subname>
-						{{ getSubname(medewerker) }}
+						{{ medewerker.email }}
 					</template>
 					<template #actions>
 						<NcActionButton @click="medewerkerStore.setMedewerkerItem(medewerker); navigationStore.setModal('editMedewerker')">
@@ -119,12 +119,7 @@ export default {
 			return name
 		},
 		getName(medewerker) {
-			return medewerker?.voornaam ?? 'onbekend'
-
-		},
-		getSubname(medewerker) {
-			return medewerker?.tussenvoegsel ? `${medewerker.tussenvoegsel} ${medewerker.achternaam}` : medewerker?.achternaam ? `${medewerker.achternaam}` : 'onbekend'
-
+			return `${medewerker?.voornaam} ${medewerker?.tussenvoegsel} ${medewerker?.achternaam}`
 		},
 		deleteKlant() {
 			fetch(
diff --git a/src/views/taken/TaakDetails.vue b/src/views/taken/TaakDetails.vue
index dd2310d..da686ab 100644
--- a/src/views/taken/TaakDetails.vue
+++ b/src/views/taken/TaakDetails.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { navigationStore, taakStore, klantStore } from '../../store/store.js'
+import { navigationStore, taakStore, klantStore, medewerkerStore } from '../../store/store.js'
 </script>
 
 <template>
@@ -35,7 +35,24 @@ import { navigationStore, taakStore, klantStore } from '../../store/store.js'
 							<b>Sammenvatting:</b>
 							<span>{{ taakStore.taakItem.onderwerp }}</span>
 						</div>
-						<div>
+						<div v-if="taakStore.taakItem.medewerker">
+							<b>Medewerker:</b>
+							<span v-if="medewerkerLoading">Loading...</span>
+							<div v-if="!medewerkerLoading" class="buttonLinkContainer">
+								<span>{{ getMedewerkerName(medewerker) }}</span>
+								<NcActions>
+									<NcActionLink :aria-label="`ga naar ${getMedewerkerName(medewerker)}`"
+										:name="getMedewerkerName(medewerker)"
+										@click="goToMedewerker()">
+										<template #icon>
+											<OpenInApp :size="20" />
+										</template>
+										{{ getMedewerkerName(medewerker) }}
+									</NcActionLink>
+								</NcActions>
+							</div>
+						</div>
+						<div v-if="taakStore.taakItem.klant">
 							<b>Klant:</b>
 							<span v-if="klantLoading">Loading...</span>
 							<div v-if="!klantLoading" class="buttonLinkContainer">
@@ -125,22 +142,26 @@ export default {
 		return {
 			currentActiveTaak: null,
 			auditTrails: [],
-			klant: [],
+			klant: null,
+			medewerker: null,
 			klantLoading: false,
+			medewerkerLoading: false,
 		}
 	},
 	mounted() {
 		if (taakStore.taakItem?.id) {
 			this.currentActiveTaak = taakStore.taakItem
 			this.fetchAuditTrails(taakStore.taakItem.id)
-			this.fetchKlant(taakStore.taakItem.klant)
+			if (taakStore.taakItem.klant) this.fetchKlant(taakStore.taakItem.klant)
+			if (taakStore.taakItem.medewerker) this.fetchMedewerker(taakStore.taakItem.medewerker)
 		}
 	},
 	updated() {
 		if (taakStore.taakItem?.id && JSON.stringify(this.currentActiveTaak) !== JSON.stringify(taakStore.taakItem)) {
 			this.currentActiveTaak = taakStore.taakItem
 			this.fetchAuditTrails(taakStore.taakItem.id)
-			this.fetchKlant(taakStore.taakItem.klant)
+			if (taakStore.taakItem.klant) this.fetchKlant(taakStore.taakItem.klant)
+			if (taakStore.taakItem.medewerker) this.fetchMedewerker(taakStore.taakItem.medewerker)
 		}
 	},
 	methods: {
@@ -156,10 +177,17 @@ export default {
 		getKlantName(klant) {
 			return klant?.type === 'persoon' ? `${klant?.voornaam} ${klant?.tussenvoegsel} ${klant?.achternaam}` : klant?.bedrijfsnaam
 		},
+		getMedewerkerName(medewerker) {
+			return `${medewerker?.voornaam} ${medewerker?.tussenvoegsel} ${medewerker?.achternaam}`
+		},
 		goToKlant() {
 			klantStore.setKlantItem(this.klant)
 			navigationStore.setSelected('klanten')
 		},
+		goToMedewerker() {
+			medewerkerStore.setMedewerkerItem(this.medewerker)
+			navigationStore.setSelected('medewerkers')
+		},
 		fetchKlant(klant) {
 			this.klantLoading = true
 
@@ -178,6 +206,24 @@ export default {
 				})
 
 		},
+		fetchMedewerker(medewerker) {
+			this.medewerkerLoading = true
+
+			fetch(`/index.php/apps/zaakafhandelapp/api/medewerkers/${medewerker}`, {
+				method: 'GET',
+			})
+				.then((response) => {
+					response.json().then((data) => {
+						this.medewerker = data
+					})
+					this.medewerkerLoading = false
+				})
+				.catch((err) => {
+					console.error(err)
+					this.medewerkerLoading = false
+				})
+
+		},
 	},
 }
 </script>