Merge pull request #119 from ConductionNL/feature/PC108-130/new-activ…

…e-tab feature/PC108-138
ConductionNL · Dec 20, 2024 · 437cbc3 · 437cbc3
2 parents 3fe9a60 + 3d45f1b
commit 437cbc3
Show file tree

Hide file tree

Showing 8 changed files with 315 additions and 317 deletions.
diff --git a/src/entities/contactmoment/contactmoment.mock.ts b/src/entities/contactmoment/contactmoment.mock.ts
@@ -12,6 +12,7 @@ export const mockContactMomentData = (): TContactMoment[] => [
 		product: 'Product 3',
 		startDate: new Date().toISOString(),
 		status: 'open',
+		contactmoment: 'Contactmoment 3',
 	},
 ]
 

diff --git a/src/entities/contactmoment/contactmoment.ts b/src/entities/contactmoment/contactmoment.ts
@@ -12,6 +12,7 @@ export class ContactMoment implements TContactMoment {
 	public product: string
 	public startDate: string
 	public status: string
+	public contactmoment: string
 
 	constructor(source: TContactMoment) {
 		this.id = source.id || ''
@@ -23,6 +24,7 @@ export class ContactMoment implements TContactMoment {
 		this.product = source.product || ''
 		this.startDate = source.startDate || ''
 		this.status = source.status || 'open'
+		this.contactmoment = source.contactmoment || ''
 	}
 
 	public validate(): SafeParseReturnType<TContactMoment, unknown> {
@@ -36,6 +38,7 @@ export class ContactMoment implements TContactMoment {
 			product: z.string().min(1),
 			startDate: z.string().min(1),
 			status: z.string().min(1),
+			contactmoment: z.string().min(1),
 		})
 
 		return schema.safeParse(this)

diff --git a/src/entities/contactmoment/contactmoment.types.ts b/src/entities/contactmoment/contactmoment.types.ts
@@ -8,4 +8,5 @@ export type TContactMoment = {
     product: string;
     startDate: string;
     status: string;
+    contactmoment: string;
 }
diff --git a/src/modals/contactMomenten/ContactMomentenForm.vue b/src/modals/contactMomenten/ContactMomentenForm.vue
@@ -783,27 +783,16 @@ export default {
 
 			const contactMomentCopy = _.cloneDeep(this.contactMoment)
 
-			delete contactMomentCopy.taken
-			delete contactMomentCopy.zaken
-			delete contactMomentCopy.berichten
-			delete contactMomentCopy.klantContactmomenten
-			delete contactMomentCopy.auditTrails
-			delete contactMomentCopy.addedTaken
-			delete contactMomentCopy.selectedKlantContactMoment
-			delete contactMomentCopy.selectedProduct
-			delete contactMomentCopy.selectedTaak
-			delete contactMomentCopy.selectedZaak
-
 			contactMomentStore.saveContactMoment({
-				...contactMomentCopy,
+				id: contactMomentCopy.id,
 				notitie: contactMomentCopy.notitie,
 				klant: contactMomentCopy.klant?.id ?? '',
 				zaak: contactMomentCopy.selectedZaak ?? '',
 				taak: contactMomentCopy.selectedTaak ?? '',
 				product: contactMomentCopy.selectedProduct ?? '',
-				contactmoment: contactMomentCopy.selectedKlantContactMoment,
-				status: contactMomentCopy.status === 'gesloten' ? 'gesloten' : 'open',
 				startDate: contactMomentCopy.startDate ?? new Date().toISOString(),
+				status: contactMomentCopy.status === 'gesloten' ? 'gesloten' : 'open',
+				contactmoment: contactMomentCopy.selectedKlantContactMoment,
 			})
 				.then((response) => {
 					this.contactMoment.addedTaken.forEach(taak => {
@@ -843,25 +832,18 @@ export default {
 					this.success = true
 					this.loading = false
 
-					if (!this.dashboardWidget) {
+					setTimeout(() => {
+						this.closeTab(this.selectedContactMoment)
+						this.success = false
+						this.succesMessage = false
+					}, 2000)
+					if (this.tabs.length === 1) {
+						if (this.dashboardWidget) this.$emit('save-success')
 						setTimeout(() => {
 							this.closeModal()
 						}, 2000)
 					}
 
-					if (this.dashboardWidget === true) {
-						setTimeout(() => {
-							this.closeTab(this.selectedContactMoment)
-							this.success = false
-							this.succesMessage = false
-						}, 2000)
-						if (this.tabs.length === 1) {
-							this.$emit('save-success')
-							setTimeout(() => {
-								this.closeModal()
-							}, 2000)
-						}
-					}
 				})
 				.catch((err) => {
 					console.error(err)

diff --git a/src/modals/taken/EditTaak.vue b/src/modals/taken/EditTaak.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { taakStore, navigationStore, klantStore, medewerkerStore, contactMomentStore } from '../../store/store.js'
+import { taakStore, navigationStore, klantStore, contactMomentStore } from '../../store/store.js'
 </script>
 
 <template>
@@ -59,15 +59,13 @@ import { taakStore, navigationStore, klantStore, medewerkerStore, contactMomentS
 					<NcSelect v-if="(clientType !== 'medewerker' && (clientType !== 'both' || clientType === 'both' && !useMedewerkerInsteadOfKlant))"
 						v-bind="klanten"
 						v-model="klanten.value"
-						:user-select="true"
 						input-label="Klant*"
 						:loading="klantenLoading"
 						:disabled="loading" />
 
 					<NcSelect v-if="(clientType !== 'klant' && (clientType !== 'both' || clientType === 'both' && useMedewerkerInsteadOfKlant))"
 						v-bind="medewerkers"
 						v-model="medewerkers.value"
-						:user-select="true"
 						input-label="Medewerker*"
 						:loading="medewerkersLoading"
 						:disabled="loading" />
@@ -352,6 +350,7 @@ export default {
 	},
 	mounted() {
 		this.fetchData()
+		this.fetchMedewerkers()
 	},
 	methods: {
 		closeModalFromButton() {
@@ -400,7 +399,6 @@ export default {
 			}
 
 			if (this.clientType !== 'medewerker') this.fetchKlanten(taakEntity?.klant) // will either pass a id or undefined
-			if (this.clientType !== 'klant') this.fetchMedewerkers(taakEntity?.medewerker)
 			this.fetchContactMomentItems()
 		},
 		/**
@@ -419,6 +417,7 @@ export default {
 					const selectedKlant = data.find((klant) => klant?.id.toString() === searchId) || null
 
 					this.klanten = {
+						userSelect: true,
 						options: data.map((klant) => ({
 							id: klant.id,
 							displayName: `${klant.voornaam} ${klant.tussenvoegsel} ${klant.achternaam}`,
@@ -499,38 +498,42 @@ export default {
 		 *                                If none are provided the default selected medewerker will be `null`.
 		 */
 		fetchMedewerkers(medewerkerId = null) {
-			medewerkerStore.refreshMedewerkersList()
-				.then(({ data }) => {
-
-					const taakMedewerkerId = taakStore.taakItem?.medewerker
-					const searchId = (this.medewerkerId ?? medewerkerId ?? taakMedewerkerId)?.toString()
-
-					const selectedMedewerker = data.find((medewerker) => medewerker?.id.toString() === searchId) || null
+			fetch('/ocs/v1.php/cloud/users/details', {
+				method: 'GET',
+				headers: {
+					Accept: 'application/json',
+					'OCS-APIRequest': 'true',
+				},
+			}).then(response => response.json()).then(data => {
+
+				const userData = data.ocs.data.users
+
+				const taakMedewerkerId = taakStore.taakItem?.medewerker
+				const searchId = (this.medewerkerId ?? medewerkerId ?? taakMedewerkerId)?.toString()
+
+				const selectedMedewerker = Object.values(userData).find((medewerker) => medewerker?.email?.toString() === searchId) || null
+
+				this.medewerkers = {
+					userSelect: true,
+					options: Object.values(userData).map((medewerker) => ({
+						id: medewerker.email,
+						displayName: medewerker.displayname,
+						subname: medewerker.email,
+						user: medewerker.id,
+
+					})),
+					value: selectedMedewerker
+						? {
+							id: selectedMedewerker?.email,
+							displayName: selectedMedewerker.displayname,
+							subname: selectedMedewerker.email,
+							user: selectedMedewerker.id,
+						}
+						: null,
+				}
 
-					this.medewerkers = {
-						options: data.map((medewerker) => ({
-							id: medewerker.id,
-							displayName: `${medewerker.voornaam} ${medewerker.tussenvoegsel} ${medewerker.achternaam}`,
-							subName: medewerker.email,
-							icon: medewerker.icon ?? '',
+			})
 
-						})),
-						value: selectedMedewerker
-							? {
-								id: selectedMedewerker?.id,
-								displayName: `${selectedMedewerker.voornaam} ${selectedMedewerker.tussenvoegsel} ${selectedMedewerker.achternaam}`,
-								subName: selectedMedewerker.email,
-								icon: selectedMedewerker.icon ?? '',
-							}
-							: null,
-					}
-				})
-				.catch((err) => {
-					console.error(err)
-				})
-				.finally(() => {
-					this.medewerkersLoading = false
-				})
 		},
 		async editTaak() {
 			this.loading = true

diff --git a/src/views/taken/TaakDetails.vue b/src/views/taken/TaakDetails.vue
@@ -37,19 +37,9 @@ import { navigationStore, taakStore, klantStore, medewerkerStore } from '../../s
 						</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>
+							<span v-if="medewerkerLoading || !medewerker">Loading...</span>
+							<div v-if="!medewerkerLoading && medewerker" class="buttonLinkContainer">
+								<span>{{ medewerker.displayname }}</span>
 							</div>
 						</div>
 						<div v-if="taakStore.taakItem.klant">
@@ -209,19 +199,22 @@ export default {
 		fetchMedewerker(medewerker) {
 			this.medewerkerLoading = true
 
-			fetch(`/index.php/apps/zaakafhandelapp/api/medewerkers/${medewerker}`, {
+			const host = window.location.host
+
+			fetch(`http://${host}/ocs/v1.php/cloud/users/details`, {
 				method: 'GET',
+				headers: {
+					Accept: 'application/json',
+					'OCS-APIRequest': 'true',
+				},
+			}).then(response => response.json()).then(data => {
+
+				this.medewerker = Object.values(data.ocs.data.users).find(user => user.email === medewerker)
+			}).catch(err => {
+				console.error(err)
+			}).finally(() => {
+				this.medewerkerLoading = false
 			})
-				.then((response) => {
-					response.json().then((data) => {
-						this.medewerker = data
-					})
-					this.medewerkerLoading = false
-				})
-				.catch((err) => {
-					console.error(err)
-					this.medewerkerLoading = false
-				})
 
 		},
 	},

diff --git a/src/views/taken/TakenList.vue b/src/views/taken/TakenList.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { klantStore, medewerkerStore, navigationStore, taakStore } from '../../store/store.js'
+import { klantStore, navigationStore, taakStore } from '../../store/store.js'
 </script>
 
 <template>
@@ -30,7 +30,7 @@ import { klantStore, medewerkerStore, navigationStore, taakStore } from '../../s
 					</NcActionButton>
 				</NcActions>
 			</div>
-			<div v-if="taakStore.takenList?.length && !loading">
+			<div v-if="taakStore.takenList?.length && users && !loading">
 				<NcListItem v-for="(taak, i) in taakStore.takenList"
 					:key="`${taak}${i}`"
 					:name="taak?.title"
@@ -108,13 +108,14 @@ export default {
 			search: '',
 			loading: true,
 			takenList: [],
+			users: null,
 		}
 	},
 	mounted() {
 		Promise.all([
+			this.getUsers(),
 			taakStore.refreshTakenList(),
 			klantStore.refreshKlantenList(),
-			medewerkerStore.refreshMedewerkersList(),
 		]).then(() => {
 			this.loading = false
 		})
@@ -123,12 +124,24 @@ export default {
 		clearText() {
 			this.search = ''
 		},
+		getUsers() {
+			fetch('/ocs/v1.php/cloud/users/details', {
+				method: 'GET',
+				headers: {
+					Accept: 'application/json',
+					'OCS-APIRequest': 'true',
+				},
+			}).then(response => response.json()).then(data => {
+
+				this.users = Object.values(data.ocs.data.users)
+			})
+		},
 		getName(taak) {
-			const medewerker = medewerkerStore.medewerkersList.find(medewerker => medewerker.id === taak.medewerker)
+			const medewerker = this.users.find(user => user.email === taak.medewerker)
 			const klant = klantStore.klantenList.find(klant => klant.id === taak.klant)
 
 			if (medewerker) {
-				return `${medewerker.voornaam} ${medewerker.tussenvoegsel} ${medewerker.achternaam}` ?? 'onbekend'
+				return medewerker.displayname ?? 'onbekend'
 			}
 			if (klant) {
 				if (klant.type === 'persoon') {