Skip to main content

schedule

PRO

The functionality is available in PRO Edition only

Description​

Optional. Enables automatic task scheduling based on their dependencies and applies task constraints

With :schedule="{ auto: true }", the Gantt automatically adjusts dependent tasks according to the links between them, ensuring that successor tasks always satisfy their predecessors. All four link types are taken into account.

This is forward-only scheduling mode: changes propagate from a task to its successors, and predecessors are never moved.

Usage​

schedule?: {
  auto?: boolean;
  resourceCalendars?: boolean;
};

Parameters​

  • auto - (optional) if true, enables automatic scheduling and applies task constraints; if false, disables automatic scheduling
  • resourceCalendars - (optional) if true, calendars of assigned resources affect task dates. false by default. For details, see Schedule tasks by resource calendars

When automatic scheduling is enabled:

  • Dependencies of all link types are enforced at all times
  • On initial load, all successor tasks are shifted forward to satisfy their dependencies
  • When a task start, end, or duration changes, all successors are automatically recalculated and moved if needed
  • A task moved by a user is placed as close to the new dates as its links allow: a task moved earlier than its predecessors allow returns to the earliest allowed date. If the task's own constraint breaks a link, the link is reported as a conflict
  • The schedule-tasks action fires whenever cascading updates occur
  • Links of any type support the lag property (a minimum delay, 0 by default)
  • Invalid links are automatically removed on load and during editing
  • If projectStart is defined, tasks that start earlier are moved forward to the project start date.

Example​

<script setup>
  import { Gantt } from "@svar/vue-gantt";
  import { getData } from "../data";

  const data = getData("basic");
</script>

<template>
  <Gantt
    :tasks="data.tasks"
    :links="data.links"
    :schedule="{ auto: true }"
  />
</template>

Related articles: