Estensione della barra delle azioni

Estensioni che includono una barra delle azioni, introdurre un pulsante nell’azione della AEM console Frammenti di contenuto che viene visualizzata quando 1 o più I frammenti di contenuto sono selezionati. Poiché i pulsanti di estensione della barra delle azioni vengono visualizzati solo quando è selezionato almeno un frammento di contenuto, in genere agiscono sui frammenti di contenuto selezionati. Gli esempi includono:

• Richiamo di un processo aziendale o di un flusso di lavoro nei frammenti di contenuto selezionati.
• Aggiornamento o modifica dei dati della selezione dei frammenti di contenuto.

Registrazione delle estensioni

ExtensionRegistration.js è il punto di ingresso dell'estensione AEM e definisce:

1. il tipo di estensione; nel caso di un pulsante della barra delle azioni.
2. Definizione del pulsante di estensione, in getButton() funzione .
3. Il gestore di clic per il pulsante, nella onClick() funzione .

• ./src/aem-cf-console-admin-1/web-src/src/components/ExtensionRegistration.js

function ExtensionRegistration() {
  const init = async () => {
    const guestConnection = await register({
      id: extensionId,
      methods: {
        // Configure your Action Bar button here
        actionBar: {
          getButton() {
            return {
              'id': 'example.my-action-bar-button',     // Unique ID for the button
              'label': 'My action bar button',          // Button label
              'icon': 'Edit'                            // Button icon; get name from: https://spectrum.adobe.com/page/icons/ (Remove spaces, keep uppercase)
            }
          },
          // Click handler for the Action Bar extension button
          onClick(selections) {
            // Action Bar buttons require the selection of at least 1 Content Fragment,
            // so we can assume the extension will do something with these selections

            // Collect the selected content fragment paths from the selections parameter
            const selectionIds = selections.map(selection => selection.id);

            // Do some work with the selected content fragments
            doWork(selectionIds);
        }
      }
    })
  }
  init().catch(console.error)

Finestra modale

AEM le estensioni della barra delle azioni della console Frammenti di contenuto possono richiedere:

• Un ulteriore input dell’utente per eseguire l’azione desiderata.
• La possibilità di fornire all’utente informazioni dettagliate sul risultato dell’azione.

Per supportare questi requisiti, l’estensione AEM della console Frammenti di contenuto consente un modale personalizzato per il rendering come applicazione React.

• ./src/aem-cf-console-admin-1/web-src/src/components/ExtensionRegistration.js

function ExtensionRegistration() {
  ...
  onClick(selections) {
    // Collect the selected content fragment paths
    const contentFragmentPaths = selections.map(selection => selection.id);

    // Create a URL that maps to the React route to be rendered in the modal
    const modalURL = "/index.html#" + generatePath(
      "/content-fragment/:selection/my-extension",
      {
        // Set the :selection React route parameter to an encoded, delimited list of paths of the selected content fragments
        selection: encodeURIComponent(contentFragmentPaths.join('|'))
      }
    );

    // Open the modal and display the React route created above
    guestConnection.host.modal.showUrl({
      title: "My modal title",
      url: modalURL
    })
  } ...
} ...

Nessun modale

A volte, AEM estensioni della console Frammenti di contenuto della barra delle azioni non richiedono ulteriore interazione con l’utente, ad esempio:

• Richiamare un processo back-end che non richiede l’input dell’utente, ad esempio l’importazione o l’esportazione.

In questi casi, l’estensione della console Frammento di contenuto AEM non richiede un modaleed esegui il lavoro direttamente nel pulsante della barra delle azioni onClick handler.

L’estensione AEM console Frammento di contenuto consente di sovrapporre la console Frammento di contenuto AEM durante l’esecuzione del lavoro, impedendo all’utente di eseguire ulteriori azioni. L’utilizzo dell’indicatore di avanzamento è facoltativo, ma utile per comunicare all’utente l’avanzamento del lavoro sincrono.

• ./src/aem-cf-console-admin-1/web-src/src/components/ExtensionRegistration.js

function ExtensionRegistration() {
  guestConnection: { ...
    methods: { ...
      actionBar: { ...
        onClick(selections) {
          // Collect the selected content fragment paths
          const contentFragmentPaths = selections.map(selection => selection.id);

          // Optionally, show the progress indicator overlay on the AEM Content Fragment console
          guestConnection.host.progressCircle.start();
          // Perform work on the selected Content Fragments
          doWork(contentFragmentPaths);
          // Hide the progress indicator overlay on the AEM Content Fragment console when the work is done
          guestConnection.host.progressCircle.stop();
        }
      }
    }
  }
}

Risorse Business.Adobe.com