From a5ca10448d66c8dd2c3ca4ca5c8688a3020ec42d Mon Sep 17 00:00:00 2001
From: Thijn <thijn@conduction.nl>
Date: Wed, 11 Dec 2024 14:50:01 +0100
Subject: [PATCH] enabled create zaak on contactMoment modal

---
 .../contactMomenten/ContactMomentenForm.vue   | 21 ++++++++++++++++++-
 src/modals/zaken/ZaakForm.vue                 | 10 +++++++++
 2 files changed, 30 insertions(+), 1 deletion(-)

diff --git a/src/modals/contactMomenten/ContactMomentenForm.vue b/src/modals/contactMomenten/ContactMomentenForm.vue
index 39f71bd..f0f7182 100644
--- a/src/modals/contactMomenten/ContactMomentenForm.vue
+++ b/src/modals/contactMomenten/ContactMomentenForm.vue
@@ -223,7 +223,7 @@ import { contactMomentStore, navigationStore, taakStore, zaakStore } from '../..
 					</template>
 					Klant taak aanmaken
 				</NcActionButton>
-				<NcActionButton :disabled="true" @click="zaakStore.setZaakItem(); navigationStore.setModal('editZaak')">
+				<NcActionButton :disabled="!klant?.id" @click="openZaakForm()">
 					<template #icon>
 						<BriefcaseAccountOutline :size="20" />
 					</template>
@@ -250,6 +250,12 @@ import { contactMomentStore, navigationStore, taakStore, zaakStore } from '../..
 			:klant-id="klant?.id"
 			@close-modal="closeTaakForm"
 			@save-success="closeTaakForm" />
+
+		<ZaakForm v-if="zaakFormOpen"
+			:dashboard-widget="true"
+			:klant-id="klant?.id"
+			@close-modal="() => (zaakFormOpen = false)"
+			@save-success="zaakFormSaveSuccess" />
 	</NcDialog>
 </template>
 
@@ -261,6 +267,7 @@ import { NcButton, NcActions, NcLoadingIcon, NcDialog, NcTextArea, NcNoteCard, N
 // Forms
 import SearchKlantModal from '../../modals/klanten/SearchKlantModal.vue'
 import EditTaak from '../../modals/taken/EditTaak.vue'
+import ZaakForm from '../../modals/zaken/ZaakForm.vue'
 
 // Icons
 import Plus from 'vue-material-design-icons/Plus.vue'
@@ -337,6 +344,7 @@ export default {
 			startingType: 'all',
 			taakFormOpen: false,
 			taakClientType: 'both',
+			zaakFormOpen: false,
 		}
 	},
 	mounted() {
@@ -442,6 +450,17 @@ export default {
 			this.taakFormOpen = false
 		},
 
+		// zaak functions
+		openZaakForm() {
+			zaakStore.setZaakItem(null)
+			this.zaakFormOpen = true
+		},
+
+		zaakFormSaveSuccess() {
+			this.zaakFormOpen = false
+			this.fetchKlantData(this.klant.id)
+		},
+
 		async fetchKlantData(id) {
 			try {
 				const klantResponse = await fetch(`/index.php/apps/zaakafhandelapp/api/klanten/${id}`)
diff --git a/src/modals/zaken/ZaakForm.vue b/src/modals/zaken/ZaakForm.vue
index ff73091..f705c7d 100644
--- a/src/modals/zaken/ZaakForm.vue
+++ b/src/modals/zaken/ZaakForm.vue
@@ -114,6 +114,15 @@ export default {
 			default: false,
 			required: false,
 		},
+		/**
+		 * The id of the klant that the zaak is for.
+		 * Currently there is no dropdown for selecting a klant.
+		 * So it currently will pass the klantId with the zaak to the API.
+		 */
+		klantId: {
+			type: String,
+			default: null,
+		},
 	},
 	data() {
 		return {
@@ -230,6 +239,7 @@ export default {
 				...this.zaak,
 				archiefstatus: this.archiefstatus.value?.id || '',
 				zaaktype: this.zaakType.value?.id || '',
+				klant: this.klantId,
 			})
 
 			zaakStore.saveZaak(newZaak)