mirror of
https://bitbucket.org/studiotem/jandl-taskmanager-app.git
synced 2026-10-21 14:29:34 +00:00
refactor podla review
This commit is contained in:
1 parent
d46a9151fc
commit
c542ea7760
14 files changed
+87
-180
No files matched your search
@@ -38,7 +38,6 @@
|
|||||||
"tasks": [
|
"tasks": [
|
||||||
{
|
{
|
||||||
"id": 1,
|
"id": 1,
|
||||||
"task_id": 1,
|
|
||||||
"starts_at": "2023-01-11T08:01:00+00:00",
|
"starts_at": "2023-01-11T08:01:00+00:00",
|
||||||
"ends_at": "2023-01-11T09:00:00+00:00",
|
"ends_at": "2023-01-11T09:00:00+00:00",
|
||||||
"title": "Task DNES",
|
"title": "Task DNES",
|
||||||
@@ -49,7 +48,6 @@
|
|||||||
|
|
||||||
{
|
{
|
||||||
"id": 2,
|
"id": 2,
|
||||||
"task_id": 2,
|
|
||||||
"starts_at": "2023-01-12T08:30:00+00:00",
|
"starts_at": "2023-01-12T08:30:00+00:00",
|
||||||
"ends_at": "2023-01-12T09:00:00+00:00",
|
"ends_at": "2023-01-12T09:00:00+00:00",
|
||||||
"title": "Kratky 30min Lorem ipsum dolor sit amet, consectetur adipiscing e",
|
"title": "Kratky 30min Lorem ipsum dolor sit amet, consectetur adipiscing e",
|
||||||
@@ -60,7 +58,6 @@
|
|||||||
|
|
||||||
{
|
{
|
||||||
"id": 3,
|
"id": 3,
|
||||||
"task_id": 3,
|
|
||||||
"starts_at": "2023-01-12T10:30:00+00:00",
|
"starts_at": "2023-01-12T10:30:00+00:00",
|
||||||
"ends_at": "2023-01-12T10:45:00+00:00",
|
"ends_at": "2023-01-12T10:45:00+00:00",
|
||||||
"title": "Kratky 15min",
|
"title": "Kratky 15min",
|
||||||
@@ -71,7 +68,6 @@
|
|||||||
|
|
||||||
{
|
{
|
||||||
"id": 4,
|
"id": 4,
|
||||||
"task_id": 4,
|
|
||||||
"starts_at": "2023-01-13T08:00:00+00:00",
|
"starts_at": "2023-01-13T08:00:00+00:00",
|
||||||
"ends_at": "2023-01-13T10:00:00+00:00",
|
"ends_at": "2023-01-13T10:00:00+00:00",
|
||||||
"title": "Task 2",
|
"title": "Task 2",
|
||||||
@@ -82,7 +78,6 @@
|
|||||||
|
|
||||||
{
|
{
|
||||||
"id": 6,
|
"id": 6,
|
||||||
"task_id": 6,
|
|
||||||
"starts_at": "2023-01-13T09:00:00+00:00",
|
"starts_at": "2023-01-13T09:00:00+00:00",
|
||||||
"ends_at": "2023-01-13T12:00:00+00:00",
|
"ends_at": "2023-01-13T12:00:00+00:00",
|
||||||
"title": "Task 6",
|
"title": "Task 6",
|
||||||
@@ -93,7 +88,6 @@
|
|||||||
|
|
||||||
{
|
{
|
||||||
"id": 7,
|
"id": 7,
|
||||||
"task_id": 7,
|
|
||||||
"starts_at": "2023-01-13T12:00:00+00:00",
|
"starts_at": "2023-01-13T12:00:00+00:00",
|
||||||
"ends_at": "2023-01-13T16:00:00+00:00",
|
"ends_at": "2023-01-13T16:00:00+00:00",
|
||||||
"title": "Task 7",
|
"title": "Task 7",
|
||||||
@@ -104,7 +98,6 @@
|
|||||||
|
|
||||||
{
|
{
|
||||||
"id": 8,
|
"id": 8,
|
||||||
"task_id": 8,
|
|
||||||
"starts_at": "2023-01-14T07:00:00+00:00",
|
"starts_at": "2023-01-14T07:00:00+00:00",
|
||||||
"ends_at": "2023-01-14T09:00:00+00:00",
|
"ends_at": "2023-01-14T09:00:00+00:00",
|
||||||
"title": "Task 8",
|
"title": "Task 8",
|
||||||
@@ -115,7 +108,6 @@
|
|||||||
|
|
||||||
{
|
{
|
||||||
"id": 9,
|
"id": 9,
|
||||||
"task_id": 9,
|
|
||||||
"starts_at": "2023-01-14T09:00:00+00:00",
|
"starts_at": "2023-01-14T09:00:00+00:00",
|
||||||
"ends_at": "2023-01-14T12:00:00+00:00",
|
"ends_at": "2023-01-14T12:00:00+00:00",
|
||||||
"title": "Task 9",
|
"title": "Task 9",
|
||||||
@@ -126,7 +118,6 @@
|
|||||||
|
|
||||||
{
|
{
|
||||||
"id": 10,
|
"id": 10,
|
||||||
"task_id": 10,
|
|
||||||
"starts_at": "2023-01-14T12:00:00+00:00",
|
"starts_at": "2023-01-14T12:00:00+00:00",
|
||||||
"ends_at": "2023-01-14T13:00:00+00:00",
|
"ends_at": "2023-01-14T13:00:00+00:00",
|
||||||
"title": "Task 10",
|
"title": "Task 10",
|
||||||
|
|||||||
@@ -10,7 +10,6 @@
|
|||||||
"tasks": [
|
"tasks": [
|
||||||
{
|
{
|
||||||
"id": 1,
|
"id": 1,
|
||||||
"task_id": 1,
|
|
||||||
"starts_at": "2023-01-12T08:01:00+00:00",
|
"starts_at": "2023-01-12T08:01:00+00:00",
|
||||||
"ends_at": "2023-01-12T09:00:00+00:00",
|
"ends_at": "2023-01-12T09:00:00+00:00",
|
||||||
"title": "Task DNES",
|
"title": "Task DNES",
|
||||||
@@ -21,7 +20,6 @@
|
|||||||
|
|
||||||
{
|
{
|
||||||
"id": 2,
|
"id": 2,
|
||||||
"task_id": 2,
|
|
||||||
"starts_at": "2023-01-12T08:30:00+00:00",
|
"starts_at": "2023-01-12T08:30:00+00:00",
|
||||||
"ends_at": "2023-01-12T09:00:00+00:00",
|
"ends_at": "2023-01-12T09:00:00+00:00",
|
||||||
"title": "Kratky 30min",
|
"title": "Kratky 30min",
|
||||||
@@ -32,7 +30,6 @@
|
|||||||
|
|
||||||
{
|
{
|
||||||
"id": 3,
|
"id": 3,
|
||||||
"task_id": 3,
|
|
||||||
"starts_at": "2023-01-13T10:30:00+00:00",
|
"starts_at": "2023-01-13T10:30:00+00:00",
|
||||||
"ends_at": "2023-01-13T10:45:00+00:00",
|
"ends_at": "2023-01-13T10:45:00+00:00",
|
||||||
"title": "Kratky 15min",
|
"title": "Kratky 15min",
|
||||||
@@ -51,8 +48,7 @@
|
|||||||
"unscheduled_time": 10,
|
"unscheduled_time": 10,
|
||||||
"tasks": [
|
"tasks": [
|
||||||
{
|
{
|
||||||
"id": 1,
|
"id": 4,
|
||||||
"task_id": 1,
|
|
||||||
"starts_at": "2023-01-12T08:01:00+00:00",
|
"starts_at": "2023-01-12T08:01:00+00:00",
|
||||||
"ends_at": "2023-01-12T09:00:00+00:00",
|
"ends_at": "2023-01-12T09:00:00+00:00",
|
||||||
"title": "Task DNES",
|
"title": "Task DNES",
|
||||||
@@ -62,8 +58,7 @@
|
|||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
"id": 2,
|
"id": 5,
|
||||||
"task_id": 2,
|
|
||||||
"starts_at": "2023-01-12T08:30:00+00:00",
|
"starts_at": "2023-01-12T08:30:00+00:00",
|
||||||
"ends_at": "2023-01-12T09:00:00+00:00",
|
"ends_at": "2023-01-12T09:00:00+00:00",
|
||||||
"title": "Kratky 30min",
|
"title": "Kratky 30min",
|
||||||
@@ -73,8 +68,7 @@
|
|||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
"id": 3,
|
"id": 6,
|
||||||
"task_id": 3,
|
|
||||||
"starts_at": "2023-01-12T10:30:00+00:00",
|
"starts_at": "2023-01-12T10:30:00+00:00",
|
||||||
"ends_at": "2023-01-12T10:45:00+00:00",
|
"ends_at": "2023-01-12T10:45:00+00:00",
|
||||||
"title": "Kratky 15min",
|
"title": "Kratky 15min",
|
||||||
@@ -94,7 +88,6 @@
|
|||||||
"tasks": [
|
"tasks": [
|
||||||
{
|
{
|
||||||
"id": 1,
|
"id": 1,
|
||||||
"task_id": 1,
|
|
||||||
"starts_at": "2023-01-13T08:01:00+00:00",
|
"starts_at": "2023-01-13T08:01:00+00:00",
|
||||||
"ends_at": "2023-01-13T09:00:00+00:00",
|
"ends_at": "2023-01-13T09:00:00+00:00",
|
||||||
"title": "Task DNES",
|
"title": "Task DNES",
|
||||||
@@ -105,7 +98,6 @@
|
|||||||
|
|
||||||
{
|
{
|
||||||
"id": 2,
|
"id": 2,
|
||||||
"task_id": 2,
|
|
||||||
"starts_at": "2023-01-12T08:30:00+00:00",
|
"starts_at": "2023-01-12T08:30:00+00:00",
|
||||||
"ends_at": "2023-01-12T09:00:00+00:00",
|
"ends_at": "2023-01-12T09:00:00+00:00",
|
||||||
"title": "Kratky 30min",
|
"title": "Kratky 30min",
|
||||||
@@ -116,7 +108,6 @@
|
|||||||
|
|
||||||
{
|
{
|
||||||
"id": 3,
|
"id": 3,
|
||||||
"task_id": 3,
|
|
||||||
"starts_at": "2023-01-13T10:30:00+00:00",
|
"starts_at": "2023-01-13T10:30:00+00:00",
|
||||||
"ends_at": "2023-01-13T10:45:00+00:00",
|
"ends_at": "2023-01-13T10:45:00+00:00",
|
||||||
"title": "Kratky 15min",
|
"title": "Kratky 15min",
|
||||||
@@ -136,7 +127,6 @@
|
|||||||
"tasks": [
|
"tasks": [
|
||||||
{
|
{
|
||||||
"id": 1,
|
"id": 1,
|
||||||
"task_id": 1,
|
|
||||||
"starts_at": "2023-01-11T08:01:00+00:00",
|
"starts_at": "2023-01-11T08:01:00+00:00",
|
||||||
"ends_at": "2023-01-11T09:00:00+00:00",
|
"ends_at": "2023-01-11T09:00:00+00:00",
|
||||||
"title": "Task DNES",
|
"title": "Task DNES",
|
||||||
@@ -147,7 +137,6 @@
|
|||||||
|
|
||||||
{
|
{
|
||||||
"id": 2,
|
"id": 2,
|
||||||
"task_id": 2,
|
|
||||||
"starts_at": "2023-01-11T08:30:00+00:00",
|
"starts_at": "2023-01-11T08:30:00+00:00",
|
||||||
"ends_at": "2023-01-11T09:00:00+00:00",
|
"ends_at": "2023-01-11T09:00:00+00:00",
|
||||||
"title": "Kratky 30min",
|
"title": "Kratky 30min",
|
||||||
@@ -158,7 +147,6 @@
|
|||||||
|
|
||||||
{
|
{
|
||||||
"id": 3,
|
"id": 3,
|
||||||
"task_id": 3,
|
|
||||||
"starts_at": "2023-01-11T10:30:00+00:00",
|
"starts_at": "2023-01-11T10:30:00+00:00",
|
||||||
"ends_at": "2023-01-11T10:45:00+00:00",
|
"ends_at": "2023-01-11T10:45:00+00:00",
|
||||||
"title": "Kratky 15min",
|
"title": "Kratky 15min",
|
||||||
|
|||||||
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
+6
-9
@@ -91,7 +91,6 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
// Kaluza: Cely tento komponent presun do tm@dashboard/_components/z-timeline.vue
|
|
||||||
import ZCompleteTaskModal from '@/plugins/tm@modal/task/z-complete-task-modal.vue'
|
import ZCompleteTaskModal from '@/plugins/tm@modal/task/z-complete-task-modal.vue'
|
||||||
import ZDeleteTaskModal from '@/plugins/tm@modal/task/z-delete-task-modal.vue'
|
import ZDeleteTaskModal from '@/plugins/tm@modal/task/z-delete-task-modal.vue'
|
||||||
import ZSubTaskModal from '@/plugins/tm@modal/sub-task/z-sub-task-modal.vue'
|
import ZSubTaskModal from '@/plugins/tm@modal/sub-task/z-sub-task-modal.vue'
|
||||||
@@ -147,9 +146,7 @@ export default {
|
|||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
weekChanged() {
|
weekChanged() {
|
||||||
// Kaluza: Skus tieto document.getElementBy... prerobit na this.$el.getElement ...
|
const scrollContainer = this.$el.getElementsByClassName('vuecal__scrollable-body')[0]
|
||||||
// Je za tym viacero problemov ktore by to mohlo sposobit, v tejto appke asi ne ale nech si drzime best practices
|
|
||||||
const scrollContainer = document.getElementsByClassName('vuecal__scrollable-body')[0]
|
|
||||||
scrollContainer.scrollLeft = 0
|
scrollContainer.scrollLeft = 0
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -163,12 +160,12 @@ export default {
|
|||||||
},
|
},
|
||||||
|
|
||||||
correctMargins() {
|
correctMargins() {
|
||||||
if (!document.getElementsByClassName('vuecal__split-days-headers').length)
|
if (!this.$el.getElementsByClassName('vuecal__split-days-headers').length)
|
||||||
return
|
return
|
||||||
|
|
||||||
const heightOfDayHeader = document.getElementsByClassName('vuecal__split-days-headers')[0].clientHeight
|
const heightOfDayHeader = this.$el.getElementsByClassName('vuecal__split-days-headers')[0].clientHeight
|
||||||
document.getElementsByClassName('vuecal__time-column')[0].style.marginTop = `${heightOfDayHeader}px`
|
this.$el.getElementsByClassName('vuecal__time-column')[0].style.marginTop = `${heightOfDayHeader}px`
|
||||||
document.getElementsByClassName('vuecal__cells-body')[0].style.marginTop = `${heightOfDayHeader}px`
|
this.$el.getElementsByClassName('vuecal__cells-body')[0].style.marginTop = `${heightOfDayHeader}px`
|
||||||
},
|
},
|
||||||
|
|
||||||
getHeadingDate(value) {
|
getHeadingDate(value) {
|
||||||
@@ -207,7 +204,7 @@ export default {
|
|||||||
},
|
},
|
||||||
|
|
||||||
clickCompleteTask(event) {
|
clickCompleteTask(event) {
|
||||||
if (event.completed) this.$emit('reopenTask', event.id)
|
if (event.completed) this.completeTask(event.id)
|
||||||
else this.showCompleteModal = {task: event}
|
else this.showCompleteModal = {task: event}
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -3,12 +3,12 @@
|
|||||||
<v-select
|
<v-select
|
||||||
v-model="selectedEmployee"
|
v-model="selectedEmployee"
|
||||||
class="subheader-input"
|
class="subheader-input"
|
||||||
:items="employees"
|
:items="employeesNames"
|
||||||
label="Zamestnanec"
|
label="Zamestnanec"
|
||||||
variant="outlined"
|
variant="outlined"
|
||||||
></v-select>
|
></v-select>
|
||||||
<div class="d-flex date-wrapper">
|
<div class="d-flex date-wrapper">
|
||||||
<v-btn class="subheader-icon-button prev" variant="outlined" @click="prevWeek()"><img :src="require('./_img/icon-prev.svg')" alt=""></v-btn>
|
<v-btn class="subheader-icon-button prev" variant="outlined" @click="prevWeek()"><img :src="require('@/plugins/tm@dashboard/_components/_img/icon-prev.svg')" alt=""></v-btn>
|
||||||
<v-text-field
|
<v-text-field
|
||||||
class="subheader-input disabled"
|
class="subheader-input disabled"
|
||||||
label="Dátum"
|
label="Dátum"
|
||||||
@@ -16,7 +16,7 @@
|
|||||||
variant="outlined"
|
variant="outlined"
|
||||||
append-inner-icon="mdi-calendar-blank-outline"
|
append-inner-icon="mdi-calendar-blank-outline"
|
||||||
></v-text-field>
|
></v-text-field>
|
||||||
<v-btn class="subheader-icon-button next" variant="outlined" @click="nextWeek()"><img :src="require('./_img/icon-next.svg')" alt=""></v-btn>
|
<v-btn class="subheader-icon-button next" variant="outlined" @click="nextWeek()"><img :src="require('@/plugins/tm@dashboard/_components/_img/icon-next.svg')" alt=""></v-btn>
|
||||||
</div>
|
</div>
|
||||||
<v-text-field
|
<v-text-field
|
||||||
class="subheader-input disabled"
|
class="subheader-input disabled"
|
||||||
@@ -42,32 +42,36 @@ export default {
|
|||||||
|
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
// Kaluza: Napojit na BE
|
employees: [],
|
||||||
employees: ['Foo', 'Bar', 'Fizz', 'Buzz'],
|
employeesNames: [],
|
||||||
|
selectedDate: "",
|
||||||
// Kaluza: Toto je preco hardcoded
|
|
||||||
selectedDate: "13.11.2022 - 17.11.2022",
|
|
||||||
|
|
||||||
// Kaluza: Napojit funkcnost
|
// Kaluza: Napojit funkcnost
|
||||||
selectedEmployee: 'Bar',
|
selectedEmployee: '',
|
||||||
date: new Date()
|
date: new Date()
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
created() {
|
|
||||||
// Kaluza: getWeek pouzivas iba v js a nevolas ho z html a je to pomocna funkcia, takze ju nazvi _getWeek
|
|
||||||
this.getWeek()
|
|
||||||
},
|
|
||||||
|
|
||||||
// Kaluza: Computed ma byt hned za data
|
|
||||||
computed: {
|
computed: {
|
||||||
time() {
|
time() {
|
||||||
return this.unscheduledTime
|
return this.unscheduledTime
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
created() {
|
||||||
|
this._getEmployees()
|
||||||
|
this._getWeek()
|
||||||
|
},
|
||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
getWeek() {
|
async _getEmployees() {
|
||||||
|
this.employees = await this.$axios.get_auth_data('v1/employees')
|
||||||
|
this.employees.forEach(employee => {
|
||||||
|
this.employeesNames.push(employee.name)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
_getWeek() {
|
||||||
this.firstDay = subDays(this.date, 1)
|
this.firstDay = subDays(this.date, 1)
|
||||||
this.lastDay = addDays(this.date, 5)
|
this.lastDay = addDays(this.date, 5)
|
||||||
|
|
||||||
@@ -77,12 +81,12 @@ export default {
|
|||||||
|
|
||||||
prevWeek() {
|
prevWeek() {
|
||||||
this.date = subDays(this.date, 7)
|
this.date = subDays(this.date, 7)
|
||||||
this.getWeek()
|
this._getWeek()
|
||||||
},
|
},
|
||||||
|
|
||||||
nextWeek() {
|
nextWeek() {
|
||||||
this.date = addDays(this.date, 7)
|
this.date = addDays(this.date, 7)
|
||||||
this.getWeek()
|
this._getWeek()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -3,24 +3,14 @@
|
|||||||
<A-task-filter :unscheduledTime="unscheduledTime" @weekChange="getWeekData" />
|
<A-task-filter :unscheduledTime="unscheduledTime" @weekChange="getWeekData" />
|
||||||
|
|
||||||
<W-loadable :content="timelineData" class="w-loadable" empty-message="Nepodarilo sa nacitat data!">
|
<W-loadable :content="timelineData" class="w-loadable" empty-message="Nepodarilo sa nacitat data!">
|
||||||
<Z-timeline :calData="timelineData" :calConfig="config" :splits="splitDays" @eventMoved="onEventMoved" @completeTask="completeTask" @reopenTask="reopenTask" @deleteTask="deleteTask" />
|
<Z-timeline :calData="timelineData" :calConfig="config" :splits="splitDays" @eventMoved="onEventMoved" @completeTask="completeTask" @deleteTask="deleteTask" />
|
||||||
</W-loadable>
|
</W-loadable>
|
||||||
|
|
||||||
<!-- Kaluza: Toto vyhodit a pouzit w toast -->
|
|
||||||
<v-snackbar
|
|
||||||
v-model="errorToast"
|
|
||||||
:timeout="2000"
|
|
||||||
color="red"
|
|
||||||
:rounded="true"
|
|
||||||
>
|
|
||||||
{{ errorToastMessage }}
|
|
||||||
</v-snackbar>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import ATaskFilter from './_components/a-tasks-filter.vue'
|
import ATaskFilter from './_components/a-tasks-filter.vue'
|
||||||
import ZTimeline from './_components/z-timeline.vue'
|
import ZTimeline from '@/plugins/tm@dashboard/_components/z-timeline.vue'
|
||||||
|
|
||||||
import { addDays, setHours, setMinutes, setSeconds, differenceInCalendarDays } from 'date-fns'
|
import { addDays, setHours, setMinutes, setSeconds, differenceInCalendarDays } from 'date-fns'
|
||||||
|
|
||||||
@@ -33,12 +23,6 @@ export default {
|
|||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
timelineData: null,
|
timelineData: null,
|
||||||
|
|
||||||
// Kaluza: Vyhodit tieto toast veci
|
|
||||||
errorToast: false,
|
|
||||||
errorToastMessage: "Nepodarilo sa nacitat data!",
|
|
||||||
|
|
||||||
dataLoaded: false,
|
|
||||||
splitDays: [],
|
splitDays: [],
|
||||||
unscheduledTime: 0,
|
unscheduledTime: 0,
|
||||||
config: {
|
config: {
|
||||||
@@ -53,19 +37,17 @@ export default {
|
|||||||
this.config.date = week.firstDay
|
this.config.date = week.firstDay
|
||||||
try {
|
try {
|
||||||
this.timelineData = await this.$axios.get_auth_data('v1/overview/tasks')
|
this.timelineData = await this.$axios.get_auth_data('v1/overview/tasks')
|
||||||
this.formatData(week.firstDay)
|
this.formatTimelineDataToTimelineFormat(week.firstDay)
|
||||||
this.generateSplits(week.firstDay)
|
this.generateDays(week.firstDay)
|
||||||
this.generateNonWorkingHours(week.firstDay)
|
this.generateNonWorkingHours(week.firstDay)
|
||||||
} catch(error) {
|
} catch (error) {
|
||||||
// Kaluza: Ked to davas do w loadable tak nepouzi toast a iba daj this.timeineData = {error} a loadable ho parsne a zobrazi
|
this.timelineData = {error: error || 'Nepodarilo sa nacitat data!'}
|
||||||
this.timelineData = {}
|
|
||||||
console.error(error)
|
console.error(error)
|
||||||
this.triggerToast("Nepodarilo sa nacitat data!")
|
// console.log(this.$store.getters['auth/user'])
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
// Kaluza: Toto prosimta premenuj lebo neviem vobec co znamena splits
|
generateDays(date) {
|
||||||
generateSplits(date) {
|
|
||||||
this.splitDays = []
|
this.splitDays = []
|
||||||
for (let i = 0; i < 7; i++) {
|
for (let i = 0; i < 7; i++) {
|
||||||
this.splitDays.push({
|
this.splitDays.push({
|
||||||
@@ -78,8 +60,7 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
// Kaluza: Toto nazvi nejako inak aby bolo viac jasne ze z coho to preformatovava na co
|
formatTimelineDataToTimelineFormat(date) {
|
||||||
formatData(date) {
|
|
||||||
// format events
|
// format events
|
||||||
this.timelineData.tasks.forEach(event => {
|
this.timelineData.tasks.forEach(event => {
|
||||||
event.name = this.timelineData.name
|
event.name = this.timelineData.name
|
||||||
@@ -137,56 +118,33 @@ export default {
|
|||||||
this.timelineData.tasks.push(...nonWorkingHours)
|
this.timelineData.tasks.push(...nonWorkingHours)
|
||||||
},
|
},
|
||||||
|
|
||||||
// Kaluza: Vyhodit
|
|
||||||
triggerToast(message) {
|
|
||||||
this.errorToastMessage = message
|
|
||||||
this.errorToast = true
|
|
||||||
},
|
|
||||||
|
|
||||||
// Kaluza: Vyhodit ak sa nepouzije
|
|
||||||
async onEventMoved(event) {
|
async onEventMoved(event) {
|
||||||
console.log("drag", event)
|
console.log("drag", event)
|
||||||
// try {
|
const task = this.timelineData.tasks.find(task => task.id == event.event.id)
|
||||||
// const newStartDate = addDays(event.event.start, differenceInCalendarDays(this.splitDays.filter((split) => {return split.id == event.newSplit})[0].date, event.event.start))
|
|
||||||
// const newEndDate = addDays(event.event.end, differenceInCalendarDays( newStartDate, event.event.start))
|
try {
|
||||||
|
const newStartDate = addDays(event.event.start, differenceInCalendarDays(this.splitDays.filter((split) => {return split.id == event.newSplit})[0].date, event.event.start))
|
||||||
|
const newEndDate = addDays(event.event.end, differenceInCalendarDays( newStartDate, event.event.start))
|
||||||
|
|
||||||
// await this.$axios.post_auth_data(`v1/overview/tasks/${event.event.id}`, {start: newStartDate, end: newEndDate})
|
// await this.$axios.post_auth_data(`v1/overview/tasks/${event.event.id}`, {start: newStartDate, end: newEndDate})
|
||||||
// } catch(error) {
|
task.start = newStartDate
|
||||||
// this.triggerToast("Nepodarilo sa presunut ulohu!")
|
task.end = newEndDate
|
||||||
// this.timelineData.tasks.filter(e => {
|
task.split = event.newSplit
|
||||||
// if (e.id == event.event.id) {
|
} catch(error) {
|
||||||
// e.start = new Date(event.originalEvent.start)
|
this.$toast.error(error)
|
||||||
// e.end = new Date(event.originalEvent.end)
|
|
||||||
// }
|
task.start = new Date(event.originalEvent.start)
|
||||||
// })
|
task.end = new Date(event.originalEvent.end)
|
||||||
// }
|
task.split = event.oldSplit
|
||||||
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
completeTask(id) {
|
completeTask(id) {
|
||||||
// Kaluza: Tu pridaj request na BE, nepouzi filter ale find a sprav to takto
|
const task = this.timelineData.tasks.find(task => task.id == id)
|
||||||
// 1. const task = this.timelineData.tasks.find(task => task.id == id)
|
task.completed = !task.completed
|
||||||
// 2. task.completed = true
|
|
||||||
// 3. V tryCatch zavolaj request na BE
|
|
||||||
// 4. Ak to spadne do catchu tak daj task.completed = false a pod tym daj this.$toast.error(error)
|
|
||||||
|
|
||||||
// A AKO NAD TYM ROZMYSLAM completeTask A reopenTask MOZES SPOJIT DO JEDNEJ A VZDY LEN DAS task.completed = !task.completed
|
|
||||||
this.timelineData.tasks.filter(task => {
|
|
||||||
if (task.id == id) {
|
|
||||||
task.completed = true
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
|
|
||||||
reopenTask(id) {
|
|
||||||
// Kaluza: Toto rovnakym sposobom ako complete task
|
|
||||||
this.timelineData.tasks.filter(task => {
|
|
||||||
if (task.id == id) {
|
|
||||||
task.completed = false
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
},
|
||||||
|
|
||||||
deleteTask(id) {
|
deleteTask(id) {
|
||||||
// Kaluza: Toto rovnako ako complete a reopen
|
|
||||||
this.timelineData.tasks.splice(this.timelineData.tasks.findIndex(item => item.id === id), 1)
|
this.timelineData.tasks.splice(this.timelineData.tasks.findIndex(item => item.id === id), 1)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -3,12 +3,12 @@
|
|||||||
<v-select
|
<v-select
|
||||||
v-model="selectedEmployee"
|
v-model="selectedEmployee"
|
||||||
class="subheader-input"
|
class="subheader-input"
|
||||||
:items="employees"
|
:items="teams"
|
||||||
label="Tím"
|
label="Tím"
|
||||||
variant="outlined"
|
variant="outlined"
|
||||||
></v-select>
|
></v-select>
|
||||||
<div class="d-flex date-wrapper">
|
<div class="d-flex date-wrapper">
|
||||||
<v-btn class="subheader-icon-button prev" variant="outlined" @click="prevDay()"><img :src="require('../../tasks/_components/_img/icon-prev.svg')" alt=""></v-btn>
|
<v-btn class="subheader-icon-button prev" variant="outlined" @click="prevDay()"><img :src="require('@/plugins/tm@dashboard/_components/_img/icon-prev.svg')" alt=""></v-btn>
|
||||||
<v-text-field
|
<v-text-field
|
||||||
class="subheader-input disabled"
|
class="subheader-input disabled"
|
||||||
label="Dátum"
|
label="Dátum"
|
||||||
@@ -16,7 +16,7 @@
|
|||||||
variant="outlined"
|
variant="outlined"
|
||||||
append-inner-icon="mdi-calendar-blank-outline"
|
append-inner-icon="mdi-calendar-blank-outline"
|
||||||
></v-text-field>
|
></v-text-field>
|
||||||
<v-btn class="subheader-icon-button next" variant="outlined" @click="nextDay()"><img :src="require('../../tasks/_components/_img/icon-next.svg')" alt=""></v-btn>
|
<v-btn class="subheader-icon-button next" variant="outlined" @click="nextDay()"><img :src="require('@/plugins/tm@dashboard/_components/_img/icon-next.svg')" alt=""></v-btn>
|
||||||
</div>
|
</div>
|
||||||
<v-text-field
|
<v-text-field
|
||||||
class="subheader-input disabled"
|
class="subheader-input disabled"
|
||||||
@@ -43,7 +43,7 @@ export default {
|
|||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
// Kaluza: Napojit funkcionalitu
|
// Kaluza: Napojit funkcionalitu
|
||||||
employees: ['Foo', 'Bar', 'Fizz', 'Buzz'],
|
teams: ['Foo', 'Bar', 'Fizz', 'Buzz'],
|
||||||
selectedDate: new Date(),
|
selectedDate: new Date(),
|
||||||
day: new Date(),
|
day: new Date(),
|
||||||
selectedEmployee: 'Bar',
|
selectedEmployee: 'Bar',
|
||||||
|
|||||||
@@ -3,24 +3,14 @@
|
|||||||
<A-team-filter :unscheduledTime="unscheduledTime" @dayChanged="getDayData" />
|
<A-team-filter :unscheduledTime="unscheduledTime" @dayChanged="getDayData" />
|
||||||
|
|
||||||
<W-loadable :content="timelineData" class="w-loadable" empty-message="Nepodarilo sa nacitat data!">
|
<W-loadable :content="timelineData" class="w-loadable" empty-message="Nepodarilo sa nacitat data!">
|
||||||
<Z-timeline :calData="timelineData" :calConfig="config" :splits="splitDays" @eventMoved="onEventMoved" @completeTask="completeTask" @reopenTask="reopenTask" @deleteTask="deleteTask" />
|
<Z-timeline :calData="timelineData" :calConfig="config" :splits="splitDays" @eventMoved="onEventMoved" @completeTask="completeTask" @deleteTask="deleteTask" />
|
||||||
</W-loadable>
|
</W-loadable>
|
||||||
|
|
||||||
<!-- Kaluza: vyhodit toto a nahradit za wToast -->
|
|
||||||
<v-snackbar
|
|
||||||
v-model="errorToast"
|
|
||||||
:timeout="2000"
|
|
||||||
color="red"
|
|
||||||
:rounded="true"
|
|
||||||
>
|
|
||||||
{{ errorToastMessage }}
|
|
||||||
</v-snackbar>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import ATeamFilter from './_components/a-team-filter.vue'
|
import ATeamFilter from './_components/a-team-filter.vue'
|
||||||
import ZTimeline from '../tasks/_components/z-timeline.vue'
|
import ZTimeline from '@/plugins/tm@dashboard/_components/z-timeline.vue'
|
||||||
|
|
||||||
import { setHours, setMinutes, setSeconds } from 'date-fns'
|
import { setHours, setMinutes, setSeconds } from 'date-fns'
|
||||||
|
|
||||||
@@ -51,23 +41,22 @@ export default {
|
|||||||
this.config.date = date
|
this.config.date = date
|
||||||
try {
|
try {
|
||||||
this.timelineData = await this.$axios.get_auth_data('v1/overview/teams')
|
this.timelineData = await this.$axios.get_auth_data('v1/overview/teams')
|
||||||
this.generateSplits()
|
this.generateEmployees()
|
||||||
this.formatData()
|
this.formatTimelineDataToTimelineFormat()
|
||||||
this.generateNonWorkingHours(date)
|
this.generateNonWorkingHours(date)
|
||||||
} catch(error) {
|
} catch(error) {
|
||||||
// Kaluza: Upravit podla feedbacku v tasks.modal
|
this.timelineData = {error: error || 'Nepodarilo sa nacitat data!'}
|
||||||
this.timelineData = {}
|
|
||||||
console.error(error)
|
console.error(error)
|
||||||
this.triggerToast("Nepodarilo sa nacitat data!")
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
generateSplits() {
|
generateEmployees() {
|
||||||
this.splitDays = []
|
this.splitDays = []
|
||||||
for (let i = 0; i < this.timelineData.length; i++) {
|
for (let i = 0; i < this.timelineData.length; i++) {
|
||||||
this.timelineData[i].splitId = i + 1
|
this.timelineData[i].splitId = i + 1
|
||||||
this.splitDays.push({
|
this.splitDays.push({
|
||||||
id: i + 1,
|
id: i + 1,
|
||||||
|
employeeId: this.timelineData[i].id,
|
||||||
firstName: this.timelineData[i].name,
|
firstName: this.timelineData[i].name,
|
||||||
name: this.timelineData[i].name + " " + this.timelineData[i].surname,
|
name: this.timelineData[i].name + " " + this.timelineData[i].surname,
|
||||||
initials: this.timelineData[i].name.charAt(0).toUpperCase() + this.timelineData[i].surname.charAt(0).toUpperCase(),
|
initials: this.timelineData[i].name.charAt(0).toUpperCase() + this.timelineData[i].surname.charAt(0).toUpperCase(),
|
||||||
@@ -76,8 +65,7 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
// Kaluza: Upravit podla feedbacku v tasks.modal
|
formatTimelineDataToTimelineFormat() {
|
||||||
formatData() {
|
|
||||||
this.timelineData.tasks = []
|
this.timelineData.tasks = []
|
||||||
this.unscheduledTime = 0
|
this.unscheduledTime = 0
|
||||||
|
|
||||||
@@ -132,46 +120,27 @@ export default {
|
|||||||
this.timelineData.tasks.push(...nonWorkingHours)
|
this.timelineData.tasks.push(...nonWorkingHours)
|
||||||
},
|
},
|
||||||
|
|
||||||
// Kaluza: Upravit podla feedbacku v tasks.modal
|
|
||||||
triggerToast(message) {
|
|
||||||
this.errorToastMessage = message
|
|
||||||
this.errorToast = true
|
|
||||||
},
|
|
||||||
|
|
||||||
// Kaluza: Upravit podla feedbacku v tasks.modal
|
|
||||||
async onEventMoved(event) {
|
async onEventMoved(event) {
|
||||||
console.log("drag", event)
|
console.log("drag", event)
|
||||||
// try {
|
const task = this.timelineData.tasks.find(task => task.id == event.event.id)
|
||||||
// const newStartDate = addDays(event.event.start, differenceInCalendarDays(this.splitDays.filter((split) => {return split.id == event.newSplit})[0].date, event.event.start))
|
const newEmployeeId = this.splitDays.find(split => split.id == event.newSplit).employeeId
|
||||||
// const newEndDate = addDays(event.event.end, differenceInCalendarDays( newStartDate, event.event.start))
|
|
||||||
// await this.$axios.post_auth_data(`v1/overview/tasks/${event.event.id}`, {start: newStartDate, end: newEndDate})
|
try {
|
||||||
// } catch(error) {
|
// await this.$axios.post_auth_data(`v1/overview/tasks/${event.event.id}`, {start: newEmployeeId})
|
||||||
// this.triggerToast("Nepodarilo sa presunut ulohu!")
|
task.split = event.newSplit
|
||||||
// this.timelineData.tasks.filter(e => {
|
task.start = event.event.start
|
||||||
// if (e.id == event.event.id) {
|
task.end = event.event.end
|
||||||
// e.start = new Date(event.originalEvent.start)
|
} catch(error) {
|
||||||
// e.end = new Date(event.originalEvent.end)
|
task.split = event.oldSplit
|
||||||
// }
|
task.start = new Date(event.originalEvent.start)
|
||||||
// })
|
task.end = new Date(event.originalEvent.end)
|
||||||
// }
|
this.$toast.error(error)
|
||||||
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
// Kaluza: Upravit podla feedbacku v tasks.modal
|
|
||||||
completeTask(id) {
|
completeTask(id) {
|
||||||
this.timelineData.tasks.filter(task => {
|
const task = this.timelineData.tasks.find(task => task.id == id)
|
||||||
if (task.id == id) {
|
task.completed = !task.completed
|
||||||
task.completed = true
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
|
|
||||||
// Kaluza: Upravit podla feedbacku v tasks.modal
|
|
||||||
reopenTask(id) {
|
|
||||||
this.timelineData.tasks.filter(task => {
|
|
||||||
if (task.id == id) {
|
|
||||||
task.completed = false
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
},
|
||||||
|
|
||||||
deleteTask(id) {
|
deleteTask(id) {
|
||||||
|
|||||||
@@ -280,7 +280,7 @@
|
|||||||
</td>
|
</td>
|
||||||
<td class="task-action">
|
<td class="task-action">
|
||||||
<div class="d-flex justify-start">
|
<div class="d-flex justify-start">
|
||||||
<img class="pencil-icon" :src="require('@/plugins/tm@dashboard/tasks/_components/_img/checkmark.svg')" alt="checkmark-icon" :style="{opacity: 0.3}">
|
<img class="pencil-icon" :src="require('@/plugins/tm@dashboard/_components/_img/checkmark.svg')" alt="checkmark-icon" :style="{opacity: 0.3}">
|
||||||
<img class="pencil-icon ml-2" :src="require('@/plugins/tm@overview/_img/pencil-icon.svg')" alt="pencil-icon" :style="{opacity: 0.3}">
|
<img class="pencil-icon ml-2" :src="require('@/plugins/tm@overview/_img/pencil-icon.svg')" alt="pencil-icon" :style="{opacity: 0.3}">
|
||||||
<img class="trash-icon" :src="require('@/plugins/tm@overview/_img/trash-icon.svg')" alt="trash-icon" :style="{opacity: 0.3}">
|
<img class="trash-icon" :src="require('@/plugins/tm@overview/_img/trash-icon.svg')" alt="trash-icon" :style="{opacity: 0.3}">
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in new issue
Block a user