[Review]

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

@@ -42,17 +42,24 @@ export default {
 
 	data() {
 		return {
+			// Kaluza: Napojit na BE
 			employees: ['Foo', 'Bar', 'Fizz', 'Buzz'],
+
+			// Kaluza: Toto je preco hardcoded
 			selectedDate: "13.11.2022 - 17.11.2022",
+
+			// Kaluza: Napojit funkcnost
 			selectedEmployee: 'Bar',
 			date: new Date()
 		}
 	},
 
 	created() {
+		// Kaluza: getWeek pouzivas iba v js a nevolas ho z html a je to pomocna funkcia, takze ju nazvi _getWeek
 		this.getWeek()
 	},
 
+	// Kaluza: Computed ma byt hned za data
 	computed: {
 		time() {
 			return this.unscheduledTime

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

@@ -66,7 +66,7 @@
 						</div>
 					</div>
 
-					<div class="event-footer d-flex">		
+					<div class="event-footer d-flex">
 						<v-btn rounded class="event-footer-button me-2" :class="{'completed': event.completed}" @click="clickCompleteTask(event)"><img :src="require('./_img/checkmark.svg')" alt=""></v-btn>
 						<v-btn rounded class="event-footer-button me-2" @click.stop="editTask(event.id, true)"><img :src="require('./_img/pencil.svg')" alt=""></v-btn>
 						<v-btn rounded class="event-footer-button me-2" @click.stop="this.showDeleteModal = {task: event}"><img :src="require('./_img/bin.svg')" alt=""></v-btn>
@@ -83,12 +83,15 @@
 		</Vue-cal>
 
 		<Z-sub-task-modal ref="z-sub-task-modal" />
+
+		<!-- Kravarik: Prerobit modaly na novy sposob -->
 		<Z-complete-task-modal v-if="showCompleteModal" :visible="showCompleteModal ? true : false" :task="showCompleteModal.task" @completeTask="completeTask" @close="showCompleteModal = null" />
 		<Z-delete-task-modal v-if="showDeleteModal" :visible="showDeleteModal ? true : false" :task="showDeleteModal.task" @deleteTask="deleteTask" @close="showDeleteModal = null" />
 	</div>
 </template>
 
 <script>
+// Kaluza: Cely tento komponent presun do tm@dashboard/_components/z-timeline.vue
 import ZCompleteTaskModal 	from '@/plugins/tm@modal/task/z-complete-task-modal.vue'
 import ZDeleteTaskModal 	from '@/plugins/tm@modal/task/z-delete-task-modal.vue'
 import ZSubTaskModal 		from '@/plugins/tm@modal/sub-task/z-sub-task-modal.vue'
@@ -142,12 +145,10 @@ export default {
 		}
 	},
 
-	mounted() {
-		// console.log(this.calData.tasks)
-	},
-
 	methods: {
 		weekChanged() {
+			// Kaluza: Skus tieto document.getElementBy... prerobit na this.$el.getElement ...
+			// Je za tym viacero problemov ktore by to mohlo sposobit, v tejto appke asi ne ale nech si drzime best practices
 			const scrollContainer = document.getElementsByClassName('vuecal__scrollable-body')[0]
 			scrollContainer.scrollLeft = 0
 		},
@@ -162,7 +163,9 @@ export default {
 		},
 
 		correctMargins() {
-			if (!document.getElementsByClassName('vuecal__split-days-headers').length) return
+			if (!document.getElementsByClassName('vuecal__split-days-headers').length)
+				return
+
 			const heightOfDayHeader = document.getElementsByClassName('vuecal__split-days-headers')[0].clientHeight
 			document.getElementsByClassName('vuecal__time-column')[0].style.marginTop = `${heightOfDayHeader}px`
 			document.getElementsByClassName('vuecal__cells-body')[0].style.marginTop = `${heightOfDayHeader}px`
@@ -230,7 +233,7 @@ export default {
 	.calendar-wrapper
 		width: 100%
 		height: 100%
-		// padding: 0 20px 0 0 
+		// padding: 0 20px 0 0
 
 		&:deep()
 			.vuecal__cells

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

@@ -6,6 +6,7 @@
 			<Z-timeline :calData="timelineData" :calConfig="config" :splits="splitDays" @eventMoved="onEventMoved" @completeTask="completeTask" @reopenTask="reopenTask" @deleteTask="deleteTask" />
 		</W-loadable>
 
+		<!-- Kaluza: Toto vyhodit a pouzit w toast -->
 		<v-snackbar
 			v-model="errorToast"
 			:timeout="2000"
@@ -32,8 +33,11 @@ export default {
 	data() {
 		return {
 			timelineData: null,
+
+			// Kaluza: Vyhodit tieto toast veci
 			errorToast: false,
 			errorToastMessage: "Nepodarilo sa nacitat data!",
+
 			dataLoaded: false,
 			splitDays: [],
 			unscheduledTime: 0,
@@ -53,12 +57,14 @@ export default {
 				this.generateSplits(week.firstDay)
 				this.generateNonWorkingHours(week.firstDay)
 			} catch(error) {
+				// Kaluza: Ked to davas do w loadable tak nepouzi toast a iba daj this.timeineData = {error} a loadable ho parsne a zobrazi
 				this.timelineData = {}
 				console.error(error)
 				this.triggerToast("Nepodarilo sa nacitat data!")
 			}
 		},
 
+		// Kaluza: Toto prosimta premenuj lebo neviem vobec co znamena splits
 		generateSplits(date) {
 			this.splitDays = []
 			for (let i = 0; i < 7; i++) {
@@ -72,6 +78,7 @@ export default {
 			}
 		},
 
+		// Kaluza: Toto nazvi nejako inak aby bolo viac jasne ze z coho to preformatovava na co
 		formatData(date) {
 			// format events
 			this.timelineData.tasks.forEach(event => {
@@ -130,11 +137,13 @@ export default {
 			this.timelineData.tasks.push(...nonWorkingHours)
 		},
 
+		// Kaluza: Vyhodit
 		triggerToast(message) {
 			this.errorToastMessage = message
 			this.errorToast = true
 		},
 
+		// Kaluza: Vyhodit ak sa nepouzije
 		async onEventMoved(event) {
 			console.log("drag", event)
 			// try {
@@ -153,6 +162,13 @@ export default {
 		},
 
 		completeTask(id) {
+			// Kaluza: Tu pridaj request na BE, nepouzi filter ale find a sprav to takto
+			// 1. const task = this.timelineData.tasks.find(task => task.id == id)
+			// 2. task.completed = true
+			// 3. V tryCatch zavolaj request na BE
+			// 4. Ak to spadne do catchu tak daj task.completed = false a pod tym daj this.$toast.error(error)
+
+			// A AKO NAD TYM ROZMYSLAM completeTask A reopenTask MOZES SPOJIT DO JEDNEJ A VZDY LEN DAS task.completed = !task.completed
 			this.timelineData.tasks.filter(task => {
 				if (task.id == id) {
 					task.completed = true
@@ -161,6 +177,7 @@ export default {
 		},
 
 		reopenTask(id) {
+			// Kaluza: Toto rovnakym sposobom ako complete task
 			this.timelineData.tasks.filter(task => {
 				if (task.id == id) {
 					task.completed = false
@@ -169,6 +186,7 @@ export default {
 		},
 
 		deleteTask(id) {
+			// Kaluza: Toto rovnako ako complete a reopen
 			this.timelineData.tasks.splice(this.timelineData.tasks.findIndex(item => item.id === id), 1)
 		}
 	}