[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() {
-			return tmUtils.enrichEmployees(this.employees)
+
+		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)
 		}
 	}
 }