Personalizar las tablas de seguimiento customize-tracking-tables

CAUTION
AEM 6.4 ha llegado al final de la compatibilidad ampliada y esta documentación ya no se actualiza. Para obtener más información, consulte nuestra períodos de asistencia técnica. Buscar las versiones compatibles here.

La pestaña de seguimiento de AEM Forms Workspace se utiliza para mostrar los detalles de las instancias de proceso en las que participa el usuario que ha iniciado sesión. Para ver las tablas de seguimiento, seleccione primero un nombre del proceso en el panel izquierdo para ver su lista de instancias en el panel central. Seleccione una instancia de proceso para ver una tabla de tareas generada por esta instancia en el panel derecho. De forma predeterminada, las columnas de la tabla muestran los siguientes atributos de tarea (el atributo correspondiente del modelo de tarea se proporciona entre paréntesis):

  • ID ( taskId)
  • Nombre ( stepName)
  • Instrucciones ( instructions)
  • Acción seleccionada ( selectedRoute)
  • Hora de creación ( createTime)
  • Hora de finalización ( completeTime)
  • Propietario ( currentAssignment.queueOwner)

Los atributos restantes del modelo de tareas disponibles para mostrar en la tabla de tareas son los siguientes:

actionInstanceId
isOpenFullScreen
reminderCount
classOfTask
isOwner
routeList
consultGroupId
isRouteSelectionRequired
savedFormCount
contentType
isShowAttachments
serializedImageTicket
createTime
isStartTask
serviceName
creationId
isVisible
serviceTitle
currentAssignment
nextReminder
showACLActions
deadline
numForms
showDirectActions
description
numFormsToBeSaved
status
displayName
outOfOfficeUserId
summaryUrl
forwardGroupId
outOfOfficeUserName
supportsSave
isApprovalUI
priority
taskACL
isCustomUI
processInstanceId
taskFormType
isDefaultImage
processInstanceStatus
taskUserInfo
isLocked
processVariables
isMustOpenToComplete
readerSubmitOptions

Para las siguientes personalizaciones de la tabla de tareas, debe realizar cambios semánticos en el código fuente. Consulte Introducción a la personalización de AEM Forms Workspace para obtener información sobre cómo realizar cambios semánticos mediante el espacio de trabajo del SDK y crear un paquete minificado a partir del origen modificado.

Cambiar las columnas de la tabla y su orden changing-table-columns-and-their-order

  1. Para modificar los atributos de tarea mostrados en la tabla y su orden, configure el archivo /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>
    

Clasificar una tabla de seguimiento sorting-a-tracking-table

Para ordenar la tabla de la lista de tareas al hacer clic en el encabezado de columna, haga lo siguiente:

  1. Registre un controlador de clics para .fixedTaskTableHeader th en el archivo js/runtime/views/processinstancehistory.js.

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

    En el controlador, invoque la función onTaskTableHeaderClick de js/runtime/util/history.js.

    code language-as3
    onTaskTableHeaderClick: function (event) {
            history.onTaskTableHeaderClick(event);
    }
    
  2. Exponga el método TaskTableHeaderClick en js/runtime/util/history.js.

    El método encuentra el atributo de tarea del evento de clic, ordena la lista de tareas de ese atributo y procesa la tabla de tareas con la lista de tareas ordenada.

    La ordenación se realiza mediante la función de ordenación Backbone de la colección de listas de tareas y proporciona una función de comparación.

    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