[Mastertask modal] Team selects WIP

This commit is contained in:
Matej Glasnák committed 2023-06-12 12:33:45 +02:00
1 parent 3b09f8b51a
commit be1deb9296
3 files changed
+18 -23

No files matched your search

@@ -13,7 +13,7 @@
<v-sheet class="py-3 d-flex flex-wrap flex-column"> <v-sheet class="py-3 d-flex flex-wrap flex-column">
<template v-if="team"> <template v-if="team">
<p class="task-badge px-4 py-2 rounded-pill flex-shrink-0">{{ team.name }}</p> <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"> <p class="employee-selected-avatar d-flex justify-center align-center">
{{ employee._initials }} {{ employee._initials }}
</p> </p>
@@ -23,7 +23,7 @@
</template> </template>
<p class="task-badge px-4 py-2 rounded-pill flex-shrink-0">Nepriradený</p> <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"> <p class="employee-selected-avatar d-flex justify-center align-center">
{{ employee._initials }} {{ employee._initials }}
</p> </p>
@@ -52,14 +52,19 @@ export default {
}, },
computed: { computed: {
enrichedTeamEmployees() { enrichedEmployeesInTeam() {
if (!this.team?.employees) if (!this.team?.employees)
return [] return []
return tmUtils.enrichEmployees(this.team.employees) 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)
} }
} }
} }
@@ -80,7 +80,7 @@ export default {
if (!value) return if (!value) return
this.mastertask.team = this.teams.find(team => team.id == value) this.mastertask.team = this.teams.find(team => team.id == value)
// this.mastertask.employees = this.mastertask.team.employees this.mastertask.employees = this.mastertask.team.employees
}, },
} }
} }
@@ -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> <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"> <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"> <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"> <p class="employee-select-avatar d-flex justify-center align-center">
@@ -218,14 +208,14 @@ export default {
}, },
methods: { methods: {
removeEmployeeFromTeam({ id }) {
const employees = this.mastertask.team.employees.filter(employee => employee.id != id)
this.mastertask.employees = [...employees, ...this.mastertask.employees]
this.mastertask.team_id = null
this.mastertask.team = null
},
removeEmployee({ id }) { removeEmployee({ id }) {
const isEmployeeInTeam = this.mastertask.team.employees.find(employee => employee.id == id)
if (isEmployeeInTeam) {
this.mastertask.team_id = null
this.mastertask.team = null
}
this.mastertask.employees = this.mastertask.employees.filter(employee => employee.id != id) this.mastertask.employees = this.mastertask.employees.filter(employee => employee.id != id)
}, },