[Mastertask modal] Team selects WIP

app/src/plugins/tm@modal/_components/read-only/z-team.vue

@@ -13,7 +13,7 @@
 			<v-sheet class="py-3 d-flex flex-wrap flex-column">
 				<template v-if="team">
 					<p class="task-badge px-4 py-2 rounded-pill flex-shrink-0">{{ team.name }}</p>
-					<div class="d-flex align-center flex-shrink-0 mt-2 task-badge px-4 py-2 rounded-pill" v-for="employee in enrichedTeamEmployees" :key="employee.id">
+					<div class="d-flex align-center flex-shrink-0 mt-2 task-badge px-4 py-2 rounded-pill" v-for="employee in enrichedEmployeesInTeam" :key="employee.id">
 						<p class="employee-selected-avatar d-flex justify-center align-center">
 							{{ employee._initials }}
 						</p>
@@ -23,7 +23,7 @@
 				</template>
 
 				<p class="task-badge px-4 py-2 rounded-pill flex-shrink-0">Nepriradený</p>
-				<div class="d-flex align-center flex-shrink-0 mt-2 task-badge px-4 py-2 rounded-pill" v-for="employee in enrichedEmployees" :key="employee.id">
+				<div class="d-flex align-center flex-shrink-0 mt-2 task-badge px-4 py-2 rounded-pill" v-for="employee in enrichedEmployeesOutsideTeam" :key="employee.id">
 					<p class="employee-selected-avatar d-flex justify-center align-center">
 						{{ employee._initials }}
 					</p>
@@ -52,14 +52,19 @@ export default {
 	},
 
 	computed: {
-		enrichedTeamEmployees() {
+		enrichedEmployeesInTeam() {
 			if (!this.team?.employees)
 				return []
 
 			return tmUtils.enrichEmployees(this.team.employees)	
 		},
-		enrichedEmployees() {
+
+		enrichedEmployeesOutsideTeam() {
+			if (!this.team)
 				return tmUtils.enrichEmployees(this.employees)
+
+			const employeesOutsideOfTeam = this.employees.filter(employee => !this.team.employees.find(em => em.id == employee.id))
+			return tmUtils.enrichEmployees(employeesOutsideOfTeam)
 		}
 	}
 }

app/src/plugins/tm@modal/master-task/_mixins/selects.mixin.ts

@@ -80,7 +80,7 @@ export default {
 			if (!value) return
 			
 			this.mastertask.team 		= this.teams.find(team => team.id == value)
-			// this.mastertask.employees   = this.mastertask.team.employees
+			this.mastertask.employees   = this.mastertask.team.employees
 		},
 	}
 }

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

@@ -25,16 +25,6 @@
 
 					<v-select v-model="mastertask.team_id" @focus="onInputFocus" class="modal-input border-select" label="Tím" variant="solo" :items="teams" item-value="id" item-title="name"></v-select>
 
-					<template v-if="mastertask.team && mastertask.team_id">
-						<v-text-field v-for="(employee, index) in mastertask.team.employees" :key="employee.id" @focus="onInputFocus" class="modal-input" :label="`${employee.name} ${employee.surname}`" variant="solo" placeholder="h" v-model="mastertask.team.employees[index].duration" type="number" min="1" @input="onEmployeeDurationChanged">
-							<p class="employee-select-avatar d-flex justify-center align-center">
-								{{ employee?.name.charAt(0) + employee?.surname.charAt(0) }}
-							</p>
-
-							<v-icon @click.stop="removeEmployeeFromTeam(employee)" class="remove-input" icon="mdi-close" size="small"></v-icon>
-						</v-text-field>
-					</template>
-
 					<template v-if="mastertask.employees">
 						<v-text-field v-for="(employee, index) in mastertask.employees" :key="employee.id" @focus="onInputFocus" class="modal-input" :label="`${employee.name} ${employee.surname}`" variant="solo" placeholder="h" v-model="mastertask.employees[index].duration" type="number" min="1" @input="onEmployeeDurationChanged">
 							<p class="employee-select-avatar d-flex justify-center align-center">
@@ -218,14 +208,14 @@ export default {
 	},
 
 	methods: {
-		removeEmployeeFromTeam({ id }) {
-			const employees = this.mastertask.team.employees.filter(employee => employee.id != id)
-			this.mastertask.employees = [...employees, ...this.mastertask.employees]
+		removeEmployee({ id }) {
+			const isEmployeeInTeam = this.mastertask.team.employees.find(employee => employee.id == id)
+
+			if (isEmployeeInTeam) {
 				this.mastertask.team_id = null
 				this.mastertask.team = null
-		},
+			}
 
-		removeEmployee({ id }) {
 			this.mastertask.employees = this.mastertask.employees.filter(employee => employee.id != id)
 		},