[subTask] v-select employee, [refactor], [masterTaskDetail] formattedDates

app/src/plugins/tm@modal/master-task/z-master-task-modal.vue

@@ -1,6 +1,6 @@
 <template>
 	<v-dialog v-model="visible" max-width="650" max-height="90%" height="700px">
-		<W-loadable :content="masterTask && employees" class="h-100">
+		<W-loadable :content="masterTask" class="h-100">
 			<v-card v-if="editMode" height="100%" class="d-flex flex-column scrolling">
 				<div class="d-flex justify-space-between align-center modal-header">
 					<h1>{{ masterTask.id ? 'Upraviť master task' : 'Vytvoriť master task' }}</h1>
@@ -69,7 +69,9 @@
 						class="modal-input border-select"
 						label="Tím"
 						variant="solo"
-						:items="teamsOptions"
+						:items="teams"
+						item-value="id"
+						item-title="name"
 					></v-select>
 
 					<v-text-field
@@ -170,7 +172,7 @@
 							</v-col>
 							<v-col cols="7">
 								<v-sheet class="ma-2">
-									<p class="text-red-darken-4">{{ formattedDeadline }}</p>
+									<p :class="`${compareDates ? 'text-black' : 'text-red-darken-4'}`">{{ formattedDeadline }}</p>
 								</v-sheet>
 							</v-col>
 						</v-row>
@@ -212,7 +214,7 @@
 							</v-col>
 							<v-col cols="7">
 								<v-sheet class="ma-2">
-									<p>{{ (masterTask.duration / 60 / 60).toFixed(2) }} h</p>
+									<p>{{ (masterTask.duration).toFixed(2) }} h</p>
 								</v-sheet>
 							</v-col>
 						</v-row>
@@ -230,7 +232,7 @@
 							</v-col>
 							<v-col cols="7">
 								<v-sheet class="ma-2">
-									<p class="text-red-darken-4">{{ masterTask.worked_time }} h</p>
+									<p :class="masterTask.worked_time > masterTask.duration ? 'text-red-darken-4': 'text-black'">{{ (masterTask.worked_time).toFixed(2) }} h</p>
 								</v-sheet>
 							</v-col>
 						</v-row>
@@ -248,7 +250,7 @@
 							</v-col>
 							<v-col cols="7">
 								<v-sheet class="ma-2">
-									<p class="text-red-darken-4">{{ masterTask.remaining_time }} h</p>
+									<p :class="masterTask.worked_time > masterTask.duration ? 'text-red-darken-4': 'text-black'">{{ (masterTask.duration - masterTask.worked_time).toFixed(2) }} h</p>
 								</v-sheet>
 							</v-col>
 						</v-row>
@@ -359,10 +361,14 @@ export default {
 
 	methods: {
 		async create(masterTaskId = null, editMode = false) {
+			this.visible = true
+			this.masterTask = null
+
 			if (masterTaskId) {
 				await this._load(masterTaskId)
+				this.editMode = editMode || (!this.masterTask?.id)
 			} else {
-				this.masterTask = {
+				const masterTask = {
 					project_code: null,
 					name: null,
 					deadline: null,
@@ -372,10 +378,12 @@ export default {
 					employees: [],
 					files: []
 				}
-			}
 
-			this.editMode = editMode || (!this.masterTask.id)
-			this.visible = true
+				setTimeout(() => {
+					this.masterTask = masterTask
+					this.editMode = editMode || (!this.masterTask.id)
+				})
+			}
 		},
 
 		async save() {
@@ -391,14 +399,13 @@ export default {
 				this.close()
 				this.$router.push({ name: 'Dashboard - Tasks' })
 			} catch (error) {
-				console.log(error)
+				this.$toast(error)
 			}
 		},
 
 		close() {
 			this.visible = false
 			this.$emit('close', this.masterTask)
-			this.masterTask = null
 		},
 
 		async _load(masterTaskId) {
@@ -460,9 +467,6 @@ export default {
 	},
 
 	computed: {
-		teamsOptions() {
-			return this.teams.map(team => `${team.name} - ${team.id}`)
-		},
 
 		totalHours() {
 			let hours = 0
@@ -470,7 +474,6 @@ export default {
 			this.masterTask.employees.forEach(function(employee) {
 				if(employee.hours > 0) hours += parseFloat(employee.hours)
 			})
-			console.log(hours)
 
 			return hours ? hours : 0
 		},
@@ -495,12 +498,18 @@ export default {
 			let deadline = moment(this.masterTask.deadline)
 			let date = deadline.format('DD.MM.yyyy')
 			return date
+		},
+
+		compareDates() {
+			const date1 = moment()
+			const date2 = moment(this.masterTask.deadline)
+			return moment(date1).isBefore(date2)
 		}
 	},
 
 	watch: {
 		selectedTeam() {
-			this.masterTask.team 		= this.teams.find(team => `${team.name} - ${team.id}` == this.selectedTeam)
+			this.masterTask.team 		= this.teams.find(team => team.id == this.selectedTeam)
 			this.masterTask.employees 	= this.masterTask.team.employees
 		}
 	}