Mostra/Nascondi 'Crea DitaMAP' dal menu di scelta rapida delle cartelle nell'editor Web
In questo articolo verrà illustrato come personalizzare l'Editor Web Guide per nascondere o visualizzare l'opzione "Crea DitaMap" nel menu di scelta rapida delle cartelle in base alle autorizzazioni di utenti/gruppi.
In questo caso d’uso questa opzione verrà nascosta per tutti gli utenti non autori.
Prerequisiti
Sfrutteremo il pacchetto dell’estensione AEM Guides che consente di personalizzare l’interfaccia utente dell’app in base alle tue esigenze.
Consulta questa documentazione per ulteriori informazioni sul funzionamento di Guides Extension Framework.
Ora iniziamo e scopri come personalizzare il menu di scelta rapida delle cartelle per nascondere questa opzione per tutti gli utenti non autori.
Come puoi vedere dallo snippet qui sotto, l’opzione "create DitaMap" (crea DitaMap) è visibile per un utente che crea.
Vediamo ora come è possibile nascondere questa opzione utilizzando Guides Extension Framework.
Passaggi di implementazione
L’implementazione è suddivisa nelle seguenti parti:
-
Modifiche nel controller Folder_options
A ogni menu di scelta rapida è associato un ID controller. Questo controller gestisce la funzionalità on-event per le varie opzioni del menu di scelta rapida.
In questo esempio personalizzeremo il menu di scelta rapida delle cartelle per nascondere l’opzione "Crea DitaMap" per i non autori. A questo scopo, verranno apportate modifiche al file folder_options.ts presente in /src nell’archivio del framework di estensione delle guide.
Stiamo utilizzando "viewState" come "REPLACE" per nascondere questa opzione dal menu di scelta rapida.
Stiamo chiamando un nuovo widget in questa cartella_options tramite la chiave 'id'.
const folderOptions = {
id: "folder_options",
contextMenuWidget: "repository_panel",
view: {
items: [
{
component: "widget",
id: "customditamap",
target: {
key: "displayName",
value: "DITA Map",
viewState: VIEW_STATE.REPLACE,
},
},
],
},
};
-
Creazione di un nuovo widget per gestire la logica
È necessaria una nuova creazione di widget (customoptions.ts) per scrivere la logica e nascondere questa opzione solo per gli utenti non autori. Per ottenere questo risultato, abbiamo utilizzato il tasto "show", che funge da interruttore nella struttura JSON.
Puoi scrivere un servlet esterno per controllare i dettagli del gruppo. In questo modo è possibile personalizzare anche le opzioni di menu delle cartelle per il gruppo personalizzato.
In questo esempio, abbiamo sfruttato la chiamata "rolesapi" dell’AEM OOTB per recuperare i dettagli utente e impostare la risposta in "isAuthor", come mostrato nei frammenti precedenti.
const folderOptions = {
id: "customditamap",
view: {
component: "button",
quiet: true,
icon: "breakdownAdd",
label: "DITA Map",
"on-click": "createNewDitaMap",
show: "@extraProps.isAuthor",
},
};
Attraverso questo, siamo in grado di nascondere il pulsante con l'etichetta "Dita Map" in base al valore di "show".
È stato aggiunto un controller per impostare l’attributo "isAuthor" nel modello. Questa operazione può essere eseguita utilizzando la seguente sintassi nel controller.
this.model.extraProps.set("key", value);
Qui la chiave è "isAuthor" e il valore è la risposta della chiamata rolesapi.
Abbiamo anche definito l’evento "createNewDitaMap" per abilitare l’opzione create DitaMap (per gli utenti autori).
controller: {
init: function () {
this.model.extraProps.set("isAuthor", false);
rolesApiResponse.then((result) => {
console.log(result);
this.model.extraProps.set(
"isAuthor",
result["/content/dam"].roles.authors
);
console.log("testresult" + result["/content/dam"].roles.authors);
});
},
createNewDitaMap() {
repositoryController && repositoryController.next("create_new.map");
},
},
-
Aggiunta del codice personalizzato
Importare i file folder_options.ts e customoptions.ts nel file index.ts in /src.
Test
- Accedi all’AEM con un utente che non fa parte del gruppo authors. L'opzione Crea DitaMap è nascosta nel menu di scelta rapida di qualsiasi cartella, come illustrato di seguito.
Questo caso d’uso è stato aggiunto a GIT. Di seguito trovi le relative risorse.
Risorse correlate
-
Archivio base framework estensioni - GIT
-
Documentazione - sull'Experience League
-
Casi d'uso comuni documentati - sull'Experience League
-
Archivio pubblico con esempi - su GIT. Consulta la filiale sc-expert-session