From ebd824bddf8d37a66d2dbf7f330b39c8849db9b2 Mon Sep 17 00:00:00 2001 From: kolaente Date: Thu, 21 Jul 2022 00:29:12 +0200 Subject: [PATCH] feat: update task in gantt bar after dragging to make sure it changes its color --- src/components/tasks/gantt-chart.vue | 26 +++++++++++++++++--------- 1 file changed, 17 insertions(+), 9 deletions(-) diff --git a/src/components/tasks/gantt-chart.vue b/src/components/tasks/gantt-chart.vue index 9713c0fd9..a2780ba74 100644 --- a/src/components/tasks/gantt-chart.vue +++ b/src/components/tasks/gantt-chart.vue @@ -105,13 +105,9 @@ const ganttBars = ref([]) const defaultStartDate = format(new Date(), dateFormat) const defaultEndDate = format(new Date((new Date()).setDate((new Date()).getDate() + 7)), dateFormat) -// We need a "real" ref object for the gantt bars to instantly update the tasks when they are dragged on the chart. -// A computed won't work directly. -function mapGanttBars() { - ganttBars.value = [] +function transformTaskToGanttBar(t: TaskModel) { const black = 'var(--grey-800)' - - tasks.value.forEach(t => ganttBars.value.push([{ + return [{ startDate: t.startDate ? format(t.startDate, dateFormat) : defaultStartDate, endDate: t.endDate ? format(t.endDate, dateFormat) : defaultEndDate, ganttBarConfig: { @@ -124,7 +120,15 @@ function mapGanttBars() { border: t.startDate ? '' : '2px dashed var(--grey-300)', }, }, - }])) + }] +} + +// We need a "real" ref object for the gantt bars to instantly update the tasks when they are dragged on the chart. +// A computed won't work directly. +function mapGanttBars() { + ganttBars.value = [] + + tasks.value.forEach(t => ganttBars.value.push(transformTaskToGanttBar(t))) } async function loadTasks() { @@ -168,11 +172,15 @@ async function updateTask(e) { task.startDate = e.bar.startDate task.endDate = e.bar.endDate const taskService = new TaskService() - await taskService.update(task) + const r = await taskService.update(task) // TODO: Loading animation + for (const i in ganttBars.value) { + if(ganttBars.value[i][0].ganttBarConfig.id === task.id) { + ganttBars.value[i] = transformTaskToGanttBar(r) + } + } } - const newTaskFieldActive = ref(false) const newTaskTitleField = ref() const newTaskTitle = ref('')