Die Sidebar

Die rechte Sidebar steht Ihnen in allen ticketrelevanten Oberflächen zur Verfügung. Sie kann für jeden Kontext, in dem sie sich befindet (Home Dashboard, Ticketdetails, Dialoge etc.) separat konfiguriert werden. Somit kann die Sidebar in jedem Kontext andere Widgets mit jeweils anderen Inhalten enthalten.

Die Konfiguration der Sidebar und der einzelnen Widgets erfolgt im Menü System → SysConfig.

Eine Sidebar besteht aus der Sidebar selbst und den darin enthaltenen Widgets . Jeder Kontext besitzt seine eigene Sidebar und beinhaltet dafür in seinem Konfigurationsschlüssel den Codeblock "sidebars": [...] . In diesem Codeblock kann eine Liste von Widget-Konfigurationen angegeben werden, um damit den in der Sidebar anzuzeigenden Inhalt zu definieren.

Abb.: Die Ticketdetails mit konfigurierter Sidebar

Konfiguration der Sidebar

Die Konfiguration der Sidebar ist wie folgt strukturiert:

Context
- Sidebar
  - Widget-Instanzen
    Es können ein oder mehrere Widgets (Tabellen-Widgets oder Objekt-Info-Widgets) definiert sein.
    Jedes Widget muss eine eigene instanceId besitzen. Diese darf nur einmal im Konfigurationsschlüssel existieren. Anzugeben ist der Name des Konfigurationsschlüssels, welcher die spezifische Konfiguration des jeweiligen Widgets enthält.
    Bei Bedarf können eigene Konfigurationen implementiert werden.
    Jedes Widget kann mit spezifischen Filter-Bedingungen für dessen Anzeige versehen werden. Das Widget wird dann nur angezeigt, wenn diese erfüllt sind (s. auch: Grundlagen der GUI-Konfiguration)

Beispiel:

Konfiguration der Sidebar in den Ticketdetails von KIX Start

{ //Konfiguration des Kontexts Ticket-Details
  "id": "ticket-details",
  "name": "Ticket Details",
  "type": "Context",
  "contextId": "ticket-details",
  "sidebars": [
    { //Instanz des Widgets Kontakt Informationen
      "instanceId": "ticket-details-contact-card-widget",
      "configurationId": "ticket-details-contact-card-widget",
      "configuration":null,
      "permissions": [],
      "size": "large",
      "roleIds": [],
      "conditions": []
    },
    {//Instanz des Widgets Zugeordnete Assets
      "instanceId": "ticket-details-assigned-assets",
      "configurationId": "ticket-details-assigned-assets",
      "permissions": [...],
      "size": "large",
      "roleIds": [],
      "conditions": []
    },
    {//Instanz des Widgets Tickets zu Assets
      "instanceId": "ticket-details-affected-asset-tickets",
      "configurationId": "ticket-details-affected-asset-tickets",
      "configuration": null,
      "permissions": [...],
      "size": "large",
      "roleIds": [],
      "conditions": [...]
    },
    { //Instanz des WidgetsTickets zu Kontakt
      "instanceId": "ticket-details-contact-tickets",
      "configurationId": "ticket-details-contact-tickets",
      "permissions": [],
      "size": "large",
      "roleIds": [],
      "conditions": []
    },
    { //Instanz des Widgets Empfohlene FAQ
      "instanceId": "ticket-details-suggested-faq-widget",
      "configurationId": "ticket-details-suggested-faq-widget",
      "permissions": [...],
      "size": "large",
      "roleIds": [],
      "conditions": []
    }    
  ]

Um eine Sidebar anzupassen, haben Sie folgende Möglichkeiten:

Sie können die Konfiguration der initial in der Sidebar enthaltenen Widgets nachkonfigurieren um individuelle Festlegungen zu treffen, welche Inhalte im Sidebar-Widget angezeigt werden sollen. Beispielsweise, um die erforderlichen Berechtigungen für die Anzeige des Widgets festlegen (Parameter "permissions": [...] ).
Sie können nicht benötigte Widgets entfernen, indem Sie den Codeblock des Widgets aus der Sidebar löschen. Sie können die Instanz des Widgets jederzeit wieder in die Sidebar integrieren.
Sie können die in der Sidebar enthaltenen Widgets um weitere Widgets ergänzen, deren Konfigurationsschlüssel im System bereits existiert. Sie können sich dabei an der bestehenden Sidebar-Konfiguration orientieren.
Sie können eigene, individuelle Widgets in die Sidebar integrieren. Diese müssen jedoch direkt in die Sidebar fest implementiert werden.

Weiterführende Informationen:

SysConfig-Schlüssel der Sidebars

Die zu verwendenden Konfigurationsschlüssel für die Sidebar sind vom Kontext abhängig, in dem die Sidebar eingebunden ist. Ebenso sind die Konfigurationsschlüssel der Sidebar-Widgets vom Kontext der Sidebar abhängig.

Nachfolgend die wichtigsten Konfigurationsschlüssel für die Konfiguration der Sidebars sowie der initial darin enthaltenen Widgets.

Sie können für die Suche nach den Konfigurationsschlüsseln den Stern-Platzhalter (*) verwenden, z. B. *card* für die Suche nach dem object-information-card-widget Kontakt Informationen.

Konfigurationsschlüssel der Sidebars

Kontext der Sidebar	Konfigurationsschlüssel
Ticket Details	ticket-details
Dialog "Neues Ticket"	new-ticket-dialog-context
Dialog "Ticket bearbeiten"	edit-ticket-dialog-context
Dialog "Neuer Artikel"	new-ticket-article-dialog-context

Konfigurationsschlüssel der Widgets in den Sidebars

Widget	Ticket Details	Dialog "Neues Ticket"	Dialog "Ticket bearbeiten"
Kontakt Informationen	ticket-details-contact-card-widget	ticket-new-contact-card-widget	ticket-edit-contact-card-widget
Empfohlene FAQ	ticket-details-suggested-faq-widget	ticket-new-dialog-suggested-faq-widget	ticket-edit-dialog-suggested-faq-widget
Tickets zu Assets	ticket-details-affected-asset-tickets	ticket-new-affected-asset-tickets	ticket-edit-affected-asset-tickets
Tickets zu Kontakt	ticket-details-contact-tickets	ticket-new-contact-tickets	n/a
Offene Kind-Tickets	ticket-details-child-tickets	n/a	n/a
Zeitbuchung	(ohne) Die Konfiguration ist direkt in die Sidebar implementiert (Key: `ticket-details`)	n/a	n/a

Der Sidebar ein Widget hinzufügen

Die nachfolgende Beschreibung bezieht sich auf die Konfiguration der Sidebar der Ticketdetails. Für alle anderen Sidebars können Sie analog verfahren.

Ein initial existierendes Widget in die Sidebar integrieren

Sie können Widgets, die initial in KIX existieren, in die Sidebar integrieren. Dabei kann es sich sowohl um Objekt-Info-Widgets oder auch Tabellen-Widgets handeln. Gehen Sie dazu wie folgt vor:

Navigieren Sie im Explorer des Admin Moduls zu System → GUI Konfiguration → Agentenportal.
Suchen Sie nach dem Widget, welches Sie in die Sidebar integrieren möchten.
Notieren Sie sich die genaue Bezeichnung des Widgets. Sie benötigen den Namen, um darauf zu referenzieren.
Suchen und öffnen Sie den Konfigurationsschlüssel des Kontextes, in dessen Sidebar Sie das Widget integrieren möchten (z. B.: ticket-details oder new-ticket-dialog-context).
Duplizieren Sie eine der unter "sidebars":[] angegebenen Instanzen (ggf. mehrfach).
Ersetzen Sie die Werte von instanceID und configurationID durch die ID des einzufügenden Widgets. Als ID ist der Name des zu integrierenden Widgets anzugeben (s. Punkt 3).
Speichern Sie Ihre Änderungen mit Klick auf Speichern.
Klicken Sie auf Lade Frontend-Konfigurationen neu, um die Ansicht im Frontend zu aktualisieren.

Die Sidebar enthält nun das zusätzliche Widget.

Ein individuelles Widget in die Sidebar integrieren

Sie können eigene, individuell definierte Widgets in die Sidebar integrieren. Diese müssen direkt in der Sidebar fest implementiert werden. Das Generieren eigener SysConfig-Schlüssel gestattet KIX nicht.

Gehen Sie wie folgt vor:

Navigieren Sie im Explorer des Admin Moduls zu System → GUI Konfiguration → Agentenportal.
Suchen und öffnen Sie den Konfigurationsschlüssel ticket-details (Ticket Details).
Alternativ können Sie den Konfigurationsschlüssel eines anderen Kontextes bearbeiten (s. auch: SysConfig-Schlüssel der Sidebars)

Fügen Sie den nachfolgenden Quellcode innerhalb des Abschnitt "sidebars": [...] ein.

Der Quellcode bildet das Grundgerüst für ein Objekt-Info-Widget.

Zum Einbinden eines Tabellen-Widgets können Sie sich an der Beispielkonfiguration im Kapitel Konfiguration Widget "Empfohlene FAQ" orientieren.

Platzieren Sie den Quellcode zwischen 2 bestehende Widgets oder an den Anfang bzw. das Ende des Abschnitts. Sie legen damit fest, an welcher Stelle das Widget in der Sidebar angezeigt wird.

{   //Instanz des eigenen Widgets anlegen
   "instanceId": "ticket-details-my-own-widget",
   //Konfiguration des eigenen Widgets
   "configuration": {
      "id": "ticket-details-my-own-widget",
      "name": "My Own Widget",
      "type": "Widget",
      "widgetId": "object-information-card-widget",
      "title": "Translatable#My Own Widget",
      "actions": [],
      "subConfigurationDefinition": null,
      //Konfiguration des Widget-Inhalts
      "configuration": {
         //Konfiguration des Avatars   
         "avatar": {
            "displayValues": [],
            "KIXObjectType": "OBJECT_ICON",
            "ObjectId": "<KIX_CONTACT_ID>",
            "Object": "CONTACT",
            "ContentType": null,
            "Content": null
         },
         //zeilenweise anzuzeigender Inhalt im Widget
         "rows": [
            //Zeile 1
            {
               "margin": false,
               "values": [
                  {
                     "icon": null,
                     "text": "<KIX_CONTACT_ID>",
                     "linkSrc": null
                  }
               ]
            },
            //Zeile 2
            {
               "margin": true,
               "values": [
                  {
                     "icon": "kix-icon-handshake",
                     "text": "Description:<KIX_CONTACT_Firstname><KIX_CONTACT_Lastname>",
                     "linkSrc": null
                  }
               ]
            }
         ]
      },
      //Verhalten des Widgets und Widget-Titel
      "minimized": false,
      "minimizable": true,
      "icon": "kix-icon-man-house",
      "contextDependent": false
   },
   "permissions": [],
   "size": "large"
},

Abb.: Ein eigenes Objekt-Info-Widget in der Sidebar der Ticket Details

Entfernen Sie die Kommentare im Quellcode (//Kommentartext ) und konfigurieren Sie den Widget-Inhalt. Lesen Sie dazu das Kapitel Ein Object-information-card-widget konfigurieren.
Übersichten zu den Attributen (Konfigurationsparametern) finden Sie hier:
- Attribute des Objekt-Info-Widgets
- Das Tabellen-Widget
Speichern Sie abschließend Ihre Änderungen mit Klick auf Speichern.
Klicken Sie auf Lade Frontend-Konfigurationen neu, um die Ansicht im Frontend zu aktualisieren.

Die Sidebar enthält nun das zusätzliche Widget.

Hinweis

Gegebenenfalls müssen Sie die Übersetzung für den Widget-Titel bzw. für individuelle Elemente im Widget nachpflegen. Hinterlegen Sie dazu im Menü Internationalisierung → Übersetzungen die entsprechenden Pattern.

Abb.: Ein zusätzliches Sidebar-Widget

Das Widget "Ähnliche Tickets" aktivieren

Für den Ticket Edit Context wird das initial deaktivierte Sidebar-Widget Ähnliche Tickets mit KIX ausgeliefert. Das Widget ermöglicht das Ausführen einer Aktion auf mehrere, ähnliche Tickets.

Sie können das Widget aktivieren, wenn Agenten häufig gleiche Aufgaben/Aktionen an mehreren, ähnlichen Tickets erledigen (z.B. bei Wartungen) und diese in einer Sammelaktion nicht ausführen können, z. B. weil keine Möglichkeit des E-Mailversands existiert oder bei Notizen.

Wenn das Widget aktiviert ist, wird es in der Sidebar von Aktionen angezeigt. Darin werden Tickets aufgelistet, die dem aktuell geöffneten Ticket ähnlich sind. Sie können konfigurieren, was KIX als "ähnlich" betrachten soll.

Agenten können im Widget die Tickets auswählen, an denen die Aktion ebenfalls ausgeführt wird. Mit dem Speichern der Aktion werden alle Änderung am aktuellen Ticket auch auf die ausgewählten "ähnlichen" Tickets angewandt.

Ticketaktion "Schließen" mit Sidebar-Widget "Ähnliche Widgets"

Abb.: Ticketaktion "Schließen" mit Sidebar-Widget Auf ähnliche Tickets anwenden

Das Widget aktivieren

Das Sidebar-Widget Auf ähnliche Tickets anwenden wird initial deaktiviert ausgeliefert. Zum Aktivieren gehen Sie wie folgt vor:

Navigieren Sie im Explorer des Admin Moduls zu System → GUI Konfiguration → Agentenportal.
Suchen und öffnen Sie den Konfigurationsschlüssel edit-ticket-dialog-context (Ticket Edit Dialog).
Setzen Sie in der Instanz similar-ticket-widget den Parameter valid auf true.
Klicken Sie abschließend auf Speichern.
Klicken Sie auf Lade Frontend-Konfigurationen neu, um die Ansicht im Frontend zu aktualisieren.

Das Widget Auf Ähnliche Tickets anwenden ist nun aktiviert und steht in der Sidebar von Aktionen zur Verfügung. Dies betrifft alle im System angelegten Aktionen.

Ähnlichkeit definieren

Sie können konfigurieren, was KIX als "ähnlich" betrachten soll. Sie legen damit fest, welche Tickets im Widget "Ähnliche Tickets" angezeigt werden. Diese Festlegung treffen Sie in den Filtern des Widgets.

Navigieren Sie im Explorer des Admin Moduls zu System → GUI Konfiguration → Agentenportal.
Suchen und öffnen Sie den Konfigurationsschlüssel edit-ticket-dialog-context (Ticket Edit Dialog).
Navigieren Sie innerhalb der Konfiguration der Instanz similar-ticket-widget zum Abschnitt loadingOptions{...}.

Passen Sie die Filter an Ihren Bedarf an. Die Filter definieren, was als "ähnlich" betrachtet wird. Entspricht ein Ticket den hier definierten Bedingungen, wird es im Widget aufgelistet.

Zum Beispiel könnten Sie das Quellticket ausblenden, aber alle Tickets des gleichen Bearbeiters anzeigen:

"filter": [
    {
      "property": "TicketID",
      "operator": "NE",
      "type": "NUMERIC",
      "filterType": "AND",
      "value": "<KIX_TICKET_TicketID>"
    },
    {
      "property": "OwnerID",
      "operator": "EQ",
      "type": "NUMERIC",
      "filterType": "AND",
      "value": "<KIX_TICKET_OwnerID>"
    }
  ]

Klicken Sie abschließend auf Speichern.
Klicken Sie auf Lade Frontend-Konfigurationen neu, um die Ansicht im Frontend zu aktualisieren.

Im Widget Auf Ähnliche Tickets anwenden werden nun nur noch die Tickets aufgeführt, die den definierten Filtern entsprechen.

Die Tabelle des Widgets konfigurieren

Das Widget Auf ähnliche Tickets anwenden ist ein Tabellen-Widget. Sie können festlegen, welche Tabellenspalten im Widget angezeigt werden. Sie können die Anzahl der Tabellenspalten reduzieren oder weitere Spalten ergänzen, um den Agenten zusätzliche Ticketinformationen bereitzustellen.

Navigieren Sie im Explorer des Admin Moduls zu System → GUI Konfiguration → Agentenportal.
Suchen und öffnen Sie den Konfigurationsschlüssel edit-ticket-dialog-context (Ticket Edit Dialog).
Navigieren Sie innerhalb der Konfiguration der Instanz similar-ticket-widget zum Abschnitt tableColumns{...}.
Im Codeabschnitt tableColumns{..} werden die Tabellenspalten definiert. Jede Spalte beginnt und endet mit einer geschweiften Klammer: {...}. Innerhalb dieser Klammern werden die Attribute der Tabellenspalte einschließlich ihrer Werte angegeben.
Alternativ Spalten entfernen: Löschen Sie die Konfigurationsblöcke der nicht benötigten Tabellenspalten.

Alternativ Spalten hinzufügen: Duplizieren Sie eine der Tabellenspalten und konfigurieren Sie diese nach Bedarf. Sie können sich an nachfolgenden Codeblock orientieren.

Achten Sie bei Dynamischen Feldern auf die feldspezifische Verwendung der Parameter property und componentID (s. auch: Feldspezifische Konfigurationsparameter).

Hinweise zu den Parametern der Tabellenspalten finden Sie unter: TableColumns Configuration.

{
  "id": null,
  "name": null,
  "type": null,
  "property": "DynamicFields.MyOwnDynamicField",
  "showText": true,
  "showIcon": false,
  "showColumnTitle": true,
  "showColumnIcon": false,
  "size": 50,
  "sortable": true,
  "filterable": true,
  "hasListFilter": true,
  "dataType": "STRING",
  "resizable": true,
  "componentId": "label-list-cell-content",
  "defaultText": null,
  "translatable": true,
  "titleTranslatable": true,
  "useObjectServiceForFilter": false,
  "valid": true,
  "rtl": false,
  "application": "agent-portal",
  "roleIds": []
}

Klicken Sie abschließend auf Speichern.
Klicken Sie auf Lade Frontend-Konfigurationen neu, um die Ansicht im Frontend zu aktualisieren.

Die Tabellenspalten sind nun konfiguriert. Im Widget werden die Spalten gemäß der Konfiguration angezeigt.

Der Sidebar ein Widget hinzufügen

Die nachfolgende Beschreibung bezieht sich auf die Konfiguration der Sidebar der Ticketdetails. Für alle anderen Sidebars können Sie analog verfahren.

Ein initial existierendes Widget in die Sidebar integrieren

Sie können Widgets, die initial in KIX existieren, in die Sidebar integrieren. Dabei kann es sich sowohl um Objekt-Info-Widgets oder auch Tabellen-Widgets handeln. Gehen Sie dazu wie folgt vor:

Navigieren Sie im Explorer des Admin Moduls zu System → GUI Konfiguration → Agentenportal.
Suchen Sie nach dem Widget, welches Sie in die Sidebar integrieren möchten.
Notieren Sie sich die genaue Bezeichnung des Widgets. Sie benötigen den Namen, um darauf zu referenzieren.
Suchen und öffnen Sie den Konfigurationsschlüssel des Kontextes, in dessen Sidebar Sie das Widget integrieren möchten (z. B.: ticket-details oder new-ticket-dialog-context).
Duplizieren Sie eine der unter "sidebars":[] angegebenen Instanzen (ggf. mehrfach).
Ersetzen Sie die Werte von instanceID und configurationID durch die ID des einzufügenden Widgets. Als ID ist der Name des zu integrierenden Widgets anzugeben (s. Punkt 3).
Speichern Sie Ihre Änderungen mit Klick auf Speichern.
Klicken Sie auf Lade Frontend-Konfigurationen neu, um die Ansicht im Frontend zu aktualisieren.

Die Sidebar enthält nun das zusätzliche Widget.

Ein individuelles Widget in die Sidebar integrieren

Gehen Sie wie folgt vor:

Navigieren Sie im Explorer des Admin Moduls zu System → GUI Konfiguration → Agentenportal.
Suchen und öffnen Sie den Konfigurationsschlüssel ticket-details (Ticket Details).
Alternativ können Sie den Konfigurationsschlüssel eines anderen Kontextes bearbeiten (s. auch: SysConfig-Schlüssel der Sidebars)

Fügen Sie den nachfolgenden Quellcode innerhalb des Abschnitt "sidebars": [...] ein.

Der Quellcode bildet das Grundgerüst für ein Objekt-Info-Widget.

Zum Einbinden eines Tabellen-Widgets können Sie sich an der Beispielkonfiguration im Kapitel Konfiguration Widget "Empfohlene FAQ" orientieren.

Platzieren Sie den Quellcode zwischen 2 bestehende Widgets oder an den Anfang bzw. das Ende des Abschnitts. Sie legen damit fest, an welcher Stelle das Widget in der Sidebar angezeigt wird.

{   //Instanz des eigenen Widgets anlegen
   "instanceId": "ticket-details-my-own-widget",
   //Konfiguration des eigenen Widgets
   "configuration": {
      "id": "ticket-details-my-own-widget",
      "name": "My Own Widget",
      "type": "Widget",
      "widgetId": "object-information-card-widget",
      "title": "Translatable#My Own Widget",
      "actions": [],
      "subConfigurationDefinition": null,
      //Konfiguration des Widget-Inhalts
      "configuration": {
         //Konfiguration des Avatars   
         "avatar": {
            "displayValues": [],
            "KIXObjectType": "OBJECT_ICON",
            "ObjectId": "<KIX_CONTACT_ID>",
            "Object": "CONTACT",
            "ContentType": null,
            "Content": null
         },
         //zeilenweise anzuzeigender Inhalt im Widget
         "rows": [
            //Zeile 1
            {
               "margin": false,
               "values": [
                  {
                     "icon": null,
                     "text": "<KIX_CONTACT_ID>",
                     "linkSrc": null
                  }
               ]
            },
            //Zeile 2
            {
               "margin": true,
               "values": [
                  {
                     "icon": "kix-icon-handshake",
                     "text": "Description:<KIX_CONTACT_Firstname><KIX_CONTACT_Lastname>",
                     "linkSrc": null
                  }
               ]
            }
         ]
      },
      //Verhalten des Widgets und Widget-Titel
      "minimized": false,
      "minimizable": true,
      "icon": "kix-icon-man-house",
      "contextDependent": false
   },
   "permissions": [],
   "size": "large"
},

Abb.: Ein eigenes Objekt-Info-Widget in der Sidebar der Ticket Details

Entfernen Sie die Kommentare im Quellcode (//Kommentartext ) und konfigurieren Sie den Widget-Inhalt. Lesen Sie dazu das Kapitel Ein Object-information-card-widget konfigurieren.
Übersichten zu den Attributen (Konfigurationsparametern) finden Sie hier:
- Attribute des Objekt-Info-Widgets
- Das Tabellen-Widget
Speichern Sie abschließend Ihre Änderungen mit Klick auf Speichern.
Klicken Sie auf Lade Frontend-Konfigurationen neu, um die Ansicht im Frontend zu aktualisieren.

Die Sidebar enthält nun das zusätzliche Widget.

Hinweis

Abb.: Ein zusätzliches Sidebar-Widget

In diesem Abschnitt:

Die Sidebar

Konfiguration der Sidebar

SysConfig-Schlüssel der Sidebars

Konfigurationsschlüssel der Sidebars

Konfigurationsschlüssel der Widgets in den Sidebars

Der Sidebar ein Widget hinzufügen

Ein initial existierendes Widget in die Sidebar integrieren

Ein individuelles Widget in die Sidebar integrieren

Das Widget "Ähnliche Tickets" aktivieren

Das Widget aktivieren

Ähnlichkeit definieren

Die Tabelle des Widgets konfigurieren

Der Sidebar ein Widget hinzufügen

Ein initial existierendes Widget in die Sidebar integrieren

Ein individuelles Widget in die Sidebar integrieren

Suchresultat