JandL_gitea/jandl-taskmanager-app
1
0 Fork 0
mirror of https://bitbucket.org/studiotem/jandl-taskmanager-app.git synced 2026-10-21 14:29:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

[Subtask] Added autocomplete to modals

Browse Source
This commit is contained in:
Matej Glasnák committed 2023-04-11 12:44:37 +02:00
1 parent 750f3dd59a
commit 340ac2a76d
3 files changed
+27 -60
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

app/src/plugins/tm@modal/_components/read-only/z-created-by.vue
+3 -3
View File
@@ -1,5 +1,5 @@
<template> <template>
<v-row no-gutters class="align-center" v-if="employee"> <v-row no-gutters class="align-center">
<v-col cols="5"> <v-col cols="5">
<v-sheet class="py-3"> <v-sheet class="py-3">
<div class="d-flex align-center"> <div class="d-flex align-center">
@@ -12,9 +12,9 @@
<v-col cols="7"> <v-col cols="7">
<v-sheet class="py-3 d-flex align-center"> <v-sheet class="py-3 d-flex align-center">
<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 ? employee._initials : '?' }}
</p> </p>
<p class="ml-2">{{ employee._fullName }}</p> <p class="ml-2">{{ employee ? employee._fullName : $t('Unasigned') }}</p>
</v-sheet> </v-sheet>
</v-col> </v-col>
</v-row> </v-row>
app/src/plugins/tm@modal/task/_components/z-task-readonly-info.vue
+2 -2
View File
@@ -1,9 +1,9 @@
<template> <template>
<A-mastertask-name :name="subtask.master_task?.name || task.master_task" :id="subtask.master_task.id" :color="subtask.master_task.color" @close-modal="$emit('close-modal')" /> <A-mastertask-name :name="subtask._master_task.name" :id="subtask.master_task_id" :color="subtask._master_task.color" @close-modal="$emit('close-modal')" />
<A-mastertask-status :status="subtask.is_finished" /> <A-mastertask-status :status="subtask.is_finished" />
<A-task-timeblocks :timeblocks="subtask.timeblocks" :subtask="subtask" /> <A-task-timeblocks :timeblocks="subtask.timeblocks" :subtask="subtask" />
<Z-created-by :employee-id="subtask.created_by" /> <Z-created-by :employee-id="subtask.created_by" />
<A-task-assigned-employee :employee="subtask.employee" /> <A-task-assigned-employee :employee="subtask._employee" />
<A-task-planned-time :hours="subtask.duration" /> <A-task-planned-time :hours="subtask.duration" />
<A-task-remaining-time :hours="subtask.duration - subtask.spent_time" /> <A-task-remaining-time :hours="subtask.duration - subtask.spent_time" />
<A-task-spent-time :hours="subtask.spent_time" :subtask="subtask" /> <A-task-spent-time :hours="subtask.spent_time" :subtask="subtask" />
app/src/plugins/tm@modal/task/z-task-modal.vue
+22 -55
View File
@@ -10,9 +10,10 @@
<v-card-actions class="d-flex flex-column modal-content"> <v-card-actions class="d-flex flex-column modal-content">
<v-text-field v-model="subtask.project_code" label="Kód projektu" :value="subtask.project_code" @focus="onInputFocus" class="modal-input" variant="solo" disabled></v-text-field> <v-text-field v-model="subtask.project_code" label="Kód projektu" :value="subtask.project_code" @focus="onInputFocus" class="modal-input" variant="solo" disabled></v-text-field>
<Z-autocomplete label="Master task" :options="mastertasks.map((mastertask) => ({ key: mastertask.id, value: mastertask.name }))" :validations="v$.subtask.master_task.id" :clear-on-submit="false" :value="subtask?.master_task?.name" :class="{ error: v$.subtask.master_task.id.$errors.length }" class="modal-input" @option-selected="onMasterTaskSelected" /> <v-autocomplete v-model="subtask.master_task_id" label="Master task" :class="{error: v$.subtask.master_task_id.$errors.length}" :items="mastertasks" item-title="name" item-value="id" variant="solo" class="modal-input" clearable />
<v-autocomplete v-model="subtask.employee_id" label="Priradený" :class="{error: v$.subtask.employee_id.$errors.length}" :items="enrichedEmployees" item-title="_fullName" item-value="id" variant="solo" class="modal-input" clearable />
<Z-autocomplete label="Priradený" :value="subtask?.employee ? `${subtask?.employee?.name} ${subtask?.employee?.surname}` : ''" :options="enrichedEmployees.map(employee => ({key: employee.id, value: employee._fullName}))" :clear-on-submit="false" :class="{ error: v$.subtask.employee.$errors.length }" class="modal-input" @option-selected="onEmployeeSelected" />
<v-text-field v-model="subtask.duration" @focus="onInputFocus" class="modal-input" variant="solo" type="number" label="Časový odhad" :class="{ error: v$.subtask.duration.$errors.length }" :hint="v$.subtask.duration.$errors ? errorUtils.parseErrors(v$.subtask.duration.$errors) : null" append-inner-icon="mdi-clock-outline"></v-text-field> <v-text-field v-model="subtask.duration" @focus="onInputFocus" class="modal-input" variant="solo" type="number" label="Časový odhad" :class="{ error: v$.subtask.duration.$errors.length }" :hint="v$.subtask.duration.$errors ? errorUtils.parseErrors(v$.subtask.duration.$errors) : null" append-inner-icon="mdi-clock-outline"></v-text-field>
<div class="w-100 modal-input"> <div class="w-100 modal-input">
@@ -28,8 +29,8 @@
<v-card v-else height="100%" class="d-flex flex-column scrolling"> <v-card v-else height="100%" class="d-flex flex-column scrolling">
<div class="d-flex justify-space-between align-center"> <div class="d-flex justify-space-between align-center">
<div> <div>
<p>{{ subtask.master_task?.project_code }}</p> <p>{{ subtask._master_task.project_code }}</p>
<h1>{{ subtask.master_task?.name }}</h1> <h1>{{ subtask._master_task.name }}</h1>
</div> </div>
<v-icon @click.stop="closeModal()" icon="mdi-close" size="large" class="pb-5"></v-icon> <v-icon @click.stop="closeModal()" icon="mdi-close" size="large" class="pb-5"></v-icon>
@@ -83,7 +84,7 @@ export default {
ZTaskReadonlyInfo, ZTaskReadonlyInfo,
ZFilesUpload, ZFilesUpload,
QuillEditor, QuillEditor,
ZAutocomplete // ZAutocomplete
}, },
data() { data() {
@@ -95,7 +96,6 @@ export default {
errorUtils, errorUtils,
v$: useVuelidate(), v$: useVuelidate(),
preventInputFocus: false, preventInputFocus: false,
mastertaskIdSelect: null,
showDatePicker: false, showDatePicker: false,
selectedNewDate: [] selectedNewDate: []
} }
@@ -105,24 +105,15 @@ export default {
...mapGetters('tm', [ ...mapGetters('tm', [
'mastertasks', 'mastertasks',
'enrichedEmployees' 'enrichedEmployees'
]), ])
filteredEmployees() {
if (!this.enrichedEmployees || !this.subtask?.master_task) return []
const selectedEmployees = this.subtask.master_task.employees?.map((employee) => employee.id) || []
return this.enrichedEmployees.filter((employee) => !selectedEmployees.includes(employee.id))
}
}, },
validations() { validations() {
return { return {
subtask: { subtask: {
master_task: { master_task_id: { required },
id: { required }
},
duration: { required }, duration: { required },
employee: { required } employee_id: { required }
} }
} }
}, },
@@ -153,7 +144,6 @@ export default {
this.subtask = this._enrichTask(data) this.subtask = this._enrichTask(data)
} else { } else {
this.subtask = { master_task: mastertask, timeblocks: [{start: tmUtils.formatDateTimeForBackend(moment()), end: tmUtils.formatDateTimeForBackend(moment())}] } this.subtask = { master_task: mastertask, timeblocks: [{start: tmUtils.formatDateTimeForBackend(moment()), end: tmUtils.formatDateTimeForBackend(moment())}] }
this.mastertaskIdSelect = mastertask.id
} }
this.editMode = editMode || !this.subtask.id this.editMode = editMode || !this.subtask.id
@@ -178,7 +168,7 @@ export default {
const { subtask } = await this.$axios.put_auth(`v1/subtasks/${this.subtask.id}`, this.subtask) const { subtask } = await this.$axios.put_auth(`v1/subtasks/${this.subtask.id}`, this.subtask)
this.$store.commit('tm/update_subtask', subtask) this.$store.commit('tm/update_subtask', subtask)
} else { } else {
const { subtask } = await this.$axios.post_auth(`v1/mastertasks/${this.subtask.master_task.id}/subtasks`, this.subtask) const { subtask } = await this.$axios.post_auth(`v1/mastertasks/${this.subtask.master_task_id}/subtasks`, this.subtask)
this.subtask.id = subtask.id this.subtask.id = subtask.id
this.$store.commit('tm/update_subtask', subtask) this.$store.commit('tm/update_subtask', subtask)
} }
@@ -190,17 +180,6 @@ export default {
} }
}, },
async addNewDate() {
if (this.selectedNewDate) {
this.subtask.timeblocks.push({
start: this.selectedNewDate[0],
end: this.selectedNewDate[1]
})
this.showDatePicker = false
this.selectedNewDate = []
}
},
async downloadFile(id) { async downloadFile(id) {
try { try {
const file = await this.$axios.get_auth_data(`v1/subtasks/${this.subtask.id}`, { responseType: "arraybuffer" }) const file = await this.$axios.get_auth_data(`v1/subtasks/${this.subtask.id}`, { responseType: "arraybuffer" })
@@ -210,10 +189,6 @@ export default {
} }
}, },
removeDate(index) {
this.subtask.timeblocks.splice(index, 1)
},
openDeleteTaskModal(subtask) { openDeleteTaskModal(subtask) {
this.$events.emit("show-delete-task-modal", { subtask }) this.$events.emit("show-delete-task-modal", { subtask })
}, },
@@ -226,35 +201,27 @@ export default {
this.subtask.files = files this.subtask.files = files
}, },
onEmployeeSelected({ key }) {
this.subtask.employee_id = key
},
_enrichTask(subtask) { _enrichTask(subtask) {
subtask.master_task = this.mastertasks.find((mastertask) => mastertask.id == subtask.master_task_id) return {
subtask.employee = this.enrichedEmployees.find((employee) => employee.id == subtask.employee_id) ...subtask,
subtask._created_by = this.enrichedEmployees.find((employee) => employee.id == subtask.created_by) _created_by: this.enrichedEmployees.find((employee) => employee.id == subtask.created_by),
this.mastertaskIdSelect = subtask.master_task?.id _employee: this.enrichedEmployees.find((employee) => employee.id == subtask.employee_id),
_master_task: this.mastertasks.find((mastertask) => mastertask.id == subtask.master_task_id)
return subtask }
} }
}, },
watch: { watch: {
mastertaskIdSelect(value) { 'subtask.employee_id'(value, oldValue) {
if (!value || !this.subtask) return if (!value || !oldValue) return
this.subtask.master_task = this.mastertasks.find((mastertask) => mastertask.id == value) this.subtask.timeblocks = []
this.subtask.project_code = this.subtask.master_task.project_code this.subtask._employee = this.enrichedEmployees.find((employee) => employee.id == this.subtask.employee_id)
}, },
"subtask.employee_id"(value, oldValue) { 'subtask.master_task_id'(value) {
if (!value) return if (!value) return
this.subtask._master_task = this.mastertasks.find((mastertask) => mastertask.id == this.subtask.master_task_id)
if (value && oldValue)
this.subtask.timeblocks = []
this.subtask.employee = this.enrichedEmployees.find((employee) => employee.id == value)
}, },
editMode() { editMode() {