将自定义操作添加到资产列表视图

概述

Correspondence Management解决方案允许您向“管理资产”用户界面添加自定义操作。

您可以为以下项向资产列表视图添加自定义操作：

一个或多个资源类型或字母
在选择单个、多个资源/字母时或不进行选择时执行（动作/命令变为活动状态）

通过向字母的资产列表视图添加“下载平面PDF”命令的方案演示了此自定义。此自定义方案允许用户下载单个选定字母的平面PDF。

前提条件

要完成以下或类似方案，您需要了解：

CRX
JavaScript
Java

方案：向字母列表用户界面添加命令以下载字母的平面PDF版本

以下步骤将“下载简单PDF”命令添加到字母的资产列表视图，并允许用户下载所选字母的简单PDF。通过使用这些步骤和相应的代码和参数，您可以为其他资产添加一些其他功能，如数据字典或文本。

要自定义Correspondence Management以允许用户下载简单的PDF字母，请完成以下步骤：

转到https://[server]:[port]/[ContextPath]/crx/de并以管理员身份登录。
在apps文件夹中，使用以下步骤创建一个名为items的文件夹，其路径/结构与位于选择文件夹中的items文件夹类似：
1. 右键单击以下路径的items文件夹，然后选择叠加节点:
  
  /libs/fd/cm/ma/gui/content/cmassets/jcr:content/body/content/header/items/selection/items
  
  注意
  
  此路径专门用于创建与选择多个资源/字母之一配合的操作。如果要创建不进行选择的操作，您需要为以下路径创建一个叠加节点，然后相应地完成其余步骤：
  
  /libs/fd/cm/ma/gui/content/cmassets/jcr:content/body/content/header/items/default/items
2. 确保“叠加节点”对话框具有以下值：
  
  路径 :/libs/fd/cm/ma/gui/content/cmassets/jcr:content/body/content/header/items/selection/items
  
  位置： /apps/
  
  匹配节点类型：已选 定
3. 单击确定。文件夹结构将在apps文件夹中创建。
  
  单击保存全部。

在新创建的项目文件夹下，为特定资产中的自定义按钮/操作添加一个节点(示例：下载FlatPDF)，步骤如下：

右键单击items文件夹，然后选择创建 > 创建节点。
确保“创建节点”对话框具有以下值，然后单击确定:

名称： downloadFlatPDF（或要给此属性的名称）

类型： nt:unstructured
单击您创建的新节点（此处为downloadFlatPDF）。 CRX显示节点的属性。
将以下属性添加到节点（此处为downloadFlatPDF），然后单击保存全部:

名称	类型	值和说明
class	字符串	foundation-collection-action
foundation-collection-action	字符串	{"目标":"。cq-manageasset-admin-childpages"、"activeSelectionCount":"single","type":"LETTER"} activeSelectionCount可以是单个或多个，以允许选择执行自定义操作的一个或多个资产。 Typecan 为以下项中的一个或多个（逗号分隔多个条目）：字母、文本、列表、条件、自动词
图标	字符串	icon-download Correndence Management在命令/菜单左侧显示的图标。有关可用的不同图标和设置，请参阅CoralUI图标文档。
jcr:primaryType	名称	nt:unstructured
rel	字符串	下载 — flat-pdf-button
sling:resourceType	字符串	granite/ui/components/endor/actionbar/button
文本	字符串	下载平面PDF（或任何其他标签）资产列表界面中显示的命令
页面	字符串	下载所选字母的平面PDF（或任何其他标签/Alt文本）标题是当用户悬停在自定义命令上方时Corresponce Management显示的替代文本。

在apps文件夹中，使用以下步骤创建一个名为js的文件夹，其路径/结构与管理文件夹中的items文件夹类似：
1. 右键单击以下路径的js文件夹，然后选择叠加节点:"
  
  /libs/fd/cm/ma/gui/components/admin/clientlibs/admin/js
2. 确保“叠加节点”对话框具有以下值：
  
  路径 :/libs/fd/cm/ma/gui/components/admin/clientlibs/admin/js
  
  位置： /apps/
  
  匹配节点类型：已选 定
3. 单击确定。文件夹结构将在apps文件夹中创建。单击保存全部。

在js文件夹中，使用以下步骤创建一个名为formaction.js的文件，其中包含用于按钮操作处理的代码：

右键单击以下路径的js文件夹，然后选择创建>创建文件:

/apps/fd/cm/ma/gui/components/admin/clientlibs/admin/js

将文件命名为formaction.js。
多次单击文件以在CRX中打开它。

在formaction.js文件（/apps分支下）中，从位于以下位置的formaction.js文件复制代码：

/libs/fd/cm/ma/gui/components/admin/clientlibs/admin/js/formaction.js

然后，在formaction.js文件（/apps分支下）的末尾附加以下代码，并单击保存全部:

/* Action url for xml file to be added.*/
var ACTION_URL = "/apps/fd/cm/ma/gui/content/commons/actionhandlers/items/letterpdfdownloader.html";

/* File upload handling*/
var fileSelectedHandler = function(e){
    if(e && e.target && e.target.value)
        $(".downloadLetterPDFBtn").removeAttr('disabled');
    else
        $(".downloadLetterPDFBtn").attr('disabled','disabled');
}

/*Handing of Download button in pop up.*/
var downloadClickHandler = function(){
    $('#downloadLetterPDFDilaog').modal("hide");
    var element = $('.foundation-selections-item');
    var path = $(element).data("path");
    $("#fileUploadForm").attr('action', ACTION_URL + "?letterId="+path).submit();
}

/*Click handling on action button.*/
$(document).on("click",'.download-flat-pdf-button',function(e){
    $("#uploadSamepledata").val("");
     if($('#downloadLetterPDFDilaog').length == 0){
        $(document).on("click",".downloadLetterPDFBtn",downloadClickHandler);
        $(document).on("change","#uploadSamepledata",fileSelectedHandler);
        $("body").append(downloadLetterPDFDilaog);
    }
      $('#downloadLetterPDFDilaog').modal("show");
});

/*Download popup.*/
var downloadLetterPDFDilaog = '<div id="downloadLetterPDFDilaog" class="coral-Modal notice " role="dialog"  aria-hidden="true">'+
    '<form id="fileUploadForm" method="POST" enctype="multipart/form-data">'+
        '<div class="coral-Modal-header">'+
            '<h2 class="coral-Modal-title coral-Heading coral-Heading--2" id="modal-header1443020790107-label" tabindex="0">Download Letter as PDF.</h2>'+
            '<button type="button" class="coral-MinimalButton coral-Modal-closeButton" data-dismiss="modal">×</button>'+
        '</div>'+
        '<div class="coral-Modal-body" id="modal-header1443020790107-message" role="document" tabindex="0">'+
            '<div class="coral-Modal-message">'+
                '<p></p>'+
            '</div>'+
            '<div class="coral-Modal-uploader">'+
                '<p>Select sample data for letter.</p>'+
                '<input type="file" id="uploadSamepledata" name="file" accept=".xml" size="70px">'+
            '</div>'+
        '</div>'+
     '</form>'+
        '<div class="coral-Modal-footer">'+
            '<button type="button" class="coral-Button" data-dismiss="modal">Cancel</button>'+
            '<button type="button" class="coral-Button coral-Button--primary downloadLetterPDFBtn" disabled="disabled">Download</button>'+
        '</div>'+
'</div>';

在此步骤中添加的代码将覆盖libs文件夹下的代码，因此将上一个代码复制到/apps分支中的formaction.js文件。将代码从/libs分支复制到/apps分支可确保以前的功能也能正常工作。

上述代码用于对在此过程中创建的命令执行字母特定的操作处理。要对其他资源执行操作处理，请修改JavaScript代码。

在apps文件夹中，使用以下步骤创建一个名为items的文件夹，其路径/结构与actionhandlers文件夹中的items文件夹类似：
1. 右键单击以下路径的items文件夹，然后选择叠加节点:
  
  /libs/fd/cm/ma/gui/content/commons/actionhandlers/items/
2. 确保“叠加节点”对话框具有以下值：
  
  路径 :/libs/fd/cm/ma/gui/content/commons/actionhandlers/items/
  
  位置： /apps/
  
  匹配节点类型：已选 定
3. 单击确定。文件夹结构将在apps文件夹中创建。
4. 单击保存全部。
在新创建的项目节点下，为特定资产中的自定义按钮/操作添加一个节点(示例：letterpdfdownloader)。
1. 右键单击项目文件夹，然后选择创建>创建节点。
2. 确保“创建节点”对话框具有以下值，然后单击确定:
  
  名称： letterpdfdownloader(或要为此属性指定的名称 — 必须唯一。如果在此处使用其他名称，请在formaction.js文件的ACTION_URL变量中指定相同的名称。)
  
  类型： nt:unstructured
3. 单击您创建的新节点（此处为downloadFlatPDF）。 CRX显示节点的属性。
4. 将以下属性添加到节点（此处为letterpdfdownloader），然后单击保存全部:
  
  名称类型值
  
  sling:resourceType 字符串 fd/cm/ma/gui/components/admin/clientlibs/admin

名称	类型	值
sling:resourceType	字符串	fd/cm/ma/gui/components/admin/clientlibs/admin

使用以下位置创建一个名为POST.jsp的文件，其中包含用于命令操作处理的代码：

/apps/fd/cm/ma/gui/components/admin/clientlibs/admin

右键单击以下路径的admin文件夹，然后选择创建>创建文件:

/apps/fd/cm/ma/gui/components/admin/clientlibs/admin

将文件命名为POST.jsp。 (文件名只需为POST.jsp。)
多次 — 单击POST.jsp文件以在CRX中打开它。

将以下代码添加到POST.jsp文件，然后单击保存全部:

此代码特定于字母渲染服务。对于任何其他资源，将该资源的Java库添加到此代码。有关AEM Forms API的详细信息，请参阅AEM Forms API。

有关AEM库的详细信息，请参阅AEM 组件。

/*Import libraries. Here we are downloading letter flat pdf with input xml data so we require letterRender Api. For any other Module functionality we need to first import that library. */            
<%@include file="/libs/foundation/global.jsp?lang=zh-Hans"%>
<!DOCTYPE html lang="en" PUBLIC "-//W3C//DTD XHTML 1.1//EN" "https://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<%@page import="com.adobe.icc.ddg.api.*"%>
<%@page import="com.adobe.icc.dbforms.obj.*"%>
<%@page import="com.adobe.icc.render.obj.*" %>
<%@page import="com.adobe.icc.services.api.*" %>
<%@page import="org.apache.sling.api.resource.*" %>
<%@page import="java.io.File" %>
<%@page import="java.util.*" %>
<%@page import="com.adobe.livecycle.content.appcontext.AppContextManager"%>
<%@page import=" com.adobe.icc.dbforms.exceptions.ICCException"%>
<%@page import="java.io.InputStream" %>
<%@page import="java.io.FileInputStream" %>
<%@page import="org.apache.commons.io.IOUtils" %>
<%@page session="false" contentType="text/html; charset=utf-8"%>
<%@taglib prefix="sling" uri="https://sling.apache.org/taglibs/sling/1.0"%>
<%@taglib prefix="cq" uri="https://www.day.com/taglibs/cq/1.0" %>
 <%@page session="false" contentType="text/html; charset=utf-8"%>
<%
   AppContextManager.setCurrentAppContext("/content/apps/cm");
   /*Get letter id sent in js file.*/
    String letterId = request.getParameter("letterId");
    if(letterId.lastIndexOf("?") != -1)
        letterId = letterId.substring(0, letterId.indexOf("?"));
    String fileName = null;
    String letterName = null;
    InputStream inputStream = null;
    /*Get xml file data*/
    if (slingRequest.getRequestParameter("file") != null)
        inputStream = slingRequest.getRequestParameter("file").getInputStream();
    if(letterId != null){
        String xmlData = null;
        try{
            xmlData = IOUtils.toString(inputStream, "UTF-8");
        }
        catch (Exception e) {
            log.error("Xml data does not exists.");
        }
        /*letter Name from letter letter id.*/
        letterName = letterId.substring(letterId.lastIndexOf("/")+1);
        /*Invoking letter render services API.*/
        LetterRenderService letterRenderService = sling.getService(LetterRenderService.class);
        /*using CM renderLetter api to get pdfbytes.*/
        PDFResponseType  pdfResponseType= letterRenderService.renderLetter(letterId,xmlData,true,false,false,false);
        byte[] bytes = null;
        /*Downloading pdf bytes as pdf.*/
        if(pdfResponseType != null && pdfResponseType.getFile() != null){
            bytes = pdfResponseType.getFile().getDocument();
            /*set the response header to enable download*/
            response.setContentType("application/OCTET-STREAM");
            response.setHeader("Content-Disposition", "attachment;filename=\"" + letterName + ".pdf\"");
            response.setHeader("Pragma", "cache");
            response.setHeader("Cache-Control", "private");
            out.clear();
            response.getOutputStream().write(bytes);
        }
    }
    else{
        log.error("Letter id does not exists.");
    }
%>

使用自定义功能下载字母的平面PDF

在添加自定义功能以下载您的字母的平面PDF后，您可以使用以下步骤下载您选择的字母的平面PDF版本：

转到https://[server]:[port]/[ContextPath]/projects.html并登录。
选择Forms >字母。 Corresponence Management会列表系统中可用的信函。
单击选择，然后单击字母将其选中。
选择更多 > <下载平面PDF>（使用本文说明创建的自定义功能）。将显示“PDF格式下载信函”对话框。

菜单项名称、功能和Alt-text是根据在Scenario:向字母列表用户界面添加命令以下载字母的平面PDF版本。
在“将信函下载为PDF”对话框中，选择要从中填充PDF中数据的相关XML。

注意

在将字母下载为平面PDF之前，可以使用创建报告选项创建包含字母中数据的XML文件。

这封信将作为平面PDF下载到您的计算机。