Plattform der nächsten Generation

Von der Anwendung bereitgestellte Navigationsleiste ändern

Derzeit enthält die Navigationsleiste in der Anwendung globale Such-und Alertmenüoptionen. Sie können die Navigationsleiste nach Bedarf für Ihr Unternehmen erweitern und die angepassten globalen Such-oder Alertmenüoptionen anzeigen. Alternativ können Sie die Optionen des globalen Menüs oder des Alertmenüs in der Navigationsleiste ausblenden oder eine Menüoption hinzufügen.

Die Navigationsleiste unterstützt sowohl Erweiterungen für Überschreibung als auch differenzielle Erweiterungen. Abhängig von Ihrem Geschäftsanwendungsfall können Sie jede dieser Methoden auswählen.

Beim Erweiterbarkeitsansatz für Überschreibung können Sie Eigner des Quellcodes der Navigationsleiste sein. Verwenden Sie die Erweiterbarkeitsüberschreibungsmethode als Erweiterungspunkt für Plug-in-Funktionen, die nicht mit der differenziellen Erweiterbarkeitsmethode auf der Homepage oder in der Navigationsleiste erreicht werden können. Weitere Informationen finden Sie unter Anpassen der Navigationsleiste durch die Erweiterbarkeit von Überschreibungen.

Menüoptionen mit differenziellen Erweiterungen erweitern

Derzeit enthält die Navigationsleiste Optionen des Menüs für globale Suche und Alerts, die im entsprechenden Verzeichnis <store-temp>/<packages>/libs/functional-components/src/lib vorhanden sind.
  • Die Navigationskomponente für Alerts wird in der Navigationsleiste angezeigt, in der die eingehenden Alerts angezeigt werden. Diese Komponente befindet sich im Verzeichnis <store-temp>/packages/libs/functional-components/src/lib/alert und wird ein-oder ausgeblendet, wenn Sie auf das Glockensymbol klicken.
  • Die Navigationskomponente für die globale Suche wird in der Navigationsleiste angezeigt. Sie können eine globale Suche ausführen, um eine Bestellung schnell zu öffnen. Diese Komponente ist im Verzeichnis <store-temp>/packages/libs/functional-components/src/lib/global-search vorhanden und wird ein-oder ausgeblendet, wenn Sie auf das Suchsymbol klicken.
Die folgenden Anpassungsanwendungsfälle werden für die Navigationsleiste unterstützt:
  • Sie können die von der Anwendung bereitgestellten globalen Such-und Alertmenüoptionen durch angepasste Komponenten ersetzen.
  • Sie können die von der Anwendung bereitgestellten globalen Such-und Alertmenüoptionen ausblenden.
  • Sie können eine Menüoption hinzufügen. Weitere Informationen finden Sie unter Hinzufügen eines Menüpunkts.

Verwenden Sie die Datei <store-temp>/extensions/features/override-component/src/assets/override-component/config/isf-navbar-extn-config.json , um die von der Anwendung bereitgestellten Menüoptionen der angepassten Komponente zuzuordnen. Stellen Sie in der JSON-Datei sicher, dass Sie die eindeutigen IDs der von der Anwendung bereitgestellten Komponenten den überschriebenen Komponenten zuordnen.

In der folgenden Tabelle wird die Schemadefinition der Datei isf-navbar-extn-config.json beschrieben:
Tabelle 1. Attribute und Beschreibungen der Schemadefinition
Attributname Beschreibung
menuTID Gibt die eindeutige Kennung für die Menüoption an, die in der Navigationsleiste angezeigt wird.

Gültige Werte sind navBarMenuWidget_1 und navBarMenuWidget_2.

componentName Gibt den Komponentennamen an, der in die Navigationsleiste geladen wird. Beispiel: AlertsExtnComponent oder GlobalSearchExtnComponent.
Anzeige Gibt an, ob die Menüoption in der Navigationsleiste ein-oder ausgeblendet werden muss

Gültige Werte sind "true" oder "false". Der Standardwert ist "true".

Wenn Sie eine von der Anwendung bereitgestellte Navigationskomponente überschreiben, aktualisieren Sie <store-temp>/extensions/features/override-component/src/assets/override-component/config/isf-navbar-extn-config.json mit den in der Tabelle beschriebenen Attributen.

Die folgende Beispieldatei isf-navbar-extn-config.json veranschaulicht, wie das Menü für globale Suche ausgeblendet und die von der Anwendung bereitgestellte Alertmenüoption durch die angepasste Komponente AlertsExtensionComponent ersetzt wird.

[
    {
        "menuTID": "navBarMenuWidget_1",
        "display": false
    },
    {
        "menuTID": "navBarMenuWidget_2",
        "componentName": "AlertsExtensionComponent"
    }
   
]

Vorgehensweise

  1. Erstellen Sie eine angepasste Komponente.
    Wechseln Sie in das Verzeichnis <store-temp>/extensions/features/override-component/src/app/components und führen Sie den folgenden Befehl aus:
    ng g c <componentName> --prefix=isf
  2. Fügen Sie die statische Zeichenfolgevariable overrideComponent mit dem Wert als Komponentenklassennamen wie dargestellt hinzu.
    ....
    public static overrideComponent = 'AlertsExtensionComponent';
    ....
  3. Aktualisieren Sie den Klassennamen der angepassten Komponente.

    Wechseln Sie in das Verzeichnis <store-temp>/extensions/features/override-component/src/app . Öffnen Sie die Datei app.module.ts und aktualisieren Sie den Klassennamen der angepassten Komponente im Objekt customComponentDeclarations .

  4. Aktualisieren Sie die Datei <store-temp>/extensions/features/override-component/src/assets/override-component/config/isf-navbar-extn-config.json mit den entsprechenden Details. Wenn Sie beispielsweise die von der Anwendung bereitgestellte Alertkomponente durch die angepasste AlertsExtensionComponentersetzen möchten, gehen Sie wie folgt vor:
    [
        {
            "menuTID": "navBarMenuWidget_2",
            "componentName": "AlertsExtensionComponent"
        }
    
    ]
  5. Überprüfen Sie, ob Ihre Änderungen in der Navigationsleiste angezeigt werden.
    Um die von der erweiterten Anwendung bereitgestellte Navigationsleiste lokal zu überprüfen, starten Sie die Anwendung mit dem folgenden Befehl:
    yarn start-app

Nächste Schritte

Extrahieren und implementieren Sie die Anpassungen, um die Änderungen im Developer Toolkit zu überprüfen. Weitere Informationen zum Extrahieren und Bereitstellen von Anpassungen finden Sie unter Extrahieren von Anpassungen.