Merge pull request #6 from ConductionNL/feature/CONNECTOR-34/source-logs

feature/CONNECTOR-34/source-logs

docker-compose.yml

@@ -18,12 +18,12 @@ services:
       - MYSQL_DATABASE=nextcloud
       - MYSQL_USER=nextcloud
 
-  # init-ubuntu:
-  #   image: ubuntu
-  #   command: sh /home/ubuntu/docker/init-ubuntu.sh
-  #   volumes:
-  #     - ./docker:/home/ubuntu/docker
-  #     - .:/home/ubuntu/app
+  init-ubuntu:
+    image: ubuntu
+    command: sh /home/ubuntu/docker/init-ubuntu.sh
+    volumes:
+      - ./docker:/home/ubuntu/docker
+      - .:/home/ubuntu/app
 
   nextcloud:
     user: root
@@ -45,5 +45,4 @@ services:
       - MYSQL_USER=nextcloud
       - MYSQL_HOST=db
       - TZ=Europe/Amsterdam
-      - NEXTCLOUD_ADMIN_USER=admin
-      - NEXTCLOUD_ADMIN_PASSWORD=admin
+

docker/init-ubuntu.sh

@@ -0,0 +1,8 @@
+apt update;
+apt install npm composer php-gd php-zip -y
+
+cd /home/ubuntu/app
+npm i
+npm run dev
+
+composer install

lib/Service/JobService.php

@@ -30,7 +30,7 @@ public function scheduleJob(Job $job): Job
 
             $this->jobList->removeById($job->getId());
             $job->setJobListId(null);
-            return $this->jobMapper->save(job);
+            return $this->jobMapper->update($job);
         }
 
         // lets not update the job if it's already scheduled @todo we should

src/modals/Job/DeleteJob.vue

@@ -4,15 +4,15 @@ import { jobStore, navigationStore } from '../../store/store.js'
 
 <template>
 	<NcDialog v-if="navigationStore.dialog === 'deleteJob'"
-		name="Job verwijderen"
+		name="Delete job"
 		size="normal"
 		:can-close="false">
 		<p v-if="!success">
-			Wil je <b>{{ jobStore.jobItem.name }}</b> definitief verwijderen? Deze actie kan niet ongedaan worden gemaakt.
+			Do you want to delete <b>{{ jobStore.jobItem.name }}</b>? This action cannot be undone.
 		</p>
 
 		<NcNoteCard v-if="success" type="success">
-			<p>Job succesvol verwijderd</p>
+			<p>Successfully deleted job</p>
 		</NcNoteCard>
 		<NcNoteCard v-if="error" type="error">
 			<p>{{ error }}</p>
@@ -24,7 +24,7 @@ import { jobStore, navigationStore } from '../../store/store.js'
 				<template #icon>
 					<Cancel :size="20" />
 				</template>
-				{{ success ? 'Sluiten' : 'Annuleer' }}
+				{{ success ? 'Close' : 'Cancel' }}
 			</NcButton>
 			<NcButton
 				v-if="!success"
@@ -79,14 +79,15 @@ export default {
 				this.success = true
 				this.loading = false
 				this.error = false
+				jobStore.setJobItem(null)
 				setTimeout(() => {
 					this.success = false
 					navigationStore.setDialog(false)
 				}, 2000)
 			} catch (error) {
 				this.loading = false
 				this.success = false
-				this.error = error.message || 'Er is een fout opgetreden bij het verwijderen van de job'
+				this.error = error.message || 'An error occurred while deleting the job'
 			}
 		},
 	},

src/modals/Job/EditJob.vue

@@ -3,11 +3,14 @@ import { jobStore, navigationStore } from '../../store/store.js'
 </script>
 
 <template>
-	<NcModal v-if="navigationStore.modal === 'editJob'" ref="modalRef" @close="navigationStore.setModal(false)">
+	<NcModal v-if="navigationStore.modal === 'editJob'"
+		ref="modalRef"
+		label-id="editJob"
+		@close="closeModal">
 		<div class="modalContent">
-			<h2>Job {{ jobStore.jobItem.id ? 'Aanpassen' : 'Aanmaken' }}</h2>
+			<h2>{{ jobItem?.id ? 'Edit' : 'Add' }} job</h2>
 			<NcNoteCard v-if="success" type="success">
-				<p>Job succesvol toegevoegd</p>
+				<p>Successfully added job</p>
 			</NcNoteCard>
 			<NcNoteCard v-if="error" type="error">
 				<p>{{ error }}</p>
@@ -18,18 +21,19 @@ import { jobStore, navigationStore } from '../../store/store.js'
 					<NcTextField
 						label="Name"
 						maxlength="255"
-						:value.sync="jobStore.jobItem.name"
+						:value.sync="jobItem.name"
 						required />
 				</div>
 				<div class="form-group">
 					<NcTextArea
 						label="Description"
-						:value.sync="jobStore.jobItem.description" />
+						:value.sync="jobItem.description" />
 				</div>
 				<div class="form-group">
-					<NcTextArea
+					<NcInputField
+						type="number"
 						label="Intraval"
-						:value.sync="jobStore.jobItem.interval" />
+						:value.sync="jobItem.interval" />
 				</div>
 			</form>
 
@@ -42,7 +46,7 @@ import { jobStore, navigationStore } from '../../store/store.js'
 					<NcLoadingIcon v-if="loading" :size="20" />
 					<ContentSaveOutline v-if="!loading" :size="20" />
 				</template>
-				Opslaan
+				Save
 			</NcButton>
 		</div>
 	</NcModal>
@@ -54,9 +58,9 @@ import {
 	NcModal,
 	NcTextField,
 	NcTextArea,
-	NcSelect,
 	NcLoadingIcon,
 	NcNoteCard,
+	NcInputField,
 } from '@nextcloud/vue'
 import ContentSaveOutline from 'vue-material-design-icons/ContentSaveOutline.vue'
 
@@ -67,18 +71,18 @@ export default {
 		NcTextField,
 		NcTextArea,
 		NcButton,
-		NcSelect,
 		NcLoadingIcon,
 		NcNoteCard,
+		NcInputField,
 		// Icons
 		ContentSaveOutline,
 	},
 	data() {
 		return {
-			sourceItem: {
+			jobItem: {
 				name: '',
 				description: '',
-				location: '',
+				interval: '3600',
 			},
 			success: false,
 			loading: false,
@@ -88,22 +92,50 @@ export default {
 				{ label: 'In Progress', value: 'in_progress' },
 				{ label: 'Completed', value: 'completed' },
 			],
+			hasUpdated: false,
+		}
+	},
+	mounted() {
+		this.initializeJobItem()
+	},
+	updated() {
+		if (navigationStore.modal === 'editJob' && !this.hasUpdated) {
+			this.initializeJobItem()
+			this.hasUpdated = true
 		}
 	},
 	methods: {
+		initializeJobItem() {
+			if (jobStore.jobItem?.id) {
+				this.jobItem = {
+					...jobStore.jobItem,
+					name: jobStore.jobItem.name || '',
+					description: jobStore.jobItem.description || '',
+					interval: jobStore.jobItem.interval || '3600',
+				}
+			}
+		},
+		closeModal() {
+			navigationStore.setModal(false)
+			this.success = false
+			this.loading = false
+			this.error = false
+			this.hasUpdated = false
+			this.jobItem = {
+				name: '',
+				description: '',
+				interval: '3600',
+			}
+		},
 		async editJob() {
 			this.loading = true
 			try {
-				await jobStore.saveJob()
+				await jobStore.saveJob({ ...this.jobItem })
 				// Close modal or show success message
 				this.success = true
 				this.loading = false
-				setTimeout(() => {
-					this.success = false
-					this.loading = false
-					this.error = false
-					navigationStore.setModal(false)
-				}, 2000)
+				setTimeout(this.closeModal, 2000)
+
 			} catch (error) {
 				this.loading = false
 				this.success = false

src/modals/Source/EditSource.vue

@@ -103,7 +103,7 @@ export default {
 	methods: {
 		closeModal() {
 			navigationStore.setModal(false)
-			this.succes = false
+			this.success = false
 			this.loading = false
 			this.error = false
 			this.sourceItem = {

src/store/modules/job.js

@@ -22,6 +22,10 @@ export const useJobStore = defineStore(
 				)
 				console.log('Job list set to ' + jobList.length + ' items')
 			},
+			setJobLogs(jobLogs) {
+				this.jobLogs = jobLogs
+				console.log('Job logs set to ' + jobLogs.length + ' items')
+			},
 			/* istanbul ignore next */ // ignore this for Jest until moved into a service
 			async refreshJobList(search = null) {
 				// @todo this might belong in a service?
@@ -99,23 +103,23 @@ export const useJobStore = defineStore(
 					})
 			},
 			// Create or save a job from store
-			saveJob() {
-				if (!this.jobItem) {
+			saveJob(jobItem) {
+				if (!jobItem) {
 					throw new Error('No job item to save')
 				}
 
 				console.log('Saving job...')
 
-				const isNewJob = !this.jobItem.id
+				const isNewJob = !jobItem.id
 				const endpoint = isNewJob
 					? '/index.php/apps/openconnector/api/jobs'
-					: `/index.php/apps/openconnector/api/jobs/${this.jobItem.id}`
+					: `/index.php/apps/openconnector/api/jobs/${jobItem.id}`
 				const method = isNewJob ? 'POST' : 'PUT'
 
 				// Create a copy of the job item and remove empty properties
-				const jobToSave = { ...this.jobItem }
+				const jobToSave = { ...jobItem }
 				Object.keys(jobToSave).forEach(key => {
-					if (jobToSave[key] === '' || (Array.isArray(jobToSave[key]) && jobToSave[key].length === 0)) {
+					if (jobToSave[key] === '' || (Array.isArray(jobToSave[key]) && jobToSave[key].length === 0) || key === 'created' || key === 'updated') {
 						delete jobToSave[key]
 					}
 				})

src/store/modules/navigation.js

@@ -5,7 +5,7 @@ export const useNavigationStore = defineStore(
 	'ui', {
 		state: () => ({
 			// The currently active menu item, defaults to '' which triggers the dashboard
-			selected: 'sources',
+			selected: 'dashboard',
 			// The currently active modal, managed trough the state to ensure that only one modal can be active at the same time
 			modal: false,
 			// The currently active dialog

src/views/Job/JobDetails.vue

@@ -6,26 +6,26 @@ import { jobStore, navigationStore } from '../../store/store.js'
 	<div class="detailContainer">
 		<div id="app-content">
 			<div>
-				<div class="head">
+				<div class="detailHeader">
 					<h1 class="h1">
 						{{ jobStore.jobItem.name }}
 					</h1>
 
-					<NcActions :primary="true" menu-name="Acties">
+					<NcActions :primary="true" menu-name="Actions">
 						<template #icon>
 							<DotsHorizontal :size="20" />
 						</template>
 						<NcActionButton @click="navigationStore.setModal('editJob')">
 							<template #icon>
 								<Pencil :size="20" />
 							</template>
-							Bewerken
+							Edit
 						</NcActionButton>
 						<NcActionButton @click="navigationStore.setDialog('deleteJob')">
 							<template #icon>
 								<TrashCanOutline :size="20" />
 							</template>
-							Verwijderen
+							Delete
 						</NcActionButton>
 					</NcActions>
 				</div>
@@ -37,17 +37,43 @@ import { jobStore, navigationStore } from '../../store/store.js'
 						<p>{{ jobStore.jobItem.status }}</p>
 					</div>
 				</div>
-				<!-- Add more job-specific details here -->
+
+				<div class="tabContainer">
+					<BTabs content-class="mt-3" justified>
+						<BTab title="Logs">
+							<div v-if="jobStore.jobLogs?.length">
+								<NcListItem v-for="(log, i) in jobStore.jobLogs"
+									:key="log.id + i"
+									:name="log.id"
+									:bold="false"
+									:force-display-actions="true">
+									<template #icon>
+										<BriefcaseAccountOutline disable-menu
+											:size="44" />
+									</template>
+									<template #subname>
+										{{ log.created }}
+									</template>
+								</NcListItem>
+							</div>
+							<div v-if="!jobStore.jobLogs?.length">
+								No logs found
+							</div>
+						</BTab>
+					</BTabs>
+				</div>
 			</div>
 		</div>
 	</div>
 </template>
 
 <script>
-import { NcActions, NcActionButton } from '@nextcloud/vue'
+import { NcActions, NcActionButton, NcListItem } from '@nextcloud/vue'
+import { BTabs, BTab } from 'bootstrap-vue'
 import DotsHorizontal from 'vue-material-design-icons/DotsHorizontal.vue'
 import Pencil from 'vue-material-design-icons/Pencil.vue'
 import TrashCanOutline from 'vue-material-design-icons/TrashCanOutline.vue'
+import BriefcaseAccountOutline from 'vue-material-design-icons/BriefcaseAccountOutline.vue'
 
 export default {
 	name: 'JobDetails',
@@ -57,6 +83,9 @@ export default {
 		DotsHorizontal,
 		Pencil,
 		TrashCanOutline,
+		BTabs,
+		BTab,
+		NcListItem,
 	},
 	mounted() {
 		jobStore.refreshJobLogs()

src/views/Job/JobsIndex.vue

@@ -10,14 +10,14 @@ import { jobStore, navigationStore } from '../../store/store.js'
 		<template #default>
 			<NcEmptyContent v-if="!jobStore.jobItem || navigationStore.selected != 'jobs'"
 				class="detailContainer"
-				name="Geen taak"
-				description="Nog geen taak geselecteerd">
+				name="No job"
+				description="No job selected">
 				<template #icon>
 					<Update />
 				</template>
 				<template #action>
-					<NcButton type="primary" @click="jobStore.setJobItem({}); navigationStore.setModal('editJob')">
-						Taak toevoegen
+					<NcButton type="primary" @click="jobStore.setJobItem(null); navigationStore.setModal('editJob')">
+						Add job
 					</NcButton>
 				</template>
 			</NcEmptyContent>