forked from vikunja/frontend
Remove date-to-string handling
Restored snappy behavior on day precision mode
This commit is contained in:
parent
c59e34f4bf
commit
ffa6ce1714
|
@ -5,9 +5,8 @@
|
||||||
/>
|
/>
|
||||||
<div ref="ganttContainer" class="gantt-container" v-else>
|
<div ref="ganttContainer" class="gantt-container" v-else>
|
||||||
<GGanttChart
|
<GGanttChart
|
||||||
:date-format="DAYJS_ISO_DATE_FORMAT"
|
:chart-start="dateFromDate"
|
||||||
:chart-start="isoToKebabTime(filters.dateFrom)"
|
:chart-end="dateToDate"
|
||||||
:chart-end="isoToKebabTime(filters.dateTo)"
|
|
||||||
:precision="ganttChartPrecision"
|
:precision="ganttChartPrecision"
|
||||||
bar-start="startDate"
|
bar-start="startDate"
|
||||||
bar-end="endDate"
|
bar-end="endDate"
|
||||||
|
@ -40,15 +39,9 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import {computed, ref, watch, toRefs, onActivated} from 'vue'
|
import {computed, ref, watch, toRefs, onActivated} from 'vue'
|
||||||
import {useRouter} from 'vue-router'
|
import {useRouter} from 'vue-router'
|
||||||
|
|
||||||
import {getHexColor} from '@/models/task'
|
import {getHexColor} from '@/models/task'
|
||||||
|
|
||||||
import {colorIsDark} from '@/helpers/color/colorIsDark'
|
import {colorIsDark} from '@/helpers/color/colorIsDark'
|
||||||
import {isoToKebabDate, isoToKebabTime} from '@/helpers/time/isoToKebabDate'
|
|
||||||
import {parseKebabDate, parseKebabDateTime} from '@/helpers/time/parseKebabDate'
|
|
||||||
|
|
||||||
import type {ITask, ITaskPartialWithId} from '@/modelTypes/ITask'
|
import type {ITask, ITaskPartialWithId} from '@/modelTypes/ITask'
|
||||||
import type {DateISO} from '@/types/DateISO'
|
|
||||||
import type {GanttFilters} from '@/views/project/helpers/useGanttFilters'
|
import type {GanttFilters} from '@/views/project/helpers/useGanttFilters'
|
||||||
|
|
||||||
import {
|
import {
|
||||||
|
@ -66,12 +59,10 @@ export interface GanttChartProps {
|
||||||
isLoading: boolean,
|
isLoading: boolean,
|
||||||
filters: GanttFilters,
|
filters: GanttFilters,
|
||||||
tasks: Map<ITask['id'], ITask>,
|
tasks: Map<ITask['id'], ITask>,
|
||||||
defaultTaskStartDate: DateISO
|
defaultTaskStartDate: Date
|
||||||
defaultTaskEndDate: DateISO
|
defaultTaskEndDate: Date
|
||||||
}
|
}
|
||||||
|
|
||||||
const DAYJS_ISO_DATE_FORMAT = 'YYYY-MM-DD HH:mm'
|
|
||||||
|
|
||||||
const props = defineProps<GanttChartProps>()
|
const props = defineProps<GanttChartProps>()
|
||||||
|
|
||||||
const emit = defineEmits<{
|
const emit = defineEmits<{
|
||||||
|
@ -135,8 +126,8 @@ function transformTaskToGanttBar(t: ITask) {
|
||||||
const black = 'var(--grey-800)'
|
const black = 'var(--grey-800)'
|
||||||
|
|
||||||
return [{
|
return [{
|
||||||
startDate: isoToKebabTime(t.startDate ? t.startDate.toISOString() : props.defaultTaskStartDate),
|
startDate: t.startDate ?? props.defaultTaskStartDate,
|
||||||
endDate: isoToKebabTime(t.endDate ? t.endDate.toISOString() : props.defaultTaskEndDate),
|
endDate: t.endDate ?? props.defaultTaskEndDate,
|
||||||
ganttBarConfig: {
|
ganttBarConfig: {
|
||||||
id: String(t.id),
|
id: String(t.id),
|
||||||
label: t.title,
|
label: t.title,
|
||||||
|
@ -156,10 +147,32 @@ async function updateGanttTask(e: {
|
||||||
e: MouseEvent;
|
e: MouseEvent;
|
||||||
datetime?: string | undefined;
|
datetime?: string | undefined;
|
||||||
}) {
|
}) {
|
||||||
|
|
||||||
|
const taskId = Number(e.bar.ganttBarConfig.id)
|
||||||
|
const task = tasks.value.get(taskId)
|
||||||
|
|
||||||
|
const startDate: Date = new Date(e.bar.startDate)
|
||||||
|
const endDate: Date = new Date(e.bar.endDate)
|
||||||
|
|
||||||
|
if(task && ganttChartPrecision.value == 'day') {
|
||||||
|
|
||||||
|
if(task.startDate) {
|
||||||
|
startDate.setHours(task.startDate.getHours(), task.startDate.getMinutes(), task.startDate.getSeconds())
|
||||||
|
} else {
|
||||||
|
startDate.setHours(0,0,0)
|
||||||
|
}
|
||||||
|
|
||||||
|
if(task.endDate) {
|
||||||
|
endDate.setHours(task.endDate.getHours(), task.endDate.getMinutes(), task.endDate.getSeconds())
|
||||||
|
} else {
|
||||||
|
endDate.setHours(23,59,59)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
emit('update:task', {
|
emit('update:task', {
|
||||||
id: Number(e.bar.ganttBarConfig.id),
|
id: Number(taskId),
|
||||||
startDate: new Date(parseKebabDateTime(e.bar.startDate)),
|
startDate: startDate,
|
||||||
endDate: new Date(parseKebabDateTime(e.bar.endDate)),
|
endDate: endDate,
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -65,7 +65,6 @@ import {createAsyncComponent} from '@/helpers/createAsyncComponent'
|
||||||
import {useGanttFilters} from './helpers/useGanttFilters'
|
import {useGanttFilters} from './helpers/useGanttFilters'
|
||||||
import {RIGHTS} from '@/constants/rights'
|
import {RIGHTS} from '@/constants/rights'
|
||||||
|
|
||||||
import type {DateISO} from '@/types/DateISO'
|
|
||||||
import type {ITask} from '@/modelTypes/ITask'
|
import type {ITask} from '@/modelTypes/ITask'
|
||||||
|
|
||||||
type Options = Flatpickr.Options.Options
|
type Options = Flatpickr.Options.Options
|
||||||
|
@ -91,12 +90,12 @@ const {
|
||||||
const DEFAULT_DATE_RANGE_DAYS = 7
|
const DEFAULT_DATE_RANGE_DAYS = 7
|
||||||
|
|
||||||
const today = new Date()
|
const today = new Date()
|
||||||
const defaultTaskStartDate: DateISO = new Date(today.setHours(0, 0, 0, 0)).toISOString()
|
const defaultTaskStartDate: Date = new Date(today.setHours(0, 0, 0, 0))
|
||||||
const defaultTaskEndDate: DateISO = new Date(new Date(
|
const defaultTaskEndDate: Date = new Date(new Date(
|
||||||
today.getFullYear(),
|
today.getFullYear(),
|
||||||
today.getMonth(),
|
today.getMonth(),
|
||||||
today.getDate() + DEFAULT_DATE_RANGE_DAYS,
|
today.getDate() + DEFAULT_DATE_RANGE_DAYS,
|
||||||
).setHours(23, 59, 0, 0)).toISOString()
|
).setHours(23, 59, 0, 0))
|
||||||
|
|
||||||
async function addGanttTask(title: ITask['title']) {
|
async function addGanttTask(title: ITask['title']) {
|
||||||
return await addTask({
|
return await addTask({
|
||||||
|
|
Loading…
Reference in New Issue
Block a user