Zum Inhalt springen

Kalenderpanels in Jitterbit App Builder

Übersicht

Kalender-Panels füllen einen Kalender mit Informationen aus einer Datenquelle, wobei drei erforderliche Steuerelementtypen verwendet werden: Beschreibung, Ereignisstart und Ereignisende. Das Steuerelement Beschreibung bestimmt, was im Kalender angezeigt wird, normalerweise der Name eines Ereignisses. Ereignisstart und Ereignisende bestimmen den Tag, an dem jedes Ereignis beginnt und endet, optional mit Zeitstempeln, die neben der Ereignisbeschreibung angezeigt werden. Wie Diagramm-Panels können Kalender-Panels mit einem anderen Panel verknüpft werden, um mehr Details zu einem Ereignis im Kalender anzuzeigen. Weitere Informationen finden Sie unter Panels mit der vollständigen Liste der Steuerelementtypen für Kalender-Panels.

Standardmäßig wird ein Kalender-Panel basierend auf den Daten seiner Business Rule angezeigt, wobei die Sortierung beachtet wird, die die Regel anwendet. Überprüfen Sie die Business Rule, um deren Sortierung zu bestätigen. Wenn die Business Rule noch keine Daten enthält, zeigt der Kalender stattdessen den aktuellen Monat, Tag oder das aktuelle Jahr an. Sobald Sie Daten hinzufügen, möchten Sie wahrscheinlich auch eine Sortierung zur Business Rule hinzufügen. Siehe Standardmäßig den aktuellen Monat anzeigen unten.

Beispielsweise zeigt der folgende Screenshot ein Kalender-Panel:

ordercalendar.png

Diese Seite behandelt auch die folgenden Aufgaben:

Standardmäßig den aktuellen Monat anzeigen

Um sicherzustellen, dass das Panel den aktuellen Monat, Tag oder das aktuelle Jahr zurückgibt, fügen Sie eine Spalte namens Sort mit logischem Typ Numerisch hinzu und wenden Sie eine aufsteigende Sortierung auf diese Spalte an. Wenn Ihr Business Object, das das Kalenderpanel unterstützt, beispielsweise eine Spalte namens StartDate enthält, die verwendet werden soll, und es sich um eine SQL-Datenquelle handelt, können Sie eine SQL-Escape-Funktion verwenden:

${ABS(DateDiff(day, getdate(), StartDate))}

oder eine App-Builder-Anweisung IIF:

IIF(DateDiff(dd, Now(), StartDate) < 0, (DateDiff(dd, Now(), StartDate))*-1, DateDiff(dd, Now(), StartDate))

Hinweis

Die SQL-Escape-Methode ist effizienter, aber IIF verlässt sich nicht auf SQL-Syntax. Beide erzeugen identische Ergebnisse.

Um andere Monate anzuzeigen, klicken Sie auf die Vor- und Zurück-Chevron-Schaltflächen in der oberen linken Ecke des Panels. Um zwischen Tag, Woche und Monat umzuschalten, klicken Sie auf die entsprechenden Schaltflächen in der oberen rechten Ecke des Panels. Kalender-Panels können nicht direkt bearbeitet werden. Ein separates Panel, das die Steuerelemente des Ereignisses anzeigt, kann jedoch bearbeitet werden.

Ändern Sie das Datum und die Uhrzeit eines Ereignisses

So ändern Sie das Datum und die Uhrzeit eines Ereignisses:

  1. Wählen Sie das Ereignis aus.
  2. Klicken Sie im Panel, das die Informationen des Ereignisses anzeigt, auf das Symbol Bleistift.
  3. Passen Sie das Datum und die Uhrzeit nach Bedarf an, und klicken Sie dann auf das Symbol Häkchen, um zu speichern.

Fügen Sie ein neues Ereignis zum Kalender hinzu

So fügen Sie ein neues Ereignis zum Kalender hinzu:

  1. Wählen Sie ein vorhandenes Ereignis aus und klicken Sie auf die Schaltfläche Erstellen.
  2. Geben Sie einen Titel für das Ereignis ein und wählen Sie dann ein Datum aus dem Dropdown-Menü des Kalenders.
  3. Klicken Sie für Steuerelemente, bei denen Zeit und Datum aktiviert sind, auf das Symbol Zeit, um eine Uhr anzuzeigen.
  4. Klicken Sie auf das Symbol Häkchen, um zu speichern.
  5. Aktualisieren Sie die Seite nach Änderungen am Kalender, um das Update zu bestätigen.

Erstellen Sie einen Kalender mit der Northwinds-Datenbank

In diesem Beispiel wird ein neues Kalender-Panel hinzugefügt, um die Daten visuell darzustellen, in denen Bestellungen in die Northwinds-Beispieldatenbank eingegeben werden.

  1. Erstellen Sie ein Business Object zur Verwendung mit dem Kalenderpanel:

  2. Erstelle eine neue Geschäftsregel.

  3. Gib der Regel einen Namen. Beispiel: Order (Calendar).
  4. Setze das Feld Purpose auf Calendar.
  5. Wähle die Tabelle Order aus.
  6. Klicke Save.
  7. Wähle aus der Tabelle Order die Spalten OrderID und OrderDate aus.
  8. Klicke auf die Registerkarte Where. Füge die Spalte OrderDate zum Feld Left hinzu, wähle IS NOT NULL als Operator und lasse das Feld Right leer.

  9. Füge bei Bedarf eine Spalte, die das Sortieren unterstützt, zur Registerkarte Columns hinzu. Beispiel: DatePart(mm, O.OrderDate).

  10. Erstelle den Kalender:

    1. Gehe zu App Workbench > Pages.
    2. Benenne die Seite Order Calendar und klicke Create.
    3. Wähle das Single-Column-Layout und klicke dann + Add Panel.
    4. Wähle Calendar aus.
    5. Suche die oben erstellte Geschäftsregel und klicke Select.
    6. Klicke Customize Page.
    7. Gib Order Calendar als Name ein, wähle Calendar Panel als Type und Monthly als Sub Type.

    8. Füge zwei Steuerelemente mit den folgenden Einstellungen hinzu:

      Column Name Usage Type
      Control #1: OrderID Order Description
      Control #2: OrderDate Order Date Event Start

    9. Navigiere zur App-Ansicht und bestätige, dass du jetzt den Kalender siehst.

Konfiguriere Kalenderereignisse so, dass sie zu einer anderen Seite verlinken

Um Kalenderereignisse so zu konfigurieren, dass sie zu einer anderen Seite verlinken:

  1. Wähle auf der Kalenderseite in deiner App Action Drawer > Live Designer aus.
  2. Klicke auf die Schaltfläche Controls auf dem Panel Calendar.
  3. Klicke auf das Symbol Open Record für das Steuerelement, das verlinkt werden soll.
  4. Setze in „Update and Linking" die Option Link To Page auf Orders.
  5. Überprüfe, dass die Bindung nach OrderID in den Criteria erfolgt.
  6. Navigiere zur Anwendungsansicht und bestätige die Aktualisierung.

Weitere Informationen darüber, wie sich Link Target und Replace Page In History auf das Verhalten der verlinkten Seite auswirken, findest du unter Configure how linked pages open.

Aktiviere das 24-Stunden-Zeitformat

Seit App Builder 4.60 unterstützen Kalenderpanels ein 24-Stunden-Zeitformat. Standardmäßig werden Ereigniszeiten im 12-Stunden-Format angezeigt. So wechselst du zum 24-Stunden-Format:

  1. Navigiere auf der Kalenderseite in deiner App zu Action Drawer > Live Designer.
  2. Klicke auf die Schaltfläche Controls auf dem Kalenderpanel.
  3. Klicke auf die Registerkarte Edge Case.
  4. Aktiviere unter dem Bereich General die Einstellung Use 24-Hour Clock.
  5. Navigiere zur Anwendungsansicht und bestätige die Aktualisierung.

Verwende das Farbsteuerelement, um die Farbe von Ereignissen zu ändern

Um das Farbsteuerelement zum Ändern der Farbe von Ereignissen zu verwenden:

  1. Füge eine neue Spalte zur Geschäftsregel des Kalenders hinzu. Gib beispielsweise '#000343' im Feld Column or Expression ein und gib Color im Feld Alias ein.
  2. Navigiere zur Kalenderseite deiner App und wähle Action Drawer > Live Designer aus.

  3. Füge ein neues Steuerelement hinzu:

    • Wähle Color für Column aus.
    • Benenne das Steuerelement Color.
    • Wähle Color für Control Type aus.

  4. Navigiere zur Anwendungsansicht und bestätige die Aktualisierung.