mirror of
https://bitbucket.org/studiotem/jandl-taskmanager-app.git
synced 2026-10-21 14:29:34 +00:00
Merge branch 'main' of bitbucket.org:studiotem/jandl-taskmanager-app
This commit is contained in:
StudioTem committed
commit
48d7ef3edb
11 files changed
+507
-273
No files matched your search
@@ -10,6 +10,7 @@
|
||||
|
||||
<Z-task-modal ref="z-task-modal" @on-subtask-edited="onTaskEdited" />
|
||||
<Z-delete-task-modal ref="z-delete-task-modal" @on-subtask-deleted="onTaskDeleted" />
|
||||
<Z-delete-blocker-modal ref="z-delete-blocker-modal" @on-blocker-deleted="onBlockerDeleted" />
|
||||
<Z-delete-master-task-modal ref="z-delete-master-task-modal" @on-mastertask-deleted="onMasterTaskDeleted" />
|
||||
<Z-complete-task-modal ref="z-complete-task-modal" @on-subtask-edited="onTaskEdited" />
|
||||
<Z-task-add-time-modal ref="z-task-add-time-modal" />
|
||||
@@ -23,6 +24,7 @@ import ZDeleteTeamModal from '@/plugins/tm@modal/team/z-delete-team-modal.vue'
|
||||
import ZTeamModal from '@/plugins/tm@modal/team/z-team-modal.vue'
|
||||
import ZDeleteTaskModal from '@/plugins/tm@modal/task/z-delete-task-modal.vue'
|
||||
import ZTaskModal from '@/plugins/tm@modal/task/z-task-modal.vue'
|
||||
import ZDeleteBlockerModal from '@/plugins/tm@modal/blocker/z-delete-blocker-modal.vue'
|
||||
import ZCompleteTaskModal from '@/plugins/tm@modal/task/z-complete-task-modal.vue'
|
||||
import ZTaskAddTimeModal from '@/plugins/tm@modal/task/z-task-add-time-modal.vue'
|
||||
import ZBlockerModal from '@/plugins/tm@modal/blocker/z-blocker-modal.vue'
|
||||
@@ -34,6 +36,7 @@ export default {
|
||||
ZDeleteTeamModal,
|
||||
ZTeamModal,
|
||||
ZDeleteTaskModal,
|
||||
ZDeleteBlockerModal,
|
||||
ZTaskModal,
|
||||
ZMasterTaskModal,
|
||||
ZCompleteTaskModal,
|
||||
@@ -55,6 +58,10 @@ export default {
|
||||
this.$refs['z-delete-task-modal'].showModal({subtask})
|
||||
})
|
||||
|
||||
this.$events.on('show-delete-blocker-modal', ({blocker}) => {
|
||||
this.$refs['z-delete-blocker-modal'].showModal({blocker})
|
||||
})
|
||||
|
||||
this.$events.on('show-delete-master-task-modal', ({mastertask}) => {
|
||||
this.$refs['z-delete-master-task-modal'].showModal({mastertask})
|
||||
})
|
||||
@@ -111,6 +118,10 @@ export default {
|
||||
this.$events.emit('on-subtask-deleted', task)
|
||||
},
|
||||
|
||||
onBlockerDeleted(task) {
|
||||
this.$events.emit('on-blocker-deleted', task)
|
||||
},
|
||||
|
||||
onTaskEdited(task) {
|
||||
this.$events.emit('on-subtask-edited', task)
|
||||
},
|
||||
|
||||
@@ -157,7 +157,7 @@ export default {
|
||||
},
|
||||
|
||||
onDragStart(e) {
|
||||
if (this.event.nonWorking) return
|
||||
if (this.event.type == 'blocker' || this.event.type == 'non-working-hours') return
|
||||
this.event.draggingStatic = false
|
||||
this.dnd && this.dnd.eventDragStart(e, this.event);
|
||||
},
|
||||
|
||||
@@ -57,30 +57,43 @@
|
||||
</template>
|
||||
|
||||
<template v-slot:event="{ event }">
|
||||
<!-- <div v-if="!event.nonWorking" @click.stop="editTask(event.id)" class="w-100 h-100 d-flex flex-column justify-space-between" :class="{'short-event' : getEventLenght(event) <= 9000000, 'mini-event' : getEventLenght(event) <= 5400000, 'micro-event' : getEventLenght(event) <= 3600000}"> -->
|
||||
<div v-if="!event.nonWorking" class="custom-event-body w-100 h-100 d-flex flex-column justify-space-between" :class="{'short-event' : getEventLenght(event) <= 9000000, 'mini-event' : getEventLenght(event) <= 5400000, 'micro-event' : getEventLenght(event) <= 3600000}" :style="{backgroundColor: event.subtask.color}">
|
||||
<div class="event-content">
|
||||
<small v-if="(event.subtask.project_code && !event.is_blocker)" class="project-code">{{ event.subtask.project_code }}</small>
|
||||
<h3>{{ event.subtask.master_task?.name || event.subtask.master_task }}</h3>
|
||||
<div v-if="event.type == 'non-working-hours'" class="custom-event-body non-working-event w-100 h-100 d-flex flex-column justify-center">
|
||||
<div class="d-flex justify-center align-center">
|
||||
<v-icon icon="mdi-cancel" color="black"></v-icon>
|
||||
<h3 class="mb-0 ms-2">{{ event.title }}</h3>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-else class="custom-event-body w-100 h-100 d-flex flex-column justify-space-between" :class="{'short-event' : getEventLenght(event) <= 9000000, 'mini-event' : getEventLenght(event) <= 5400000, 'micro-event' : getEventLenght(event) <= 3600000}" :style="{backgroundColor: event.color || event.subtask.color}">
|
||||
<div class="event-content" :class="event.type || 'subtask'">
|
||||
<template v-if="event.type == 'blocker'">
|
||||
<h3>{{ event.blocker.name }}</h3>
|
||||
</template>
|
||||
|
||||
<template v-else>
|
||||
<small v-if="event.subtask.project_code" class="project-code">{{ event.subtask.project_code }}</small>
|
||||
<h3>{{ event.subtask.master_task?.name || event.subtask.master_task }}</h3>
|
||||
</template>
|
||||
|
||||
<div class="d-flex align-center event-details event-initials-wrapper">
|
||||
<div class="event-initials d-flex justify-center align-center">
|
||||
<small>{{ event.initials }}</small>
|
||||
</div>
|
||||
<small class="event-initials-date">{{ event.start.toLocaleDateString('sk-SK') }}</small>
|
||||
<small class="event-initials-date">{{ event.date?.toLocaleDateString('sk-SK') }}</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="event-footer d-flex">
|
||||
<v-btn rounded class="event-footer-button me-2" :class="{'completed': event.subtask.is_finished}" @click.stop="completeTask(event)"><img :src="require('@/plugins/app/_img/icons/checkmark.svg')" alt=""></v-btn>
|
||||
<v-btn rounded class="event-footer-button me-2" @click.stop="editTask(event)"><img :src="require('@/plugins/app/_img/icons/eye.svg')" alt=""></v-btn>
|
||||
<v-btn rounded class="event-footer-button me-2" @click.stop="deleteTask(event)"><img :src="require('@/plugins/app/_img/icons/bin.svg')" alt=""></v-btn>
|
||||
</div>
|
||||
</div>
|
||||
<template v-if="event.type == 'blocker'">
|
||||
<v-btn rounded class="event-footer-button me-2" @click.stop="editBlocker(event)"><img :src="require('@/plugins/app/_img/icons/pencil.svg')" alt=""></v-btn>
|
||||
<v-btn rounded class="event-footer-button me-2" @click.stop="deleteBlocker(event)"><img :src="require('@/plugins/app/_img/icons/bin.svg')" alt=""></v-btn>
|
||||
</template>
|
||||
|
||||
<div v-else class="custom-event-body non-working-event w-100 h-100 d-flex flex-column justify-center">
|
||||
<div class="d-flex justify-center align-center">
|
||||
<v-icon icon="mdi-cancel" color="black"></v-icon>
|
||||
<h3 class="mb-0 ms-2">{{ event.title }}</h3>
|
||||
<template v-else>
|
||||
<v-btn rounded class="event-footer-button me-2" :class="{'completed': event.subtask?.is_finished}" @click.stop="completeTask(event)"><img :src="require('@/plugins/app/_img/icons/checkmark.svg')" alt=""></v-btn>
|
||||
<v-btn rounded class="event-footer-button me-2" @click.stop="editTask(event)"><img :src="require('@/plugins/app/_img/icons/eye.svg')" alt=""></v-btn>
|
||||
<v-btn rounded class="event-footer-button me-2" @click.stop="deleteTask(event)"><img :src="require('@/plugins/app/_img/icons/bin.svg')" alt=""></v-btn>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -196,7 +209,7 @@ export default {
|
||||
},
|
||||
|
||||
taskClicked(subtask) {
|
||||
if (subtask.nonWorking) return
|
||||
if (subtask.type == 'non-working-hours') return
|
||||
// console.log("task", task)
|
||||
if (subtask.end.getTime() - subtask.start.getTime() <= 3600000) {
|
||||
// console.log("ShortTask")
|
||||
@@ -212,13 +225,21 @@ export default {
|
||||
this.$events.emit('show-complete-task-modal', { subtask })
|
||||
},
|
||||
|
||||
editTask(subtask, editMode) {
|
||||
this.$events.emit('show-subtask-modal', {subtask, editMode})
|
||||
editTask({subtask}) {
|
||||
this.$events.emit('show-subtask-modal', {subtask})
|
||||
},
|
||||
|
||||
deleteTask(subtask) {
|
||||
deleteTask({ subtask }) {
|
||||
this.$events.emit('show-delete-task-modal', {subtask})
|
||||
}
|
||||
},
|
||||
|
||||
editBlocker({ blocker }) {
|
||||
this.$events.emit('show-blocker-modal', {blocker})
|
||||
},
|
||||
|
||||
deleteBlocker({ blocker }) {
|
||||
this.$events.emit('show-delete-blocker-modal', {blocker})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -363,6 +384,17 @@ export default {
|
||||
.custom-event-body
|
||||
padding: 20px 10px
|
||||
|
||||
.event-content
|
||||
&.blocker
|
||||
*
|
||||
color: #ffffff !important
|
||||
|
||||
.event-details .event-initials
|
||||
border: 1px solid white
|
||||
|
||||
.event-footer
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.19)
|
||||
|
||||
&:has(.completed)
|
||||
background: rgb(251, 251, 251) !important
|
||||
border: 1px solid #cccccc !important
|
||||
@@ -378,12 +410,11 @@ export default {
|
||||
left: 0 !important
|
||||
|
||||
&:not(.vuecal__event--focus)
|
||||
&:has(.short-event)
|
||||
padding: 10px !important
|
||||
|
||||
&:has(.micro-event)
|
||||
padding: 5px 10px !important
|
||||
&:has(.micro-event) .custom-event-body
|
||||
padding: 5px !important
|
||||
|
||||
&:has(.short-event) .custom-event-body:not(.micro-event)
|
||||
padding: 10px 5px !important
|
||||
.short-event
|
||||
.project-code
|
||||
display: none !important
|
||||
@@ -420,19 +451,6 @@ export default {
|
||||
.event-footer
|
||||
display: none !important
|
||||
|
||||
&.event-blocker
|
||||
background: #B00020 !important
|
||||
|
||||
h3,
|
||||
.event-details *
|
||||
color: white !important
|
||||
|
||||
.event-details .event-initials
|
||||
border: 1px solid white
|
||||
|
||||
.event-footer
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.19)
|
||||
|
||||
.project-code
|
||||
margin: 0 0 20px
|
||||
display: block
|
||||
|
||||
@@ -21,12 +21,16 @@ export default {
|
||||
},
|
||||
|
||||
generateTimelineEvents(subtasks, employee, date) {
|
||||
const events = []
|
||||
let events = []
|
||||
|
||||
subtasks.forEach(subtask => {
|
||||
subtask.timeblocks?.forEach((timeblock) => {
|
||||
events.push(this._composeTimelineEvent(subtask, employee, date, timeblock))
|
||||
})
|
||||
if (subtask.type == 'blocker') {
|
||||
events = [...events, ...this._generateEventsFromBlocker(subtask, date)]
|
||||
} else {
|
||||
subtask.timeblocks?.forEach((timeblock) => {
|
||||
events.push(this._composeTimelineEvent(subtask, employee, date, timeblock))
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
return events
|
||||
@@ -50,30 +54,76 @@ export default {
|
||||
}
|
||||
},
|
||||
|
||||
_generateEventsFromBlocker(blocker, date) {
|
||||
const start = moment(blocker.start)
|
||||
const end = moment(blocker.end)
|
||||
|
||||
const dates = start == end ? [moment(start).format('YYYY-MM-DD')] : this._getDatesInRange(start, end)
|
||||
|
||||
const blockers = dates.map(d => {
|
||||
const diffInDays = differenceInCalendarDays(date, new Date(d))
|
||||
const dStart = new Date(moment(d).set({hours: start.hours(), minutes: start.minutes()}).format('YYYY-MM-DD HH:mm'))
|
||||
const dEnd = new Date(moment(d).set({hours: end.hours(), minutes: end.minutes()}).format('YYYY-MM-DD HH:mm'))
|
||||
|
||||
return {
|
||||
blocker,
|
||||
split: this._getSplitFromDate(date, d),
|
||||
start: addDays(dStart, diffInDays),
|
||||
end: addDays(dEnd, diffInDays),
|
||||
date: new Date(d),
|
||||
type: 'blocker',
|
||||
initials: `${blocker.employee?.name[0]}${blocker.employee?.surname[0]}`,
|
||||
color: '#B00020',
|
||||
draggable: false
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
|
||||
console.log(blockers)
|
||||
|
||||
return blockers
|
||||
},
|
||||
|
||||
_getDatesInRange(start, end) {
|
||||
const dates = []
|
||||
|
||||
while (start <= end) {
|
||||
dates.push(moment(start).format('YYYY-MM-DD'))
|
||||
start.add(1, 'day')
|
||||
}
|
||||
|
||||
return dates
|
||||
},
|
||||
|
||||
generateTimelineNonWorkingHours(date, employee) {
|
||||
const nonWorkingHours = []
|
||||
const events = []
|
||||
|
||||
const { start: dayStart, end: dayEnd } = this._getDayStartEnd(date)
|
||||
|
||||
for (let i = 0; i < 7; i++) {
|
||||
nonWorkingHours.push({
|
||||
events.push({
|
||||
title: "Non working hours",
|
||||
start: setMinutes(setHours(date, 0), 0),
|
||||
end: setMinutes(setHours(date, employee.work_start), 0),
|
||||
nonWorking: true,
|
||||
start: dayStart,
|
||||
end: this._setMinutesToDate(employee.work_start, date),
|
||||
type: 'non-working-hours',
|
||||
split: i + 1,
|
||||
draggable: false
|
||||
})
|
||||
|
||||
nonWorkingHours.push({
|
||||
events.push({
|
||||
title: "Non working hours",
|
||||
start: setMinutes(setHours(date, employee.work_end), 0),
|
||||
end: setMinutes(setHours(date, 23), 59),
|
||||
nonWorking: true,
|
||||
start: this._setMinutesToDate(employee.work_end, date),
|
||||
end: dayEnd,
|
||||
type: 'non-working-hours',
|
||||
split: i + 1,
|
||||
draggable: false
|
||||
})
|
||||
}
|
||||
|
||||
return nonWorkingHours
|
||||
console.log(events)
|
||||
|
||||
return events
|
||||
},
|
||||
|
||||
_getSplitFromDate(date, start) {
|
||||
@@ -84,5 +134,18 @@ export default {
|
||||
let diff =(date1.getTime() - date2.getTime()) / 1000;
|
||||
diff /= (60 * 60)
|
||||
return Math.abs(Math.round(diff))
|
||||
},
|
||||
|
||||
_getDayStartEnd(date) {
|
||||
return {
|
||||
start: this._setMinutesToDate(0, date),
|
||||
end: this._setMinutesToDate(1439, date)
|
||||
}
|
||||
},
|
||||
|
||||
_setMinutesToDate(minutes, date) {
|
||||
const newDate = new Date(date)
|
||||
newDate.setHours(Math.floor(minutes / 60), minutes % 60, 0, 0)
|
||||
return newDate
|
||||
}
|
||||
}
|
||||
@@ -43,7 +43,7 @@ export default {
|
||||
if (!workingHours[task.split])
|
||||
workingHours[task.split] = 0
|
||||
|
||||
if (task.nonWorking || task.subtask.is_finished)
|
||||
if (task.type == 'non-working-hours' || task.subtask?.is_finished || task.blocker?.is_finished)
|
||||
return
|
||||
|
||||
workingHours[task.split] += timelineUtils._getDifferenceInHours(task.end, task.start)
|
||||
@@ -91,11 +91,21 @@ export default {
|
||||
this.$events.on('on-subtask-deleted', () => {
|
||||
this.onFilterChanged(this.filter)
|
||||
})
|
||||
|
||||
this.$events.on('on-blocker-edited', () => {
|
||||
this.onFilterChanged(this.filter)
|
||||
})
|
||||
|
||||
this.$events.on('on-blocker-deleted', () => {
|
||||
this.onFilterChanged(this.filter)
|
||||
})
|
||||
},
|
||||
|
||||
unmounted() {
|
||||
this.$events.off('on-subtask-edited')
|
||||
this.$events.off('on-subtask-deleted')
|
||||
this.$events.off('on-blocker-edited')
|
||||
this.$events.off('on-blocker-deleted')
|
||||
},
|
||||
|
||||
methods: {
|
||||
@@ -110,10 +120,10 @@ export default {
|
||||
const queryParameters = new URLSearchParams(urlQueryObject).toString()
|
||||
|
||||
try {
|
||||
const { subtasks } = await this.$axios.get_auth(`v1/subtasks?${queryParameters}`)
|
||||
this.config.scrollHour = this.filter?.employee.work_start - 1
|
||||
this.config.date = this.filter.start
|
||||
this.subtasks = subtasks
|
||||
const { subtasks, blockers } = await this.$axios.get_auth(`v1/subtasks?${queryParameters}`)
|
||||
this.config.scrollHour = this.filter?.employee.work_start - 1
|
||||
this.config.date = this.filter.start
|
||||
this.subtasks = [...subtasks, ...blockers.map(blocker => ({...blocker, type: 'blocker'}))]
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
this.$toast.error('Nepodarilo sa nacitat data!')
|
||||
|
||||
@@ -0,0 +1,162 @@
|
||||
import { setHours, setMinutes } from 'date-fns'
|
||||
import moment from 'moment'
|
||||
import timelineUtils from '@/plugins/tm@dashboard/tasks/_utils/timeline.utils'
|
||||
|
||||
|
||||
export default {
|
||||
computed: {
|
||||
calendarData() {
|
||||
if (!this.subtasks || !this.blockers)
|
||||
return
|
||||
|
||||
return {
|
||||
unscheduledTime: 333,
|
||||
tasks: [...this._generateNonWorking(), ...this._generateTasks(), ...this._generateBlockers()]
|
||||
}
|
||||
},
|
||||
|
||||
splitDays() {
|
||||
const days = []
|
||||
|
||||
this.filter.team.employees.forEach((employee, index) => {
|
||||
let workingHours = 0
|
||||
|
||||
this.calendarData.tasks.forEach(task => {
|
||||
if (task?.subtask?.employee_id == employee.id)
|
||||
workingHours += timelineUtils._getDifferenceInHours(task.end, task.start)
|
||||
})
|
||||
|
||||
days.push({
|
||||
id: index + 1,
|
||||
name: employee.name,
|
||||
fullname: `${employee.name} ${employee.surname}`,
|
||||
initials: employee.name.charAt(0).toUpperCase() + employee.surname.charAt(0).toUpperCase(),
|
||||
unscheduledTime: workingHours
|
||||
})
|
||||
})
|
||||
|
||||
return days
|
||||
},
|
||||
},
|
||||
|
||||
methods: {
|
||||
_generateNonWorking() {
|
||||
const nonWorkingHours = []
|
||||
const date = new Date(this.filter.start)
|
||||
let earliestStartHour = null
|
||||
this.calendarConfig.date = date
|
||||
|
||||
const { start: dayStart, end: dayEnd } = this._getDayStartEnd()
|
||||
|
||||
this.filter.team.employees.forEach((employee, index) => {
|
||||
if (!earliestStartHour || employee.work_start < earliestStartHour)
|
||||
earliestStartHour = employee.work_start
|
||||
|
||||
|
||||
nonWorkingHours.push({
|
||||
title: "Non working hours",
|
||||
start: dayStart,
|
||||
end: this._setMinutesToDate(employee.work_start),
|
||||
split: index + 1,
|
||||
type: 'non-working-hours',
|
||||
draggable: false
|
||||
})
|
||||
|
||||
nonWorkingHours.push({
|
||||
title: "Non working hours",
|
||||
start: this._setMinutesToDate(employee.work_end),
|
||||
end: dayEnd,
|
||||
split: index + 1,
|
||||
type: 'non-working-hours',
|
||||
draggable: false
|
||||
})
|
||||
})
|
||||
|
||||
this.calendarConfig.scrollHour = earliestStartHour - 1
|
||||
return nonWorkingHours
|
||||
},
|
||||
|
||||
_generateTasks() {
|
||||
const tasks = []
|
||||
const calendarDate = moment(this.filter.start).format('DD-MM-YYYY')
|
||||
|
||||
this.subtasks.forEach(subtask => {
|
||||
let split = null
|
||||
let employee = null
|
||||
|
||||
this.filter.team.employees.forEach((e, index) => {
|
||||
if (e.id == subtask.employee_id) {
|
||||
split = index + 1
|
||||
employee = e
|
||||
}
|
||||
})
|
||||
|
||||
subtask.timeblocks.forEach(timeblock => {
|
||||
const formattedDate = moment(timeblock.start).format('DD-MM-YYYY')
|
||||
|
||||
if (formattedDate == calendarDate) {
|
||||
tasks.push({
|
||||
id: subtask.id,
|
||||
start: new Date(timeblock.start),
|
||||
end: new Date(timeblock.end),
|
||||
master_task: subtask.master_task,
|
||||
name: employee?.name,
|
||||
surname: employee?.surname,
|
||||
// date: new Date(timeblock.start),
|
||||
isWeekend: moment(timeblock.start).day() % 6 == 0,
|
||||
initials: employee?.name?.charAt(0)?.toUpperCase() + employee?.surname?.charAt(0)?.toUpperCase(),
|
||||
split: split,
|
||||
project_code: subtask.project_code,
|
||||
subtask: subtask,
|
||||
_timeblock_id: timeblock.id
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
return tasks
|
||||
},
|
||||
|
||||
_generateBlockers() {
|
||||
const blockers = []
|
||||
|
||||
this.blockers.forEach(blocker => {
|
||||
let split = null
|
||||
let employee = null
|
||||
|
||||
this.filter.team.employees.forEach((e, index) => {
|
||||
if (e.id == blocker.employee?.id) {
|
||||
split = index + 1
|
||||
employee = e
|
||||
}
|
||||
})
|
||||
|
||||
blockers.push({
|
||||
blocker,
|
||||
split,
|
||||
start: new Date(blocker.start),
|
||||
end: new Date(blocker.end),
|
||||
type: 'blocker',
|
||||
initials: `${employee?.name[0]}${employee?.surname[0]}`,
|
||||
color: '#B00020',
|
||||
draggable: false,
|
||||
isWeekend: moment(blocker.start).day() % 6 == 0,
|
||||
})
|
||||
})
|
||||
|
||||
return blockers
|
||||
},
|
||||
|
||||
_getDayStartEnd() {
|
||||
return {
|
||||
start: this._setMinutesToDate(0),
|
||||
end: this._setMinutesToDate(1439)
|
||||
}
|
||||
},
|
||||
|
||||
_setMinutesToDate(minutes, date = new Date(this.filter.start)) {
|
||||
date.setHours(Math.floor(minutes / 60), minutes % 60, 0, 0)
|
||||
return date
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,20 +1,20 @@
|
||||
<template>
|
||||
<div>
|
||||
<A-team-filter v-if="$store.getters['tm/isInitialized']" :unscheduledTime="timelineData?.unscheduledTime || 0" @filter-changed="onFilterChanged" />
|
||||
<A-team-filter v-if="$store.getters['tm/isInitialized']" :unscheduledTime="calendarData?.unscheduledTime || 0" @filter-changed="onFilterChanged" />
|
||||
|
||||
<Z-timeline v-if="timelineData" :calData="timelineData" :calConfig="config" :splits="splitDays" />
|
||||
<Z-timeline v-if="calendarData" :cal-data="calendarData" :cal-config="calendarConfig" :splits="splitDays" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ATeamFilter from './_components/a-team-filter.vue'
|
||||
import ZTimeline from '@/plugins/tm@dashboard/_components/z-timeline.vue'
|
||||
|
||||
import { setHours, setMinutes, addDays } from 'date-fns'
|
||||
import moment from 'moment'
|
||||
import timelineUtils from '../tasks/_utils/timeline.utils'
|
||||
import TeamsCalendar from './_mixins/TeamsCalendar.mixin'
|
||||
|
||||
export default {
|
||||
mixins: [TeamsCalendar],
|
||||
|
||||
components: {
|
||||
ATeamFilter,
|
||||
ZTimeline,
|
||||
@@ -24,56 +24,14 @@ export default {
|
||||
return {
|
||||
filter: null,
|
||||
subtasks: null,
|
||||
config: {
|
||||
blockers: null,
|
||||
calendarConfig: {
|
||||
date: new Date(),
|
||||
scrollHour: 7,
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
computed: {
|
||||
splitDays() {
|
||||
const days = []
|
||||
|
||||
this.filter.team.employees.forEach((employee, index) => {
|
||||
let workingHours = 0
|
||||
|
||||
this.timelineData.tasks.forEach(task => {
|
||||
if (task?.subtask?.employee_id == employee.id)
|
||||
workingHours += timelineUtils._getDifferenceInHours(task.end, task.start)
|
||||
})
|
||||
|
||||
days.push({
|
||||
id: index + 1,
|
||||
name: employee.name,
|
||||
fullname: `${employee.name} ${employee.surname}`,
|
||||
initials: employee.name.charAt(0).toUpperCase() + employee.surname.charAt(0).toUpperCase(),
|
||||
unscheduledTime: workingHours
|
||||
})
|
||||
})
|
||||
|
||||
return days
|
||||
},
|
||||
|
||||
timelineData() {
|
||||
if (!this.subtasks)
|
||||
return
|
||||
|
||||
// let unscheduledTime = 0
|
||||
// const tasks = [...this._generateNonWorking(), ...this._generateTasks()]
|
||||
|
||||
// tasks.forEach(task => {
|
||||
// if (!task.nonWorking)
|
||||
// workingHours += timelineUtils._getDifferenceInHours(task.end, task.start)
|
||||
// })
|
||||
|
||||
return {
|
||||
unscheduledTime: 333,
|
||||
tasks: [...this._generateNonWorking(), ...this._generateTasks()]
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.$events.on('on-subtask-edited', () => {
|
||||
this.onFilterChanged(this.filter)
|
||||
@@ -82,89 +40,24 @@ export default {
|
||||
this.$events.on('on-subtask-deleted', () => {
|
||||
this.onFilterChanged(this.filter)
|
||||
})
|
||||
|
||||
this.$events.on('on-blocker-edited', () => {
|
||||
this.onFilterChanged(this.filter)
|
||||
})
|
||||
|
||||
this.$events.on('on-blocker-deleted', () => {
|
||||
this.onFilterChanged(this.filter)
|
||||
})
|
||||
},
|
||||
|
||||
unmounted() {
|
||||
this.$events.off('on-subtask-edited')
|
||||
this.$events.off('on-subtask-deleted')
|
||||
this.$events.off('on-blocker-edited')
|
||||
this.$events.off('on-blocker-deleted')
|
||||
},
|
||||
|
||||
methods: {
|
||||
_generateTasks() {
|
||||
const tasks = []
|
||||
const calendarDate = moment(this.filter.start).format('DD-MM-YYYY')
|
||||
// const diffInDays = differenceInCalendarDays(date, new Date(timeblock.start))
|
||||
|
||||
this.subtasks.forEach(subtask => {
|
||||
let split = null
|
||||
let employee = null
|
||||
|
||||
this.filter.team.employees.forEach((e, index) => {
|
||||
if (e.id == subtask.employee_id) {
|
||||
split = index + 1
|
||||
employee = e
|
||||
}
|
||||
})
|
||||
|
||||
subtask.timeblocks.forEach(timeblock => {
|
||||
const formattedDate = moment(timeblock.start).format('DD-MM-YYYY')
|
||||
|
||||
if (formattedDate == calendarDate) {
|
||||
tasks.push({
|
||||
id: subtask.id,
|
||||
start: new Date(timeblock.start),
|
||||
end: new Date(timeblock.end),
|
||||
master_task: subtask.master_task,
|
||||
name: employee?.name,
|
||||
surname: employee?.surname,
|
||||
// date: new Date(timeblock.start),
|
||||
isWeekend: moment(timeblock.start).day() % 6 == 0,
|
||||
initials: employee?.name?.charAt(0)?.toUpperCase() + employee?.surname?.charAt(0)?.toUpperCase(),
|
||||
split: split,
|
||||
project_code: subtask.project_code,
|
||||
subtask: subtask,
|
||||
_timeblock_id: timeblock.id
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
return tasks
|
||||
},
|
||||
|
||||
_generateNonWorking() {
|
||||
const tasks = []
|
||||
const date = new Date(this.filter.start)
|
||||
let earliestStartHour = null
|
||||
this.config.date = date
|
||||
|
||||
this.filter.team.employees.forEach((employee, index) => {
|
||||
if (!earliestStartHour || employee.work_start < earliestStartHour)
|
||||
earliestStartHour = employee.work_start
|
||||
|
||||
tasks.push({
|
||||
title: "Non working hours",
|
||||
start: setMinutes(setHours(date, 0), 0),
|
||||
end: setMinutes(setHours(date, employee.work_start), 0),
|
||||
split: index + 1,
|
||||
nonWorking: true,
|
||||
draggable: false
|
||||
})
|
||||
|
||||
tasks.push({
|
||||
title: "Non working hours",
|
||||
start: setMinutes(setHours(date, employee.work_end), 0),
|
||||
end: setMinutes(setHours(date, 23), 59),
|
||||
split: index + 1,
|
||||
nonWorking: true,
|
||||
draggable: false
|
||||
})
|
||||
})
|
||||
|
||||
this.config.scrollHour = earliestStartHour - 1
|
||||
return tasks
|
||||
},
|
||||
|
||||
async onFilterChanged(filter) {
|
||||
this.filter = filter
|
||||
|
||||
@@ -177,8 +70,9 @@ export default {
|
||||
const queryParameters = new URLSearchParams(urlQueryObject).toString()
|
||||
|
||||
try {
|
||||
const { subtasks } = await this.$axios.get_auth(`v1/subtasks?${queryParameters}`)
|
||||
this.subtasks = subtasks
|
||||
const { subtasks, blockers } = await this.$axios.get_auth(`v1/subtasks?${queryParameters}`)
|
||||
this.subtasks = subtasks
|
||||
this.blockers = blockers
|
||||
} catch (error) {
|
||||
this.$toast.error('Nepodarilo sa nacitat data!')
|
||||
}
|
||||
|
||||
@@ -3,66 +3,44 @@
|
||||
<W-loadable :content="blocker" class="h-100">
|
||||
<v-card height="100%" class="d-flex flex-column">
|
||||
<div class="d-flex justify-space-between align-center modal-header">
|
||||
<h1>{{ blocker.id ? 'Upraviť' : 'Vytvoriť'}} blocker</h1>
|
||||
<v-icon
|
||||
@click.stop="closeModal()"
|
||||
icon="mdi-close"
|
||||
size="large"
|
||||
></v-icon>
|
||||
<h1>{{ blocker.id ? "Upraviť" : "Vytvoriť" }} blocker</h1>
|
||||
<v-icon @click.stop="closeModal()" icon="mdi-close" size="large"></v-icon>
|
||||
</div>
|
||||
|
||||
<v-card-actions class="d-flex flex-column modal-content">
|
||||
<v-text-field
|
||||
@focus="onInputFocus"
|
||||
class="modal-input"
|
||||
label="Názov blockeru"
|
||||
:class="{ error: v$.blocker.name.$errors.length }"
|
||||
:hint="
|
||||
v$.blocker.name.$errors
|
||||
? errorUtils.parseErrors(v$.blocker.name.$errors)
|
||||
: null
|
||||
"
|
||||
v-model="blocker.name"
|
||||
variant="solo"
|
||||
></v-text-field>
|
||||
<v-select v-model="blocker.employee_id" ref="employee-select" @focus="onInputFocus" class="modal-input border-select" label="Priradený" :class="{ error: v$.blocker.employee_id.$errors.length }" variant="solo" :items="enrichedEmployees" item-value="id" item-title="_fullName"></v-select>
|
||||
<Datepicker
|
||||
class="modal-input"
|
||||
v-model="startEndDate"
|
||||
format="dd.MM.yyyy, HH:mm"
|
||||
locale="sk"
|
||||
:class="{ error: v$.blocker.start.$errors.length || v$.blocker.end.$errors.length }"
|
||||
:validations="v$.blocker.employees"
|
||||
select-text="Vybrať"
|
||||
cancel-text="Zrušiť"
|
||||
placeholder="Trvanie od - do"
|
||||
range
|
||||
ref="datepicker"
|
||||
/>
|
||||
<v-text-field @focus="onInputFocus" class="modal-input" label="Názov blockeru" :class="{ error: v$.blocker.name.$errors.length }" :hint="v$.blocker.name.$errors ? errorUtils.parseErrors(v$.blocker.name.$errors) : null" v-model="blocker.name" variant="solo"></v-text-field>
|
||||
|
||||
<Z-autocomplete label="Vyhľadať zamestnanca" :value="blocker?.employee ? `${blocker?.employee?.name} ${blocker?.employee?.surname}` : ''" :options="enrichedEmployees.map(employee => ({key: employee.id, value: employee._fullName}))" :clear-on-submit="false" :class="{ error: v$.blocker.employee.$errors.length }" class="modal-input" @option-selected="onEmployeeSelected" />
|
||||
<Datepicker class="modal-input mb-5" v-model="datepicker" format="dd.MM.yyyy" locale="sk" :class="{ error: v$.datepicker.$errors?.length }" :validations="v$.datepicker" select-text="Vybrať" cancel-text="Zrušiť" placeholder="Dátum" :enable-time-picker="false" ref="datepicker" />
|
||||
|
||||
<v-text-field v-model="starts_at_time" type="time" variant="solo" bg-color="white" :hint="v$.starts_at_time.$errors ? errorUtils.parseErrors(v$.starts_at_time.$errors) : null" :class="{ error: v$.starts_at_time.$errors.length }" class="mb-1 modal-input" label="Začiatok" />
|
||||
<v-text-field v-model="ends_at_time" type="time" variant="solo" bg-color="white" :hint="v$.ends_at_time.$errors ? errorUtils.parseErrors(v$.ends_at_time.$errors) : null" :class="{ error: v$.ends_at_time.$errors.length }" class="modal-input" label="Koniec" />
|
||||
</v-card-actions>
|
||||
|
||||
<v-btn class="button primary" @click="save()">{{ blocker.id ? 'UPRAVIŤ' : 'VYTVORIŤ'}}</v-btn>
|
||||
<v-btn class="button primary" @click="save()">{{ blocker.id ? "UPRAVIŤ" : "VYTVORIŤ" }}</v-btn>
|
||||
</v-card>
|
||||
</W-loadable>
|
||||
</v-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Datepicker from '@vuepic/vue-datepicker'
|
||||
import useVuelidate from '@vuelidate/core'
|
||||
import { required } from '@vuelidate/validators'
|
||||
import errorUtils from '@/plugins/lib@auth/_utils/error.utils'
|
||||
import VuetifyFixFocusMixin from '@/plugins/tm@modal/_mixins/vuetify-fix-focus'
|
||||
import tmUtils from '@/plugins/tm@_utils/tm.utils'
|
||||
import { mapGetters } from 'vuex'
|
||||
import Datepicker from "@vuepic/vue-datepicker"
|
||||
import useVuelidate from "@vuelidate/core"
|
||||
import { required } from "@vuelidate/validators"
|
||||
import errorUtils from "@/plugins/lib@auth/_utils/error.utils"
|
||||
import VuetifyFixFocusMixin from "@/plugins/tm@modal/_mixins/vuetify-fix-focus"
|
||||
import { mapGetters } from "vuex"
|
||||
import moment from "moment"
|
||||
import ZAutocomplete from '@/plugins/tm@_components/z-autocomplete.vue'
|
||||
|
||||
export default {
|
||||
mixins: [VuetifyFixFocusMixin],
|
||||
|
||||
emits: ['close'],
|
||||
emits: ["close"],
|
||||
|
||||
components: {
|
||||
Datepicker
|
||||
Datepicker,
|
||||
ZAutocomplete
|
||||
},
|
||||
|
||||
data() {
|
||||
@@ -71,18 +49,16 @@ export default {
|
||||
v$: useVuelidate(),
|
||||
errorUtils,
|
||||
blocker: null,
|
||||
startEndDate: null
|
||||
datepicker: null,
|
||||
starts_at_time: null,
|
||||
ends_at_time: null
|
||||
}
|
||||
},
|
||||
|
||||
computed: {
|
||||
...mapGetters('tm', [
|
||||
'enrichedEmployees'
|
||||
]),
|
||||
...mapGetters("tm", ["enrichedEmployees"]),
|
||||
|
||||
...mapGetters('auth', [
|
||||
'user'
|
||||
])
|
||||
...mapGetters("auth", ["user"])
|
||||
},
|
||||
|
||||
validations() {
|
||||
@@ -91,8 +67,12 @@ export default {
|
||||
name: { required },
|
||||
start: { required },
|
||||
end: { required },
|
||||
employee_id: { required }
|
||||
}
|
||||
employee: { required }
|
||||
},
|
||||
|
||||
starts_at_time: { required },
|
||||
ends_at_time: { required },
|
||||
datepicker: { required }
|
||||
}
|
||||
},
|
||||
|
||||
@@ -100,17 +80,23 @@ export default {
|
||||
async showModal({ blocker }) {
|
||||
this.visible = true
|
||||
this.blocker = null
|
||||
this.startEndDate = null
|
||||
this.datepicker = null
|
||||
this.starts_at_time = null
|
||||
this.ends_at_time = null
|
||||
|
||||
this.$nextTick(() => this.v$.$reset())
|
||||
|
||||
try {
|
||||
if (blocker?.id) {
|
||||
blocker = await this.$axios.get_auth_data(`v1/blockers/${blocker.id}`)
|
||||
blocker.employee_id = blocker.employee.id
|
||||
this.startEndDate = [new Date(blocker.start), new Date(blocker.end)]
|
||||
|
||||
this.starts_at_time = moment(blocker.start).format("HH:mm")
|
||||
this.ends_at_time = moment(blocker.end).format("HH:mm")
|
||||
this.datepicker = new Date(blocker.start)
|
||||
|
||||
this.blocker = blocker
|
||||
} else {
|
||||
this.blocker = {start: null}
|
||||
this.blocker = { start: null }
|
||||
}
|
||||
} catch (error) {
|
||||
this.$toast.error(error)
|
||||
@@ -118,42 +104,62 @@ export default {
|
||||
},
|
||||
|
||||
async save() {
|
||||
if (!(await this.v$.$validate()))
|
||||
return
|
||||
if (!(await this.v$.$validate())) return
|
||||
|
||||
try {
|
||||
if (this.blocker.id)
|
||||
await this.$axios.put_auth(`v1/blockers/${this.blocker.id}`, this.blocker)
|
||||
else
|
||||
await this.$axios.post_auth('v1/blockers', this.blocker)
|
||||
this.blocker.employee_id = this.blocker.employee?.id
|
||||
|
||||
if (this.blocker.id) {
|
||||
const { blocker } = await this.$axios.put_auth(`v1/blockers/${this.blocker.id}`, this.blocker)
|
||||
this.blocker = blocker
|
||||
} else {
|
||||
const { blocker } = await this.$axios.post_auth("v1/blockers", this.blocker)
|
||||
this.blocker = blocker
|
||||
}
|
||||
|
||||
this.$events.emit("on-blocker-edited", this.blocker)
|
||||
this.closeModal()
|
||||
} catch (error) {
|
||||
this.$toast(error)
|
||||
this.$toast.error(error)
|
||||
}
|
||||
},
|
||||
|
||||
closeModal() {
|
||||
this.$refs['datepicker'].clearValue()
|
||||
this.$refs["datepicker"].clearValue()
|
||||
this.visible = false
|
||||
this.$emit('close', this.blocker)
|
||||
this.$emit("close", this.blocker)
|
||||
},
|
||||
|
||||
onEmployeeSelected({ key }) {
|
||||
this.blocker.employee = this.enrichedEmployees.find(employee => employee.id == key)
|
||||
},
|
||||
|
||||
_syncDatesTimes() {
|
||||
if (!this.starts_at_time || !this.ends_at_time || !this.datepicker) return
|
||||
|
||||
const splittedStart = this.starts_at_time.split(":")
|
||||
const splittedEnd = this.ends_at_time.split(":")
|
||||
|
||||
this.blocker.start = moment(this.datepicker)
|
||||
.set({ hours: parseInt(splittedStart[0]), minutes: parseInt(splittedStart[1]) })
|
||||
.format("YYYY-MM-DD HH:mm")
|
||||
this.blocker.end = moment(this.datepicker)
|
||||
.set({ hours: parseInt(splittedEnd[0]), minutes: parseInt(splittedEnd[1]) })
|
||||
.format("YYYY-MM-DD HH:mm")
|
||||
}
|
||||
},
|
||||
|
||||
watch: {
|
||||
startEndDate(value) {
|
||||
if (!value || !value[1])
|
||||
return
|
||||
ends_at_time() {
|
||||
this._syncDatesTimes()
|
||||
},
|
||||
|
||||
this.startEndDate[0] = this.startEndDate[0].setHours(this.user.work_start, 0, 0, 0)
|
||||
this.startEndDate[1] = this.startEndDate[1].setHours(this.user.work_end, 0, 0, 0)
|
||||
starts_at_time() {
|
||||
this._syncDatesTimes()
|
||||
},
|
||||
|
||||
|
||||
this.blocker = {
|
||||
...this.blocker,
|
||||
start: tmUtils.formatDateTimeForBackend(this.startEndDate[0]),
|
||||
end: tmUtils.formatDateTimeForBackend(this.startEndDate[1]),
|
||||
}
|
||||
datepicker() {
|
||||
this._syncDatesTimes()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,55 @@
|
||||
<template>
|
||||
<v-dialog v-model="visible" max-width="750">
|
||||
<v-card>
|
||||
<div class="d-flex justify-space-between align-center">
|
||||
<h1>Ste si istý, že chcete zmazať <b>{{ blocker.name }}</b>?</h1>
|
||||
|
||||
<v-icon
|
||||
@click.stop="closeModal()"
|
||||
icon="mdi-close"
|
||||
size="large"
|
||||
class="mb-15"
|
||||
></v-icon>
|
||||
</div>
|
||||
<v-card-actions class="mt-10 d-flex justify-start align-center">
|
||||
<v-btn class="button primary half" variant="flat" @click="deleteBlocker()">ÁNO</v-btn>
|
||||
<v-btn class="button primary half outline" @click.stop="closeModal()">ZRUŠIŤ</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
emits: ['on-blocker-deleted'],
|
||||
|
||||
data() {
|
||||
return {
|
||||
visible: false,
|
||||
blocker: null
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
async showModal({ blocker }) {
|
||||
this.blocker = blocker
|
||||
this.visible = true
|
||||
},
|
||||
|
||||
closeModal() {
|
||||
this.visible = false
|
||||
},
|
||||
|
||||
async deleteBlocker() {
|
||||
try {
|
||||
await this.$axios.delete_auth(`v1/blockers/${this.blocker.id}`)
|
||||
|
||||
this.$emit('on-blocker-deleted', this.blocker)
|
||||
this.closeModal()
|
||||
} catch (error) {
|
||||
this.$toast.error(error)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -3,7 +3,7 @@
|
||||
<W-loadable :content="subtask" class="h-100">
|
||||
<v-card v-if="editMode" height="100%" class="d-flex flex-column scrolling">
|
||||
<div class="d-flex justify-space-between align-center modal-header">
|
||||
<h1>{{ subtask.id ? "Upraviť task" : "Vytvoriť task" }}</h1>
|
||||
<h1>Upraviť task</h1>
|
||||
<v-icon @click.stop="closeModal()" icon="mdi-close" size="large"></v-icon>
|
||||
</div>
|
||||
|
||||
@@ -12,8 +12,7 @@
|
||||
|
||||
<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-select v-model="subtask.employee_id" ref="employee-select" @focus="onInputFocus" class="modal-input border-select" label="Priradený" :class="{ error: v$.subtask.employee_id.$errors.length }" variant="solo" :items="filteredEmployees" item-value="id" item-title="_fullName"></v-select>
|
||||
|
||||
<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>
|
||||
|
||||
<div class="w-100 modal-input">
|
||||
@@ -28,7 +27,11 @@
|
||||
|
||||
<v-card v-else height="100%" class="d-flex flex-column scrolling">
|
||||
<div class="d-flex justify-space-between align-center">
|
||||
<p>{{ subtask.project_code }}</p>
|
||||
<div>
|
||||
<p>{{ subtask.master_task?.project_code }}</p>
|
||||
<h1>{{ subtask.master_task?.name }}</h1>
|
||||
</div>
|
||||
|
||||
<v-icon @click.stop="closeModal()" icon="mdi-close" size="large" class="pb-5"></v-icon>
|
||||
</div>
|
||||
<div class="d-flex justify-space-between align-center modal-header border-bottom pb-4">
|
||||
@@ -119,7 +122,7 @@ export default {
|
||||
id: { required }
|
||||
},
|
||||
duration: { required },
|
||||
employee_id: { required }
|
||||
employee: { required }
|
||||
}
|
||||
}
|
||||
},
|
||||
@@ -223,6 +226,10 @@ export default {
|
||||
this.subtask.files = files
|
||||
},
|
||||
|
||||
onEmployeeSelected({ key }) {
|
||||
this.subtask.employee_id = key
|
||||
},
|
||||
|
||||
_enrichTask(subtask) {
|
||||
subtask.master_task = this.mastertasks.find((mastertask) => mastertask.id == subtask.master_task_id)
|
||||
subtask.employee = this.enrichedEmployees.find((employee) => employee.id == subtask.employee_id)
|
||||
@@ -253,10 +260,6 @@ export default {
|
||||
editMode() {
|
||||
this.$nextTick(() => {
|
||||
this.$refs["description"]?.setHTML(this.subtask.description || "")
|
||||
|
||||
const employeeSelect = this.$refs['employee-select']?.$el?.querySelector('.v-select__selection-text')
|
||||
if (employeeSelect)
|
||||
employeeSelect.innerHTML = this.subtask?.employee?._fullName || ''
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
@@ -50,10 +50,13 @@ export default {
|
||||
async updateUserInfo() {
|
||||
if (!(await this.v$.$validate())) return
|
||||
|
||||
const [sHours, sMinutes] = this.form.work_start.split(':');
|
||||
const [eHours, eMinutes] = this.form.work_end.split(':');
|
||||
|
||||
const data = {
|
||||
id: this.user.id,
|
||||
work_start: parseInt(this.form.work_start.split(':')[0]),
|
||||
work_end: parseInt(this.form.work_end.split(':')[0])
|
||||
work_start: parseFloat(sHours) * 60 + parseFloat(sMinutes),
|
||||
work_end: parseFloat(eHours) * 60 + parseFloat(eMinutes)
|
||||
}
|
||||
|
||||
try {
|
||||
@@ -66,9 +69,18 @@ export default {
|
||||
|
||||
_setDates() {
|
||||
this.form = {
|
||||
work_start: this.user.work_start < 10 ? `0${this.user.work_start}:00` : `${this.user.work_start}:00`,
|
||||
work_end: this.user.work_end < 10 ? `0${this.user.work_end}:00` : `${this.user.work_end}:00`
|
||||
work_start: this.minutesToTime(this.user.work_start),
|
||||
work_end: this.minutesToTime(this.user.work_end)
|
||||
}
|
||||
},
|
||||
|
||||
minutesToTime(minutes) {
|
||||
var hours = Math.floor(minutes / 60)
|
||||
var mins = minutes % 60
|
||||
hours = (hours < 10 ? '0' : '') + hours
|
||||
mins = (mins < 10 ? '0' : '') + mins
|
||||
|
||||
return hours + ':' + mins
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
Reference in new issue
Block a user