AAE-26215 Standalone process cloud components (#10553)

This commit is contained in:
Denys Vuika
2025-01-15 08:37:46 -05:00
committed by GitHub
parent 8b5dcf19b9
commit 0a17fb4f4c
39 changed files with 475 additions and 974 deletions

View File

@@ -445,7 +445,6 @@ for more information about installing and using the source code.
| ---- | ----------- | ----------- |
| [Claim Task Directive](process-services/directives/claim-task.directive.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Claims a task | [Source](../lib/process-services/src/lib/task-list/components/task-form/claim-task.directive.ts) |
| [Process Audit Directive](process-services/directives/process-audit.directive.md) | Fetches the Process Audit information in PDF or JSON format. | [Source](../lib/process-services/src/lib/process-list/components/process-audit/process-audit.directive.ts) |
| [Task Audit Directive](process-services/directives/task-audit.directive.md) | Fetches the Task Audit information in PDF or JSON format. | [Source](../lib/process-services/src/lib/task-list/components/task-audit/task-audit.directive.ts) |
| [Unclaim Task Directive](process-services/directives/unclaim-task.directive.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Unclaims a task | [Source](../lib/process-services/src/lib/task-list/components/task-form/unclaim-task.directive.ts) |
### Services
@@ -475,7 +474,7 @@ for more information about installing and using the source code.
| Name | Description | Source link |
| ---- | ----------- | ----------- |
| [App List Cloud Component](process-services-cloud/components/app-list-cloud.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Shows all deployed cloud application instances. | [Source](../lib/process-services-cloud/src/lib/app/components/app-list-cloud.component.ts) |
| [Edit Process Filter Cloud component](process-services-cloud/components/edit-process-filter-cloud.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Shows/edits process filter details. | [Source](../lib/process-services-cloud/src/lib/process/process-filters/components/edit-process-filter-cloud.component.ts) |
| [Edit Process Filter Cloud component](process-services-cloud/components/edit-process-filter-cloud.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Shows/edits process filter details. | [Source](../lib/process-services-cloud/src/lib/process/process-filters/components/edit-process-filter/edit-process-filter-cloud.component.ts) |
| [Edit Task Filter Cloud component](process-services-cloud/components/edit-task-filter-cloud.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Edits task filter details. | [Source](../lib/process-services-cloud/src/lib/task/task-filters/components/edit-task-filters/edit-task-filter-cloud.component.ts) |
| [Form cloud custom outcomes component](process-services-cloud/components/form-cloud-custom-outcome.component.md) | Supplies custom outcome buttons to be included in Form cloud component. | [Source](../lib/process-services-cloud/src/lib/form/components/form-cloud-custom-outcomes.component.ts) |
| [Form cloud component](process-services-cloud/components/form-cloud.component.md) | Shows a form from Process Services. | [Source](../lib/process-services-cloud/src/lib/form/components/form-cloud.component.ts) |
@@ -485,7 +484,7 @@ for more information about installing and using the source code.
Added: v3.0.0
Status: Experimental | [Source](<>) |
| [Process Filters Cloud Component](process-services-cloud/components/process-filters-cloud.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Lists all available process filters and allows to select a filter. | [Source](../lib/process-services-cloud/src/lib/process/process-filters/components/process-filters-cloud.component.ts) |
| [Process Filters Cloud Component](process-services-cloud/components/process-filters-cloud.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Lists all available process filters and allows to select a filter. | [Source](../lib/process-services-cloud/src/lib/process/process-filters/components/process-filters/process-filters-cloud.component.ts) |
| [Process Header Cloud Component](process-services-cloud/components/process-header-cloud.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Shows all the information related to a process instance. | [Source](../lib/process-services-cloud/src/lib/process/process-header/components/process-header-cloud.component.ts) |
| [Process Instance List Cloud component](process-services-cloud/components/process-list-cloud.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Renders a list containing all the process instances matched by the parameters specified. | [Source](../lib/process-services-cloud/src/lib/process/process-list/components/process-list-cloud.component.ts) |
| [Start Process Cloud Component](process-services-cloud/components/start-process-cloud.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Starts a process. | [Source](../lib/process-services-cloud/src/lib/process/start-process/components/start-process-cloud.component.ts) |

Binary file not shown.

Before

Width:  |  Height:  |  Size: 6.9 KiB

View File

@@ -5,7 +5,7 @@ Status: Experimental
Last reviewed: 2023-04-03
---
# [Edit Process Filter Cloud component](../../../lib/process-services-cloud/src/lib/process/process-filters/components/edit-process-filter-cloud.component.ts "Defined in edit-process-filter-cloud.component.ts")
# Edit Process Filter Cloud component
Shows/edits process filter details.
@@ -41,27 +41,27 @@ Shows/edits process filter details.
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| actions | `string[]` | DEFAULT_ACTIONS | List of sort actions. |
| appName | `string` | "" | The name of the application. |
| environmentId | `string` | | [Environment](../../../lib/process-services-cloud/src/lib/common/interface/environment.interface.ts) ID of the application. |
| environmentList | [`Environment`](../../../lib/process-services-cloud/src/lib/common/interface/environment.interface.ts)`[]` | \[] | List of environments. |
| filterProperties | `string[]` | | List of process filter properties to display |
| id | `string` | | Id of the process instance filter. |
| role | `string` | "" | roles to filter the apps |
| showFilterActions | `boolean` | true | Toggles editing of process filter actions. |
| showProcessFilterName | `boolean` | true | Toggles the appearance of the process filter name . |
| showTitle | `boolean` | true | Toggles editing of the process filter title. |
| sortProperties | `string[]` | | List of sort properties to display. |
| processFilter | [`ProcessFilterCloudModel`](../../../lib/process-services-cloud/src/lib/process/process-filters/models/process-filter-cloud.model.ts) | | Process filter |
| Name | Type | Default value | Description |
|-----------------------|---------------------------|-----------------|-----------------------------------------------------|
| actions | `string[]` | DEFAULT_ACTIONS | List of sort actions. |
| appName | `string` | "" | The name of the application. |
| environmentId | `string` | | Environment ID of the application. |
| environmentList | `Environment[]` | \[] | List of environments. |
| filterProperties | `string[]` | | List of process filter properties to display |
| id | `string` | | Id of the process instance filter. |
| role | `string` | "" | roles to filter the apps |
| showFilterActions | `boolean` | true | Toggles editing of process filter actions. |
| showProcessFilterName | `boolean` | true | Toggles the appearance of the process filter name . |
| showTitle | `boolean` | true | Toggles editing of the process filter title. |
| sortProperties | `string[]` | | List of sort properties to display. |
| processFilter | `ProcessFilterCloudModel` | | Process filter |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| action | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`ProcessFilterAction`](../../../lib/process-services-cloud/src/lib/process/process-filters/models/process-filter-cloud.model.ts)`>` | Emitted when a filter action occurs i.e Save, SaveAs, Delete. |
| filterChange | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`ProcessFilterCloudModel`](../../../lib/process-services-cloud/src/lib/process/process-filters/models/process-filter-cloud.model.ts)`>` | Emitted when a process instance filter property changes. |
| 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
@@ -72,8 +72,8 @@ Use the `appName` and `id` properties to choose which process filter to edit:
```html
<adf-cloud-edit-process-filter
[id]="processFilterId"
[appName]="appName">
</adf-cloud-edit-process-filter>
[appName]="appName"
/>
```
### Filter properties
@@ -82,18 +82,18 @@ You can supply various _filter properties_ to edit. These will determine
which processes are found by a filter. The full set of properties is
given below:
| Name | Description |
| ---- | ----------- |
| **_appName_** | Name of the app |
| **_id_** | Process instance ID |
| **_name_** | 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_** |
| **_sort_** | Field on which the filter results will be sorted. Can be "id", "name", "status", "startDate". |
| **_order_** | Sort ordering of the filter results (this doesn't participate in the filtering itself) |
| Name | Description |
|----------------------------|--------------------------------------------------------------------------------------------------------------------------------------------|
| **_appName_** | Name of the app |
| **_id_** | Process instance ID |
| **_name_** | 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_** |
| **_sort_** | Field on which the filter results will be sorted. Can be "id", "name", "status", "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
@@ -118,14 +118,15 @@ export class SomeComponent implements OnInit {
onAction($event: ProcessFilterAction) {
console.log('Clicked action: ', $event);
}
}
```
```html
<adf-cloud-edit-process-filter
[id]="processFilterId"
[appName]="applicationName"
[filterProperties]="filterProperties">
</adf-cloud-edit-process-filter>
[filterProperties]="filterProperties"
/>
```
With this configuration, only the four listed properties will be shown.
@@ -146,7 +147,8 @@ export class SomeComponent implements OnInit {
sortProperties: string[] = [
"startDate",
"lastModified"];
"lastModified"
];
onFilterChange(filter: ProcessFilterCloudModel) {
console.log('On filter change: ', filter);
@@ -155,14 +157,15 @@ export class SomeComponent implements OnInit {
onAction($event: ProcessFilterAction) {
console.log('Clicked action: ', $event);
}
}
```
```html
<adf-cloud-edit-process-filter
[id]="processFilterId"
[appName]="applicationName"
[sortProperties]="sortProperties">
</adf-cloud-edit-process-filter>
[sortProperties]="sortProperties"
/>
```
With this configuration, only the two listed sort properties will be shown.
@@ -171,11 +174,11 @@ With this configuration, only the two listed sort properties will be shown.
You can supply various _actions_ to apply on process filter.
| Name | Description |
| ---- | ----------- |
| **_save_** | Save process filter. |
| Name | Description |
|--------------|-------------------------------|
| **_save_** | Save process filter. |
| **_saveAs_** | Creates a new process filter. |
| **_delete_** | Delete 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
@@ -194,14 +197,15 @@ export class SomeComponent implements OnInit {
onAction($event: ProcessFilterAction) {
console.log('Clicked action: ', $event);
}
}
```
```html
<adf-cloud-edit-process-filter
[id]="processFilterId"
[appName]="applicationName"
[actions]="actions">
</adf-cloud-edit-process-filter>
[actions]="actions"
/>
```
With this configuration, only the two actions will be shown.
@@ -211,7 +215,6 @@ With this configuration, only the two actions will be shown.
Users can save a filter if they make any changes to it in an application using the **Save** icon. How it is saved is dictated by the Activiti version used:
- An Activiti 7 community version stores saved filters in the local browser storage. This restricts a user's custom filters to that single session.
- An Activiti Enterprise version uses the preference service to store saved filters. This allows for user's custom filters to be available between sessions and between devices.
## See also

View File

@@ -5,7 +5,7 @@ Status: Experimental
Last reviewed: 2019-01-08
---
# [Process Filters Cloud Component](../../../lib/process-services-cloud/src/lib/process/process-filters/components/process-filters-cloud.component.ts "Defined in process-filters-cloud.component.ts")
# Process Filters Cloud Component
Lists all available process filters and allows to select a filter.
@@ -14,28 +14,28 @@ Lists all available process filters and allows to select a filter.
```html
<adf-cloud-process-filters
[appName]="currentAppName"
[showIcons]="true">
</adf-cloud-process-filters>
[showIcons]="true"
/>
```
## Class members
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| appName | `string` | "" | (required) The application name |
| filterParam | `UserTaskFilterRepresentation` | | (optional) The filter to be selected by default |
| showIcons | `boolean` | false | (optional) Toggles showing an icon by the side of each filter |
| Name | Type | Default value | Description |
|-------------|--------------------------------|---------------|---------------------------------------------------------------|
| appName | `string` | "" | (required) The application name |
| filterParam | `UserTaskFilterRepresentation` | | (optional) The filter to be selected by default |
| showIcons | `boolean` | false | (optional) Toggles showing an icon by the side of each filter |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| error | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when any error occurs while loading the filters |
| filterClicked | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`ProcessFilterCloudModel`](../../../lib/process-services-cloud/src/lib/process/process-filters/models/process-filter-cloud.model.ts)`>` | Emitted when a filter is being clicked from the UI. |
| filterSelected | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`ProcessFilterCloudModel`](../../../lib/process-services-cloud/src/lib/process/process-filters/models/process-filter-cloud.model.ts)`>` | Emitted when a filter is being selected based on the filterParam input. |
| success | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when filters are loaded successfully |
| Name | Type | Description |
|----------------|-----------------------------------------|-------------------------------------------------------------------------|
| error | `EventEmitter<any>` | Emitted when any error occurs while loading the filters |
| filterClicked | `EventEmitter<ProcessFilterCloudModel>` | Emitted when a filter is being clicked from the UI. |
| filterSelected | `EventEmitter<ProcessFilterCloudModel>` | Emitted when a filter is being selected based on the filterParam input. |
| success | `EventEmitter<any>` | Emitted when filters are loaded successfully |
## See also

View File

@@ -53,24 +53,3 @@ Shows the details of the task ID passed in as input.
| taskCreated | `EventEmitter<TaskRepresentation>` | Emitted when a checklist task is created. |
| taskDeleted | `EventEmitter<string>` | Emitted when a checklist task is deleted. |
| unClaimedTask | `EventEmitter<string>` | Emitted when a task is unclaimed. |
## Details
### Custom 'empty Task Details' template
By default, the [Task Details component](task-details.component.md) shows "No Tasks" message when there are
no details. You can change this by adding a custom HTML template as in the following
example:
```html
<adf-task-details [taskId]="taskId">
<adf-no-task-details-template>
<ng-template>
<h1>Sorry, no tasks here</h1>
<img src="example.jpg" alt="example">
</ng-template>
</adf-no-task-details-template>
</adf-task-details>
```
Note that you can use any HTML content in the template, including other Angular components.

View File

@@ -1,42 +0,0 @@
---
Title: Task Audit Directive
Added: v2.0.0
Status: Active
Last reviewed: 2019-01-14
---
# [Task Audit Directive](../../../lib/process-services/src/lib/task-list/components/task-audit/task-audit.directive.ts "Defined in task-audit.directive.ts")
Fetches the Task Audit information in PDF or JSON format.
![adf-task-audit-directive](../../docassets/images/adf-task-audit-directive.png)
## Basic Usage
```html
<button
adf-task-audit
[task-id]="taskId"
[download]="download"
mat-icon-button (clicked)="onAuditClick($event)" (error)="onAuditError($event)" >
<mat-icon>assignment_ind</mat-icon>
</button>
```
## Class members
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| download | `boolean` | true | Enables downloading of the audit when the decorated element is clicked. |
| fileName | `string` | "Audit" | Name of the downloaded file (for PDF downloads). |
| format | `string` | "pdf" | Format of the audit information. Can be "pdf" or "json". |
| taskId | `string` | | (**required**) The id of the task. |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| clicked | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when the decorated element is clicked. |
| error | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when an error occurs. |