Menü der Dokumentation

Definieren von Schaltflächen

Definieren Sie im Bereich Schaltflächen zusätzliche Schaltflächen. So können Sie Verknüpfungen aus der Oberfläche von d.velop contracts for Microsoft 365 konfigurieren.

Sie können Schaltflächen auf Vertragsebene und Dokumentebene erstellen.

Definieren von übergreifenden Schaltflächen

Definieren von Schaltflächen im 9-Punkte-Menü oder auf dem Dashboard 

Die zusätzlichen Schaltflächen können im 9-Punkte-Menü und/oder auf dem Dashboard angezeigt werden.

So geht's 

  • title: Erstellen Sie die Übersetzungen für alle Sprachen, die von der Applikation unterstützt werden, und zwar für die Überschrift, die oberhalb der Schaltflächen auf dem Dashboard angezeigt wird.

  • showInDashboard: Wenn aktiviert, werden die zusätzlichen Schaltflächen auf dem Dashboard in der rechten Spalte unterhalb der Suchvorlagen angezeigt. 

  • showInMenu: Wenn aktiviert, werden die zusätzlichen Schaltflächen im 9-Punkte-Menü nach dem vom System vorgegebenen Schaltflächen angezeigt.

  • buttons: Definieren Sie hier die gewünschten Schaltflächen.

Es gibt zwei Arten von Schaltflächen:

  1. LinkButton: Diese Schaltfläche öffnet bei Klick eine neue Registerkarte mit dem spezifizierten Link.

  2. GroupButton: Diese Schaltfläche klappt ein weiteres Menü aus. In diesem Menü können sich weitere Schaltflächen von beiden Typen befinden.

LinkButton 

  • link 

  • icon: Name des Fluent UI-Icons, das angezeigt werden soll. Die Liste der verfügbaren Icons finden Sie unter https://react.fluentui.dev/?path=/docs/icons-catalog--page.

  • text: Anzeigetext der Schaltfläche - entweder einfach ein Text oder ein Objekt, in dem sprachspezifische Übersetzungen mitgegeben werden können.

  • showInPanel (optionaler Parameter): true/false. Wenn der Parameter auf true gesetzt wird, dann wird die URL in einem Seitenpanel geöffnet.

  • panelSize (optionaler Parameter): Breite des Panels in Pixel.

GroupButton 

  • icon: Name des Fluent UI-Icons, das angezeigt werden soll.

  • text: Anzeigetext der Schaltfläche - entweder einfach ein Text oder ein Objekt, in dem sprachspezifische Übersetzungen mitgegeben werden können.

  • subMenuButtons: Ein Array von LinkButtons oder GroupButtons.

Beispielkonfiguration 

{
    "title": {
        "de": "Prozesse",
        "en": "Processes"
    },
    "showInDashboard": true,
    "showInMenu": true,
    "buttons": [
        {
            "link": "https://tenant.sharepoint.com/sites/testsite/testweb",
            "icon": "PanelRightExpandRegular",
            "text": {
                "de": "Zeige Test",
                "en": "Show Test"
            },
            "showInPanel": true,
            "panelSize": 1024
        },
        {
            "icon": "MoreHorizontalRegular",
            "text": "More",
            "subMenuButtons": [
                {
                    "link": "https://tenant.sharepoint.com/sites/testsite/testweb2",
                    "icon": "LinkRegular",
                    "text": {
                        "de": "Springe zum Test 2",
                        "en": "Jump to Test 2"
                    }
                },
                {
                    "link": "https://tenant.sharepoint.com/sites/testsite/testweb3",
                    "icon": "MailLinkRegular",
                    "text": {
                        "de": "Springe zum Test 3",
                        "en": "Jump to Test 3"
                    }
                }
            ]
        }
    ]
}
Definieren von Schaltflächen auf Vertragsebene

Die zusätzlichen Schaltflächen werden innerhalb der Befehlsleiste auf der Vertragsansichtsseite angezeigt.

Es gibt zwei Arten von Schaltflächen:

  1. LinkButton: Diese Schaltfläche öffnet bei Klick eine neue Registerkarte mit dem spezifizierten Link.

  2. GroupButton: Diese Schaltfläche klappt ein weiteres Menü aus. In diesem Menü können sich weitere Schaltflächen von beiden Typen befinden.

LinkButton 

  • link 

    • ${list.id}: ID der Liste.

    • ${list.url}: Serverrelative Listen-URL.

    • ${item.id}: ID des ListItems.

    • ${item.internalFieldName}: internalFieldName bestimmt das Feld, das aus dem Listitem übernommen werden soll.

  • icon: Name des Fluent UI-Icons, das angezeigt werden soll. Die Liste der verfügbaren Icons finden Sie unter https://react.fluentui.dev/?path=/docs/icons-catalog--page.

  • text: Anzeigetext der Schaltfläche - entweder einfach ein Text oder ein Objekt, in dem sprachspezifische Übersetzungen mitgegeben werden können.

  • showButtonIf (Optional): Ohne showButtonIf-Objekt wird die Schaltfläche immer in der Vertragsansicht angezeigt.

    • conditions: Die Bedingungen, unter denen die Regel angewendet wird, können wie folgt konfiguriert werden:

      • all: Alle Bedingungen in dieser Liste müssen erfüllt werden.

      • any: Irgendeine dieser Bedingungen muss erfüllt werden.

        In den all- oder any-Listen können weitere Bedingungen mit all oder any geschrieben werden. Eine Bedingung kann mit folgenden Optionen angegeben werden:

        • fact: Eine Eigenschaft aus dem Vertrag.

        • path (Optional): Kann benutzt werden, wenn der fact ein Objekt ist und man auf eine Eigenschaft zugreifen möchte (siehe Beispielkonfiguration).

        • operator:

          • Für Text:

            • equal 

            • notEqual 

            • startsWith 

          • Für Zahlen:

            • greaterThan 

            • lessThan 

            • greaterThanInclusive 

            • lessThanInclusive 

          • Für Arrays:

            • in: fact muss in der Liste value enthalten sein.

            • notIn: fact darf nicht in der Liste value enthalten sein.

            • contains: Die Liste fact muss value enthalten.

            • doesNotContain: Die Liste fact darf nicht value enthalten.

  • showInPanel (optionaler Parameter): true/false. Wenn der Parameter auf true gesetzt wird, dann wird die URL in einem Seitenpanel geöffnet.

  • panelSize (optionaler Parameter): Breite des Panels in Pixel.

GroupButton 

  • icon: Name des Fluent UI-Icons, das angezeigt werden soll.

  • text: Anzeigetext der Schaltfläche - entweder einfach ein Text oder ein Objekt, in dem sprachspezifische Übersetzungen mitgegeben werden können.

  • subMenuButtons: Ein Array von LinkButtons oder GroupButtons.

  • showButtonIf: Gleiche Konfiguration wie bei LinkButton.

Beispielkonfiguration 

[
    {
        "link": "https://tenant.sharepoint.com/sites/testsite/testweb/${item.Title}",
        "icon": "Shield",
        "text": {
            "de": "Springe zum Test",
            "en": "Jump to Test"
        },
                "showInPanel": true,
                "panelSize": 1024,
        "showButtonIf": {
            "conditions": {
                "all": [
                    {
                        "fact": "Title",
                        "path": "title",
                        "operator": "equal",
                        "value": "Test"
                    }
                ]
            }
        }
    },
    {
        "link": "https://tenant.sharepoint.com/sites/testsite/testweb/${item.Title}",
        "icon": "Shield",
        "text": {
            "de": "Test2",
            "en": "Test2"
        },
        "showButtonIf": {
            "conditions": {
                "all": [
                    {
                        "fact": "ecsContractType",
                        "path": "$.contentType",
                        "operator": "equal",
                        "value": "IT-Vertrag"
                    }
                ]
            }
        }
    },
    {
        "icon": "More",
        "text": "More",
        "subMenuButtons": [ ],
        "showButtonIf":{}
    }
]
Definieren von Schaltflächen auf Dokumentebene

Die zusätzlichen Schaltflächen werden innerhalb des Dreipunktemenüs auf Dokumentebene angezeigt.

Es gibt zwei Arten von Schaltflächen:

  1. LinkButton: Diese Schaltfläche öffnet bei Klick eine neue Registerkarte mit dem spezifizierten Link.

  2. GroupButton: Diese Schaltfläche klappt ein weiteres Menü aus. In diesem Menü können sich weitere Schaltflächen von beiden Typen befinden.

LinkButton 

  • link 

    • ${list.id}: ID der Liste.

    • ${list.url}: Serverrelative Listen-URL.

    • ${item.id}: ID des ListItems.

    • ${item.internalFieldName}: internalFieldName bestimmt das Feld, das aus dem Listitem übernommen werden soll.

    • ${doc.internalFieldName}: internalFieldName bestimmt das Feld, das aus dem Dokument übernommen werden soll.

  • icon: Name des Fluent UI-Icons, das angezeigt werden soll. Die Liste der verfügbaren Icons finden Sie unter https://react.fluentui.dev/?path=/docs/icons-catalog--page.

  • text: Anzeigetext der Schaltfläche - entweder einfach ein Text oder ein Objekt, in dem sprachspezifische Übersetzungen mitgegeben werden können.

  • showButtonIf (Optional): Ohne showButtonIf-Objekt wird die Schaltfläche immer in der Vertragsansicht angezeigt.

    • conditions: Die Bedingungen, unter denen die Regel angewendet wird, können wie folgt konfiguriert werden:

      • all: Alle Bedingungen in dieser Liste müssen erfüllt werden.

      • any: Irgendeine dieser Bedingungen muss erfüllt werden.

        In den all- oder any-Listen können weitere Bedingungen mit all oder any geschrieben werden. Eine Bedingung kann mit folgenden Optionen angegeben werden:

        • fact: Eine Eigenschaft aus dem Vertrag oder einem Dokument. Wenn eine Eigenschaft aus einem Dokument verwendet werden soll, muss “fact” : "doc" sein. Anschließend kann über  "path": "$internalFieldName" auf die Eigenschaft zugegriffen werden.

        • path (Optional): Kann benutzt werden, wenn der fact ein Objekt ist und man auf eine Eigenschaft zugreifen möchte (siehe Beispielkonfiguration).

        • operator:

          • Für Text:

            • equal 

            • notEqual 

            • startsWith 

          • Für Zahlen:

            • greaterThan 

            • lessThan 

            • greaterThanInclusive 

            • lessThanInclusive 

          • Für Arrays:

            • in: fact muss in der Liste value enthalten sein.

            • notIn: fact darf nicht in der Liste value enthalten sein.

            • contains: Die Liste fact muss value enthalten.

            • doesNotContain: Die Liste fact darf nicht value enthalten.

  • showInPanel (optionaler Parameter): true/false. Wenn der Parameter auf true gesetzt wird, dann wird die URL in einem Seitenpanel geöffnet.

  • panelSize (optionaler Parameter): Breite des Panels in Pixel.

GroupButton 

  • icon: Name des Fluent UI-Icons, das angezeigt werden soll.

  • text: Anzeigetext der Schaltfläche - entweder einfach ein Text oder ein Objekt, in dem sprachspezifische Übersetzungen mitgegeben werden können.

  • subMenuButtons: Ein Array von LinkButtons oder GroupButtons.

  • showButtonIf: Gleiche Konfiguration wie bei LinkButton.

Beispielkonfiguration 

[
    {
        "link": "https://tenant.sharepoint.com/sites/testsite/testweb/${item.Title}",
        "icon": "Shield",
        "text": {
            "de": "Springe zu Test",
            "en": "Jump to Test"
        },
        "showInPanel": true,
        "panelSize": 1024,
        "showButtonIf": {
            "conditions": {
                "all": [
                    {
                        "fact": "Title",
                        "path": "Title",
                        "operator": "equal",
                        "value": "Test"
                    },
                    {
                        "fact": "doc",
                        "path": "$.fileType",
                        "operator": "startsWith",
                        "value": "docx"
                    }
                ]
            }
        }
    },
    {
        "icon": "More",
        "text": "Mehr",
        "subMenuButtons": [
            {
                "text": {
                    "de": "Test"
                    "en": "Test"
                },
                "link": "test.de",
                "showInPanel": true
            },
            {
                "text": "Test2",
                "subMenuButtons": [
                    {
                        "text": {
                            "de": "d.velop"
                        },
                        "link": "https://d-velop.de"
                    }
                ]
            }
        ]
    }
]