Welcome to the Alfresco Builder Network

Renders a list containing all the process instances matched by the parameters specified.

Contents

Basic Usage

app.component.html

<adf-cloud-process-list
    [applicationName]="'app-name'">
</adf-cloud-process-list>

Transclusions

Any content inside an <adf-empty-custom-content> sub-component will be shown when the process list is empty:

<adf-cloud-process-list>
    <adf-empty-custom-content>
        Your Content
    </adf-empty-custom-content>
<adf-cloud-process-list>

Class members

Properties

NameTypeDefault valueDescription
appVersionstring""The related application version.
applicationNamestring""The name of the application.
businessKeystring""Filter the tasks to display only the ones with this businessKey value.
idstring""Filter the processes to display only the ones with this ID.
initiatorstring""Name of the initiator of the process.
landingTaskIdstringDefine which task id should be selected after reloading. If the task id doesn't exist or nothing is passed then the first task will be selected.
multiselectbooleanfalseToggles multiple row selection and renders checkboxes at the beginning of each row
namestring""Filter the processes to display only the ones with this name.
processDefinitionIdstring""Filter the processes to display only the ones with this process definition ID.
processDefinitionKeystring""Filter the processes to display only the ones with this process definition key.
selectFirstRowbooleantrueToggles default selection of the first row
selectionModestring"single"Row selection mode. Can be "none", "single" or "multiple". For multiple mode, you can use Cmd (macOS) or Ctrl (Win) modifier key to toggle selection for multiple rows.
serviceFullNamestring""Filter the processes to display only the ones with this serviceFullName value.
serviceNamestring""Filter the processes to display only the ones with this serviceName value.
serviceTypestring""Filter the processes to display only the ones with this serviceType value.
serviceVersionstring""Filter the processes to display only the ones with this serviceVersion value.
sortingProcessListCloudSortingModel[]Array of objects specifying the sort order and direction for the list. The sort parameters are for BE sorting.
statusstring""Filter the processes to display only the ones with this status.

Events

NameTypeDescription
errorEventEmitter<any>Emitted when an error occurs while loading the list of process instances from the server.
rowClickEventEmitter<string>Emitted when a row in the process list is clicked.
rowsSelectedEventEmitter<any[]>Emitted when rows are selected/unselected.
successEventEmitter<any>Emitted when the list of process instances has been loaded successfully from the server.

Details

You can define a custom schema for the list in the app.config.json file and access it with the presetColumn property as shown below:

"adf-cloud-process-list": {
        "presets": {
            "customSchema": [
            {
                    "key": "name",
                    "type": "text",
                    "title": "name",
                    "sortable": true         
            }],
            "default": [
                {
                    "key": "name",
                    "type": "text",
                    "title": "name",
                    "sortable": true
            }],
        }
}
<adf-cloud-process-list
    [applicationName]="'appName'">
</adf-cloud-process-list>

You can also define the schema in the HTML using the Data column component. You can combine this with schema information defined in app.config.json as in the example below:

"adf-cloud-process-list": {
        "presets": {
            "customSchema": [
            {
                    "key": "id",
                    "type": "text",
                    "title": "Id",
                    "sortable": true
            }],
            "default": [
                {
                    "key": "name",
                    "type": "text",
                    "title": "name",
                    "sortable": true
            }],
        }
}
<adf-cloud-process-list
    [applicationName]="'appName'" >
    <data-columns>
        <data-column key="key" title="title" class="full-width name-column">
            <ng-template let-entry="$implicit">
                    <div>{{getFullName(entry.row.obj.assignee)}}</div>
            </ng-template>
        </data-column>
    </data-columns>
</adf-cloud-process-list>

Setting Sorting Order for the list

You can specify a sorting order as shown in the example below:

let sorting = [{ orderBy: 'status', direction: 'desc' }];
<adf-cloud-process-list
    [applicationName]="'appName'"
    [sort]="sorting">
</adf-cloud-process-list>

Pagination strategy

The Process Instance List also supports pagination:

<adf-cloud-process-list
    [appId]="'1'"
    [page]="page"
    [size]="size"
    #processList>
</adf-cloud-process-list>
<adf-pagination
    *ngIf="processList"
    [target]="processList"
    [supportedPageSizes]="supportedPages"
    #processListPagination>
</adf-pagination>

See also

Interested in trying Alfresco?

Try Now