Merge pull request #75 from ConductionNL/feature/PC108-82/Contactmome…

…nt-detail-page

cleanup

src/entities/contactmoment/contactmoment.mock.ts

@@ -5,7 +5,6 @@ export const mockContactMomentData = (): TContactMoment[] => [
 	{
 		id: '15551d6f-44e3-43f3-a9d2-59e583c91eb0',
 		uuid: '15551d6f-44e3-43f3-a9d2-59e583c91eb0',
-		titel: 'Zaak 3',
 		notitie: 'Zaak 3',
 		klant: 'Klant 3',
 		zaak: 'Zaak 3',

src/entities/contactmoment/contactmoment.ts

@@ -5,7 +5,6 @@ export class ContactMoment implements TContactMoment {
 
 	public id: string
 	public uuid: string
-	public titel: string
 	public notitie: string
 	public klant: string
 	public zaak: string
@@ -17,7 +16,6 @@ export class ContactMoment implements TContactMoment {
 	constructor(source: TContactMoment) {
 		this.id = source.id || ''
 		this.uuid = source.uuid || ''
-		this.titel = source.titel || ''
 		this.notitie = source.notitie || ''
 		this.klant = source.klant || ''
 		this.zaak = source.zaak || ''
@@ -31,7 +29,6 @@ export class ContactMoment implements TContactMoment {
 		const schema = z.object({
 			id: z.string().optional(),
 			uuid: z.string().optional(),
-			titel: z.string().min(1),
 			notitie: z.string().min(1),
 			klant: z.string().min(1),
 			zaak: z.string().min(1),

src/entities/contactmoment/contactmoment.types.ts

@@ -1,7 +1,6 @@
 export type TContactMoment = {
     id: string;
     uuid: string;
-    titel: string;
     notitie: string;
     klant: string;
     zaak: string;

src/modals/contactMomenten/ContactMomentenForm.vue

@@ -65,7 +65,7 @@ import { navigationStore, taakStore, zaakStore } from '../../store/store.js'
 					</div>
 				</div>
 
-				<div v-if="klant" class="buttonsContainer">
+				<div v-if="klant && !contactMomentId" class="buttonsContainer">
 					<div>
 						<NcButton
 							:disabled="loading"
@@ -85,10 +85,6 @@ import { navigationStore, taakStore, zaakStore } from '../../store/store.js'
 					label="Notitie"
 					:disabled="loading"
 					placeholder="Notitie" />
-				<NcTextField
-					:value.sync="titel"
-					label="Titel"
-					:disabled="loading" />
 			</div>
 			<div class="tabContainer">
 				<BTabs content-class="mt-3" justified>
@@ -184,7 +180,10 @@ import { navigationStore, taakStore, zaakStore } from '../../store/store.js'
 				</template>
 				Annuleer
 			</NcButton>
-			<NcActions :disabled="loading || success" :primary="true" menu-name="Acties">
+			<NcActions v-if="!contactMomentId"
+				:disabled="loading || success"
+				:primary="true"
+				menu-name="Acties">
 				<template #icon>
 					<DotsHorizontal :size="20" />
 				</template>
@@ -202,6 +201,7 @@ import { navigationStore, taakStore, zaakStore } from '../../store/store.js'
 				</NcActionButton>
 			</NcActions>
 			<NcButton
+				v-if="!contactMomentId"
 				type="primary"
 				:disabled="!klant || loading || success"
 				:loading="loading"
@@ -223,7 +223,7 @@ import { navigationStore, taakStore, zaakStore } from '../../store/store.js'
 <script>
 // Components
 import { BTabs, BTab } from 'bootstrap-vue'
-import { NcButton, NcActions, NcLoadingIcon, NcDialog, NcTextArea, NcNoteCard, NcListItem, NcActionButton, NcEmptyContent, NcTextField } from '@nextcloud/vue'
+import { NcButton, NcActions, NcLoadingIcon, NcDialog, NcTextArea, NcNoteCard, NcListItem, NcActionButton, NcEmptyContent } from '@nextcloud/vue'
 
 // Forms
 import SearchKlantModal from '../../modals/klanten/SearchKlantModal.vue'
@@ -249,7 +249,6 @@ export default {
 		NcListItem,
 		NcActionButton,
 		NcEmptyContent,
-		NcTextField,
 		// Icons
 		Plus,
 		BriefcaseAccountOutline,
@@ -304,6 +303,7 @@ export default {
 		},
 		closeModal() {
 			navigationStore.setModal(false)
+			
 			this.$emit('close-modal')
 		},
 
@@ -319,7 +319,6 @@ export default {
 						'Content-Type': 'application/json',
 					},
 					body: JSON.stringify({
-						titel: this.titel,
 						notitie: this.notitie,
 						klant: this.klant?.id ?? '',
 						zaak: this.selectedZaak ?? '',
@@ -370,7 +369,6 @@ export default {
 			fetch(`/index.php/apps/zaakafhandelapp/api/contactmomenten/${id}`)
 				.then(response => response.json())
 				.then(data => {
-					this.titel = data.titel
 					this.notitie = data.notitie
 					this.status = data.status
 					this.startDate = data.startDate

src/modals/taken/EditTaak.vue

@@ -28,13 +28,6 @@ import { taakStore, navigationStore, klantStore } from '../../store/store.js'
 				label="Type"
 				maxlength="255" />
 
-			<NcSelect
-				v-bind="statusOptions"
-				v-model="taakItem.status"
-				:disabled="loading"
-				input-label="Status"
-				required />
-
 			<div>
 				<p>Deadline</p>
 				<NcDateTimePicker
@@ -145,18 +138,6 @@ export default {
 				onderwerp: '',
 				toelichting: '',
 			},
-			statusOptions: {
-				options: [
-					{
-						id: 'open',
-						label: 'Open',
-					},
-					{
-						id: 'gesloten',
-						label: 'Gesloten',
-					},
-				],
-			},
 		}
 	},
 	mounted() {

src/modals/taken/WidgetTaakForm.vue

@@ -274,7 +274,11 @@ export default {
 			fetch(`/index.php/apps/zaakafhandelapp/api/taken/${id}`)
 				.then(response => response.json())
 				.then(data => {
-					this.taakItem = data
+					this.taakItem = {
+						...data,
+						deadline: new Date(data.deadline),
+					}
+
 					this.fetchMedewerkers()
 				})
 		},

src/views/contactMomenten/ContactMomentenList.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { navigationStore, contactMomentStore } from '../../store/store.js'
+import { navigationStore, contactMomentStore, klantStore } from '../../store/store.js'
 </script>
 
 <template>
@@ -33,7 +33,7 @@ import { navigationStore, contactMomentStore } from '../../store/store.js'
 			<div v-if="contactMomentStore.contactMomentenList?.length && !loading">
 				<NcListItem v-for="(contactMoment, i) in contactMomentStore.contactMomentenList"
 					:key="`${contactMoment}${i}`"
-					:name="contactMoment?.titel || 'onbekend'"
+					:name="getKlantName(contactMoment.klant) || 'onbekend'"
 					:active="contactMomentStore.contactMomentItem?.id === contactMoment?.id"
 					:force-display-actions="true"
 					@click="contactMomentStore.setContactMomentItem(contactMoment)">
@@ -115,6 +115,7 @@ export default {
 		contactMomentStore.refreshContactMomentenList().then(() => {
 			this.loading = false
 		})
+		klantStore.refreshKlantenList()
 	},
 	methods: {
 		editContactMoment(contactMoment) {
@@ -124,6 +125,17 @@ export default {
 		storeContactMoment(contactMoment) {
 			contactMomentStore.setContactMomentItem(contactMoment)
 		},
+		getKlantName(klantId) {
+			const klant = klantStore.klantenList.find(klant => klant.id === klantId)
+			if (klant.type === 'persoon') {
+				return `${klant.voornaam} ${klant.tussenvoegsel} ${klant.achternaam}` ?? 'onbekend'
+			}
+			if (klant.type === 'organisatie') {
+				return klant?.bedrijfsnaam ?? 'onbekend'
+			}
+			return 'onbekend'
+		},
+
 		fetchData(newPage) {
 			this.loading = true
 			fetch(
@@ -147,6 +159,7 @@ export default {
 			this.search = ''
 		},
 	},
+
 }
 </script>
 <style>

src/views/widgets/ContactMomentenWidget.vue

@@ -136,7 +136,7 @@ export default {
 		},
 		openModal() {
 			this.isModalOpen = true
-			contactMomentStore.setWidgetContactMomentId(null)
+			this.contactMomentId = null
 			contactMomentStore.setContactMomentItem(null)
 			navigationStore.setModal('contactMomentenForm')
 		},

src/views/widgets/TakenWidget.vue

@@ -123,6 +123,7 @@ export default {
 		},
 		openModal() {
 			this.isModalOpen = true
+			this.taakId = null
 			taakStore.setTaakItem(null)
 			navigationStore.setModal('editTaak')
 		},