mirror of
https://bitbucket.org/studiotem/jandl-taskmanager-app.git
synced 2026-10-21 14:29:34 +00:00
[Mastertask] Added v-autocomplete
This commit is contained in:
Matej Glasnák committed
1 parent
5d6a2f9b66
commit
4a9dfc6520
4 files changed
+87
-86
No files matched your search
@@ -8,7 +8,7 @@
|
||||
</div>
|
||||
|
||||
<v-card-actions class="d-flex flex-column modal-content">
|
||||
<Z-autocomplete label="Kód projektu" :options="projects.map((project) => ({ key: project.id, value: project.code }))" :validations="v$.mastertask.project_code" :clear-on-submit="false" :value="mastertask.project_code" :class="{ error: v$.mastertask.project_code.$errors.length }" class="modal-input" @option-selected="onProjectSelected" />
|
||||
<v-autocomplete v-model="mastertask.project_id" :label="$t('Project code')" :class="{error: v$.mastertask.project_id.$errors.length}" :items="projectsOptions" item-title="code" item-value="id" variant="solo" class="modal-input" clearable @update:search="projectCodeSearch = $event" />
|
||||
|
||||
<v-text-field v-model="mastertask.name" @focus="onInputFocus" class="modal-input" label="Názov mastertasku" variant="solo" :class="{ error: v$.mastertask.name.$errors.length }" :hint="v$.mastertask.name.$errors ? errorUtils.parseErrors(v$.mastertask.name.$errors) : null"></v-text-field>
|
||||
|
||||
@@ -16,17 +16,26 @@
|
||||
|
||||
<v-text-field v-model="mastertask.duration" @focus="onInputFocus" class="modal-input mt-5" variant="solo" type="number" disabled :label="`${mastertask.duration} h`"></v-text-field>
|
||||
|
||||
<v-select v-model="this.mastertask.team_id" @focus="onInputFocus" class="modal-input border-select" :class="{ error: v$.mastertask.team_id.$errors.length }" 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" :class="{ error: v$.mastertask.team_id.$errors.length }" label="Tím" variant="solo" :items="teams" item-value="id" item-title="name"></v-select>
|
||||
|
||||
<template v-if="!mastertask.id">
|
||||
<template v-if="!mastertask.id && mastertask.team_id">
|
||||
<v-text-field v-for="(employee, index) in mastertask.employees" :key="employee.id" @focus="onInputFocus" :class="{ error: !mastertask.employees[index].duration }" 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">
|
||||
{{ employee.name.charAt(0) + employee.surname.charAt(0) }}
|
||||
</p>
|
||||
</v-text-field>
|
||||
</template>
|
||||
<template v-else-if="mastertask.subtasks">
|
||||
<v-text-field v-for="(subtask, index) in enrichedSubtasks" :key="subtask.id" @focus="onInputFocus" :class="{ error: !mastertask.subtasks[index].duration }" class="modal-input" :label="`${subtask._fullName}`" variant="solo" placeholder="h" v-model="mastertask.subtasks[index].duration" type="number" min="1" @input="onEmployeeDurationChanged">
|
||||
<p class="employee-select-avatar d-flex justify-center align-center">
|
||||
{{ subtask._initials }}
|
||||
</p>
|
||||
</v-text-field>
|
||||
</template>
|
||||
|
||||
<Z-autocomplete label="Vyhľadať zamestnanca" v-if="showAddEmployeeInput" :options="employeesOptions" class="modal-input" @option-selected="onEmployeeSelected" />
|
||||
<v-autocomplete v-if="showAddEmployeeInput" :label="$t('Search for employee')" :class="{error: v$.mastertask.project_id.$errors.length}" :items="employeesOptions" item-title="_fullName" item-value="id" variant="solo" class="modal-input" clearable @update:model-value="onEmployeeSelected" />
|
||||
|
||||
<!-- <Z-autocomplete label="Vyhľadať zamestnanca" :options="employeesOptions" class="modal-input" @option-selected="onEmployeeSelected" /> -->
|
||||
|
||||
<v-btn class="w-100 mb-5 button secondary" :disabled="!mastertask.team?.id" @click="showAddEmployeeInput = true"> <v-icon class="mx-1" icon="mdi-plus" />Pridať zamestnanca </v-btn>
|
||||
|
||||
@@ -79,11 +88,11 @@ import ZFilesUpload from '@/plugins/tm@_components/z-files-upload.vue'
|
||||
import useVuelidate from '@vuelidate/core'
|
||||
import { required } from '@vuelidate/validators'
|
||||
import errorUtils from '@/plugins/lib@auth/_utils/error.utils'
|
||||
import ZAutocomplete from '@/plugins/tm@_components/z-autocomplete.vue'
|
||||
// import ZAutocomplete from '@/plugins/tm@_components/z-autocomplete.vue'
|
||||
import VuetifyFixFocusMixin from '@/plugins/tm@modal/_mixins/vuetify-fix-focus'
|
||||
import moment from 'moment'
|
||||
import { QuillEditor } from '@vueup/vue-quill'
|
||||
import tmUtils from '@/plugins/tm@_utils/tm.utils'
|
||||
// import tmUtils from '@/plugins/tm@_utils/tm.utils'
|
||||
|
||||
import '@vueup/vue-quill/dist/vue-quill.snow.css'
|
||||
|
||||
@@ -94,7 +103,7 @@ import { mapGetters } from 'vuex'
|
||||
|
||||
export default {
|
||||
// MIXINS
|
||||
// computed: employeesOptions
|
||||
// computed: employeesOptions, projectsOptions
|
||||
// methods: onProjectSelected, onEmployeeSelected, onEmployeeDurationChanged
|
||||
// watch: mastertask.team_id
|
||||
|
||||
@@ -106,7 +115,7 @@ export default {
|
||||
ATasksTable,
|
||||
Datepicker,
|
||||
ZFilesUpload,
|
||||
ZAutocomplete,
|
||||
// ZAutocomplete,
|
||||
QuillEditor
|
||||
},
|
||||
|
||||
@@ -119,6 +128,7 @@ export default {
|
||||
mastertask: null,
|
||||
showAddEmployeeInput: false,
|
||||
date: null,
|
||||
projectCodeSearch: null
|
||||
}
|
||||
},
|
||||
|
||||
@@ -127,13 +137,29 @@ export default {
|
||||
'teams',
|
||||
'projects',
|
||||
'enrichedEmployees'
|
||||
])
|
||||
]),
|
||||
|
||||
|
||||
enrichedSubtasks() {
|
||||
if (!this.mastertask?.subtasks)
|
||||
return null
|
||||
|
||||
return this.mastertask.subtasks.map(subtask => {
|
||||
const employee = this.enrichedEmployees.find(employee => employee.id == subtask.employee_id)
|
||||
|
||||
return {
|
||||
...subtask,
|
||||
_initials: employee ? employee.name.charAt(0) + employee.surname.charAt(0) : '?',
|
||||
_fullName: employee ? `${employee.name} ${employee.surname}` : ''
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
validations() {
|
||||
return {
|
||||
mastertask: {
|
||||
project_code: { required },
|
||||
project_id: { required },
|
||||
team_id: { required },
|
||||
name: { required },
|
||||
description: { required },
|
||||
@@ -171,7 +197,8 @@ export default {
|
||||
|
||||
methods: {
|
||||
async showModal({mastertask, editMode = false}) {
|
||||
this.visible = true
|
||||
this.editMode = null
|
||||
this.visible = true
|
||||
this.mastertask = null
|
||||
this.$nextTick(() => this.v$.$reset())
|
||||
|
||||
@@ -179,11 +206,14 @@ export default {
|
||||
if (mastertask?.id) {
|
||||
this.mastertask = await this.$axios.get_auth_data(`v1/mastertasks/${mastertask.id}`)
|
||||
|
||||
const project = this.projects.find((project) => project.code == this.mastertask?.project_code)
|
||||
console.log(this.mastertask)
|
||||
|
||||
this.mastertask.team_id = this.mastertask.team?.id || null
|
||||
// TODO zmazat ked zacne prichadzat project_id a team_id
|
||||
const project = this.projects.find((project) => project.code == this.mastertask.project_code)
|
||||
this.mastertask.project_id = project.id
|
||||
this.mastertask.project_code = project.code
|
||||
this.mastertask.team_id = this.mastertask.team?.id || null
|
||||
|
||||
// this.mastertask.project_code = project.code
|
||||
} else {
|
||||
this.mastertask = { employees: [], duration: 0 }
|
||||
}
|
||||
@@ -205,15 +235,6 @@ export default {
|
||||
if (this.$refs['description'])
|
||||
this.mastertask.description = this.$refs['description'].getHTML()
|
||||
|
||||
// this.mastertask.subtasks = this.mastertask.subtasks.map(subtask => {
|
||||
// const employee = this.mastertask.employees.find(employee => employee.id == subtask.employee_id)
|
||||
// subtask.duration = employee.duration
|
||||
|
||||
// return subtask
|
||||
// })
|
||||
|
||||
// this.mastertask.project_code = null
|
||||
|
||||
try {
|
||||
this.mastertask.deadline = moment(this.mastertask.deadline).format('YYYY-MM-DD HH:MM:SS')
|
||||
|
||||
|
||||
Reference in new issue
Block a user