inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-07-24 17:32:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ACS-7427] Process Services improvements and cleanup (#9664)

Browse Source
This commit is contained in:
Denys Vuika
2024-05-20 16:08:47 -04:00
committed by GitHub
parent 96e607b4de
commit e71e2a749a
174 changed files with 1736 additions and 3933 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
docs/process-services/components/apps-list.component.md
View File

@@ -37,17 +37,17 @@ You can show custom content when there are no apps available by supplying an
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| filtersAppId | `any[]` | | Provides a way to filter the apps to show. |
| layoutType | `string` | | (**required**) Defines the layout of the apps. There are two possible values, "GRID" and "LIST". |
| Name | Type | Default value | Description |
|--------------|----------|---------------|--------------------------------------------------------------------------------------------------|
| filtersAppId | `any[]` | | Provides a way to filter the apps to show. |
| layoutType | `string` | | (**required**) Defines the layout of the apps. There are two possible values, "GRID" and "LIST". |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| appClick | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`AppDefinitionRepresentationModel`](../../../lib/process-services/src/lib/task-list/models/filter.model.ts)`>` | Emitted when an app entry is clicked. |
| error | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when an error occurs. |
| Name | Type | Description |
|----------|---------------------------------------------|---------------------------------------|
| appClick | `EventEmitter<AppDefinitionRepresentation>` | Emitted when an app entry is clicked. |
| error | `EventEmitter<any>` | Emitted when an error occurs. |
## Details

2
docs/process-services/components/form-custom-outcome.component.md
View File

@@ -5,7 +5,7 @@ Status: Active
Last reviewed: 2020-06-09
---
# [Form custom outcomes component](../../../lib/process-services/src/lib/form/form-custom-outcomes.component.ts "Defined in form-custom-outcomes.component.ts")
# Form Custom Outcomes Component
Supplies custom outcome buttons to be included in [Form component](form.component.md).

6
docs/process-services/components/form.component.md
View File

@@ -5,11 +5,9 @@ Status: Active
Last reviewed: 2019-01-16
---
# [Form component](../../../lib/process-services/src/lib/form/form.component.ts "Defined in form.component.ts")
# Form component
Shows a [`Form`](../../../lib/process-services/src/lib/task-list/models/form.model.ts) from APS
(See it live: [Form Quickstart](https://embed.plnkr.co/YSLXTqb3DtMhVJSqXKkE/))
Renders a Form from Alfresco Process Services.
## Contents

45
docs/process-services/components/people-list.component.md
View File

@@ -5,7 +5,7 @@ Status: Active
Last reviewed: 2019-01-14
---
# [People list component](../../../lib/process-services/src/lib/people/components/people-list/people-list.component.ts "Defined in people-list.component.ts")
# People List Component
Shows a list of users (people).
@@ -16,32 +16,33 @@ Shows a list of users (people).
Populate the users in the component class:
```ts
import { UserProcessModel } from '@alfresco/adf-core';
import { LightUserRepresentation } from '@alfresco/js-api';
export class SomeComponent implements OnInit {
people: UserProcessModel[] = [
people: LightUserRepresentation[] = [
{
id: 1,
email: 'john.doe@alfresco.com',
firstName: 'John',
lastName: 'Doe'
id: 1,
email: 'john.doe@alfresco.com',
firstName: 'John',
lastName: 'Doe'
},
{
id: 2,
email: 'jane.doe@alfresco.com',
firstName: 'Jane',
lastName: 'Doe'
id: 2,
email: 'jane.doe@alfresco.com',
firstName: 'Jane',
lastName: 'Doe'
}
];
onClickPeopleRow(user: UserProcessModel) {
onClickPeopleRow(user: LightUserRepresentation) {
console.log('Clicked row: ', user);
}
onClickPeopleAction($event: Event) {
console.log('Clicked action: ', $event);
}
}
```
You can use column templates with the [people list component](people-list.component.md), since it is based on the
@@ -76,14 +77,14 @@ You can use column templates with the [people list component](people-list.compon
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| actions | `boolean` | false | Toggles whether or not actions should be visible, i.e. the 'Three-Dots' menu. |
| users | [`UserProcessModel`](../../core/models/user-process.model.md)`[]` | | The array of user data used to populate the people list. |
| Name | Type | Default value | Description |
|---------|-----------------------------|---------------|-------------------------------------------------------------------------------|
| actions | `boolean` | false | Toggles whether or not actions should be visible, i.e. the 'Three-Dots' menu. |
| users | `LightUserRepresentation[]` | | The array of user data used to populate the people list. |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| clickAction | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`UserEventModel`](../../../lib/process-services/src/lib/task-list/models/user-event.model.ts)`>` | Emitted when the user clicks in the 'Three Dots' drop down menu for a row. |
| clickRow | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`UserProcessModel`](../../core/models/user-process.model.md)`>` | Emitted when the user clicks a row in the people list. |
| Name | Type | Description |
|-------------|-----------------------------------------|----------------------------------------------------------------------------|
| clickAction | `EventEmitter<UserEventModel>` | Emitted when the user clicks in the 'Three Dots' drop down menu for a row. |
| clickRow | `EventEmitter<LightUserRepresentation>` | Emitted when the user clicks a row in the people list. |

26
docs/process-services/components/people-search.component.md
View File

@@ -5,7 +5,7 @@ Status: Active
Last reviewed: 2018-11-14
---
# [People Search component](../../../lib/process-services/src/lib/people/components/people-search/people-search.component.ts "Defined in people-search.component.ts")
# People Search Component
Searches users/people.
@@ -18,10 +18,10 @@ Searches users/people.
### [Transclusions](../../user-guide/transclusion.md)
You can provide a title for the search header and a label for the action button using
special sub-components in the body of the `<adf-people-search>` element:
special subcomponents in the body of the `<adf-people-search>` element:
```html
<adf-people-search ...>
<adf-people-search>
<header-title>Custom title</header-title>
<action-button-label>Custom label</action-button-label>
</adf-people-search>
@@ -31,24 +31,22 @@ special sub-components in the body of the `<adf-people-search>` element:
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| results | [`Observable`](http://reactivex.io/documentation/observable.html)`<`[`UserProcessModel`](../../core/models/user-process.model.md)`[]>` | | Parameters for displaying the list. |
| Name | Type | Default value | Description |
|---------|-----------------------------------------|---------------|-------------------------------------|
| results | `Observable<LightUserRepresentation[]>` | | Parameters for displaying the list. |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| closeSearch | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when the "close" button is clicked. |
| searchPeople | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when a search is performed with a new keyword. |
| success | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`UserProcessModel`](../../core/models/user-process.model.md)`>` | Emitted when a user is selected and the action button is clicked. |
| Name | Type | Description |
|--------------|-----------------------------------------|-------------------------------------------------------------------|
| closeSearch | `EventEmitter<any>` | Emitted when the "close" button is clicked. |
| searchPeople | `EventEmitter<any>` | Emitted when a search is performed with a new keyword. |
| success | `EventEmitter<LightUserRepresentation>` | Emitted when a user is selected and the action button is clicked. |
## Details
Usage example:
<!-- {% raw %} -->
```html
<adf-people-search
(searchPeople)="searchUser($event)"
@@ -59,5 +57,3 @@ Usage example:
<action-button-label>{{ 'PEOPLE.ADD_USER' | translate }}</action-button-label>
</adf-people-search>
```
<!-- {% endraw %} -->

91
docs/process-services/components/people.component.md
View File

@@ -2,26 +2,14 @@
Title: People Component
Added: v2.0.0
Status: Active
Last reviewed: 2018-11-19
Last reviewed: 2024-05-16
---
# [People Component](../../../lib/process-services/src/lib/people/components/people/people.component.ts "Defined in people.component.ts")
# People Component
Displays users involved with a specified task
![activiti-people](../../docassets/images/activiti_people.png)
## Contents
- [Basic Usage](#basic-usage)
- [Class members](#class-members)
- [Properties](#properties)
- [Details](#details)
- [How to customize the people component behavior](#how-to-customize-the-people-component-behavior)
- [Involve People single click and close search](#involve-people-single-click-and-close-search)
- [Involve People single click without close search](#involve-people-single-click-without-close-search)
- [Involve People double click and close search](#involve-people-double-click-and-close-search)
- [Involve People double double without close search](#involve-people-double-double-without-close-search)
![people component](../../docassets/images/activiti_people.png)
## Basic Usage
@@ -37,75 +25,12 @@ Displays users involved with a specified task
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| people | [`UserProcessModel`](../../core/models/user-process.model.md)`[]` | \[] | The array of User objects to display. |
| readOnly | `boolean` | false | Should the data be read-only? |
| taskId | `string` | "" | The numeric ID of the task. |
| Name | Type | Default value | Description |
|----------|-----------------------------|---------------|---------------------------------------|
| people | `LightUserRepresentation[]` | \[] | The array of User objects to display. |
| readOnly | `boolean` | false | Should the data be read-only? |
| taskId | `string` | "" | The numeric ID of the task. |
### Events
- `error`: Emitted when an error occurs.
## Details
### How to customize the people component behavior
The [people component](people.component.md) provides two options to customize its behavior:
- _involveUserAndCloseSearch_: The selected user gets added and then the search section is closed
- _involveUserWithoutCloseSearch_: The selected user gets added without closing the search section
This makes it easy to customize the [people component](people.component.md) to involve the user via a single or double click event:
### Involve People single click and close search
```html
<adf-people #people
(row-click)="people.involveUserAndCloseSearch()"
[people]="YOUR_INVOLVED_PEOPLE_LIST"
[taskId]="YOUR_TASK_ID"
[readOnly]="YOUR_READ_ONLY_FLAG">
</adf-people>
```
![involve-people-single-click-and-close-search](../../docassets/images/involve-people-single-click-and-close-search.gif)
### Involve People single click without close search
```html
<adf-people #people
(row-click)="people.involveUserWithoutCloseSearch()"
[people]="YOUR_INVOLVED_PEOPLE_LIST"
[taskId]="YOUR_TASK_ID"
[readOnly]="YOUR_READ_ONLY_FLAG">
</adf-people>
```
![involve-people-single-click-without-close-search](../../docassets/images/involve-people-single-click-without-close-search.gif)
### Involve People double click and close search
```html
<adf-people #people
(row-dblclick)="people.involveUserAndCloseSearch()"
[people]="YOUR_INVOLVED_PEOPLE_LIST"
[taskId]="YOUR_TASK_ID"
[readOnly]="YOUR_READ_ONLY_FLAG">
</adf-people>
```
![involve-people-double-click-and-close-search](../../docassets/images/involve-people-double-click-and-close-search.gif)
### Involve People double double without close search
```html
<adf-people #people
(row-dblclick)="people.involveUserWithoutCloseSearch()"
[people]="YOUR_INVOLVED_PEOPLE_LIST"
[taskId]="YOUR_TASK_ID"
[readOnly]="YOUR_READ_ONLY_FLAG">
</adf-people>
```
![involve-people-double-click-without-close-search](../../docassets/images/involve-people-double-click-without-close-search.gif)

54
docs/process-services/components/process-filters.component.md
View File

@@ -5,7 +5,7 @@ Status: Active
Last reviewed: 2018-09-14
---
# [Process Filters Component](../../../lib/process-services/src/lib/process-list/components/process-filters.component.ts "Defined in process-filters.component.ts")
# Process Filters Component
Collection of criteria used to filter process instances, which may be customized by users.
@@ -17,14 +17,12 @@ Collection of criteria used to filter process instances, which may be customized
- [Events](#events)
- [Details](#details)
- [How filter the activiti process filters](#how-filter-the-activiti-process-filters)
- [FilterParamsModel](#filterparamsmodel)
- [See also](#see-also)
## Basic Usage
```html
<adf-process-instance-filters
appId="1001">
<adf-process-instance-filters appId="1001">
</adf-process-instance-filters>
```
@@ -32,21 +30,21 @@ Collection of criteria used to filter process instances, which may be customized
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| appId | `number` | | Display filters available to the current user for the application with the specified ID. |
| appName | `string` | | Display filters available to the current user for the application with the specified name. |
| filterParam | [`FilterProcessRepresentationModel`](../../../lib/process-services/src/lib/process-list/models/filter-process.model.ts) | | The parameters to filter the task filter. If there is no match then the default one (ie, the first filter in the list) is selected. |
| showIcon | `boolean` | true | Toggle to show or hide the filter's icon. |
| Name | Type | Default value | Description |
|-------------|-------------------------------------------------------------------------------------------------------------------------|---------------|-------------------------------------------------------------------------------------------------------------------------------------|
| appId | `number` | | Display filters available to the current user for the application with the specified ID. |
| appName | `string` | | Display filters available to the current user for the application with the specified name. |
| filterParam | [`FilterProcessRepresentationModel`](../../../lib/process-services/src/lib/process-list/models/filter-process.model.ts) | | The parameters to filter the task filter. If there is no match then the default one (ie, the first filter in the list) is selected. |
| showIcon | `boolean` | true | Toggle to show or hide the filter's icon. |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| error | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when an error occurs. |
| filterClicked | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`UserProcessInstanceFilterRepresentation`](https://github.com/Alfresco/alfresco-js-api/blob/develop/src/api/activiti-rest-api/docs/UserProcessInstanceFilterRepresentation.md)`>` | Emitted when a filter is being clicked from the UI. |
| filterSelected | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`UserProcessInstanceFilterRepresentation`](https://github.com/Alfresco/alfresco-js-api/blob/develop/src/api/activiti-rest-api/docs/UserProcessInstanceFilterRepresentation.md)`>` | Emitted when a filter is being selected based on the filterParam input. |
| success | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`ProcessInstanceFilterRepresentation`](https://github.com/Alfresco/alfresco-js-api/blob/develop/src/api/activiti-rest-api/docs/ProcessInstanceFilterRepresentation.md)`[]>` | Emitted when the list of filters has been successfully loaded from the server. |
| Name | Type | Description |
|----------------|-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|--------------------------------------------------------------------------------|
| error | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when an error occurs. |
| filterClicked | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`UserProcessInstanceFilterRepresentation`](https://github.com/Alfresco/alfresco-js-api/blob/develop/src/api/activiti-rest-api/docs/UserProcessInstanceFilterRepresentation.md)`>` | Emitted when a filter is being clicked from the UI. |
| filterSelected | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`UserProcessInstanceFilterRepresentation`](https://github.com/Alfresco/alfresco-js-api/blob/develop/src/api/activiti-rest-api/docs/UserProcessInstanceFilterRepresentation.md)`>` | Emitted when a filter is being selected based on the filterParam input. |
| success | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`ProcessInstanceFilterRepresentation`](https://github.com/Alfresco/alfresco-js-api/blob/develop/src/api/activiti-rest-api/docs/ProcessInstanceFilterRepresentation.md)`[]>` | Emitted when the list of filters has been successfully loaded from the server. |
## Details
@@ -58,7 +56,7 @@ process instances are displayed in the list.
If both `appId` and `appName` are specified then `appName` will take precedence and `appId` will be ignored.
### How filter the activiti process filters
### How filter the Activiti process filters
```html
<adf-process-instance-filters
@@ -66,23 +64,13 @@ If both `appId` and `appName` are specified then `appName` will take precedence
</adf-process-instance-filters>
```
You can use inside the filterParam one of the properties defined by [`FilterParamsModel`](../../../lib/process-services/src/lib/task-list/models/filter.model.ts) (see below).
You can use inside the filterParam one of the properties defined by `UserTaskFilterRepresentation`:
### FilterParamsModel
```json
{
"id": "number",
"name": "string",
"index": "number"
}
```
| Name | Type | Description |
| ---- | ---- | ----------- |
| id | string | The id of the task filter. |
| name | string | The name of the task filter, lowercase is checked. |
| index | number | Zero-based position of the filter in the array. |
| Name | Type | Description |
|-------|--------|----------------------------------------------------|
| id | string | The id of the task filter. |
| name | string | The name of the task filter, lowercase is checked. |
| index | number | Zero-based position of the filter in the array. |
## See also

2
docs/process-services/components/process-user-info.component.md
View File

@@ -22,7 +22,7 @@ Shows user information for `PROCESS` and `ALL` mode.
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| bpmBackgroundImage | `string` | | Custom path for the background banner image for APS users. |
| bpmUser | [`BpmUserModel`](../../core/models/bpm-user.model.md) | | BPM user info. |
| bpmUser | UserRepresentation | | BPM user info. |
| ecmBackgroundImage | `string` | | Custom path for the background banner image for ACS users. |
| ecmUser | [`EcmUserModel`](../../core/models/ecm-user.model.md) | | ECM user info. |
| isLoggedIn | `boolean` | | Determines if user is logged in. |

71
docs/process-services/components/start-process.component.md
View File

@@ -38,27 +38,27 @@ Starts a process.
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| appId | `number` | | (optional) Limit the list of processes that can be started to those contained in the specified app. |
| name | `string` | "" | (optional) Name to assign to the current process. |
| processDefinitionName | `string` | | (optional) Definition name of the process to start. |
| processFilterSelector | `boolean` | true | (optional) Parameter to enable selection of process when filtering. |
| showSelectApplicationDropdown | `boolean` | false | (optional) Hide or show application selection dropdown. |
| showSelectProcessDropdown | `boolean` | true | Hide or show the process selection dropdown. |
| title | `string` | | (optional) Define the header of the component. |
| values | [`FormValues`](../../../lib/core/src/lib/form/components/widgets/core/form-values.ts) | | Parameter to pass form field values in the start form if one is associated. |
| variables | [`ProcessInstanceVariable`](../../../lib/process-services/src/lib/process-list/models/process-instance-variable.model.ts)`[]` | | Variables in the input to the process [`RestVariable`](https://github.com/Alfresco/alfresco-js-api/blob/develop/src/api/activiti-rest-api/docs/RestVariable.md). |
| Name | Type | Default value | Description |
|-------------------------------|------------------|---------------|------------------------------------------------------------------------------------------------------------------------------------------------------------------|
| appId | `number` | | (optional) Limit the list of processes that can be started to those contained in the specified app. |
| name | `string` | "" | (optional) Name to assign to the current process. |
| processDefinitionName | `string` | | (optional) Definition name of the process to start. |
| processFilterSelector | `boolean` | true | (optional) Parameter to enable selection of process when filtering. |
| showSelectApplicationDropdown | `boolean` | false | (optional) Hide or show application selection dropdown. |
| showSelectProcessDropdown | `boolean` | true | Hide or show the process selection dropdown. |
| title | `string` | | (optional) Define the header of the component. |
| values | `FormValues` | | Parameter to pass form field values in the start form if one is associated. |
| variables | `RestVariable[]` | | Variables in the input to the process [`RestVariable`](https://github.com/Alfresco/alfresco-js-api/blob/develop/src/api/activiti-rest-api/docs/RestVariable.md). |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| applicationSelection | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`AppDefinitionRepresentationModel`](../../../lib/process-services/src/lib/task-list/models/filter.model.ts)`>` | Emitted when application selection changes. |
| cancel | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<void>` | Emitted when the process is canceled. |
| error | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when an error occurs. |
| processDefinitionSelection | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`ProcessDefinitionRepresentation`](https://github.com/Alfresco/alfresco-js-api/blob/develop/src/api/activiti-rest-api/docs/ProcessDefinitionRepresentation.md)`>` | Emitted when process definition selection changes. |
| start | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`ProcessInstance`](../../../lib/process-services/src/lib/process-list/models/process-instance.model.ts)`>` | Emitted when the process starts. |
| Name | Type | Description |
|----------------------------|-------------------------------------------------|----------------------------------------------------|
| applicationSelection | `EventEmitterAppDefinitionRepresentation>` | Emitted when application selection changes. |
| cancel | `EventEmitter<void>` | Emitted when the process is canceled. |
| error | `EventEmitter<any>` | Emitted when an error occurs. |
| processDefinitionSelection | `EventEmitter<ProcessDefinitionRepresentation>` | Emitted when process definition selection changes. |
| start | `EventEmitter<ProcessInstance>` | Emitted when the process starts. |
## Details
@@ -123,8 +123,8 @@ to _alfresco-1002_ as follows:
"application": {
"name": "Alfresco ADF Application"
},
"ecmHost": "http://{hostname}{:port}/ecm",
"bpmHost": "http://{hostname}{:port}/bpm",
"ecmHost": "https://{hostname}{:port}/ecm",
"bpmHost": "https://{hostname}{:port}/bpm",
"logLevel": "silent",
"alfrescoRepositoryName": "alfresco-1002"
}
@@ -135,10 +135,10 @@ You then need to pass the node as the input `values` object with the other prope
```ts
let node: Node = null;
this.nodesApiService.getNode(NODE_ID).subscribe((res) => this.node = res);
this.nodesApiService.getNode(NODE_ID).subscribe((res) => this.node = res);
const formValues: FormValues = {
'file' : node
'file' : node,
'field_one': 'example text'
};
```
@@ -149,20 +149,19 @@ You could pass multiple nodes too:
const nodes: string[] = [NODE_ID_1, NODE_ID_2];
const values: FormValues = {
'files': []
};
'files': []
};
Observable.from(nodes)
.flatMap((nodeId) => this.nodesApiService.getNode(nodeId))
.subscribe(
(node) => {
values.files.push(node);
},
(error) => console.log(error) ,
() => {
this.formValues = values;
});
});
Observable.from(nodes)
.flatMap((nodeId) => this.nodesApiService.getNode(nodeId))
.subscribe(
(node) => {
values.files.push(node);
},
(error) => console.log(error),
() => {
this.formValues = values;
});
```
Note that in the object above, the key `file` is the name of the attach file field in the start form of the process. The value of the `file` property must be a
@@ -211,9 +210,11 @@ When an error occurs, the component will emit an error event that can be used to
```
```ts
class StartProcessComponent {
onError(error) {
this.notificationService.showError(event.response.body.message);
}
}
```
## See also

28
docs/process-services/components/task-filters.component.md
View File

@@ -23,17 +23,17 @@ Shows all available filters.
| ---- | ---- | ------------- | ----------- |
| appId | `number` | | Display filters available to the current user for the application with the specified ID. |
| appName | `string` | | Display filters available to the current user for the application with the specified name. |
| filterParam | [`FilterParamsModel`](../../../lib/process-services/src/lib/task-list/models/filter.model.ts) | | Parameters to use for the task filter. If there is no match then the default filter (the first one the list) is selected. |
| filterParam | `UserTaskFilterRepresentation` | | Parameters to use for the task filter. If there is no match then the default filter (the first one the list) is selected. |
| showIcon | `boolean` | | Toggles display of the filter's icon. |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| error | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when an error occurs during loading. |
| filterClicked | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FilterRepresentationModel`](../../../lib/process-services/src/lib/task-list/models/filter.model.ts)`>` | Emitted when a filter is being clicked from the UI. |
| filterSelected | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FilterRepresentationModel`](../../../lib/process-services/src/lib/task-list/models/filter.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 the list is loaded. |
| Name | Type | Description |
| ---- |-----------------------------------------------------------------------------------------------------------------------------------------------------------------------| ----------- |
| error | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when an error occurs during loading. |
| filterClicked | `EventEmitter<UserTaskFilterRepresentation>` | Emitted when a filter is being clicked from the UI. |
| filterSelected | `EventEmitter<UserTaskFilterRepresentation>` | Emitted when a filter is being selected based on the filterParam input. |
| success | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when the list is loaded. |
## Details
@@ -42,16 +42,14 @@ Shows all available filters.
Use the `filterParam` property to restrict the range of filters that are shown:
```html
<adf-task-filters
[filterParam]="{name:'My tasks'}">
<adf-task-filters [filterParam]="{name:'My tasks'}">
</adf-task-filters>
```
You can use properties from [`FilterParamsModel`](../../../lib/process-services/src/lib/task-list/models/filter.model.ts)
as the value of `filterParam` as shown in the table below:
You can use properties from `UserTaskFilterRepresentation` as the value of `filterParam` as shown in the table below:
| Name | Type | Description |
| ---- | ---- | ----------- |
| id | string | The id of the task filter |
| name | string | The name of the task filter, lowercase is checked |
| Name | Type | Description |
|-------|--------|-----------------------------------------------------|
| id | string | The id of the task filter |
| name | string | The name of the task filter, lowercase is checked |
| index | string | The zero-based position of the filter in the array. |