Vue

The fastest Vue scheduler

Bryntum Vue Scheduler is packed with all the features you need, lightning-fast performance, and easy integration with new or existing applications and any backend technology.

View examples

Download trial

Get started with Bryntum Scheduler for Vue

Quick start

Guide

Tutorial

Feature-rich Vue scheduling library

Bryntum Vue Scheduler supports a range of essential scheduling features to improve efficiency and productivity.

Drag-and-drop resizing
Event editor
Keyboard navigation
Export to PDF, PNG, and Excel
Drag and drop events from an external grid
Render components in events and cells

View all features

Vue Scheduler code example

The following code example shows the setup for a Bryntum Vue Scheduler component in App.vue that uses a CRUD manager to load data.

<script setup>
import '@bryntum/scheduler'
import { BryntumScheduler } from '@bryntum/scheduler-vue-3'
import '@bryntum/scheduler/scheduler.material.css'

const crudManagerConfig = {
    loadUrl: 'data/data.json',
    autoLoad: true
};
</script>

<template>
    <bryntum-scheduler
        :crud-manager="crudManagerConfig"
        :width="800"
        :height="600"
        start-date="2023-04-16"
        end-date="2023-05-15"
    ></bryntum-scheduler>
</template>

<style>

</style>

Excellent scheduling performance

Highly performant and responsive even with large data sets, the Bryntum Vue Scheduler features a combination of performance optimization techniques:

Virtual rendering
Minimal DOM footprint
Extensive element reuse

View big data set demo

Dynamic rendering with Vue template syntax

Render custom columns, headers, and tooltips using Vue components in the Bryntum Vue Scheduler. Easily use Vue HTML-based template syntax in components and keep rendering logic and markup in sync.

View docs

The most versatile task scheduling library for Vue

Effortlessly handle simple to complex scheduling scenarios with Bryntum Vue Scheduler and improve your users’ productivity. Organize tasks in a tree structure, display event dependencies, and more!

Custom tree layout

Event dependencies

Drag from Grid

View Vue examples

Render custom content and style event bars

Change anything on the fly with Bryntum Vue Scheduler. The extensive and reactive Bryntum API makes rendering custom HTML into event bars quick and easy.

View our demo for inspiration on customizing your Bryntum Vue Scheduler with event progress bars, menu icons, and resource avatars.

View demo

Smooth and intuitive experience

The Bryntum Vue Scheduler delivers a smooth and intuitive experience for both developers and users. Easily add animations that users enjoy using with the Bryntum Vue Scheduler component.

View demo