自定义跟踪表 customize-tracking-tables

AEM Forms工作区中的“跟踪”选项卡用于显示与登录用户有关的进程实例的详细信息。 要查看跟踪表,请先在左窗格中选择进程名称,然后在中间窗格中查看其实例列表。 选择一个进程实例,以在右侧窗格中查看由此实例生成的任务表。 默认情况下,表列显示以下任务属性(任务模型中的相应属性在括号中给出):

  • ID ( taskId)
  • 名称( stepName)
  • 说明( instructions)
  • 选定的操作( selectedRoute)
  • 创建时间( createTime)
  • 完成时间( completeTime)
  • 所有者( currentAssignment.queueOwner)

任务模型中可在任务表中显示的其余属性包括:

actionInstanceId
isOpenFullScreen
提醒计数
classOfTask
isOwner
routeList
consultGroupId
isRouteSelectionRequired
savedFormCount
内容类型
isShowAttachments
serializedImageTicket
createTime
isStartTask
serviceName
creationId
isVisible
服务标题
当前工作
nextReminder
showACLActions
截止日期
numForms
showDirectActions
说明
numformsToBeSaved
状态
显示名称
outOfOfficeUserId
summaryUrl
forwardGroupId
outOfOfficeUserName
supportssave
isApprovalUI
优先级
taskACL
isCustomUI
processInstanceId
任务表单类型
isDefaultImage
processInstanceStatus
taskUserinfo
isLocked
processVariables
isMustOpenToComplete
readerSubmitOptions

对于任务表中的以下自定义,您需要在源代码中进行语义更改。 请参阅 自定义AEM Forms工作区简介 有关如何使用Workspace SDK进行语义更改以及如何从更改的源构建缩小的包。

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

  1. 要修改表中显示的任务属性及其顺序,请配置文件/ws/js/runtime/templates/processinstancehistory.html :

    code language-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>
    
    code language-html
    <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-javascript
    events: {
        //other handlers
        "click .fixedTaskTableHeader th": "onTaskTableHeaderClick",
        //other handlers
    }
    

    在处理程序中,调用 onTaskTableHeaderClick 功能 js/runtime/util/history.js.

    code language-javascript
    onTaskTableHeaderClick: function (event) {
            history.onTaskTableHeaderClick(event);
    }
    
  2. 公开 TaskTableHeaderClick 中的方法 js/runtime/util/history.js.

    该方法从单击事件中查找任务属性,对该属性上的任务列表进行排序,然后使用排序的任务列表呈现任务表。

    通过提供比较器函数,使用任务列表集合上的主干排序函数完成排序。

    code language-javascript
        return {
            //other methods
            onTaskTableHeaderClick  : onTaskTableHeaderClick,
            //other methods
        };
    
    code language-javascript
    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
19ffd973-7af2-44d0-84b5-d547b0dffee2