[teams overview] setup, tahanie dat a ich formatovanie...

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

@@ -3,12 +3,12 @@
 		<A-team-filter @dayChanged="getDayData" />
 
 		<W-loadable :content="timelineData" class="w-loadable" empty-message="Nepodarilo sa nacitat data!">
-			<Z-timeline />
+			<Z-timeline :calData="timelineData" :calConfig="config" :splits="splitDays" @eventMoved="onEventMoved" />
 		</W-loadable>
 
-		<v-snackbar 
-			v-model="errorToast" 
-			:timeout="2000" 
+		<v-snackbar
+			v-model="errorToast"
+			:timeout="2000"
 			color="red"
 			:rounded="true"
 		>
@@ -21,6 +21,8 @@
 import ATeamFilter from './_components/a-team-filter.vue'
 import ZTimeline from '../tasks/_components/z-timeline.vue'
 
+import { setHours, setMinutes, setSeconds } from 'date-fns'
+
 export default {
 	components: {
 		ATeamFilter,
@@ -29,13 +31,119 @@ export default {
 
 	data() {
 		return {
-			timelineData: {kokot: "kokot"}
+			timelineData: null,
+			formatedTasks: {tasks: []},
+			errorToast: false,
+			errorToastMessage: "Nepodarilo sa nacitat data!",
+			dataLoaded: false,
+			splitDays: [],
+			config: {
+				date: new Date(),
+				scrollHour: 7,
+			}
 		}
 	},
 
 	methods: {
-		getDayData(date) {
-			console.log(date)
+		async getDayData(date) {
+			this.config.date = date
+			try {
+				this.timelineData = await this.$axios.get_auth_data('v1/overview/teams')
+				this.generateSplits()
+				this.formatData()
+				this.generateNonWorkingHours(date)
+			} catch(error) {
+				this.timelineData = {}
+				console.error(error)
+				this.triggerToast("Nepodarilo sa nacitat data!")
+			}
+		},
+
+		generateSplits() {
+			this.splitDays = []
+			for (let i = 0; i < this.timelineData.length; i++) {
+				this.timelineData[i].splitId = i + 1
+				this.splitDays.push({
+					id: i + 1,
+					firstName: this.timelineData[i].name,
+					name: this.timelineData[i].name + " " + this.timelineData[i].surname,
+					initials: this.timelineData[i].name.charAt(0).toUpperCase() + this.timelineData[i].surname.charAt(0).toUpperCase(),
+					unscheduledTime: Math.floor(this.timelineData[i].unscheduled_time / 60) + "," + String(this.timelineData[i].unscheduled_time % 60)[0]
+				})
+			}
+		},
+
+		formatData() {
+			this.timelineData.tasks = []
+			
+			// format events
+			this.timelineData.forEach(user => {
+				user.tasks.forEach(event => {
+					event.name = user.name
+					event.surname = user.surname
+
+					event.start = new Date(event.starts_at)
+					event.end = new Date(event.ends_at)
+					event.split = user.splitId
+				})
+				this.timelineData.tasks.push(...user.tasks)
+			})
+		},
+
+		generateNonWorkingHours(date) {
+			let nonWorkingHours = []
+			let workStartHour = 23
+
+			this.timelineData.forEach(user => {
+				const start1 = { hour: 0, minutes: 0, seconds: 0}
+				const end1 = { hour: Number(user.work_hours_from.split(':')[0]), minutes: Number(user.work_hours_from.split(':')[1]) - 1, seconds: 0 }
+				const start2 = { hour: Number(user.work_hours_to.split(':')[0]), minutes: Number(user.work_hours_to.split(':')[1]) + 1, seconds: 0 }
+				const end2 = { hour: 23, minutes: 59, seconds: 59}
+
+				if (workStartHour > Number(user.work_hours_from.split(':')[0])) workStartHour = Number(user.work_hours_from.split(':')[0])
+
+				nonWorkingHours.push({
+					title: "Non working hours",
+					start: setSeconds(setMinutes(setHours(date, start1.hour), start1.minutes), start1.seconds),
+					end: setSeconds(setMinutes(setHours(date, end1.hour), end1.minutes), end1.seconds),
+					nonWorking: true,
+					split: user.splitId,
+					draggable: false
+				})
+				nonWorkingHours.push({
+					title: "Non working hours",
+					start: setSeconds(setMinutes(setHours(date, start2.hour), start2.minutes), start2.seconds),
+					end: setSeconds(setMinutes(setHours(date, end2.hour), end2.minutes), end2.seconds),
+					nonWorking: true,
+					split: user.splitId,
+					draggable: false
+				})
+			})
+
+			this.config.scrollHour = workStartHour - 1
+			this.timelineData.tasks.push(...nonWorkingHours)
+		},
+
+		triggerToast(message) {
+			this.errorToastMessage = message
+			this.errorToast = true
+		},
+
+		async onEventMoved(event) {
+			console.log("drag", event)
+			// try {
+			// 	const newStartDate = addDays(event.event.start, differenceInCalendarDays(this.splitDays.filter((split) => {return split.id == event.newSplit})[0].date, event.event.start))
+			// 	const newEndDate = addDays(event.event.end, differenceInCalendarDays( newStartDate, event.event.start))
+			// 	await this.$axios.post_auth_data(`v1/overview/tasks/${event.event.id}`, {start: newStartDate, end: newEndDate})
+			// } catch(error) {
+			// 	this.triggerToast("Nepodarilo sa presunut ulohu!")
+			// 	this.timelineData.tasks.filter(e => {
+			// 		if (e.id == event.event.id) {
+			// 			e.start = new Date(event.originalEvent.start)
+			// 			e.end = new Date(event.originalEvent.end)
+			// 		}
+			// 	})
+			// }
 		}
 	}
 }
@@ -50,4 +158,5 @@ export default {
 @media (max-width: 1312px)
 	.w-loadable
 		height: calc( 100% - 202px )
+
 </style>