diff --git a/docs/.vitepress/theme/components/AdvancedGanttDemo.vue b/docs/.vitepress/theme/components/AdvancedGanttDemo.vue index 7b56325..cf2f6db 100644 --- a/docs/.vitepress/theme/components/AdvancedGanttDemo.vue +++ b/docs/.vitepress/theme/components/AdvancedGanttDemo.vue @@ -27,6 +27,8 @@ const enableMinutes = ref(false) const currentTime = ref(true) const currentTimeLabel = ref('Now') const locale = ref('en') +const utc = ref(false) + // Display Configuration const hideTimeaxis = ref(false) @@ -442,6 +444,12 @@ const formattedEventLog = computed(() => { > +
+ +
@@ -744,6 +752,7 @@ const formattedEventLog = computed(() => { :milestones="milestones" :enableConnectionCreation="enableConnectionCreation" :enableConnectionDeletion="enableConnectionDeletion" + :utc="utc" @click-bar="handleEvent($event, 'Bar Click')" @drag-bar="handleEvent($event, 'Bar Drag')" @sort="handleEvent($event, 'Sort Change')" diff --git a/docs/.vitepress/theme/index.ts b/docs/.vitepress/theme/index.ts index a467c23..8e65d95 100644 --- a/docs/.vitepress/theme/index.ts +++ b/docs/.vitepress/theme/index.ts @@ -8,6 +8,7 @@ import isSameOrAfter from "dayjs/plugin/isSameOrAfter.js" import isBetween from "dayjs/plugin/isBetween.js" import weekOfYear from "dayjs/plugin/weekOfYear" import dayOfYear from "dayjs/plugin/dayOfYear.js" +import utc from "dayjs/plugin/utc" export function extendDayjs() { @@ -17,6 +18,7 @@ export function extendDayjs() { dayjs.extend(weekOfYear) dayjs.extend(isoWeek) dayjs.extend(dayOfYear) + dayjs.extend(utc) } const GanttDemo = defineClientComponent(() => { diff --git a/docs/components/g-gantt-chart.md b/docs/components/g-gantt-chart.md index 5b0101b..ac15098 100644 --- a/docs/components/g-gantt-chart.md +++ b/docs/components/g-gantt-chart.md @@ -76,6 +76,7 @@ Here's a minimal example of using the GGanttChart component: | defaultProgressResizable | `boolean` | `true` | Enable progress adjustment through dragging | | enableConnectionCreation | `boolean` | `false` | Enable the possibility to draw connections | | enableConnectionDelete | `boolean` | `false` | Enable the possibility to delete connections | +| utc | `boolean` | `false` | Set the current time position based on UTC | ### Events @@ -105,6 +106,7 @@ Here's a minimal example of using the GGanttChart component: | connection-delete | `{ sourceBar: GanttBarObject, targetBar: GanttBarObject, e: MouseEvent }` | Delete a connection | + ### Slots | Slot Name | Props | Description | diff --git a/src/components/GGanttChart.vue b/src/components/GGanttChart.vue index 2c024cc..412792b 100644 --- a/src/components/GGanttChart.vue +++ b/src/components/GGanttChart.vue @@ -124,7 +124,8 @@ const props = withDefaults(defineProps(), { showProgress: true, defaultProgressResizable: true, enableConnectionCreation: false, - enableConnectionDeletion: false + enableConnectionDeletion: false, + utc: false }) // Events diff --git a/src/components/GGanttCurrentTime.vue b/src/components/GGanttCurrentTime.vue index 9d8ac7e..7e95d35 100644 --- a/src/components/GGanttCurrentTime.vue +++ b/src/components/GGanttCurrentTime.vue @@ -1,5 +1,5 @@