Aggiungere un pulsante di azione personalizzato nell’interfaccia utente per la creazione di corrispondenza add-custom-action-button-in-create-correspondence-ui

Vai a https://'[server]:[port]'/[ContextPath]/crx/de e accedi come amministratore.

Nella cartella delle app, crea una cartella denominata defaultApp con un percorso/struttura simile alla cartella defaultApp (nella cartella di configurazione). Per creare la cartella, effettua le seguenti operazioni:

1. Fare clic con il pulsante destro del mouse sulla cartella defaultApp nel percorso seguente e selezionare Sovrapponi nodo:

   /libs/fd/cm/config/defaultApp/

   

2. Assicurati che la finestra di dialogo Sovrapponi nodo abbia i seguenti valori:

   Percorso: /libs/fd/cm/config/defaultApp/

   Posizione sovrapposizione: /apps/

   Corrispondenza tipi di nodo: selezionata

   

3. Fai clic su OK.

4. Fare clic su Salva tutto.

Crea una copia del file acmExtensionsConfig.xml (presente nel ramo /libs) nel ramo /apps.

1. Vai a "/libs/fd/cm/config/defaultApp/acmExtensionsConfig.xml"

2. Fare clic con il pulsante destro del mouse sul file acmExtensionsConfig.xml e selezionare Copia.

   

3. Fare clic con il pulsante destro del mouse sulla cartella defaultApp in "/apps/fd/cm/config/defaultApp/" e selezionare Incolla.

4. Fare clic su Salva tutto.

Fai doppio clic sulla copia di acmExtentionsConfig.xml appena creata nella cartella delle app. Il file viene aperto per la modifica.

Individua il seguente codice:

<?xml version="1.0" encoding="utf-8"?>
<extensionsConfig>
    <modelExtensions>
        <modelExtension type="LetterInstance">
  <customAction name="Preview" label="loc.letterInstance.preview.label" tooltip="loc.letterInstance.preview.tooltip" styleName="previewButton"/>
            <customAction name="Submit" label="loc.letterInstance.submit.label" tooltip="loc.letterInstance.submit.tooltip" styleName="submitButton" permissionName="forms-users"/>
            <customAction name="SaveAsDraft" label="loc.letterInstance.saveAsDraft.label" tooltip="loc.letterInstance.saveAsDraft.tooltip" styleName="submitButton" permissionName="forms-users"/>
            <customAction name="Close" label="loc.letterInstance.close.label" tooltip="loc.letterInstance.close.tooltip" styleName="closeButton"/>
        </modelExtension>
    </modelExtensions>
</extensionsConfig>

Per inviare una lettera via e-mail puoi utilizzare il Forms Workflow LiveCycle. Aggiungi un tag customAction sotto il tag modelExtension in acmExtensionsConfig.xml come segue:

 <customAction name="Letter Review" label="Letter Review" tooltip="Letter Review" styleName="" permissionName="forms-users" actionHandler="CM.domain.CCRCustomActionHandler">
      <serviceName>Forms Workflow -> SendLetterForReview/SendLetterForReviewProcess</serviceName>
    </customAction>

Il tag modelExtension dispone di un set di tag figlio customAction che configurano l’azione, le autorizzazioni e l’aspetto del pulsante di azione. Di seguito è riportato l’elenco dei tag di configurazione customAction:

A parte i parametri di cui sopra, ci possono essere configurazioni aggiuntive associate a un customAction. Queste configurazioni aggiuntive vengono rese disponibili al gestore tramite l'oggetto CustomAction.

Fare clic su Salva tutto.

Fare clic con il pulsante destro del mouse sulla cartella locale nel percorso seguente e selezionare Sovrapponi nodo:

/libs/fd/cm/config/defaultApp/locale

Assicurati che la finestra di dialogo Sovrapponi nodo abbia i seguenti valori:

Percorso: /libs/fd/cm/config/defaultApp/locale

Posizione sovrapposizione: /apps/

Corrispondenza tipi di nodo: selezionata

Fai clic su OK.

Fare clic su Salva tutto.

Fare clic con il pulsante destro del mouse sul file seguente e selezionare Copia:

/libs/fd/cm/config/defaultApp/locale/ACMExtensionsMessages.properties

Fare clic con il pulsante destro del mouse sulla cartella locale nel percorso seguente e selezionare Incolla:

/apps/fd/cm/config/defaultApp/locale/

Il file ACMExtensionsMessages.properties viene copiato nella cartella locale.

Per localizzare le etichette dell'azione o del pulsante personalizzato appena aggiunto, creare il file ACMExtensionsMessages.properties per le impostazioni locali pertinenti in /apps/fd/cm/config/defaultApp/locale/.

Ad esempio, per localizzare l’azione/pulsante personalizzato creato in questo articolo, crea un file denominato ACMExtensionsMessages_fr.properties con la seguente voce:

loc.letterInstance.letterreview.label=Revue De Lettre

Allo stesso modo, in questo file è possibile aggiungere altre proprietà, ad esempio per la descrizione comando e lo stile.

Fare clic su Salva tutto.

Vai a https://[host]:'port'/system/console/bundles. Se necessario, accedi come amministratore.

Individua il bundle Adobe Asset Composer Building Block. Riavvia il bundle: fai clic su Interrompi, quindi fai clic su Avvia.

Vai a https://'[server]:[port]'/[ContextPath]/crx/de. Se necessario, accedi come amministratore.

Nella cartella delle app, crea una cartella denominata js nel ramo /apps di CRX con una struttura simile a quella della cartella seguente:

/libs/fd/cm/ccr/gui/components/admin/clientlibs/ccrui/js

Per creare la cartella, effettua le seguenti operazioni:

1. Fare clic con il pulsante destro del mouse sulla cartella js nel percorso seguente e selezionare Sovrapponi nodo:

   /libs/fd/cm/ccr/gui/components/admin/clientlibs/ccrui/js

2. Assicurati che la finestra di dialogo Sovrapponi nodo abbia i seguenti valori:

   Percorso: /libs/fd/cm/ccr/gui/components/admin/clientlibs/ccrui/js

   Posizione sovrapposizione: /apps/

   Corrispondenza tipi di nodo: selezionata

3. Fai clic su OK.

4. Fare clic su Salva tutto.

Nella cartella js, crea un file denominato crcustomization.js con il codice per la gestione delle azioni del pulsante, seguendo la procedura riportata di seguito:

1. Fare clic con il pulsante destro del mouse sulla cartella js nel percorso seguente e selezionare Crea > Crea file:

   /apps/fd/cm/ccr/gui/components/admin/clientlibs/ccrui/js

   Denomina il file come customization.js.

2. Fai doppio clic sul file ccrcustomization.js per aprirlo in CRX.

3. Nel file, incolla il seguente codice e fai clic su Salva tutto:

   code language-javascript

   /* for adding and handling custom actions in Extensible Toolbar. * One instance of handler will be created for each action. * CM.domain.CCRCustomActionHandler is actionHandler class. */ var CCRCustomActionHandler; CCRCustomActionHandler = CM.domain.CCRCustomActionHandler = new Class({ className: 'CCRCustomActionHandler', extend: CCRDefaultActionHandler, construct : function(action,model){ } }); /** * Called when user user click an action * @param extraParams additional arguments that may be passed to handler (For future use) */ CCRCustomActionHandler.prototype.handleAction = function(extraParams){ if (this.action.name == CCRCustomActionHandler.SEND_FOR_REVIEW) { var sendForReview = function(){ var serviceName = this.action.actionConfig["serviceName"]; var inputParams = {}; inputParams["dataXML"] = this.model.iccData.data; inputParams["letterId"] = this.letterVO.id; inputParams["letterName"] = this.letterVO.name; inputParams["mailId"] = $('#email').val(); /*function to invoke the LivecyleService */ ServiceDelegate.callJSONService(this,"lc.icc.renderlib.serviceInvoker.json","invokeProcess",[serviceName,inputParams],this.onProcessInvokeComplete,this.onProcessInvokeFail); $('#ccraction').modal("hide"); } if($('#ccraction').length == 0){ /*For first click adding popup & setting letterName.*/ $("body").append(popUp); $("input[id*='letterName']").val(this.letterVO.name); $(document).on('click',"#submitLetter",$.proxy( sendForReview, this )); } $('#ccraction').modal("show"); } }; /** * Should the action be enabled in toolbar * @param extraParams additional arguements that may be passed to handler (For future use) * @return flag indicating whether the action should be enabled */ CCRCustomActionHandler.prototype.actionEnabled = function(extraParams){ /*can be customized as per user requirement*/ return true; }; /** * Should the action be visible in toolbar * @param extraParams additional arguments that may be passed to handler (For future use) * @return flag indicating whether the action should be enabled */ CCRCustomActionHandler.prototype.actionVisible = function(extraParams){ /*Check can be enabled for Non-Preview Mode.*/ return true; }; /*SuccessHandler*/ CCRCustomActionHandler.prototype.onProcessInvokeComplete = function(response) { ErrorHandler.showSuccess("Letter Sent for Review"); }; /*FaultHandler*/ CCRCustomActionHandler.prototype.onProcessInvokeFail = function(event) { ErrorHandler.showError(event.message); }; CCRCustomActionHandler.SEND_FOR_REVIEW = "Letter Review"; /*For PopUp*/ var popUp = '<div class="modal fade" id="ccraction" tabindex="-1" role="dialog" aria-hidden="true">'+ '<div class="modal-dialog modal-sm">'+ '<div class="modal-content">' + '<div class="modal-header">'+ '<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</code></button>'+ '<h4 class="modal-title"> Send Review </h4>'+ '</div>'+ '<div class="modal-body">'+ '<form>'+ '<div class="form-group">'+ '<label class="control-label">Email Id</label>'+ '<input type="text" class="form-control" id="email">'+ '</div>'+ '<div class="form-group">'+ '<label class="control-label">Letter Name</label>'+ '<input id="letterName" type="text" class="form-control" readonly>'+ '</div>'+ '<div class="form-group">'+ '<input id="letterData" type="text" class="form-control hide" readonly>'+ '</div>'+ '</form>'+ '</div>'+ '<div class="modal-footer">'+ '<button type="button" class="btn btn-default" data-dismiss="modal"> Cancel </button>'+ '<button type="button" class="btn btn-primary" id="submitLetter"> Submit </button>'+ '</div>'+ '</div>'+ '</div>'+ '</div>';

Vai a https://'[server]:[port]'/system/console/configMgr e accedi come amministratore.

Individua la configurazione Adobe LiveCycle Client SDK e fai clic su Modifica (icona Modifica). Viene visualizzato il pannello Configurazioni.

Immetti i dettagli seguenti e fai clic su Salva:

• Url server: URL del server LC di cui viene utilizzato il codice del gestore di azioni nel servizio Send For Review.
• Nome utente: nome utente amministratore del server LC
• Password: password del nome utente amministratore

Accedere come amministratore all'interfaccia utente di LiveCycle® Server all'indirizzo https:/[lc server]/:[lc port]/adminui.

Passa a Home > Servizi > Applicazioni e servizi > Gestione applicazioni.

Se l'applicazione SendLetterForReview è già presente, ignorare i passaggi rimanenti di questa procedura, altrimenti continuare con i passaggi successivi.

Fai clic su Importa.

Fare clic su Scegli file e selezionare SendLetterForReview.lca.

Fare clic su Anteprima.

Selezionare Distribuisci risorse in fase di esecuzione al termine dell'importazione.

Fai clic su Importa.

Accedere come amministratore a https:/[host]:'port'/system/console/configMgr.

Individua e fai clic su Adobe configurazione SDK client LiveCycle. Viene visualizzato il pannello Configurazione di Adobe LiveCycle Client SDK.

Nell'elenco Nome servizio fare clic sull'icona + e aggiungere un serviceName SendLetterForReview/SendLetterForReviewProcess.

Fai clic su Salva.

Accedere con le credenziali di amministratore all'interfaccia utente di amministrazione di LiveCycle Server all'indirizzo https:/[lc server]:[lc port]/adminui.

Passa a Home > Servizi > Applicazioni e servizi > Gestione servizi.

Individua e fai clic su EmailService.

In Host SMTP, configurare il servizio e-mail.

Fai clic su Salva.

Aggiorna l’URL del server di Experience Manager in cmsa.properties in DSCSample.jar, che si trova nella seguente posizione:

DSCSample.jar\com\adobe\livecycle\cmsa.properties

Fornisci i seguenti parametri nel file di configurazione:

• crx.serverUrl=https:/host:port/[percorso contestuale]/[URL AEM]
• crx.username= nome utente Experience Manager
• crx.password= password Experience Manager
• crx.appRoot=/content/apps/cm

Il file DSCSample.jar utilizza l’API renderLetter. Per ulteriori informazioni sull'API renderLetter, vedere Interface LetterRenderService.

Avvia Workbench e accedi.

Selezionare Finestra > Mostra visualizzazioni > Componenti. La vista Componenti viene aggiunta a Workbench ES2.

Fare clic con il pulsante destro del mouse su Componenti e selezionare Installa componente.

Seleziona il file DSCSample.jar tramite il browser dei file e fai clic su Apri.

Fare clic con il pulsante destro del mouse su RenderWrapper e selezionare Avvia componente. Se il componente viene avviato, accanto al nome del componente viene visualizzata una freccia verde.

Cancella la cache del browser.

Nell'interfaccia utente per la creazione di corrispondenza, fare clic su Revisione lettera e specificare l'ID e-mail del revisore.

Fai clic su Invia.