[Blockers] Teams screen

app/src/plugins/tm@dashboard/_components/z-timeline.vue

@@ -30,6 +30,7 @@
 						<p class="weekday-label">{{ getHeadingDate(split.date) }}</p>
 					</span>
 					<span v-else class="d-flex align-center">
+						<img v-if="split.isHomeoffice" :src="require('@/plugins/app/_img/icons/home.svg')" class="mr-2">
 						<p class="weekday-label">{{ split.name }}</p>
 					</span>
 
@@ -64,7 +65,7 @@
 					</div>
 				</div>
 
-				<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 v-else-if="['subtask', 'blocker', 'adhoc', 'vacation', 'free_day'].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>

app/src/plugins/tm@dashboard/tasks/_utils/timeline.utils.ts

@@ -23,10 +23,8 @@ export default {
 	generateTimelineEvents(subtasks, employee, date) {
 		let events  = []
 
-		
-
 		subtasks.forEach(subtask => {
-			if (['blocker', 'adhoc', 'home_office', 'vacation'].includes(subtask.type)) {
+			if (['blocker', 'adhoc', 'home_office', 'vacation', 'free_day'].includes(subtask.type)) {
 				events = [...events, ...this._generateEventsFromBlocker(subtask, date)]
 			} else {
 				subtask.timeblocks?.forEach((timeblock) => {

app/src/plugins/tm@dashboard/tasks/tasks.vue

@@ -40,8 +40,6 @@ export default {
 			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

app/src/plugins/tm@dashboard/teams/_components/a-team-filter.vue

@@ -46,7 +46,7 @@ export default {
 
 	data() {
 		return {
-			date: new Date(),
+			date: new Date('2023-03-24'),
 			selectedTeam: null,
 			selectedDate: null,
 			time: null,

app/src/plugins/tm@dashboard/teams/_mixins/TeamsCalendar.mixin.ts

@@ -17,13 +17,21 @@ export default {
 
 		splitDays() {
 			const days = []
+			const homeoffice = {}
 
 			this.filter.team.employees.forEach((employee, index) => {
 				let workingHours = 0
 
 				this.calendarData.tasks.forEach(task => {
-					if (task?.subtask?.employee_id == employee.id)
+					if ((task.subtask?.employee.id == employee.id) || (task.blocker?.employee?.id == employee.id))
-						workingHours += timelineUtils._getDifferenceInHours(task.end, task.start)
+						return
+
+					console.log(task.type)
+
+					if (task.type == 'home_office')
+						return homeoffice[task.split] = true
+
+					workingHours += timelineUtils._getDifferenceInHours(task.end, task.start)
 				})
 
 				days.push({
@@ -31,7 +39,8 @@ export default {
 					name: employee.name,
 					fullname: `${employee.name} ${employee.surname}`,
 					initials: employee.name.charAt(0).toUpperCase() + employee.surname.charAt(0).toUpperCase(),
-					unscheduledTime: workingHours
+					unscheduledTime: workingHours,
+					isHomeoffice: homeoffice[index + 1] ? true : false
 				})
 			})
 
@@ -107,7 +116,7 @@ export default {
 							initials: employee?.name?.charAt(0)?.toUpperCase() + employee?.surname?.charAt(0)?.toUpperCase(),
 							split: split,
 							project_code: subtask.project_code,
-							subtask: subtask,
+							subtask,
 							_timeblock_id: timeblock.id
 						})
 					}
@@ -136,7 +145,8 @@ export default {
 					split,
 					start: new Date(blocker.start),
 					end: new Date(blocker.end),
-					type: 'blocker',
+					type: blocker.type,
+					isBlocker: true,
 					initials: `${employee?.name[0]}${employee?.surname[0]}`,
 					color: '#B00020',
 					draggable: false,

app/src/plugins/tm@dashboard/teams/teams.vue

@@ -1,7 +1,6 @@
 <template>
 	<div>
 		<A-team-filter v-if="$store.getters['tm/isInitialized']"  :unscheduledTime="calendarData?.unscheduledTime || 0" @filter-changed="onFilterChanged" />
-		
 		<Z-timeline v-if="calendarData" :cal-data="calendarData" :cal-config="calendarConfig" :splits="splitDays" />
 	</div>
 </template>