From ceabe4905faa0a1f745b8ec6dded4bb832e29a7d Mon Sep 17 00:00:00 2001
From: Thijn <thijn@conduction.nl>
Date: Tue, 31 Dec 2024 15:28:55 +0100
Subject: [PATCH] finished "see only my contactmoments"

---
 .../contactmoment/contactmoment.mock.ts       |  1 +
 src/entities/contactmoment/contactmoment.ts   |  3 +
 .../contactmoment/contactmoment.types.ts      |  1 +
 .../contactMomenten/ContactMomentenForm.vue   | 79 ++++++++++++++++++-
 src/store/modules/contactmoment.ts            | 22 +++---
 src/views/widgets/ContactMomentenWidget.vue   | 19 ++++-
 6 files changed, 110 insertions(+), 15 deletions(-)

diff --git a/src/entities/contactmoment/contactmoment.mock.ts b/src/entities/contactmoment/contactmoment.mock.ts
index e8cc740..f2a1383 100644
--- a/src/entities/contactmoment/contactmoment.mock.ts
+++ b/src/entities/contactmoment/contactmoment.mock.ts
@@ -13,6 +13,7 @@ export const mockContactMomentData = (): TContactMoment[] => [
 		startDate: new Date().toISOString(),
 		status: 'open',
 		contactmoment: 'Contactmoment 3',
+		medewerker: 'Medewerker 3',
 	},
 ]
 
diff --git a/src/entities/contactmoment/contactmoment.ts b/src/entities/contactmoment/contactmoment.ts
index 99efc21..dcf7cc9 100644
--- a/src/entities/contactmoment/contactmoment.ts
+++ b/src/entities/contactmoment/contactmoment.ts
@@ -13,6 +13,7 @@ export class ContactMoment implements TContactMoment {
 	public startDate: string
 	public status: string
 	public contactmoment: string
+	public medewerker: string
 
 	constructor(source: TContactMoment) {
 		this.id = source.id || ''
@@ -25,6 +26,7 @@ export class ContactMoment implements TContactMoment {
 		this.startDate = source.startDate || ''
 		this.status = source.status || 'open'
 		this.contactmoment = source.contactmoment || ''
+		this.medewerker = source.medewerker || ''
 	}
 
 	public validate(): SafeParseReturnType<TContactMoment, unknown> {
@@ -39,6 +41,7 @@ export class ContactMoment implements TContactMoment {
 			startDate: z.string().min(1),
 			status: z.string().min(1),
 			contactmoment: z.string().min(1),
+			medewerker: z.string().min(1),
 		})
 
 		return schema.safeParse(this)
diff --git a/src/entities/contactmoment/contactmoment.types.ts b/src/entities/contactmoment/contactmoment.types.ts
index e2444af..a3d53fa 100644
--- a/src/entities/contactmoment/contactmoment.types.ts
+++ b/src/entities/contactmoment/contactmoment.types.ts
@@ -9,4 +9,5 @@ export type TContactMoment = {
     startDate: string;
     status: string;
     contactmoment: string;
+    medewerker: string;
 }
diff --git a/src/modals/contactMomenten/ContactMomentenForm.vue b/src/modals/contactMomenten/ContactMomentenForm.vue
index eca9c7e..13fb6d9 100644
--- a/src/modals/contactMomenten/ContactMomentenForm.vue
+++ b/src/modals/contactMomenten/ContactMomentenForm.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { contactMomentStore, navigationStore, taakStore, zaakStore } from '../../store/store.js'
+import { contactMomentStore, medewerkerStore, navigationStore, taakStore, zaakStore } from '../../store/store.js'
 </script>
 
 <template>
@@ -117,6 +117,11 @@ import { contactMomentStore, navigationStore, taakStore, zaakStore } from '../..
 								:disabled="loading"
 								:loading="fetchLoading"
 								placeholder="Notitie" />
+
+							<NcSelect v-bind="medewerkers"
+								v-model="medewerkers.values[i-1]"
+								input-label="Medewerker"
+								:user-select="true" />
 						</div>
 						<div class="tabContainer">
 							<BTabs content-class="mt-3" justified>
@@ -564,7 +569,7 @@ import { contactMomentStore, navigationStore, taakStore, zaakStore } from '../..
 <script>
 // Components
 import { BTabs, BTab } from 'bootstrap-vue'
-import { NcButton, NcActions, NcLoadingIcon, NcDialog, NcTextArea, NcNoteCard, NcListItem, NcActionButton, NcEmptyContent } from '@nextcloud/vue'
+import { NcButton, NcActions, NcLoadingIcon, NcDialog, NcTextArea, NcNoteCard, NcListItem, NcActionButton, NcEmptyContent, NcSelect } from '@nextcloud/vue'
 import _ from 'lodash'
 
 import getValidISOstring from '../../services/getValidISOstring.js'
@@ -588,7 +593,7 @@ import Minus from 'vue-material-design-icons/Minus.vue'
 import ProgressClose from 'vue-material-design-icons/ProgressClose.vue'
 import Eye from 'vue-material-design-icons/Eye.vue'
 import router from '../../router/router.ts'
-import { generateUrl } from '@nextcloud/router';
+import { generateUrl } from '@nextcloud/router'
 
 export default {
 	name: 'ContactMomentenForm',
@@ -604,6 +609,7 @@ export default {
 		EditTaakForm: EditTaak,
 		BTabs,
 		BTab,
+		NcSelect,
 		// Icons
 		Plus,
 		BriefcaseAccountOutline,
@@ -698,6 +704,11 @@ export default {
 
 			tabs: [1],
 			tabCounter: 1,
+
+			medewerkers: {
+				options: [],
+				values: [], // used to store the selected medewerker for each contactmoment
+			},
 		}
 	},
 	mounted() {
@@ -709,6 +720,8 @@ export default {
 		} else if (this.klantId) {
 			// if it is not an edit modal but a klantId is provided, fetch the klant data
 			this.fetchKlantData(this.klantId)
+		} else {
+			this.fetchMedewerkers()
 		}
 	},
 	methods: {
@@ -717,6 +730,7 @@ export default {
 			for (let i = 0; i < this.tabs.length; i++) {
 				if (this.tabs[i] === x) {
 					this.tabs.splice(i, 1)
+					this.medewerkers.values.splice(i, 1)
 				}
 			}
 			this.selectedContactMoment = 1
@@ -764,11 +778,67 @@ export default {
 			this.selectedTaak = data.taak
 			this.selectedProduct = data.product
 
-			await this.fetchKlantData(data.klant)
+			await Promise.all([
+				this.fetchKlantData(data.klant),
+				this.fetchMedewerkers(data.medewerker),
+			])
 
 			this.fetchLoading = false
 		},
 
+		async fetchMedewerkers(medewerkerEmail = null) {
+			return Promise.all([
+				medewerkerStore.refreshMedewerkersList(),
+				fetch('/index.php/apps/zaakafhandelapp/me').then(response => response.json()),
+			])
+				.then(([{ data }, { user }]) => {
+					const medewerkerToSelect = medewerkerEmail ?? data.find(medewerker => medewerker.email === user.email)?.email
+					const selectedMedewerker = data.find(medewerker => medewerker.email === medewerkerToSelect) || null
+
+					this.medewerkers = {
+						options: data.map(medewerker => ({
+							id: medewerker.id,
+							displayName: `${medewerker.voornaam} ${medewerker.tussenvoegsel} ${medewerker.achternaam}`,
+							subname: medewerker.email,
+							email: medewerker.email,
+							isNoUser: false,
+							icon: null,
+							user: medewerker.id,
+							// if it is the current user show online status, there is currently no way of knowing other user statuses
+							...(medewerker.email === user.email && {
+								preloadedUserStatus: {
+									icon: null,
+									status: 'online',
+									message: 'I am online',
+								},
+							}),
+						})),
+						values: [selectedMedewerker
+							? {
+								id: selectedMedewerker.id,
+								displayName: `${selectedMedewerker.voornaam} ${selectedMedewerker.tussenvoegsel} ${selectedMedewerker.achternaam}`,
+								subname: selectedMedewerker.email,
+								email: selectedMedewerker.email,
+								isNoUser: false,
+								icon: null,
+								user: selectedMedewerker.id,
+								// if it is the current user show online status, there is currently no way of knowing other user statuses
+								...(selectedMedewerker.email === user.email && {
+									preloadedUserStatus: {
+										icon: null,
+										status: 'online',
+										message: 'I am online',
+									},
+								}),
+							}
+							: null],
+					}
+				})
+				.catch((err) => {
+					console.error(err)
+				})
+		},
+
 		// Modal functions
 		closeModalFromButton() {
 			setTimeout(() => {
@@ -806,6 +876,7 @@ export default {
 				startDate: contactMomentCopy.startDate ?? new Date().toISOString(),
 				status: contactMomentCopy.status === 'gesloten' ? 'gesloten' : 'open',
 				contactmoment: contactMomentCopy.selectedKlantContactMoment,
+				medewerker: this.medewerkers.values[this.selectedContactMoment - 1].email,
 			})
 				.then((response) => {
 					this.contactMoment.addedTaken.forEach(taak => {
diff --git a/src/store/modules/contactmoment.ts b/src/store/modules/contactmoment.ts
index d35c767..8d026fa 100644
--- a/src/store/modules/contactmoment.ts
+++ b/src/store/modules/contactmoment.ts
@@ -36,22 +36,26 @@ export const useContactMomentStore = defineStore('contactmomenten', {
 		 *
 		 * @param search - Optional search query to filter the contact moments list. (default: `null`)
 		 * @param notClosed - Optional boolean to filter out closed contact moments from the contact moments list. (default: `false`)
+		 * @param user
 		 * @throws If the HTTP request fails.
 		 * @return {Promise<{ response: Response, data: TContactMoment[], entities: ContactMoment[] }>} The response, raw data, and entities.
 		 */
-		async refreshContactMomentenList(search: string = null, notClosed: boolean = false): Promise<{ response: Response, data: TContactMoment[], entities: ContactMoment[] }> {
+		async refreshContactMomentenList(search: string = null, notClosed: boolean = false, user: string = null): Promise<{ response: Response, data: TContactMoment[], entities: ContactMoment[] }> {
 			let endpoint = apiEndpoint
 
-			if (search !== null && search !== '') {
-				endpoint = endpoint + '?_search=' + search
+			const params = new URLSearchParams()
+			if (search) {
+				params.append('_search', search)
 			}
-
 			if (notClosed) {
-				if (search !== null && search !== '') {
-					endpoint = endpoint + '&status=open'
-				} else {
-					endpoint = endpoint + '?status=open'
-				}
+				params.append('status', 'open')
+			}
+			if (user) {
+				params.append('medewerker', user)
+			}
+
+			if (params.toString()) {
+				endpoint += `?${params.toString()}`
 			}
 
 			const response = await fetch(endpoint, {
diff --git a/src/views/widgets/ContactMomentenWidget.vue b/src/views/widgets/ContactMomentenWidget.vue
index 30f44da..b7887ef 100644
--- a/src/views/widgets/ContactMomentenWidget.vue
+++ b/src/views/widgets/ContactMomentenWidget.vue
@@ -71,6 +71,7 @@ export default {
 			 * determines if the contactmoment form modal is open
 			 */
 			isContactMomentFormOpen: false,
+			userEmail: null,
 			contactMomentItems: [],
 			// contactmoment form props
 			contactMomentId: null,
@@ -93,14 +94,28 @@ export default {
 		}
 	},
 	mounted() {
-		this.fetchContactMomentItems()
+		this.fetchUser()
 	},
 	methods: {
+		async fetchUser() {
+			this.loading = true
+
+			const getUser = await fetch('/index.php/apps/zaakafhandelapp/me')
+			const user = await getUser.json()
+
+			const medewerkerList = await fetch('/index.php/apps/zaakafhandelapp/api/medewerkers')
+			const medewerkers = await medewerkerList.json()
+
+			const medewerker = medewerkers.results.find((medewerker) => medewerker.email === user.user.email)
+
+			this.userEmail = medewerker.email
+			this.fetchContactMomentItems()
+		},
 		fetchContactMomentItems() {
 			this.loading = true
 
 			Promise.all([
-				contactMomentStore.refreshContactMomentenList(null, true),
+				contactMomentStore.refreshContactMomentenList(null, true, this.userEmail),
 				klantStore.refreshKlantenList(),
 			])
 				.then(([contactMomentResponse, klantResponse]) => {