Was ist ein Ressourcenplaner?

Ein Ressourcenplaner beantwortet eine einzige Frage: Welche Ressource macht was, und wann ist sie frei? Ressourcen sind Zeilen, die Zeit verläuft horizontal, und jede Arbeit ist ein Balken in der Zeile der Ressource, die sie erledigt. Die Hotelrezeption sieht Zimmer und Aufenthalte, die Werkstatt Hebebühnen und Reparaturaufträge, die Disposition Techniker und Einsätze.

Diese Seite erklärt, worin sich dieses Layout von einem Kalender unterscheidet, wann Ihr Produkt es braucht, was SuperScheduler übernimmt und was in Ihrer Anwendung bleibt und wie sich die beiden Editionen unterscheiden. Zum Schluss folgt das Vokabular, das der Rest der Dokumentation verwendet.

#Der Unterschied zum Terminkalender

Beide zeigen Ereignisse auf einer Zeitachse, sind aber für unterschiedliche Fragen gebaut.

Ein Kalender ist um die Person organisiert, die ihn liest. Ein Ressourcenplaner ist um die Dinge organisiert, deren Kapazität begrenzt ist. Sobald Nutzer viele davon gleichzeitig vergleichen und Arbeit von einer zur anderen verschieben müssen, stößt das Kalenderlayout an seine Grenzen: Eine Wochenansicht für 80 Zimmer sind 80 Kalender.

#Wann Sie einen brauchen

Sie brauchen einen Ressourcenplaner, wenn mehrere dieser Punkte zutreffen:

• Kapazität ist das Problem. Zimmer, Betten, Hebebühnen, Teams, Studios, Maschinen, Fahrzeuge, Liegeplätze oder Messgeräte können jeweils nur eine Sache gleichzeitig erledigen oder eine begrenzte Anzahl.
• Arbeit wandert zwischen Ressourcen. Eine Buchung geht von Zimmer 101 in Zimmer 102, eine Reparatur wechselt auf eine Bühne mit Hebevorrichtung, ein Einsatz wird einem anderen Techniker zugewiesen.
• Viele Ressourcen werden gleichzeitig verglichen. Dutzende bis Tausende Zeilen, oft nach Standort, Etage, Team oder Typ gruppiert.
• Die Dauern sind sehr unterschiedlich. 15-Minuten-Slots und mehrwöchige Einsätze stehen in denselben Daten, daher muss die Ansicht von Minuten bis Monaten reichen.
• Regeln entscheiden, was wohin darf. Ein Aufenthalt kann nicht in die Vergangenheit verschoben werden, ein Auftrag braucht einen zertifizierten Techniker, zwei Operationen können sich keinen Saal teilen.

Ein einfacher Kalender genügt, wenn eine Person einen Terminplan verwaltet, wenn es vor allem um Einladungen und wiederkehrende Besprechungen geht oder wenn niemand Ressourcen vergleicht. Dann fügt ein Ressourcenplaner eine Dimension hinzu, die niemand nutzt.

Zimmerplanung im HotelIn Zimmer 104 tropft die Dusche. Buchen Sie den nächsten Gast um, sperren Sie das Zimmer für den Installateur und finden Sie die ausgebuchten Nächte. Termine in der PhysiotherapiepraxisEin Patient kann um 10 Uhr nicht. Finden Sie den nächsten Slot, der Pausen und Reinigung respektiert.

#Was die Bibliothek übernimmt und was Ihre Anwendung

SuperScheduler ist eine Komponente der Benutzeroberfläche. Sie rendert, misst und reagiert auf Interaktionen; Ihre Daten und Ihre Geschäftslogik gehören ihr nicht.

#Lite und Pro

SuperScheduler gibt es in zwei Editionen mit demselben Komponentennamen und denselben Konventionen für Datumsangaben und Daten.

• Lite ist das öffentliche npm-Paket super-scheduler-lite: eine schreibgeschützte Tageszeitleiste. Siehe Schnellstart mit Lite.
• Pro ist das Paket super-scheduler, installiert aus einem privaten, versionierten Tarball. Siehe SuperScheduler Pro installieren.

Keine der beiden Editionen begrenzt die Anzahl der Ressourcen oder Ereignisse. Lite wirft einen Fehler, wenn es eine Option erhält, die es nicht implementiert; eine Pro-Konfiguration funktioniert in Lite also nie stillschweigend nur halb. Pro behält eine kleine Gruppe reservierter APIs, die aus Kompatibilitätsgründen typisiert, aber nicht implementiert sind (zum Beispiel Textbearbeitung direkt im Ereignis, interaktives Anlegen von Verknüpfungen und Export als Bild oder Tabelle); sie warnen in der Entwicklung einmal, und die API-Referenz kennzeichnet sie.

Kommerzielle Fragen zu Pro beantwortet die Seite Preise.

#Die Daten auf einen Blick

Alles, was der Planer zeichnet, stammt aus zwei Arrays: Ressourcen und Ereignisse. Ein Ereignis verweist über die ID auf seine Ressource.

import type { SuperScheduler } from 'super-scheduler'

// Rows: anything that can only do one thing at a time, or has a limited capacity.
export const resources: SuperScheduler.ResourceData[] = [
  { id: 'room-101', name: 'Room 101' },
  { id: 'room-102', name: 'Room 102' },
  { id: 'van-3', name: 'Van 3' },
]

// Bars: one interval on one row. `end` is exclusive, so the stay below ends at 11:00 on
// 5 October and a booking that starts at 11:00 that day does not overlap it.
export const events: SuperScheduler.EventData[] = [
  {
    id: 'booking-1042',
    resource: 'room-101',
    start: '2026-10-02T14:00:00',
    end: '2026-10-05T11:00:00',
    text: 'Booking 1042',
  },
  {
    id: 'route-7',
    resource: 'van-3',
    start: '2026-10-03T08:00:00',
    end: '2026-10-03T12:30:00',
    text: 'Delivery route 7',
  },
]

Auf einer Tagesachse gerendert, sähen Sie drei Zeilen und zwei Balken: einen vom 2. bis zum 5. Oktober auf Room 101 und einen am 3. Oktober auf Van 3. Der Leitfaden zum Datenmodell behandelt IDs, Intervalle und eigene Felder im Detail.

#Glossar

Diese Begriffe haben in der gesamten Dokumentation und in der API dieselbe Bedeutung.

#Ressource

Eine Zeile des Planers: alles, was über die Zeit Arbeit leisten kann. In der API ist das ResourceData, mit einer id und einem name. In Pro können Ressourcen children haben (ein Baum), oben oder unten fixiert oder in Unterzeilen geteilt sein. Manche APIs sprechen von row: Eine Zeile ist die gerenderte Ressource.

#Ereignis

Ein Balken in einer Ressourcenzeile: eine Buchung, eine Schicht, ein Auftrag, eine Reservierung. In der API ist das EventData, mit id, text, start, end und der resource, zu der es gehört. In Callbacks erhalten Sie meist einen Wrapper (SuperScheduler.Event), dessen Eigenschaft data Ihr Objekt ist.

#Intervall

Die Spanne eines Ereignisses, von start bis end. Intervalle sind halboffen, [start, end): Der Anfang gehört zum Ereignis, das Ende nicht. Ein Ereignis, das um 11:00 Uhr endet, und ein anderes, das um 11:00 Uhr beginnt, überlappen sich nicht.

#Zelle

Ein Schritt des Zeitrasters in einer Zeile: je nach Skala ein Tag, eine Stunde oder ein 15-Minuten-Slot. Auf Zellen klicken Sie, um Zeit auszuwählen, an ihnen richtet sich das Einrasten aus, und Sie können sie mit onBeforeCellRender (Pro) sperren oder gestalten.

#Skala

Die Größe einer Zelle: Day in Lite; in Pro außerdem Hour, Minute, Week, Month, Year oder CellDuration mit einer eigenen Anzahl von Minuten. Die Skala ist unabhängig davon, wie die Köpfe beschriftet sind. Siehe Stunden, Minuten, Tage und Zoom.

#Zoomstufe

Ein benannter Satz von Optionen der Zeitachse (Skala, Zelldauer, Zellbreite, Köpfe), die Pro gemeinsam anwendet. Gesten und control.zoom wechseln zwischen Zoomstufen oder zoomen stufenlos zwischen ihnen.

#Control

Die Instanz des Planers, SuperScheduler.Scheduler. Die React-Komponente erzeugt sie beim Mounten und gibt sie beim Unmounten frei. Über ihre Methoden scrollen, wählen, aktualisieren oder zoomen Sie; Handler erhalten sie als args.control. Siehe React-Integration.

#Nächste Schritte

• Die schreibgeschützte Edition in wenigen Minuten ausprobieren: Schnellstart mit Lite.
• Pro installieren und eine bearbeitbare Planung bauen: SuperScheduler Pro installieren.
• Das Datenmodell kennenlernen, bevor Sie ein Backend anbinden: Ressourcen, Ereignisse und Intervalle.
• Funktionierende Planungstafeln für zwölf Branchen finden Sie in den Beispielen.