자산 목록 보기에 사용자 지정 작업 추가 add-custom-action-to-the-asset-listing-view
개요 overview
서신 관리 솔루션을 사용하여 자산 관리 사용자 인터페이스에 사용자 지정 작업을 추가할 수 있습니다.
다음에 대한 자산 목록 보기에 사용자 지정 작업을 추가할 수 있습니다.
- 하나 이상의 자산 유형 또는 문자
- 단일, 여러 자산/문자 선택 시 또는 선택 없이 실행(작업/명령이 활성 상태가 됨)
이 사용자 지정은 "Download Flat Page" 명령을 Letters for Letters Listing 보기에 추가하는 시나리오와 함께 표시됩니다. 이 사용자 지정 시나리오를 사용하면 사용자가 선택한 단일 편지의 PDF을 다운로드할 수 있습니다.
사전 요구 사항 prerequisites
다음 시나리오 또는 유사한 시나리오를 완료하려면 다음 사항에 대한 지식이 필요합니다.
- CRX
- JavaScript
- Java
시나리오: 편지 목록 사용자 인터페이스에 명령을 추가하여 일반 PDF 버전의 문자를 다운로드합니다 addcommandtoletters
아래 단계는 "플랫 PDF 다운로드" 명령을 Letters for Letters 보기에 추가하고 사용자가 선택한 문자의 플랫 PDF을 다운로드할 수 있도록 합니다. 적절한 코드 및 매개 변수와 함께 이 단계를 사용하여 데이터 사전 또는 텍스트와 같은 다른 자산에 다른 기능을 추가할 수 있습니다.
사용자가 플랫 편지 PDF을 다운로드할 수 있도록 서신 관리를 사용자 지정하려면 다음 단계를 완료하십시오.
-
이동
https://[server]:[port]/[ContextPath]/crx/de
관리자로 로그인합니다. -
apps 폴더에서 다음 단계를 사용하여 선택 폴더에 있는 항목 폴더와 유사한 경로/구조가 있는 항목이라는 폴더를 만듭니다.
-
마우스 오른쪽 단추를 클릭합니다. 항목 다음 경로에 있는 폴더를 선택하고 을 선택합니다. 오버레이 노드:
/libs/fd/cm/ma/gui/content/cmassets/jcr:content/body/content/header/items/selection/items
note note NOTE 이 경로는 하나 이상의 자산/문자 중 하나를 선택하여 작동하는 작업을 만드는 용도로만 사용됩니다. 선택 없이 작동하는 작업을 만들려면 대신 다음 경로에 대한 오버레이 노드를 만들고 그에 따라 나머지 단계를 완료해야 합니다. /libs/fd/cm/ma/gui/content/cmassets/jcr:content/body/content/header/items/default/items
-
오버레이 노드 대화 상자에 다음 값이 있는지 확인합니다.
경로: /libs/fd/cm/ma/gui/content/cmassets/jcr:content/body/content/header/items/selection/items
위치: /apps/
일치 노드 유형: 선택됨
-
확인 을 클릭합니다. 폴더 구조가 apps 폴더에 만들어집니다.
클릭 모두 저장.
-
-
새로 만든 항목 폴더 아래에 특정 자산의 사용자 지정 단추/작업에 대한 노드를 추가합니다(예: downloadFlatPDF)를 참조하십시오.
-
마우스 오른쪽 단추를 클릭합니다. 항목 폴더를 선택하고 만들기 > 노드 만들기.
-
노드 만들기 대화 상자에 다음 값이 있는지 확인하고 를 클릭합니다 확인:
이름: downloadFlatPDF(또는 이 속성에 지정할 이름)
유형: nt:구조화되지 않음
-
만든 새 노드(여기서는 downloadFlatPDF)를 클릭합니다. CRX는 노드의 속성을 표시합니다.
-
노드(여기서는 downloadFlatPDF)에 다음 속성을 추가하고 모두 저장:
table 0-row-3 1-row-3 2-row-3 3-row-3 4-row-3 5-row-3 6-row-3 7-row-3 8-row-3 html-authored no-header 이름 유형 값 및 설명 class 문자열 foundation-collection-action foundation-collection-action 문자열 {"target": ".cq-managesset-admin-childpages", "activeSelectionCount": "single","type": "LETTER"}
activeSelectionCount 단일 또는 여러 개일 수 있으므로 사용자 지정 작업이 수행되는 단일 또는 여러 자산을 선택할 수 있습니다.유형 다음 항목 중 하나 이상(쉼표로 구분된 여러 항목)일 수 있습니다. LETTER,TEXT,LIST,CONDITION,DATADICTIONARY
아이콘 문자열 icon-download
Correspondence Management가 명령/메뉴의 왼쪽에 표시되는 아이콘입니다. 사용 가능한 다양한 아이콘 및 설정에 대해서는 다음을 참조하십시오 CoralUI 아이콘 설명서.jcr:primaryType 이름 nt:unstructured rel 문자열 download-flat-pdf-button sling:resourceType 문자열 granite/ui/components/endor/actionbar/button text 문자열 플랫 PDF(또는 기타 레이블) 다운로드
자산 목록 인터페이스에 표시되는 명령제목 문자열 선택한 문자의 플랫 PDF(또는 기타 레이블/대체 텍스트)를 다운로드합니다
제목은 사용자가 사용자 지정 명령을 마우스로 가리키면 서신 관리에 표시되는 대체 텍스트입니다. -
-
앱 폴더에서 다음 단계를 사용하여 관리자 폴더에 있는 항목 폴더와 유사한 경로/구조로 js라는 폴더를 만듭니다.
-
마우스 오른쪽 단추를 클릭합니다. js 다음 경로에 있는 폴더를 선택하고 을 선택합니다. 오버레이 노드: "
/libs/fd/cm/ma/gui/components/admin/clientlibs/admin/js
-
오버레이 노드 대화 상자에 다음 값이 있는지 확인합니다.
경로: /libs/fd/cm/ma/gui/components/admin/clientlibs/admin/js
위치: /apps/
일치 노드 유형: 선택됨
-
확인 을 클릭합니다. 폴더 구조가 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 파일(https://experienceleague.adobe.com/apps%20%EB%B6%84%EA%B8%B0%20%EC%95%84%EB%9E%98?lang=ko)의 끝에 다음 코드를 추가하고 를 클릭합니다 모두 저장:
code language-none /* 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 폴더에서 다음 단계를 사용하여 actionhandlers 폴더에 있는 항목 폴더와 유사한 경로/구조를 가진 항목이라는 폴더를 만듭니다.
-
마우스 오른쪽 단추를 클릭합니다. 항목 다음 경로에 있는 폴더를 선택하고 을 선택합니다. 오버레이 노드:
/libs/fd/cm/ma/gui/content/commons/actionhandlers/items/
-
오버레이 노드 대화 상자에 다음 값이 있는지 확인합니다.
경로: /libs/fd/cm/ma/gui/content/commons/actionhandlers/items/
위치: /apps/
일치 노드 유형: 선택됨
-
확인 을 클릭합니다. 폴더 구조가 apps 폴더에 만들어집니다.
-
클릭 모두 저장.
-
-
새로 만든 항목 노드 아래에 특정 자산의 사용자 지정 단추/작업에 대한 노드를 추가합니다(예: letterpdfdownloader)를 사용하려면 다음 단계를 수행하십시오.
-
항목 폴더를 마우스 오른쪽 단추로 클릭하고 를 선택합니다. 만들기 > 노드 만들기.
-
노드 만들기 대화 상자에 다음 값이 있는지 확인하고 를 클릭합니다 확인:
이름: letterpdfdownloader(또는 이 속성에 지정할 이름)는 고유해야 합니다. 여기에서 다른 이름을 사용하는 경우 formaction.js 파일의 ACTION_URL 변수에서 동일하게 지정합니다.
유형: nt:구조화되지 않음
-
만든 새 노드(여기서는 downloadFlatPDF)를 클릭합니다. CRX는 노드의 속성을 표시합니다.
-
노드(여기서 letterpdfdownloader)에 다음 속성을 추가하고 을 클릭합니다 모두 저장:
table 0-row-3 1-row-3 이름 유형 값 sling:resourceType 문자열 fd/cm/ma/gui/components/admin/clientlibs/admin
-
-
다음 위치에서 명령의 작업 처리를 위한 코드를 사용하여 POST.jsp라는 파일을 만듭니다.
/apps/fd/cm/ma/gui/components/admin/clientlibs/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 를 참조하십시오 구성 요소.
code language-xml /*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"%> <!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 다운로드 download-flat-pdf-of-a-letter-using-the-custom-functionality
편지의 평면 PDF을 다운로드하는 사용자 정의 기능을 추가한 후에는 다음 단계를 사용하여 선택한 편지의 평면 PDF 버전을 다운로드할 수 있습니다.
-
이동
https://[server]:[port]/[ContextPath]/projects.html
로그인하고 -
선택 Forms > 문자. 서신 관리 는 시스템에서 사용할 수 있는 문자를 나열합니다.
-
클릭 선택 그런 다음 편지를 클릭하여 선택합니다.
-
선택 자세히 > <download flat="" pdf=""> (이 문서의 지침에 따라 만든 사용자 지정 기능). 편지를 PDF으로 다운로드 대화 상자가 나타납니다.
메뉴 항목 이름, 기능 및 대체 텍스트는 시나리오: 편지 목록 사용자 인터페이스에 명령을 추가하여 일반 PDF 버전의 문자를 다운로드합니다.
-
편지를 PDF으로 다운로드 대화 상자에서 PDF의 데이터를 채울 관련 XML을 선택합니다.
note note NOTE 편지를 플랫 PDF으로 다운로드하기 전에 보고서 만들기 선택 사항입니다. 이 편지는 컴퓨터에 플랫 PDF으로 다운로드됩니다.