自訂追蹤表格 customize-tracking-tables

CAUTION
AEM 6.4已結束延伸支援,本檔案不再更新。 如需詳細資訊,請參閱 技術支援期. 尋找支援的版本 此處.

AEM Forms工作區中的追蹤標籤可用來顯示與登入使用者有關的程式例項詳細資訊。 若要檢視追蹤表格,請先在左側窗格中選取程式名稱,以便在中間窗格中查看其執行個體清單。 在右窗格中選擇一個進程實例以查看該實例生成的任務表。 預設情況下,表列顯示以下任務屬性(任務模型中的相應屬性以括弧表示):

  • ID ( taskId)
  • 名稱 ( stepName)
  • 指示 ( instructions)
  • 選取的動作 ( selectedRoute)
  • 建立時間( createTime)
  • 完成時間( completeTime)
  • 所有者 ( currentAssignment.queueOwner)

任務模型中可用於顯示在任務表中的剩餘屬性為:

actionInstanceId
isOpenFullScreen
menternCount
classOfTask
isOwner
routeList
consultGroupId
isRouteSelectionRequired
savedFormCount
contentType
isShowAttachments
serializedImageTicket
createTime
isStartTask
serviceName
creationId
isVisible
serviceTitle
currentAssignment
nextTimmer
showACLAactions
截止日期
numForms
showDirectActions
說明
numFormsToBeSaved
狀態
displayName
outOfOfficeUserId
summaryUrl
forwardGroupId
outOfOfficeUserName
supportsSave
isApprovalUI
優先順序
taskACL
isCustomUI
processInstanceId
taskFormType
isDefaultImage
processInstanceStatus
taskUserInfo
isLocked
processVariables
isMustOpenToComplete
readerSubmitOptions

對於任務表中的以下自定義項,您需要在原始碼中執行語義更改。 請參閱 自訂AEM Forms工作區簡介 如何使用工作區SDK進行語義變更,並從變更的來源建立縮制套件。

更改表列及其順序 changing-table-columns-and-their-order

  1. 要修改表中顯示的任務屬性及其順序,請配置檔案/ws/js/runtime/templates/processinstancehistory.html :

    code language-as3
    <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>
    
    code language-as3
    <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>
    

排序追蹤表格 sorting-a-tracking-table

要在按一下列標題時對任務清單表進行排序:

  1. 註冊點擊處理程式 .fixedTaskTableHeader th 檔案中 js/runtime/views/processinstancehistory.js.

    code language-as3
    events: {
        //other handlers
        "click .fixedTaskTableHeader th": "onTaskTableHeaderClick",
        //other handlers
    }
    

    在處理常式中,叫用 onTaskTableHeaderClick 函式 js/runtime/util/history.js.

    code language-as3
    onTaskTableHeaderClick: function (event) {
            history.onTaskTableHeaderClick(event);
    }
    
  2. 公開 TaskTableHeaderClick 方法輸入 js/runtime/util/history.js.

    該方法從點擊事件中查找任務屬性,對該屬性上的任務清單進行排序,並使用排序的任務清單呈現任務表。

    通過提供比較器函式,使用任務清單集合上的骨幹分類函式進行分類。

    code language-as3
        return {
            //other methods
            onTaskTableHeaderClick  : onTaskTableHeaderClick,
            //other methods
        };
    
    code language-as3
    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();
        };
    
recommendation-more-help
a6ebf046-2b8b-4543-bd46-42a0d77792da