vikunja/frontend
Archived
6
39
Fork 49
Code Issues 1 Pull Requests 4 Projects Releases 26 Activity

feat: remove gantt-chart wrapper

Browse Source
This commit is contained in:
Dominik Pschenitschni 2022-10-19 15:18:54 +02:00 committed by kolaente
parent a70a2e3ba6
commit aefda38bdd
Signed by: konrad
GPG Key ID: F40E70337AB24C9B
1 changed files with 29 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
src/components/tasks/gantt-chart.vue
View File

@ -1,33 +1,32 @@
<template> <template>
<div> <Loading
<Loading v-if="props.isLoading && tasks.size || dayjsLanguageLoading"
v-if="props.isLoading && tasks.size || dayjsLanguageLoading" class="gantt-container"
class="gantt-container" />
/> <div class="gantt-container" v-else>
<div class="gantt-container" v-else> <GGanttChart
<GGanttChart :date-format="DAYJS_ISO_DATE_FORMAT"
:date-format="DAYJS_ISO_DATE_FORMAT" :chart-start="isoToKebabDate(filters.dateFrom)"
:chart-start="isoToKebabDate(filters.dateFrom)" :chart-end="isoToKebabDate(filters.dateTo)"
:chart-end="isoToKebabDate(filters.dateTo)" precision="day"
precision="day" bar-start="startDate"
bar-start="startDate" bar-end="endDate"
bar-end="endDate" :grid="true"
:grid="true" @dragend-bar="updateGanttTask"
@dragend-bar="updateGanttTask" @dblclick-bar="openTask"
@dblclick-bar="openTask" :width="ganttChartWidth + 'px'"
:width="ganttChartWidth + 'px'" >
> <template #timeunit="{label, value}">
<template #timeunit="{label, value}"> <div
<div class="timeunit-wrapper"
class="timeunit-wrapper" :class="{'today': dayIsToday(label)}"
:class="{'today': dayIsToday(label)}" >
> <span>{{ value }}</span>
<span>{{ value }}</span> <span class="weekday">
<span class="weekday"> {{ weekdayFromTimeLabel(label) }}
{{ weekdayFromTimeLabel(label) }} </span>
</span> </div>
</div> </template>
</template>
<GGanttRow <GGanttRow
v-for="(bar, k) in ganttBars" v-for="(bar, k) in ganttBars"
:key="k" :key="k"
@ -35,7 +34,6 @@
:bars="bar" :bars="bar"
/> />
</GGanttChart> </GGanttChart>
</div>
</div> </div>
</template> </template>
@ -181,7 +179,7 @@ function dayIsToday(label: string): boolean {
<style lang="scss"> <style lang="scss">
// Not scoped because we need to style the elements inside the gantt chart component // Not scoped because we need to style the elements inside the gantt chart component
.g-gantt-chart { .g-gantt-chart {
width: 2000px; width: max-content;
} }
.g-gantt-row-label { .g-gantt-row-label {