finished bericht audit trails

ConductionNL · Oct 23, 2024 · 503c34f · 503c34f
1 parent e4b456f
commit 503c34f
Show file tree

Hide file tree

Showing 2 changed files with 69 additions and 2 deletions.
diff --git a/src/views/berichten/BerichtDetails.vue b/src/views/berichten/BerichtDetails.vue
@@ -76,14 +76,52 @@ import { navigationStore, berichtStore } from '../../store/store.js'
 						<span>{{ berichtStore.berichtItem.volgorde }}</span>
 					</div>
 				</div>
+
+				<div class="tabContainer">
+					<BTabs content-class="mt-3" justified>
+						<BTab title="Audit trail" active>
+							<div v-if="auditTrails.length">
+								<NcListItem v-for="(auditTrail, key) in auditTrails"
+									:key="key"
+									:name="new Date(auditTrail.created).toLocaleString()"
+									:bold="false"
+									:details="auditTrail.action"
+									:counter-number="Object.keys(auditTrail.changed).length"
+									:force-display-actions="true">
+									<template #icon>
+										<TimelineQuestionOutline disable-menu
+											:size="44" />
+									</template>
+									<template #subname>
+										{{ auditTrail.userName }}
+									</template>
+									<template #actions>
+										<NcActionButton @click="berichtStore.setAuditTrailItem(auditTrail); navigationStore.setModal('viewBerichtAuditTrail')">
+											<template #icon>
+												<Eye :size="20" />
+											</template>
+											View details
+										</NcActionButton>
+									</template>
+								</NcListItem>
+							</div>
+							<NcEmptyContent v-else icon="icon-history" title="Geen audit trail gevonden">
+								<template #description>
+									Er is geen audit trail gevonden voor deze bericht.
+								</template>
+							</NcEmptyContent>
+						</BTab>
+					</BTabs>
+				</div>
 			</div>
 		</div>
 	</div>
 </template>
 
 <script>
 // Components
-import { NcActions, NcActionButton } from '@nextcloud/vue'
+import { NcActions, NcActionButton, NcListItem, NcEmptyContent } from '@nextcloud/vue'
+import { BTabs, BTab } from 'bootstrap-vue'
 
 // Icons
 import DotsHorizontal from 'vue-material-design-icons/DotsHorizontal.vue'
@@ -101,6 +139,35 @@ export default {
 		DotsHorizontal,
 		TrashCanOutline,
 	},
+	data() {
+		return {
+			currentActiveBericht: null,
+			auditTrails: [],
+		}
+	},
+	mounted() {
+		if (berichtStore.berichtItem?.id) {
+			this.currentActiveBericht = berichtStore.berichtItem
+			this.fetchAuditTrails(berichtStore.berichtItem.id)
+		}
+	},
+	updated() {
+		if (berichtStore.berichtItem?.id && JSON.stringify(this.currentActiveBericht) !== JSON.stringify(berichtStore.berichtItem)) {
+			this.currentActiveBericht = berichtStore.berichtItem
+			this.fetchAuditTrails(berichtStore.berichtItem.id)
+		}
+	},
+	methods: {
+		fetchAuditTrails(id) {
+			fetch(`/index.php/apps/zaakafhandelapp/api/berichten/${id}/audit_trail`)
+				.then(response => response.json())
+				.then(data => {
+					if (Array.isArray(data)) {
+						this.auditTrails = data
+					}
+				})
+		},
+	},
 }
 </script>
 

diff --git a/src/views/taken/TaakDetails.vue b/src/views/taken/TaakDetails.vue
@@ -55,7 +55,7 @@ import { navigationStore, taakStore } from '../../store/store.js'
 										{{ auditTrail.userName }}
 									</template>
 									<template #actions>
-										<NcActionButton @click="objectStore.setAuditTrailItem(auditTrail); navigationStore.setModal('viewTaakAuditTrail')">
+										<NcActionButton @click="taakStore.setAuditTrailItem(auditTrail); navigationStore.setModal('viewTaakAuditTrail')">
 											<template #icon>
 												<Eye :size="20" />
 											</template>