From b6f2249440e6964c82760c4a5585b4d4488e6a8a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Matej=20Glasn=C3=A1k?= <glasnak@wezeo.com>
Date: Tue, 11 Apr 2023 15:14:57 +0200
Subject: [PATCH] [Blockers] Implemented homeoffice, adhoc, vacation blockers

---
 .../tm@dashboard/_components/z-timeline.vue   | 24 ++++++++-----------
 .../tasks/_utils/timeline.utils.ts            | 13 +++++-----
 app/src/plugins/tm@dashboard/tasks/tasks.vue  | 10 +++++++-
 .../master-task/z-master-task-modal.vue       |  2 --
 4 files changed, 26 insertions(+), 23 deletions(-)

diff --git a/app/src/plugins/tm@dashboard/_components/z-timeline.vue b/app/src/plugins/tm@dashboard/_components/z-timeline.vue
index 296c3e1..579d297 100644
--- a/app/src/plugins/tm@dashboard/_components/z-timeline.vue
+++ b/app/src/plugins/tm@dashboard/_components/z-timeline.vue
@@ -26,7 +26,7 @@
 			<template v-slot:split-label="{ split }">
 				<div class="w-100 h-100 d-flex flex-column">
 					<span v-if="split.date" class="d-flex align-center">
-						<img v-if="getHeadingDate(split.date) == 'Dnes'" :src="require('@/plugins/app/_img/icons/home.svg')" class="mr-2">
+						<img v-if="split.isHomeoffice" :src="require('@/plugins/app/_img/icons/home.svg')" class="mr-2">
 						<p class="weekday-label">{{ getHeadingDate(split.date) }}</p>
 					</span>
 					<span v-else class="d-flex align-center">
@@ -64,16 +64,16 @@
 					</div>
 				</div>
 
-				<div v-else-if="event.blocker?.type != 'home_office'" class="custom-event-body w-100 h-100 d-flex flex-column justify-space-between" :class="{'short-event' : getEventLength(event) <= 9000000, 'mini-event' : getEventLength(event) <= 5400000, 'micro-event' : getEventLength(event) <= 3600000}" :style="{backgroundColor: event.color || event.subtask.color}">
-					<div class="event-content" :class="event.type || 'subtask'"> 
-						<template v-if="event.type == 'blocker'">
-							<h3>{{ event.blocker.name }}</h3>
-						</template>
-						
-						<template v-else>
+				<div v-else-if="['subtask', 'blocker', 'adhoc', 'vacation'].includes(event.type)" class="custom-event-body w-100 h-100 d-flex flex-column justify-space-between" :class="{'short-event' : getEventLength(event) <= 9000000, 'mini-event' : getEventLength(event) <= 5400000, 'micro-event' : getEventLength(event) <= 3600000}" :style="{backgroundColor: event.color || event.subtask.color}">
+					<div class="event-content" :class="{'is-blocker': event.isBlocker}"> 
+						<template v-if="event.type == 'subtask'">
 							<small v-if="event.subtask.project_code" class="project-code">{{ event.subtask.project_code }}</small>
 							<h3>{{ event.subtask.master_task?.name || event.subtask.master_task }}</h3>
 						</template>
+
+						<template v-else>
+							<h3>{{ event.blocker.name }}</h3>
+						</template>
 						
 						<div class="d-flex align-center event-details event-initials-wrapper">
 							<div class="event-initials d-flex justify-center align-center">
@@ -209,11 +209,7 @@ export default {
 		},
 
 		taskClicked(subtask) {
-			if (subtask.type == 'non-working-hours') return
-			// console.log("task", task)
-			if (subtask.end.getTime() - subtask.start.getTime() <= 3600000) {
-				// console.log("ShortTask")
-			}
+			// console.log('task clicked')
 		},
 
 		eventFocused(event) {
@@ -385,7 +381,7 @@ export default {
 						padding: 20px 10px
 
 					.event-content
-						&.blocker
+						&.is-blocker
 							*
 								color: #ffffff !important
 
diff --git a/app/src/plugins/tm@dashboard/tasks/_utils/timeline.utils.ts b/app/src/plugins/tm@dashboard/tasks/_utils/timeline.utils.ts
index c38c0f2..8f7508d 100644
--- a/app/src/plugins/tm@dashboard/tasks/_utils/timeline.utils.ts
+++ b/app/src/plugins/tm@dashboard/tasks/_utils/timeline.utils.ts
@@ -23,8 +23,10 @@ export default {
 	generateTimelineEvents(subtasks, employee, date) {
 		let events  = []
 
+		
+
 		subtasks.forEach(subtask => {
-			if (subtask.type == 'blocker') {
+			if (['blocker', 'adhoc', 'home_office', 'vacation'].includes(subtask.type)) {
 				events = [...events, ...this._generateEventsFromBlocker(subtask, date)]
 			} else {
 				subtask.timeblocks?.forEach((timeblock) => {
@@ -50,6 +52,7 @@ export default {
 			split: this._getSplitFromDate(date, timeblock.start),
 			project_code: subtask.project_code,
 			subtask: subtask,
+			type: 'subtask',
 			_timeblock_id: timeblock.id
 		}
 	},
@@ -58,8 +61,7 @@ export default {
 		const start = moment(blocker.start)
 		const end 	= moment(blocker.end)
 
-		const dates 	= start == end ? [moment(start).format('YYYY-MM-DD')] : this._getDatesInRange(start, end)
-		
+		const dates 	= start.isSame(end, 'date') ? [moment(start).format('YYYY-MM-DD')] : this._getDatesInRange(start, end)
 		const blockers 	= dates.map(d => {
 			const diffInDays = differenceInCalendarDays(date, new Date(d))
 			const dStart = new Date(moment(d).set({hours: start.hours(), minutes: start.minutes()}).format('YYYY-MM-DD HH:mm'))
@@ -71,7 +73,8 @@ export default {
 				start: addDays(dStart, diffInDays),
 				end: addDays(dEnd, diffInDays),
 				date: new Date(d),
-				type: 'blocker',
+				type: blocker.type,
+				isBlocker: true,
 				initials: `${blocker.employee?.name[0]}${blocker.employee?.surname[0]}`,
 				color: '#B00020',
 				draggable: false
@@ -117,8 +120,6 @@ export default {
 			})
 		}
 
-		console.log(events)
-
 		return events
 	},
 
diff --git a/app/src/plugins/tm@dashboard/tasks/tasks.vue b/app/src/plugins/tm@dashboard/tasks/tasks.vue
index ff0f10e..f45371f 100644
--- a/app/src/plugins/tm@dashboard/tasks/tasks.vue
+++ b/app/src/plugins/tm@dashboard/tasks/tasks.vue
@@ -38,11 +38,18 @@ export default {
 		splitDays() {
 			const days = []
 			const workingHours = {}
+			const homeoffice = {}
+
+			console.log(this.timelineData.tasks.filter(task => task.type != 'subtask' && task.type != 'non-working-hours'))
 
 			this.timelineData.tasks.forEach(task => {
 				if (!workingHours[task.split])
 					workingHours[task.split] = 0
 
+				if (task.type == 'home_office') {
+					return homeoffice[task.split] = true
+				}
+
 				if (task.type == 'non-working-hours' || task.subtask?.is_finished || task.blocker?.is_finished)
 					return
 
@@ -56,6 +63,7 @@ export default {
 					initials: this.filter.employee.name.charAt(0).toUpperCase() + this.filter.employee.surname.charAt(0).toUpperCase(),
 					unscheduledTime: workingHours[i + 1],
 					date: addDays(this.filter.start, i),
+					isHomeoffice: homeoffice[i],
 					isWeekend: timelineUtils.isWeekend(addDays(this.filter.start, i))
 				})
 			}
@@ -123,7 +131,7 @@ export default {
 				const { subtasks, blockers } 	= await this.$axios.get_auth(`v1/subtasks?${queryParameters}`)
 				this.config.scrollHour 			= (this.filter?.employee.work_start / 60) - 1
 				this.config.date 				= this.filter.start
-				this.subtasks					= [...subtasks, ...blockers.map(blocker => ({...blocker, type: 'blocker'}))]
+				this.subtasks					= [...subtasks, ...blockers]
 			} catch (error) {
 				this.$toast.error('Nepodarilo sa nacitat data!')
 			}
diff --git a/app/src/plugins/tm@modal/master-task/z-master-task-modal.vue b/app/src/plugins/tm@modal/master-task/z-master-task-modal.vue
index 045a086..f332169 100644
--- a/app/src/plugins/tm@modal/master-task/z-master-task-modal.vue
+++ b/app/src/plugins/tm@modal/master-task/z-master-task-modal.vue
@@ -206,8 +206,6 @@ export default {
 				if (mastertask?.id) {
 					this.mastertask = await this.$axios.get_auth_data(`v1/mastertasks/${mastertask.id}`)
 
-					console.log(this.mastertask)
-
 					// TODO zmazat ked zacne prichadzat project_id a team_id
 					const project = this.projects.find((project) => project.code == this.mastertask.project_code)
 					this.mastertask.project_id 		= project.id