[ADF-2135] Updated tables of contents (#2822)

This commit is contained in:
Andy Stark
2018-01-12 13:26:11 +00:00
committed by Eugenio Romano
parent 72cfd7894d
commit 69e40ea1c0
17 changed files with 164 additions and 353 deletions

View File

@@ -1,28 +1,26 @@
# Activiti Form component
# Form component
The component shows a Form from Activiti (see it live: [Form Quickstart](https://embed.plnkr.co/YSLXTqb3DtMhVJSqXKkE/))
Shows a Form from APS (see it live: [Form Quickstart](https://embed.plnkr.co/YSLXTqb3DtMhVJSqXKkE/))
<!-- markdown-toc start - Don't edit this section. npm run toc to generate it-->
## Contents
<!-- toc -->
- [Basic Usage](#basic-usage)
- [Basic Usage](#basic-usage)
* [Properties](#properties)
* [Advanced properties](#advanced-properties)
* [Events](#events)
- [Details](#details)
* [Custom empty form template](#custom-empty-form-template)
* [Controlling outcome execution behaviour](#controlling-outcome-execution-behaviour)
* [Field Validators](#field-validators)
- [Other documentation](#other-documentation)
* [Common scenarios](#common-scenarios)
+ [Changing field value based on another field](#changing-field-value-based-on-another-field)
+ [Listen all form Events](#listen-all-form-events)
- [See also](#see-also)
- [Properties](#properties)
- [Advanced properties](#advanced-properties)
- [Events](#events)
<!-- tocstop -->
- [Details](#details)
<!-- markdown-toc end -->
- [Custom empty form template](#custom-empty-form-template)
- [Controlling outcome execution behaviour](#controlling-outcome-execution-behaviour)
- [Field Validators](#field-validators)
- [Other documentation](#other-documentation)
- [Common scenarios](#common-scenarios)
- [See also](#see-also)
## Basic Usage
@@ -104,11 +102,11 @@ and store the form field as metadata. The param nameNode is optional.
### Properties
| Name | Type | Default | Description |
| --- | --- | --- | --- |
| taskId | string | | Task id to fetch corresponding form and values. |
| formId | string | | The id of the form definition to load and display with custom values. |
| formName | string | | Name of the form definition to load and display with custom values. |
| data | FormValues | | Custom form values map to be used with the rendered form. |
| ---- | ---- | ------- | ----------- |
| taskId | string | | Task id to fetch corresponding form and values. |
| formId | string | | The id of the form definition to load and display with custom values. |
| formName | string | | Name of the form definition to load and display with custom values. |
| data | FormValues | | Custom form values map to be used with the rendered form. |
| showTitle | boolean | true | Toggle rendering of the form title. |
| showCompleteButton | boolean | true | Toggle rendering of the `Complete` outcome button. |
| disableCompleteButton | boolean | false | The `Complete` outcome button is shown but it will be disabled. |
@@ -118,28 +116,28 @@ and store the form field as metadata. The param nameNode is optional.
| showRefreshButton | boolean | true | Toggle rendering of the `Refresh` button. |
| showValidationIcon | boolean | true | Toggle rendering of the validation icon next form title. |
| saveMetadata | boolean | false | Store the value of the form as metadata. |
| path | string | | Path of the folder where to store the metadata. |
| path | string | | Path of the folder where to store the metadata. |
| nameNode | string | true | Name to assign to the new node where the metadata are stored. |
| fieldValidators | FormFieldValidator[] | See [Field Validators](#field-validators) section below | Contains a list of form field validator instances. |
| fieldValidators | FormFieldValidator\[] | See [Field Validators](#field-validators) section below | Contains a list of form field validator instances. |
### Advanced properties
The following properties are for complex customisation purposes:
| Name | Type | Default | Description |
| --- | --- | --- | --- |
| form | FormModel | | Underlying form model instance. |
| ---- | ---- | ------- | ----------- |
| form | FormModel | | Underlying form model instance. |
| showDebugButton | boolean | false | Toggle debug options. |
| debugMode | boolean | false | Toggle debug mode, allows displaying additional data for development and debugging purposes. |
### Events
| Name | Return Type | Description |
| --- | --- | --- |
| Name | Return Type | Description |
| ---- | ----------- | ----------- |
| formLoaded | [FormModel](https://github.com/Alfresco/alfresco-ng2-components/blob/master/ng2-components/ng2-activiti-form/src/components/widgets/core/form.model.ts) | Invoked when form is loaded or reloaded. |
| formSaved | [FormModel](https://github.com/Alfresco/alfresco-ng2-components/blob/master/ng2-components/ng2-activiti-form/src/components/widgets/core/form.model.ts) | Invoked when form is submitted with `Save` or custom outcomes. |
| formCompleted | [FormModel](https://github.com/Alfresco/alfresco-ng2-components/blob/master/ng2-components/ng2-activiti-form/src/components/widgets/core/form.model.ts) | Invoked when form is submitted with `Complete` outcome. |
| formDataRefreshed | [FormModel](https://github.com/Alfresco/alfresco-ng2-components/blob/master/ng2-components/ng2-activiti-form/src/components/widgets/core/form.model.ts) | Invoked when form values are refreshed due to a data property change |
| formSaved | [FormModel](https://github.com/Alfresco/alfresco-ng2-components/blob/master/ng2-components/ng2-activiti-form/src/components/widgets/core/form.model.ts) | Invoked when form is submitted with `Save` or custom outcomes. |
| formCompleted | [FormModel](https://github.com/Alfresco/alfresco-ng2-components/blob/master/ng2-components/ng2-activiti-form/src/components/widgets/core/form.model.ts) | Invoked when form is submitted with `Complete` outcome. |
| formDataRefreshed | [FormModel](https://github.com/Alfresco/alfresco-ng2-components/blob/master/ng2-components/ng2-activiti-form/src/components/widgets/core/form.model.ts) | Invoked when form values are refreshed due to a data property change |
| executeOutcome | [FormOutcomeEvent](https://github.com/Alfresco/alfresco-ng2-components/blob/master/ng2-components/ng2-activiti-form/src/components/widgets/core/form-outcome-event.model.ts) | Invoked when any outcome is executed, default behaviour can be prevented via `event.preventDefault()` |
| error | any | Invoked at any error |
@@ -176,7 +174,6 @@ You can add a template that will be show if no form definition has been found
</div>
</adf-form>
```
### Controlling outcome execution behaviour
@@ -225,8 +222,8 @@ export class MyView {
There are two additional functions that can be of a great value when controlling outcomes:
- `saveTaskForm()` - saves current form
- `completeTaskForm(outcome?: string)` - save and complete form with a given outcome name
- `saveTaskForm()` - saves current form
- `completeTaskForm(outcome?: string)` - save and complete form with a given outcome name
**Please note that if `event.preventDefault()` is not called then default outcome behaviour
will also be executed after your custom code.**
@@ -279,12 +276,14 @@ formService.formEvents.subscribe((event: Event) => {
```
<!-- Don't edit the See also section. Edit seeAlsoGraph.json and run config/generateSeeAlso.js -->
<!-- seealso start -->
## See also
- [Stencils](stencils.md)
- [FormFieldValidator](FormFieldValidator.md)
- [Extensibility](extensibility.md)
- [Form rendering service](form-rendering.service.md)
- [Form field model](form-field.model.md)
<!-- seealso end -->
- [Stencils](stencils.md)
- [FormFieldValidator](FormFieldValidator.md)
- [Extensibility](extensibility.md)
- [Form rendering service](form-rendering.service.md)
- [Form field model](form-field.model.md)
<!-- seealso end -->

View File

@@ -4,25 +4,22 @@ Authenticates to Alfresco Content Services and Alfresco Process Services.
![Login component](docassets/images/custom-footer.png)
<!-- markdown-toc start - Don't edit this section. npm run toc to generate it-->
## Contents
<!-- toc -->
- [Basic usage](#basic-usage)
- [Basic usage](#basic-usage)
* [Properties](#properties)
* [Events](#events)
- [Details](#details)
* [Handling events](#handling-events)
* [Change footer content](#change-footer-content)
* [Change header content](#change-header-content)
* [Extra content](#extra-content)
* [Custom logo and background](#custom-logo-and-background)
* [Customize Validation rules](#customize-validation-rules)
* [Controlling form submit execution behaviour](#controlling-form-submit-execution-behaviour)
- [Properties](#properties)
- [Events](#events)
<!-- tocstop -->
- [Details](#details)
<!-- markdown-toc end -->
- [Handling events](#handling-events)
- [Change footer content](#change-footer-content)
- [Change header content](#change-header-content)
- [Extra content](#extra-content)
- [Custom logo and background](#custom-logo-and-background)
- [Customize Validation rules](#customize-validation-rules)
- [Controlling form submit execution behaviour](#controlling-form-submit-execution-behaviour)
## Basic usage
@@ -36,23 +33,23 @@ Authenticates to Alfresco Content Services and Alfresco Process Services.
### Properties
| Name | Type | Default Value | Description |
| --- | --- | --- | --- |
| providers | string | | Possible valid values are ECM, BPM or ALL. The default behaviour of this component will log in only in the ECM . If you want to log in in both systems the correct value to use is ALL. |
| successRoute | string | | Route to redirect to upon successful login. |
| ---- | ---- | ------------- | ----------- |
| providers | string | | Possible valid values are ECM, BPM or ALL. The default behaviour of this component will log in only in the ECM . If you want to log in in both systems the correct value to use is ALL. |
| successRoute | string | | Route to redirect to upon successful login. |
| disableCsrf | boolean | false | To prevent the CSRF Token from being submitted. Only for Alfresco Process Services call |
| needHelpLink | string | | It will change the url of the NEED HELP link in the footer |
| registerLink | string | | It will change the url of the REGISTER link in the footer |
| logoImageUrl | string | \<ADF logo image> | To change the logo image with a customised image |
| copyrightText | string | \<ADF copyright string> | The copyright text below the login box |
| backgroundImageUrl | string | \<ADF background image> | To change the background image with a customised image |
| fieldsValidation | { [key: string]: any; }, extra?: { [key: string]: any; } | | Use it to customise the validation rules of the login form |
| needHelpLink | string | | It will change the url of the NEED HELP link in the footer |
| registerLink | string | | It will change the url of the REGISTER link in the footer |
| logoImageUrl | string | \\<ADF logo image> | To change the logo image with a customised image |
| copyrightText | string | \\<ADF copyright string> | The copyright text below the login box |
| backgroundImageUrl | string | \\<ADF background image> | To change the background image with a customised image |
| fieldsValidation | { [key: string]&#x3A; any; }, extra?: { [key: string]&#x3A; any; } | | Use it to customise the validation rules of the login form |
| showRememberMe | boolean | false | Toggle `Remember me` checkbox visibility |
| showLoginActions | boolean | false | Toggle extra actions visibility (`Need Help`, `Register`, etc.) |
### Events
| Name | Description |
| --- | --- |
| ---- | ----------- |
| success | Raised when the login is done |
| error | Raised when the login fails |
| executeSubmit | Raised when the form is submitted |

View File

@@ -2,16 +2,6 @@
Logs the user out when the decorated element is clicked.
<!-- markdown-toc start - Don't edit this section. npm run toc to generate it-->
<!-- toc -->
- [Basic Usage](#basic-usage)
<!-- tocstop -->
<!-- markdown-toc end -->
## Basic Usage
```html
@@ -19,8 +9,10 @@ Logs the user out when the decorated element is clicked.
```
<!-- Don't edit the See also section. Edit seeAlsoGraph.json and run config/generateSeeAlso.js -->
<!-- seealso start -->
## See also
- [Login component](login.component.md)
<!-- seealso end -->
- [Login component](login.component.md)
<!-- seealso end -->

View File

@@ -2,30 +2,14 @@
Selectively disables an HTML element or Angular component
<!-- markdown-toc start - Don't edit this section. npm run toc to generate it-->
<!-- toc -->
- [Basic Usage](#basic-usage)
* [Properties](#properties)
- [Details](#details)
* [HTML element example](#html-element-example)
* [Angular component example](#angular-component-example)
* [Implementing the NodePermissionSubject interface](#implementing-the-nodepermissionsubject-interface)
* [Defining your components as an EXTENDIBLE_COMPONENT parent component](#defining-your-components-as-an-extendible_component-parent-component)
<!-- tocstop -->
<!-- markdown-toc end -->
## Basic Usage
### Properties
| Name | Type | Default | Description |
| --- | --- | --- | --- |
| adf-node-permission | [Permissions](https://github.com/Alfresco/alfresco-ng2-components/blob/master/ng2-components/ng2-alfresco-core/src/models/permissions.enum.ts) | null | Node permission to check (create, delete, update, updatePermissions, !create, !delete, !update, !updatePermissions)|
| adf-nodes | MinimalNodeEntity[] | [] | Nodes to check permission for |
| ---- | ---- | ------- | ----------- |
| adf-node-permission | [Permissions](https://github.com/Alfresco/alfresco-ng2-components/blob/master/ng2-components/ng2-alfresco-core/src/models/permissions.enum.ts) | null | Node permission to check (create, delete, update, updatePermissions, !create, !delete, !update, !updatePermissions) |
| adf-nodes | MinimalNodeEntity\[] | \[] | Nodes to check permission for |
## Details
@@ -34,8 +18,8 @@ by taking a collection of the `MinimalNodeEntity` instances and checking the par
The decorated element will be disabled if:
- there are no nodes in the collection
- at least one of the nodes has no expected permission
- there are no nodes in the collection
- at least one of the nodes has no expected permission
### HTML element example
@@ -94,8 +78,8 @@ The directive will look up the component in the dependency injection tree, up to
> "The host component is typically the component requesting the dependency. **But when this component is projected into a parent component, that parent component becomes the host.**"
- because of this, you have to provide your component with forward referencing as the EXTENDIBLE_COMPONENT.
- because of the emphasized second sentence you have to provide your component as a viewProvider.
- because of this, you have to provide your component with forward referencing as the EXTENDIBLE_COMPONENT.
- because of the emphasized second sentence you have to provide your component as a viewProvider.
```js
import { EXTENDIBLE_COMPONENT } from '@alfresco/adf-core';

View File

@@ -2,22 +2,6 @@
Accesses and manipulates ACS document nodes using their node IDs.
<!-- markdown-toc start - Don't edit this section. npm run toc to generate it-->
<!-- toc -->
- [Methods](#methods)
- [Details](#details)
* [Getting node information](#getting-node-information)
* [Getting folder node contents](#getting-folder-node-contents)
* [Creating and updating nodes](#creating-and-updating-nodes)
* [Deleting and restoring nodes](#deleting-and-restoring-nodes)
- [See also](#see-also)
<!-- tocstop -->
<!-- markdown-toc end -->
## Methods
`getNode(nodeId: string, options: any = {}): Observable<MinimalNodeEntryEntity>`<br/>
@@ -169,11 +153,13 @@ pages in the Alfresco JS API for further details and options. Note that you can
[Deleted Nodes Api service](deleted-nodes-api.service.md) get a list of all items currently in the trashcan.
<!-- Don't edit the See also section. Edit seeAlsoGraph.json and run config/generateSeeAlso.js -->
<!-- seealso start -->
## See also
- [Document library model](document-library.model.md)
- [Deleted nodes api service](deleted-nodes-api.service.md)
- [Document list component](document-list.component.md)
- [Node service](node.service.md)
<!-- seealso end -->
- [Document library model](document-library.model.md)
- [Deleted nodes api service](deleted-nodes-api.service.md)
- [Document list component](document-list.component.md)
- [Node service](node.service.md)
<!-- seealso end -->

View File

@@ -2,16 +2,6 @@
Shows a notification message with optional feedback.
<!-- markdown-toc start - Don't edit this section. npm run toc to generate it-->
<!-- toc -->
- [Details](#details)
<!-- tocstop -->
<!-- markdown-toc end -->
## Details
The Notification Service is implemented on top of the Angular Material Design snackbar.

View File

@@ -4,19 +4,6 @@ Adds pagination to the component it is used with.
![](docassets/images/basic.png)
<!-- markdown-toc start - Don't edit this section. npm run toc to generate it-->
<!-- toc -->
- [Basic Usage](#basic-usage)
* [Properties](#properties)
* [Events](#events)
- [Details](#details)
<!-- tocstop -->
<!-- markdown-toc end -->
## Basic Usage
```html
@@ -43,20 +30,20 @@ Adds pagination to the component it is used with.
### Properties
| Name | Type | Default | Description |
| --- | --- | --- | --- |
| pagination | Pagination | | Pagination object |
| supportedPageSizes | Array&lt;number&gt; | [ 25, 50, 100 ] | An array of page sizes |
| target | PaginatedComponent | | Component that provides custom pagination support |
| ---- | ---- | ------- | ----------- |
| pagination | Pagination | | Pagination object |
| supportedPageSizes | Array&lt;number> | [ 25, 50, 100 ] | An array of page sizes |
| target | PaginatedComponent | | Component that provides custom pagination support |
### Events
| Name | Type | Description |
| --- | --- | --- |
| change | EventEmitter&lt;PaginationQueryParams&gt; | Triggered for any action in pagination |
| nextPage | EventEmitter&lt;Pagination&gt; | Triggered on next page action |
| prevPage | EventEmitter&lt;Pagination&gt; | Triggered on previous page action |
| changePageSize | EventEmitter&lt;Pagination&gt; | Triggered on page size change action |
| changePageNumber | EventEmitter&lt;Pagination&gt; | Triggered on page change action |
| ---- | ---- | ----------- |
| change | EventEmitter&lt;PaginationQueryParams> | Triggered for any action in pagination |
| nextPage | EventEmitter&lt;Pagination> | Triggered on next page action |
| prevPage | EventEmitter&lt;Pagination> | Triggered on previous page action |
| changePageSize | EventEmitter&lt;Pagination> | Triggered on page size change action |
| changePageNumber | EventEmitter&lt;Pagination> | Triggered on page change action |
## Details
@@ -83,4 +70,4 @@ export interface PaginatedComponent {
```
Your component needs to provide a `pagination` subject to allow Pagination component to reflect to changes.
Every time user interacts with the Pagination, it will call the `updatePagination` method and pass the parameters.
Every time user interacts with the Pagination, it will call the `updatePagination` method and pass the parameters.

View File

@@ -2,19 +2,6 @@
Searches users/people.
<!-- markdown-toc start - Don't edit this section. npm run toc to generate it-->
<!-- toc -->
- [Basic Usage](#basic-usage)
* [Properties](#properties)
* [Events](#events)
- [Details](#details)
<!-- tocstop -->
<!-- markdown-toc end -->
## Basic Usage
```html
@@ -24,27 +11,26 @@ Searches users/people.
### Properties
| Name | Type | Description |
| --- | --- | --- |
| results | Observable<User[]> | The params to show people list |
| ---- | ---- | ----------- |
| results | Observable&lt;User\[]> | The params to show people list |
### Events
| Name | Description |
| --- | --- |
| searchPeople | Raised when the search people with new keyword |
| success | Raised when select the user and click action button |
| closeSearch | Raised when click the clse button |
| ---- | ----------- |
| searchPeople | Raised when the search people with new keyword |
| success | Raised when select the user and click action button |
| closeSearch | Raised when click the clse button |
## Details
```html
```html
<adf-people-search
(searchPeople)="searchUser($event)"
(success)="involveUser($event)"
(closeSearch)="onCloseSearch()"
[results]="peopleSearch$">
<header-title>{{ 'TASK_DETAILS.LABELS.ADD_PEOPLE' | translate }}</header-title>
<action-button-label>{{ 'PEOPLE.ADD_USER' | translate }}</action-button-label>
</adf-people-search>
(searchPeople)="searchUser($event)"
(success)="involveUser($event)"
(closeSearch)="onCloseSearch()"
[results]="peopleSearch$">
<header-title>{{ 'TASK_DETAILS.LABELS.ADD_PEOPLE' | translate }}</header-title>
<action-button-label>{{ 'PEOPLE.ADD_USER' | translate }}</action-button-label>
</adf-people-search>
```

View File

@@ -1,24 +1,21 @@
# Task People Component
# People Component
Displays involved users to a specified task
Displays users involved with a specified task
<!-- markdown-toc start - Don't edit this section. npm run toc to generate it-->
## Contents
<!-- toc -->
- [Basic Usage](#basic-usage)
- [Basic Usage](#basic-usage)
* [Properties](#properties)
* [Events](#events)
- [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)
- [Properties](#properties)
- [Events](#events)
<!-- tocstop -->
- [Details](#details)
<!-- markdown-toc end -->
- [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)
## Basic Usage
@@ -35,8 +32,8 @@ Displays involved users to a specified task
### Properties
| Name | Type | Description |
| --- | --- | --- |
| people | User[] | The array of User object to display |
| ---- | ---- | ----------- |
| people | User\[] | The array of User object to display |
| taskId | string | The numeric ID of the task |
| readOnly | boolean | The boolean flag |
@@ -49,8 +46,9 @@ No Events
### How to customize the people component behavior
The people component provide two methods to customize the behavior:
- involveUserAndCloseSearch: The selected user is going to be added and the search section closed
- involveUserWithoutCloseSearch: The selected user is going to be added without close the search section
- involveUserAndCloseSearch: The selected user is going to be added and the search section closed
- involveUserWithoutCloseSearch: The selected user is going to be added without close the search section
In this way will be easy customize the people component to involve the user with the single or double click event:

View File

@@ -2,17 +2,6 @@
Displays comments associated with a particular process instance and allows the user to add new comments
<!-- markdown-toc start - Don't edit this section. npm run toc to generate it-->
<!-- toc -->
- [Basic Usage](#basic-usage)
* [Properties](#properties)
<!-- tocstop -->
<!-- markdown-toc end -->
## Basic Usage
```html
@@ -24,5 +13,5 @@ Displays comments associated with a particular process instance and allows the u
### Properties
| Name | Type | Description |
| --- | --- | --- |
| ---- | ---- | ----------- |
| processInstanceId | string | (**required**): The numeric ID of the process instance to display comments for |

View File

@@ -2,18 +2,6 @@
Displays detailed information on a specified process instance
<!-- markdown-toc start - Don't edit this section. npm run toc to generate it-->
<!-- toc -->
- [Basic Usage](#basic-usage)
* [Properties](#properties)
* [Events](#events)
<!-- tocstop -->
<!-- markdown-toc end -->
## Basic Usage
```html
@@ -25,13 +13,13 @@ Displays detailed information on a specified process instance
### Properties
| Name | Type | Description |
| --- | --- | --- |
| ---- | ---- | ----------- |
| processInstanceId | string | (required): The numeric ID of the process instance to display |
### Events
| Name | Description |
| --- | --- |
| ---- | ----------- |
| processCancelledEmitter | Raised when the current process is cancelled by the user from within the component |
| taskFormCompletedEmitter | Raised when the form associated with an active task is completed from within the component |
| showProcessDiagram | Raised when the show diagram button is clicked |
| showProcessDiagram | Raised when the show diagram button is clicked |

View File

@@ -4,18 +4,6 @@ Sub-component of the process details component, which renders some general infor
![adf-process-instance-header](docassets/images/adf-process-instance-header-attachment.png)
<!-- markdown-toc start - Don't edit this section. npm run toc to generate it-->
<!-- toc -->
- [Basic Usage](#basic-usage)
* [Properties](#properties)
+ [Events](#events)
<!-- tocstop -->
<!-- markdown-toc end -->
## Basic Usage
```html
@@ -26,10 +14,10 @@ Sub-component of the process details component, which renders some general infor
### Properties
| Name | Type| Description |
| --- | --- | --- |
| Name | Type | Description |
| ---- | ---- | ----------- |
| processInstance | [ProcessInstanceModel](https://github.com/Alfresco/alfresco-ng2-components/blob/master/ng2-components/ng2-activiti-processlist/src/models/process-instance.model.ts) | (**required**): Full details of the process instance to display information about |
#### Events
This component does not define any events.
This component does not define any events.

View File

@@ -2,18 +2,6 @@
Lists both the active and completed tasks associated with a particular process instance
<!-- markdown-toc start - Don't edit this section. npm run toc to generate it-->
<!-- toc -->
- [Basic Usage](#basic-usage)
* [Properties](#properties)
* [Events](#events)
<!-- tocstop -->
<!-- markdown-toc end -->
## Basic Usage
```html
@@ -26,12 +14,12 @@ Lists both the active and completed tasks associated with a particular process i
### Properties
| Name | Type | Description |
| --- | --- | --- |
| ---- | ---- | ----------- |
| processInstanceId | string | (**required**): The ID of the process instance to display tasks for |
| showRefreshButton | boolean | (default: `true`): Whether to show a refresh button next to the list of tasks to allow this to be updated from the server |
### Events
| Name | Description |
| --- | --- |
| ---- | ----------- |
| taskFormCompletedEmitter | Raised when the form associated with an active task is completed from within the component |

View File

@@ -1,19 +1,6 @@
# Activiti Process Instance List
# Process Instance List
This component renders a list containing all the process instances matched by the parameters specified.
<!-- markdown-toc start - Don't edit this section. npm run toc to generate it-->
<!-- toc -->
- [Basic Usage](#basic-usage)
* [Properties](#properties)
* [Events](#events)
- [Details](#details)
<!-- tocstop -->
<!-- markdown-toc end -->
Renders a list containing all the process instances matched by the parameters specified.
## Basic Usage
@@ -58,28 +45,26 @@ define custom schema in the app.config.json as shown below json format.
[presetColumn]="'customSchema'">
</adf-process-instance-list>
```
### Properties
| Name | Description |
| --- | --- |
| appId | The id of the app. |
| processDefinitionKey | The processDefinitionKey of the process. |
| presetColumn | string || The presetColumn of the custom schema to fetch. |
| state | Define state of the processes. Possible values are `running`, `completed` and `all` |
| sort | Define sort of the processes. Possible values are `created-desc`, `created-asc`, `ended-desc`, `ended-asc` |
| schemaColumn | List of columns to display in the process instances datatable (see the [Details](#details) section below) |
| Name | Description | | |
| ---- | ----------- | --- | --- |
| appId | The id of the app. | | |
| processDefinitionKey | The processDefinitionKey of the process. | | |
| presetColumn | string | | The presetColumn of the custom schema to fetch. |
| state | Define state of the processes. Possible values are `running`, `completed` and `all` | | |
| sort | Define sort of the processes. Possible values are `created-desc`, `created-asc`, `ended-desc`, `ended-asc` | | |
| schemaColumn | List of columns to display in the process instances datatable (see the [Details](#details) section below) | | |
### Events
| Name | Description |
| --- | --- |
| ---- | ----------- |
| rowClick | Emitted when a row in the process list is clicked |
| success | Emitted when the list of process instances has been loaded successfully from the server |
| error | Emitted when an error is encountered loading the list of process instances from the server |
## Details
Example value for the schemaColumn property (see [Properties](#properties) section above):

View File

@@ -4,20 +4,6 @@ Displays a input text which shows find-as-you-type suggestions.
![adf-search-control](docassets/images/search-control-component.png)
<!-- markdown-toc start - Don't edit this section. npm run toc to generate it-->
<!-- toc -->
- [Basic usage](#basic-usage)
* [Properties](#properties)
* [Events](#events)
- [Details](#details)
<!-- tocstop -->
<!-- markdown-toc end -->
## Basic usage
```html
@@ -31,20 +17,20 @@ Displays a input text which shows find-as-you-type suggestions.
### Properties
| Name | Type | Default | Description |
| --- | --- | --- | --- |
| searchTerm | string | | Search term to pre-populate the field with |
| inputType | string | "text" | Type of the input field to render, e.g. "search" or "text" (default) |
| autocomplete | boolean | true | Whether the browser should offer field auto-completion for the input field to the user. |
| highlight | boolean | false | Use the true value if you want to see the searched word highlighted. |
| expandable | boolean | true | Whether to use an expanding search control, if false then a regular input is used. |
| liveSearchEnabled | boolean | true | Whether find-as-you-type suggestions should be offered for matching content items. Set to false to disable. |
| liveSearchMaxResults | number | 5 | Maximum number of results to show in the live search. |
| customQueryBody | [QueryBody](https://github.com/Alfresco/alfresco-js-api/blob/1.6.0/src/alfresco-search-rest-api/docs/QueryBody.md) | | object which allow you to perform more elaborated query from the search api |
| ---- | ---- | ------- | ----------- |
| searchTerm | string | | Search term to pre-populate the field with |
| inputType | string | "text" | Type of the input field to render, e.g. "search" or "text" (default) |
| autocomplete | boolean | true | Whether the browser should offer field auto-completion for the input field to the user. |
| highlight | boolean | false | Use the true value if you want to see the searched word highlighted. |
| expandable | boolean | true | Whether to use an expanding search control, if false then a regular input is used. |
| liveSearchEnabled | boolean | true | Whether find-as-you-type suggestions should be offered for matching content items. Set to false to disable. |
| liveSearchMaxResults | number | 5 | Maximum number of results to show in the live search. |
| customQueryBody | [QueryBody](https://github.com/Alfresco/alfresco-js-api/blob/1.6.0/src/alfresco-search-rest-api/docs/QueryBody.md) | | object which allow you to perform more elaborated query from the search api |
### Events
| Name | Description |
| --- | --- |
| ---- | ----------- |
| searchChange | Emitted when the search term is changed. The search term is provided in the 'value' property of the returned object. If the term is less than three characters in length then the term is truncated to an empty string. |
| submit | Emitted when the search is submitted pressing ENTER button. The search term is provided as value of the event. |
| optionClicked | Emitted when a file item from the list of find-as-you-type results is selected |

View File

@@ -4,22 +4,6 @@ Simple container for headers, titles, actions and breadcrumbs.
![](docassets/images/adf-toolbar-01.png)
<!-- markdown-toc start - Don't edit this section. npm run toc to generate it-->
<!-- toc -->
- [Basic Usage](#basic-usage)
* [Properties](#properties)
- [Details](#details)
* [Custom title](#custom-title)
* [Divider](#divider)
* [Dropdown menu](#dropdown-menu)
* [Custom color](#custom-color)
<!-- tocstop -->
<!-- markdown-toc end -->
## Basic Usage
```html
@@ -36,9 +20,9 @@ Simple container for headers, titles, actions and breadcrumbs.
### Properties
| Name | Type | Default | Description |
| --- | --- | --- | --- |
| title | string | | Toolbar title |
| color | string | | Toolbar color, can be changed to empty value (default), `primary`, `accent` or `warn`. |
| ---- | ---- | ------- | ----------- |
| title | string | | Toolbar title |
| color | string | | Toolbar color, can be changed to empty value (default), `primary`, `accent` or `warn`. |
## Details
@@ -120,4 +104,4 @@ For example:
![](docassets/images/adf-toolbar-06.png)
![](docassets/images/adf-toolbar-07.png)
![](docassets/images/adf-toolbar-07.png)

View File

@@ -2,22 +2,6 @@
Allows your components or common HTML elements reacting on File drag and drop in order to upload content.
<!-- markdown-toc start - Don't edit this section. npm run toc to generate it-->
<!-- toc -->
- [Basic usage](#basic-usage)
- [Details](#details)
* [Modes](#modes)
+ [Click mode](#click-mode)
+ [Drop mode](#drop-mode)
* [Events](#events)
* [Styling](#styling)
<!-- tocstop -->
<!-- markdown-toc end -->
## Basic usage
The directive itself does not do any file management process,
@@ -55,8 +39,8 @@ Used by attaching to an element or component.
Directive supports several modes:
- **drop** mode, where decorated element acts like a drop zone for files (**default** mode)
- **click** mode, where decorated element invokes File Dialog to select files or folders.
- **drop** mode, where decorated element acts like a drop zone for files (**default** mode)
- **click** mode, where decorated element invokes File Dialog to select files or folders.
It is also possible combining modes together.
@@ -70,9 +54,9 @@ It is also possible combining modes together.
For the click mode you can provide additional attributes for the File Dialog:
- **directory**, enables directory selection
- **multiple**, enables multiple file/folder selection
- **accept**, filters the content accepted
- **directory**, enables directory selection
- **multiple**, enables multiple file/folder selection
- **accept**, filters the content accepted
```html
<div style="width: 50px; height: 50px; background-color: brown"
@@ -174,4 +158,4 @@ for example you may want drawing a dashed border around the table row on drag:
.adf-upload__dragging > td:last-child {
border-right: 1px dashed rgb(68,138,255);
}
```
```