추적 테이블 사용자 지정

AEM Forms 작업 영역의 추적 탭은 로그인한 사용자가 관련된 프로세스 인스턴스의 세부 정보를 표시하는 데 사용됩니다. 추적 테이블을 보려면 왼쪽 창에서 프로세스 이름을 선택하여 가운데 창의 인스턴스 목록을 확인합니다. 오른쪽 창에서 이 인스턴스에서 생성된 작업 테이블을 보려면 프로세스 인스턴스를 선택합니다. 기본적으로 테이블 열에는 다음과 같은 작업 속성이 표시됩니다(작업 모델의 해당 속성은 괄호 안에 지정됨).

  • ID ( taskId)
  • 이름 ( stepName)
  • 지침 ( instructions)
  • 선택된 동작 ( selectedRoute)
  • 생성 시간( createTime)
  • 완료 시간( completeTime)
  • 소유자 ( currentAssignment.queueOwner)

작업 테이블에 표시할 수 있는 작업 모델의 나머지 속성은 다음과 같습니다.

actionInstanceId

isOpenFullScreen

reminderCount

classOfTask

isOwner

routeList

consultGroupId

isRouteSelectionRequired

savedFormCount

contentType

isShowAttachments

serializeImageTicket

createTime

isStartTask

serviceName

creationId

isVisible

serviceTitle

currentAssignment

nextReminder

showACLActions

기한

numForms

showDirectActions

설명

numFormsToBeSaved

상태

displayName

outOfOfficeUserId

summaryUrl

forwardGroupId

outOfOfficeUserName

supportsSave

isApprovalUI

우선 순위

taskACL

isCustomUI

processInstanceId

taskFormType

isDefaultImage

processInstanceStatus

taskUserInfo

isLocked

processVariables

isMustOpenToComplete

readerSubmitOptions

작업 테이블의 다음 사용자 지정을 수행하려면 소스 코드에서 의미 변경을 수행해야 합니다. 작업 공간 SDK를 사용하여 의미 변화를 만들고 변경된 소스에서 축소 패키지를 빌드하는 방법에 대해서는 AEM Forms 작업 영역 사용자 정의 소개을 참조하십시오.

테이블 열 및 해당 순서 변경

  1. 테이블 및 해당 주문에 표시되는 작업 속성을 수정하려면 /ws/js/runtime/templates/processinstancehistory.html 파일을 구성합니다.

    <table>
        <thead>
            <tr>
                <!-- put the column headings in order here, for example-->
                <th><%= $.t('history.fixedTaskTableHeader.taskName')%></th>
                <th><%= $.t('history.fixedTaskTableHeader.taskInstructions')%></th>
                <th><%= $.t('history.fixedTaskTableHeader.taskRoute')%></th>
                <th><%= $.t('history.fixedTaskTableHeader.taskCreateTime')%></th>
                <th><%= $.t('history.fixedTaskTableHeader.taskCompleteTime')%></th>
            </tr>
        </thead>
    </table>
    
    <table>
        <tbody>
            <%_.each(obj, function(task){%>
            <tr>
                <!-- Put the task attributes in the order of headings, for example -->
                <td><%= task.stepName %></td>
                <td><%= task.instructions %></td>
                <td><%= !task.selectedRoute?'':(task.selectedRoute=='null'?'Default':task.selectedRoute) %></td>
                <td><%= task.createTime?task.formattedCreateTime:'' %></td>
                <td><%= task.completeTime? task.formattedCompleteTime:'' %></td>
            </tr>
            <%});%>
        </tbody>
    </table>
    

추적 테이블 정렬

열 머리글을 클릭할 때 작업 목록 테이블을 정렬하려면 다음을 수행합니다.

  1. js/runtime/views/processinstancehistory.js 파일의 .fixedTaskTableHeader th에 대한 클릭 핸들러를 등록합니다.

    events: {
        //other handlers
        "click .fixedTaskTableHeader th": "onTaskTableHeaderClick",
        //other handlers
    }
    

    처리기에서 js/runtime/util/history.jsonTaskTableHeaderClick 함수를 호출합니다.

    onTaskTableHeaderClick: function (event) {
            history.onTaskTableHeaderClick(event);
    }
    
  2. js/runtime/util/history.jsTaskTableHeaderClick 메서드를 노출합니다.

    이 메서드는 click 이벤트에서 작업 속성을 찾고, 해당 속성에 대한 작업 목록을 정렬하고, 정렬된 작업 목록과 함께 작업 테이블을 렌더링합니다.

    비교자 함수를 제공하여 작업 목록 컬렉션의 백본 정렬 기능을 사용하여 정렬이 수행됩니다.

        return {
            //other methods
            onTaskTableHeaderClick  : onTaskTableHeaderClick,
            //other methods
        };
    
    onTaskTableHeaderClick = function (event) {
            var target = $(event.target),
             comparator,
                attribute;
            if(target.hasClass('taskName')){
             attribute = 'stepName';
            } else if(target.hasClass('taskInstructions')){
                attribute = 'instructions'; 
            } else if(target.hasClass('taskRoute')){
                attribute = 'selectedRoute'; 
            } else if(target.hasClass('taskCreateTime')){
                attribute = 'createTime'; 
            } else if(target.hasClass('taskCompleteTime')){
                attribute = 'completeTime'; 
            }
            taskList.comparator = function (task) {
             return task.get(attribute);
            };
            taskList.sort();
            render();
        };
    

이 페이지에서는

Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now