Agregar un botón de acción personalizado en la interfaz de usuario Crear correspondencia add-custom-action-button-in-create-correspondence-ui

Vaya a https://'[server]:[port]'/[ContextPath]/crx/de e inicie sesión como administrador.

En la carpeta de aplicaciones, cree una carpeta denominada defaultApp con una ruta/estructura similar a la carpeta defaultApp (en la carpeta config). Para crear la carpeta, siga estos pasos:

1. Haga clic con el botón derecho en la carpeta defaultApp en la siguiente ruta y seleccione Nodo de superposición:

   /libs/fd/cm/config/defaultApp/

   

2. Asegúrese de que el cuadro de diálogo Nodo de superposición tenga los siguientes valores:

   Ruta: /libs/fd/cm/config/defaultApp/

   Ubicación de superposición: /apps/

   Coincidir tipos de nodo: Comprobado

   

3. Haga clic en Aceptar.

4. Haga clic en Guardar todo.

Haga una copia del archivo acmExtensionsConfig.xml (existe en la rama /libs) en la rama /apps.

1. Vaya a “/libs/fd/cm/config/defaultApp/acmExtensionsConfig.xml”

2. Haga clic con el botón derecho en el archivo acmExtensionsConfig.xml y seleccione Copiar.

   

3. Haga clic con el botón derecho en la carpeta defaultApp en “/apps/fd/cm/config/defaultApp/” y seleccione Pegar.

4. Haga clic en Guardar todo.

Haga doble clic en la copia de acmExtentionsConfig.xml que acaba de crear en la carpeta de aplicaciones. El archivo se abre para editarlo.

Busque el siguiente código:

<?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>

Para enviar una carta por correo electrónico, puede utilizar el flujo de trabajo de Forms de LiveCycle. Agregue una etiqueta customAction bajo la etiqueta modelExtension en acmExtensionsConfig.xml como se indica a continuación:

 <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>

La etiqueta modelExtension tiene un conjunto de etiquetas secundarias customAction que configuran la acción, los permisos y el aspecto del botón de acción. A continuación se muestra la lista de etiquetas de configuración customAction:

Aparte de los parámetros anteriores, puede haber configuraciones adicionales asociadas con customAction. Estas configuraciones adicionales están disponibles para el controlador a través del objeto CustomAction.

Haga clic en Guardar todo.

Haga clic con el botón derecho en la carpeta locale en la siguiente ruta y seleccione Nodo de superposición:

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

Asegúrese de que el cuadro de diálogo Nodo de superposición tenga los siguientes valores:

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

Ubicación de superposición: /apps/

Coincidir tipos de nodo: Comprobado

Haga clic en Aceptar.

Haga clic en Guardar todo.

Haga clic con el botón derecho en el siguiente archivo y seleccione Copiar:

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

Haga clic con el botón derecho en la carpeta locale en la siguiente ruta y seleccione Pegar:

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

El archivo ACMExtensionsMessages.properties se copia en la carpeta locale.

Para localizar las etiquetas del botón/acción personalizados agregados recientemente, cree el archivo ACMExtensionsMessages.properties para el “locale” relevante en /apps/fd/cm/config/defaultApp/locale/.

Por ejemplo, para localizar la acción/botón personalizado creado en este artículo, cree un archivo llamado ACMExtensionsMessages_fr.properties con la siguiente entrada:

loc.letterInstance.letterreview.label=Revue De Lettre

Del mismo modo, puede agregar más propiedades, como información sobre herramientas y estilo, en este archivo.

Haga clic en Guardar todo.

Vaya a https://[host]:'port'/system/console/bundles. Si es necesario, inicie sesión como administrador.

Busque el paquete de bloque de creación del Compositor de recursos de Adobe. Reinicie el paquete: haga clic en Detener y, a continuación, en Iniciar.

Vaya a https://'[server]:[port]'/[ContextPath]/crx/de. Si es necesario, inicie sesión como administrador.

En la carpeta de aplicaciones, cree una carpeta denominada js en la rama /apps de CRX con una estructura similar a la siguiente carpeta:

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

Para crear la carpeta, siga estos pasos:

1. Haga clic con el botón derecho en la carpeta js en la siguiente ruta y seleccione Nodo de superposición:

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

2. Asegúrese de que el cuadro de diálogo Nodo de superposición tenga los siguientes valores:

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

   Ubicación de superposición: /apps/

   Coincidir tipos de nodo: Comprobado

3. Haga clic en Aceptar.

4. Haga clic en Guardar todo.

En la carpeta js, cree un archivo llamado ccustomization.js con el código para administrar acciones del botón al seguir los siguientes pasos:

1. Haga clic con el botón derecho en la carpeta js en la siguiente ruta y seleccione Crear > Crear archivo:

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

   Asigne un nombre al archivo como ccustomization.js.

2. Haga doble clic en el archivo ccustomization.js para abrirlo en CRX.

3. En el archivo, pegue el siguiente código y haga clic en Guardar todo:

   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>';

Vaya a https://'[server]:[port]'/system/console/configMgr e inicie sesión como administrador.

Busque la configuración del SDK del cliente de Adobe LiveCycle y haga clic en Editar (icono de edición). Se abre el panel Configuraciones.

Escriba los siguientes detalles y haga clic en Guardar:

• URL del servidor: URL del servidor LC cuyo servicio Enviar para revisión utiliza el código del controlador de acciones.
• Nombre de usuario: nombre de usuario de administrador del servidor LC
• Contraseña: contraseña del nombre de usuario del administrador

Inicie sesión como administrador en LiveCycle® Server adminui en https:/[lc server]/:[lc port]/adminui.

Navegue hasta Inicio > Servicios > Aplicaciones y servicios > Administración de aplicaciones.

Si la aplicación SendLetterForReview ya está presente, omita los pasos restantes de este procedimiento; de lo contrario, continúe con los siguientes pasos.

Haga clic en Importar.

Haga clic en Elegir archivo y seleccione SendLetterForReview.lca.

Haga clic en Vista previa.

Seleccione Implementar recursos en tiempo de ejecución cuando se complete la importación.

Haga clic en Importar.

Inicie sesión como administrador para https:/[host]:'port'/system/console/configMgr.

Busque y haga clic en Configuración del SDK de cliente de Adobe LiveCycle. Aparecerá el panel Configuración del SDK del cliente de Adobe LiveCycle.

En la lista Nombre del servicio, haga clic en el icono + y agregue un serviceName SendLetterForReview/SendLetterForReviewProcess.

Haga clic en Guardar.

Inicie sesión con credenciales de administrador en el servidor de LiveCycle en https:/[lc server]:[lc port]/adminui.

Navegue hasta Inicio > Servicios > Aplicaciones y servicios > Administración de servicios.

Busque y haga clic en EmailService.

En Host SMTP, configure el servicio de correo electrónico.

Haga clic en Guardar.

Actualice la URL del servidor de Experience Manager en cmsa.properties en DSCSample.jar, que se encuentra en la siguiente ubicación:

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

Proporcione los siguientes parámetros en el archivo de configuración:

• crx.serverUrl=https:/host:port/[context path]/[AEM URL]
• crx.username= nombre de usuario de Experience Manager
• crx.password= contraseña de Experience Manager
• crx.appRoot=/content/apps/cm

El archivo DSCSample.jar utiliza la API renderLetter. Para obtener más información sobre la API renderLetter, consulte Interfaz de LetterRenderService.

Inicie Workbench e inicie sesión.

Seleccione Ventana > Mostrar vistas > Componentes. La vista Componentes se agrega a Workbench ES2.

Haga clic con el botón derecho en Componentes y seleccione Instalar componente.

Seleccione el archivo DSCSample.jar a través del explorador de archivos y haga clic en Abrir.

Haga clic con el botón derecho en RenderWrapper y seleccione Iniciar componente. Si se inicia el componente, aparecerá una flecha verde junto al nombre del componente.

Borre la memoria caché del explorador.

En la interfaz de usuario Crear correspondencia, haga clic en Revisión de carta y especifique el ID de correo electrónico del revisor.

Haga clic en Enviar.