Personalizzare le tabelle di tracciamento customize-tracking-tables

La scheda di tracciamento nell’area di lavoro di AEM Forms viene utilizzata per visualizzare i dettagli delle istanze di processo a cui è coinvolto l’utente connesso. Per visualizzare le tabelle di rilevamento, selezionare innanzitutto un nome di processo nel riquadro sinistro per visualizzare l'elenco delle istanze nel riquadro centrale. Selezionare un'istanza di processo per visualizzare una tabella delle attività generate da questa istanza nel riquadro di destra. Per impostazione predefinita, nelle colonne della tabella vengono visualizzati i seguenti attributi di task (l'attributo corrispondente nel modello di task è indicato tra parentesi):

  • ID ( taskId)
  • Nome ( stepName)
  • Istruzioni ( instructions)
  • Azione selezionata ( selectedRoute)
  • Ora di creazione ( createTime)
  • Ora di completamento ( completeTime)
  • Proprietario ( currentAssignment.queueOwner)

Gli attributi rimanenti nel modello di task disponibili per la visualizzazione nella tabella di task sono:

actionInstanceId
isOpenFullScreen
reminderCount
classOfTask
isOwner
routeList
consultGroupId
isRouteSelectionRequired
saveFormCount
contentType
isShowAttachments
serializedImageTicket
createTime
isStartTask
serviceName
creationId
isVisible
serviceTitle
currentAssignment
nextReminder
showACLActions
scadenza
numForms
showDirectActions
descrizione
numFormsToBeSaved
stato
displayName
outOfOfficeUserId
summaryUrl
forwardGroupId
outOfOfficeUserName
supportedSave
isApprovalUI
priorità
taskACL
isCustomUI
processInstanceId
taskFormType
isDefaultImage
processInstanceStatus
taskUserInfo
isLocked
processVariables
isMustOpenToComplete
readerSubmitOptions

Per le seguenti personalizzazioni nella tabella delle attività, è necessario apportare modifiche semantiche al codice sorgente. Consulta Introduzione alla personalizzazione dell’area di lavoro di AEM Forms su come apportare modifiche semantiche utilizzando l’SDK di Workspace e creare un pacchetto minimizzato dall’origine modificata.

Modifica delle colonne della tabella e del relativo ordine changing-table-columns-and-their-order

  1. Per modificare gli attributi delle operazioni visualizzati nella tabella e il relativo ordine, configurare il file /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>
    

Ordinamento di una tabella di tracciamento sorting-a-tracking-table

Per ordinare la tabella dell'elenco delle attività quando si fa clic sull'intestazione di colonna:

  1. Registra un gestore di clic per .fixedTaskTableHeader th nel file js/runtime/views/processinstancehistory.js.

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

    Nel gestore, richiama onTaskTableHeaderClick funzione di js/runtime/util/history.js.

    code language-javascript
    onTaskTableHeaderClick: function (event) {
            history.onTaskTableHeaderClick(event);
    }
    
  2. Esporre TaskTableHeaderClick metodo in js/runtime/util/history.js.

    Il metodo trova l'attributo task dall'evento click, ordina l'elenco di task su tale attributo ed esegue il rendering della tabella di task con l'elenco di task ordinato.

    L'ordinamento viene eseguito utilizzando la funzione di ordinamento Backbone nell'insieme di elenchi di task mediante una funzione di confronto.

    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