* [ADF-3883] Improve edit-process-filter-cloud by adding inputs to control filters, sort and actions * Provided an input to pass sort properties * Provided an input to pass filter actions * Provided a way to configure sort properties and actions * * Updated unit tests to the recent changes * Fixed order should be visible if sort as been added to the config * Fixed if lastModified if defined the component should show the range lastModifiedTo lastModifiedFrom * Updated doc * * Removed ProcessFilterActionType* Renamed state to status* Refactored edit-process-filter * Updated doc * * After rebase * * Fixed editProcessFilter e2e tests. * * Removed unwanted comment * * After rebase * * After rebase * * After rebase
6.6 KiB
Title, Added, Status, Last reviewed
Title | Added | Status | Last reviewed |
---|---|---|---|
Edit Process Filter Cloud component | v3.0.0 | Experimental | 2019-01-30 |
Edit Process Filter Cloud component
Shows Process Filter Details.
Contents
Basic Usage
<adf-cloud-edit-process-filter
[id]="processFilterId"
[appName]="appName"
[filterProperties]="filterProperties"s
(filterChange)="onFilterChange($event)"
(action)="onAction($event)">
</adf-cloud-edit-process-filter>
Class members
Properties
Name | Type | Default value | Description |
---|---|---|---|
actions | string[] |
List of sort actions. | |
appName | string |
The name of the application. | |
filterProperties | string[] |
List of process filter properties to display | |
id | string |
Id of the process instance filter. | |
showFilterActions | boolean |
true | Toggles editing of process filter actions. |
showTitle | boolean |
true | Toggles editing of the process filter title. |
sortProperties | string[] |
List of sort properties to display. |
Events
Name | Type | Description |
---|---|---|
action | EventEmitter < ProcessFilterAction > |
Emitted when a filter action occurs i.e Save, SaveAs, Delete. |
filterChange | EventEmitter < ProcessFilterCloudModel > |
Emitted when a process instance filter property changes. |
Details
Editing APS2 process filters
Use the appName
and id
properties to choose which process filter to edit:
<adf-cloud-edit-process-filter
[id]="processFilterId"
[appName]="appName">
</adf-cloud-edit-process-filter>
Filter properties
You can supply various filter properties to edit that will determine which processes are found by a filter. The full set of properties is given below:
Name | Description |
---|---|
appName | Name of the app |
processInstanceId | Process instance ID |
processName | Process name. |
initiator | ID of the user who initiated the process |
status | Execution status of the process. |
processDefinitionId | Process definition ID |
processDefinitionKey | Process definition key |
lastModified | Date the process was last modified. If lastModified defined the component will show the range lastModifiedTo, lastModifiedFrom |
startDate | Date the process was started |
sort | Field on which the filter results will be sorted (doesn't participate in the filtering itself). Can be "id", "name", "status" or "startDate". |
order | Sort ordering of the filter results (this doesn't participate in the filtering itself) |
By default, the status, sort and order properties are
displayed in the editor. However, you can also choose which properties
to show using the filterProperties
array.
For example, the code below initializes the editor with the appName,
processInstanceId, startDate and lastModified properties:
export class SomeComponent implements OnInit {
filterProperties: string[] = [
"appName",
"processInstanceId",
"startDate",
"lastModified"];
onFilterChange(filter: ProcessFilterCloudModel) {
console.log('On filter change: ', filter);
}
onAction($event: ProcessFilterAction) {
console.log('Clicked action: ', $event);
}
<adf-cloud-edit-process-filter
[id]="processFilterId"
[appName]="applicationName"
[filterProperties]="filterProperties">
</adf-cloud-edit-process-filter>
With this configuration, only the four listed properties will be shown.
Sort properties
You can supply various sort properties to sort the processes.
By default, the id, name, status and startDate properties are
displayed in the editor. However, you can also choose which sort properties
to show using the sortProperties
array.
For example, the code below initializes the editor with the startDate and lastModified properties:
export class SomeComponent implements OnInit {
sortProperties: string[] = [
"startDate",
"lastModified"];
onFilterChange(filter: ProcessFilterCloudModel) {
console.log('On filter change: ', filter);
}
onAction($event: ProcessFilterAction) {
console.log('Clicked action: ', $event);
}
<adf-cloud-edit-process-filter
[id]="processFilterId"
[appName]="applicationName"
[sortProperties]="sortProperties">
</adf-cloud-edit-process-filter>
With this configuration, only the two listed sort properties will be shown.
Action properties
You can supply various actions to apply on process filter.
Name | Description |
---|---|
save | Save process filter. |
saveAs | Creates a new process filter. |
delete | Delete process filter. |
By default, the save, saveAs and delete actions are
displayed in the editor. However, you can also choose which actions to
show using the actions
array.
For example, the code below initializes the editor with the save and delete actions:
export class SomeComponent implements OnInit {
actions: string[] = ['save', 'delete'];
onFilterChange(filter: ProcessFilterCloudModel) {
console.log('On filter change: ', filter);
}
onAction($event: ProcessFilterAction) {
console.log('Clicked action: ', $event);
}
<adf-cloud-edit-process-filter
[id]="processFilterId"
[appName]="applicationName"
[actions]="actions">
</adf-cloud-edit-process-filter>
With this configuration, only the two actions will be shown.