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

[ADF-3977] EditProcessComponent - Be able to change the sort and actions (#4250)

Browse Source 
* [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
This commit is contained in:
siva kumar
2019-03-13 22:40:19 +05:30
committed by Eugenio Romano
parent 2b5b915d55
commit bc5208b767
12 changed files with 425 additions and 128 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
demo-shell/src/app.config.json
View File

@@ -575,6 +575,12 @@
"state", "assignment", "sort", "order" "state", "assignment", "sort", "order"
] ]
}, },
"adf-edit-process-filter": {
"filterProperties": [ "status", "sort", "order", "processName" ],
"sortProperties": [ "id", "name", "status", "startDate" ],
"actions": ["save", "saveAs", "delete"]
},
"content-metadata": { "content-metadata": {
"presets": { "presets": {
"default": { "default": {

4
demo-shell/src/app/components/app-layout/cloud/processes-cloud-demo.component.html
View File

@@ -2,7 +2,9 @@
<adf-cloud-edit-process-filter <adf-cloud-edit-process-filter
[appName]="appName" [appName]="appName"
[id]="filterId" [id]="filterId"
[filterProperties]="processFilterProperties" [filterProperties]="processFilterProperties.filterProperties"
[sortProperties]="processFilterProperties.sortProperties"
[actions]="processFilterProperties.actions"
(filterChange)="onFilterChange($event)" (filterChange)="onFilterChange($event)"
(action)="onProcessFilterAction($event)"> (action)="onProcessFilterAction($event)">
</adf-cloud-edit-process-filter> </adf-cloud-edit-process-filter>

6
demo-shell/src/app/components/app-layout/cloud/processes-cloud-demo.component.ts
View File

@@ -33,8 +33,8 @@ import { CloudLayoutService } from './services/cloud-layout.service';
}) })
export class ProcessesCloudDemoComponent implements OnInit { export class ProcessesCloudDemoComponent implements OnInit {
public static ACTION_SAVE_AS = 'SAVE_AS'; public static ACTION_SAVE_AS = 'saveAs';
static PROCESS_FILTER_PROPERTY_KEYS = 'adf-edit-process-filter.properties'; static PROCESS_FILTER_PROPERTY_KEYS = 'adf-edit-process-filter';
@ViewChild('processCloud') @ViewChild('processCloud')
processCloud: ProcessListCloudComponent; processCloud: ProcessListCloudComponent;
@@ -52,7 +52,7 @@ export class ProcessesCloudDemoComponent implements OnInit {
selectionMode: string; selectionMode: string;
selectedRows: string[] = []; selectedRows: string[] = [];
testingMode: boolean; testingMode: boolean;
processFilterProperties: any[] = []; processFilterProperties: any = { filterProperties: [], sortProperties: [], actions: [] };
editedFilter: ProcessFilterCloudModel; editedFilter: ProcessFilterCloudModel;

101
docs/process-services-cloud/edit-process-filter-cloud.component.md
View File

@@ -20,6 +20,8 @@ Shows Process Filter Details.
- [Details](#details) - [Details](#details)
- [Editing APS2 process filters](#editing-aps2-process-filters) - [Editing APS2 process filters](#editing-aps2-process-filters)
- [Filter properties](#filter-properties) - [Filter properties](#filter-properties)
- [Sort properties](#sort-properties)
- [Action properties](#action-properties)
- [See also](#see-also) - [See also](#see-also)
## Basic Usage ## Basic Usage
@@ -40,17 +42,19 @@ Shows Process Filter Details.
| Name | Type | Default value | Description | | Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- | | ---- | ---- | ------------- | ----------- |
| actions | `string[]` | | List of sort actions. |
| appName | `string` | | The name of the application. | | appName | `string` | | The name of the application. |
| filterProperties | `string[]` | | List of process filter properties to display | | filterProperties | `string[]` | | List of process filter properties to display |
| id | `string` | | Id of the process instance filter. | | id | `string` | | Id of the process instance filter. |
| showFilterActions | `boolean` | true | Toggles editing of process filter actions. | | showFilterActions | `boolean` | true | Toggles editing of process filter actions. |
| showTitle | `boolean` | true | Toggles editing of the process filter title. | | showTitle | `boolean` | true | Toggles editing of the process filter title. |
| sortProperties | `string[]` | | List of sort properties to display. |
### Events ### Events
| Name | Type | Description | | Name | Type | Description |
| ---- | ---- | ----------- | | ---- | ---- | ----------- |
| action | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`ProcessFilterActionType`](../../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. | | 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. | | 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. |
## Details ## Details
@@ -78,23 +82,21 @@ given below:
| **_processInstanceId_** | Process instance ID | | **_processInstanceId_** | Process instance ID |
| **_processName_** | Process name. | | **_processName_** | Process name. |
| **_initiator_** | ID of the user who initiated the process | | **_initiator_** | ID of the user who initiated the process |
| **_state_** | Execution state of the process. | | **_status_** | Execution status of the process. |
| **_processDefinitionId_** | Process definition ID | | **_processDefinitionId_** | Process definition ID |
| **_processDefinitionKey_** | Process definition key | | **_processDefinitionKey_** | Process definition key |
| **_lastModifiedFrom_** | Finds processes modified _after_ this date | | **_lastModified_** | Date the process was last modified. If lastModified defined the component will show the range **_lastModifiedTo_**, **_lastModifiedFrom_**|
| **_lastModifiedTo_** | Finds processes modified _before_ this date | | **_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". | | **_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) | | **_order_** | Sort ordering of the filter results (this doesn't participate in the filtering itself) |
By default, the **_state_**, **_sort_** and **_order_** properties are By default, the **_status_**, **_sort_** and **_order_** properties are
displayed in the editor. However, you can also choose which properties displayed in the editor. However, you can also choose which properties
to show using the `filterProperties` array. to show using the `filterProperties` array.
For example, the code below initializes the editor with the **_appName_**, For example, the code below initializes the editor with the **_appName_**,
**_processInstanceId_**, **_startDate_** and **_lastModified_** properties: **_processInstanceId_**, **_startDate_** and **_lastModified_** properties:
```ts ```ts
import { UserProcessModel } from '@alfresco/adf-core';
export class SomeComponent implements OnInit { export class SomeComponent implements OnInit {
filterProperties: string[] = [ filterProperties: string[] = [
@@ -107,15 +109,94 @@ export class SomeComponent implements OnInit {
console.log('On filter change: ', filter); console.log('On filter change: ', filter);
} }
onAction($event: ProcessFilterActionType) { onAction($event: ProcessFilterAction) {
console.log('Clicked action: ', $event); console.log('Clicked action: ', $event);
} }
``` ```
```html
<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. With this configuration, only the four listed properties will be shown.
**Note:** Currently, the `sort` property has a limited set of properties ### Sort properties
to choose from: **_id_**, **_name_**, **_status_** and **_startDate_**.
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:
```ts
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);
}
```
```html
<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:
```ts
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);
}
```
```html
<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.
## See also ## See also

12
e2e/pages/adf/process-cloud/editProcessFilterCloudComponent.ts
View File

@@ -46,13 +46,13 @@ export class EditProcessFilterCloudComponent {
return this; return this;
} }
setStateFilterDropDown(option) { setStatusFilterDropDown(option) {
this.clickOnDropDownArrow('state'); this.clickOnDropDownArrow('status');
let stateElement = element.all(by.cssContainingText('mat-option span', option)).first(); let statusElement = element.all(by.cssContainingText('mat-option span', option)).first();
Util.waitUntilElementIsClickable(stateElement); Util.waitUntilElementIsClickable(statusElement);
Util.waitUntilElementIsVisible(stateElement); Util.waitUntilElementIsVisible(statusElement);
stateElement.click(); statusElement.click();
return this; return this;
} }

4
e2e/process-services-cloud/process-custom-filters.e2e.ts
View File

@@ -94,7 +94,7 @@ describe('Process list cloud', () => {
}); });
it('[C290069] Should display processes ordered by name when Name is selected from sort dropdown', async() => { it('[C290069] Should display processes ordered by name when Name is selected from sort dropdown', async() => {
processCloudDemoPage.editProcessFilterCloudComponent().clickCustomiseFilterHeader().setStateFilterDropDown('RUNNING') processCloudDemoPage.editProcessFilterCloudComponent().clickCustomiseFilterHeader().setStatusFilterDropDown('RUNNING')
.setSortFilterDropDown('NAME').setOrderFilterDropDown('ASC'); .setSortFilterDropDown('NAME').setOrderFilterDropDown('ASC');
processCloudDemoPage.processListCloudComponent().getAllRowsNameColumn().then(function (list) { processCloudDemoPage.processListCloudComponent().getAllRowsNameColumn().then(function (list) {
let initialList = list.slice(0); let initialList = list.slice(0);
@@ -112,7 +112,7 @@ describe('Process list cloud', () => {
}); });
it('[C291783] Should display processes ordered by id when Id is selected from sort dropdown', async() => { it('[C291783] Should display processes ordered by id when Id is selected from sort dropdown', async() => {
processCloudDemoPage.editProcessFilterCloudComponent().clickCustomiseFilterHeader().setStateFilterDropDown('RUNNING') processCloudDemoPage.editProcessFilterCloudComponent().clickCustomiseFilterHeader().setStatusFilterDropDown('RUNNING')
.setSortFilterDropDown('ID').setOrderFilterDropDown('ASC'); .setSortFilterDropDown('ID').setOrderFilterDropDown('ASC');
processCloudDemoPage.processListCloudComponent().getDataTable().checkSpinnerIsDisplayed().checkSpinnerIsNotDisplayed(); processCloudDemoPage.processListCloudComponent().getDataTable().checkSpinnerIsDisplayed().checkSpinnerIsNotDisplayed();
processCloudDemoPage.getAllRowsByIdColumn().then(function (list) { processCloudDemoPage.getAllRowsByIdColumn().then(function (list) {

16
lib/process-services-cloud/src/lib/process/process-filters/components/edit-process-filter-cloud.component.html
View File

@@ -6,14 +6,8 @@
<span *ngIf="showTitle"> {{ 'ADF_CLOUD_EDIT_PROCESS_FILTER.TITLE' | translate}}</span> <span *ngIf="showTitle"> {{ 'ADF_CLOUD_EDIT_PROCESS_FILTER.TITLE' | translate}}</span>
<div *ngIf="showActions()" class="adf-cloud-edit-process-filter-actions"> <div *ngIf="showActions()" class="adf-cloud-edit-process-filter-actions">
<ng-container *ngIf="toggleFilterActions"> <ng-container *ngIf="toggleFilterActions">
<button mat-icon-button matTooltip="{{'ADF_CLOUD_EDIT_PROCESS_FILTER.TOOL_TIP.SAVE' | translate}}" [disabled]="!formHasBeenChanged" id="adf-save-id" (click)="onSave()"> <button *ngFor="let filterAction of processFilterActions" mat-icon-button matTooltip="{{ filterAction.tooltip | translate}}" [attr.data-automation-id]="'adf-filter-action-' + filterAction.actionType" [disabled]="hasFormChanged(filterAction)" (click)="executeFilterActions(filterAction)">
<mat-icon>save</mat-icon> <mat-icon>{{filterAction.icon}}</mat-icon>
</button>
<button mat-icon-button matTooltip="{{'ADF_CLOUD_EDIT_PROCESS_FILTER.TOOL_TIP.SAVE_AS' | translate}}" [disabled]="!formHasBeenChanged" id="adf-save-as-id" (click)="onSaveAs()">
<mat-icon>unarchive</mat-icon>
</button>
<button mat-icon-button matTooltip="{{'ADF_CLOUD_EDIT_PROCESS_FILTER.TOOL_TIP.DELETE' | translate}}" id="adf-delete-id" (click)="onDelete()">
<mat-icon>delete</mat-icon>
</button> </button>
</ng-container> </ng-container>
</div> </div>
@@ -27,7 +21,7 @@
placeholder="{{processFilterProperty.label | translate}}" placeholder="{{processFilterProperty.label | translate}}"
[formControlName]="processFilterProperty.key" [formControlName]="processFilterProperty.key"
[attr.data-automation-id]="'adf-cloud-edit-process-property-' + processFilterProperty.key"> [attr.data-automation-id]="'adf-cloud-edit-process-property-' + processFilterProperty.key">
<mat-option *ngFor="let propertyOption of processFilterProperty.options" [value]="propertyOption.value" [attr.data-automation-id]="'adf-cloud-edit-process-property-options' + processFilterProperty.key"> <mat-option *ngFor="let propertyOption of processFilterProperty.options" [value]="propertyOption.value" [attr.data-automation-id]="'adf-cloud-edit-process-property-options-' + processFilterProperty.key">
{{ propertyOption.label }} {{ propertyOption.label }}
</mat-option> </mat-option>
</mat-select> </mat-select>
@@ -49,8 +43,8 @@
placeholder="{{processFilterProperty.label | translate}}" placeholder="{{processFilterProperty.label | translate}}"
[formControlName]="processFilterProperty.key" [formControlName]="processFilterProperty.key"
[attr.data-automation-id]="'adf-cloud-edit-process-property-' + processFilterProperty.key"> [attr.data-automation-id]="'adf-cloud-edit-process-property-' + processFilterProperty.key">
<mat-datepicker-toggle matSuffix [for]="dateController" [attr.data-automation-id]="'adf-cloud-edit-process-property-date-toggle' + processFilterProperty.key"></mat-datepicker-toggle> <mat-datepicker-toggle matSuffix [for]="dateController" [attr.data-automation-id]="'adf-cloud-edit-process-property-date-toggle-' + processFilterProperty.key"></mat-datepicker-toggle>
<mat-datepicker #dateController [attr.data-automation-id]="'adf-cloud-edit-process-property-date-picker' + processFilterProperty.key"></mat-datepicker> <mat-datepicker #dateController [attr.data-automation-id]="'adf-cloud-edit-process-property-date-picker-' + processFilterProperty.key"></mat-datepicker>
<div class="adf-edit-process-filter-date-error-container"> <div class="adf-edit-process-filter-date-error-container">
<div *ngIf="hasError(processFilterProperty)"> <div *ngIf="hasError(processFilterProperty)">
<div class="adf-error-text">{{'ADF_CLOUD_EDIT_PROCESS_FILTER.ERROR.DATE' | translate}}</div> <div class="adf-error-text">{{'ADF_CLOUD_EDIT_PROCESS_FILTER.ERROR.DATE' | translate}}</div>

167
lib/process-services-cloud/src/lib/process/process-filters/components/edit-process-filter-cloud.component.spec.ts
View File

@@ -44,10 +44,9 @@ describe('EditProcessFilterCloudComponent', () => {
name: 'FakeRunningProcess', name: 'FakeRunningProcess',
icon: 'adjust', icon: 'adjust',
id: 'mock-process-filter-id', id: 'mock-process-filter-id',
state: 'RUNNING', status: 'RUNNING',
appName: 'mock-app-name', appName: 'mock-app-name',
processDefinitionId: 'process-def-id', processDefinitionId: 'process-def-id',
assignment: 'fake-involved',
order: 'ASC', order: 'ASC',
sort: 'id' sort: 'id'
}); });
@@ -85,7 +84,7 @@ describe('EditProcessFilterCloudComponent', () => {
expect(getProcessFilterByIdSpy).toHaveBeenCalled(); expect(getProcessFilterByIdSpy).toHaveBeenCalled();
expect(component.processFilter.name).toEqual('FakeRunningProcess'); expect(component.processFilter.name).toEqual('FakeRunningProcess');
expect(component.processFilter.icon).toEqual('adjust'); expect(component.processFilter.icon).toEqual('adjust');
expect(component.processFilter.state).toEqual('RUNNING'); expect(component.processFilter.status).toEqual('RUNNING');
expect(component.processFilter.order).toEqual('ASC'); expect(component.processFilter.order).toEqual('ASC');
expect(component.processFilter.sort).toEqual('id'); expect(component.processFilter.sort).toEqual('id');
}); });
@@ -118,7 +117,7 @@ describe('EditProcessFilterCloudComponent', () => {
it('should create editProcessFilter form', async(() => { it('should create editProcessFilter form', async(() => {
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => { fixture.whenStable().then(() => {
const stateController = component.editProcessFilterForm.get('state'); const stateController = component.editProcessFilterForm.get('status');
const sortController = component.editProcessFilterForm.get('sort'); const sortController = component.editProcessFilterForm.get('sort');
const orderController = component.editProcessFilterForm.get('order'); const orderController = component.editProcessFilterForm.get('order');
expect(component.editProcessFilterForm).toBeDefined(); expect(component.editProcessFilterForm).toBeDefined();
@@ -138,7 +137,7 @@ describe('EditProcessFilterCloudComponent', () => {
expansionPanel.click(); expansionPanel.click();
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => { fixture.whenStable().then(() => {
let saveButton = fixture.debugElement.nativeElement.querySelector('#adf-save-id'); let saveButton = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-filter-action-save"]');
expect(saveButton.disabled).toBe(true); expect(saveButton.disabled).toBe(true);
}); });
})); }));
@@ -149,7 +148,7 @@ describe('EditProcessFilterCloudComponent', () => {
expansionPanel.click(); expansionPanel.click();
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => { fixture.whenStable().then(() => {
let saveButton = fixture.debugElement.nativeElement.querySelector('#adf-save-as-id'); let saveButton = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-filter-action-saveAs"]');
expect(saveButton.disabled).toBe(true); expect(saveButton.disabled).toBe(true);
}); });
})); }));
@@ -160,7 +159,7 @@ describe('EditProcessFilterCloudComponent', () => {
expansionPanel.click(); expansionPanel.click();
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => { fixture.whenStable().then(() => {
let deleteButton = fixture.debugElement.nativeElement.querySelector('#adf-delete-id'); let deleteButton = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-filter-action-delete"]');
expect(deleteButton.disabled).toBe(false); expect(deleteButton.disabled).toBe(false);
}); });
})); }));
@@ -171,14 +170,14 @@ describe('EditProcessFilterCloudComponent', () => {
let expansionPanel = fixture.debugElement.nativeElement.querySelector('mat-expansion-panel-header'); let expansionPanel = fixture.debugElement.nativeElement.querySelector('mat-expansion-panel-header');
expansionPanel.click(); expansionPanel.click();
fixture.detectChanges(); fixture.detectChanges();
let stateElement = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-cloud-edit-process-property-state"]'); let stateElement = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-cloud-edit-process-property-status"]');
let sortElement = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-cloud-edit-process-property-sort"]'); let sortElement = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-cloud-edit-process-property-sort"]');
let orderElement = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-cloud-edit-process-property-order"]'); let orderElement = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-cloud-edit-process-property-order"]');
expect(stateElement).toBeDefined(); expect(stateElement).toBeDefined();
expect(sortElement).toBeDefined(); expect(sortElement).toBeDefined();
expect(orderElement).toBeDefined(); expect(orderElement).toBeDefined();
expect(stateElement.innerText.trim()).toBe('RUNNING'); expect(stateElement.innerText.trim()).toBe('RUNNING');
expect(sortElement.innerText.trim()).toBe('ID'); expect(sortElement.innerText.trim()).toBe('Id');
expect(orderElement.innerText.trim()).toBe('ASC'); expect(orderElement.innerText.trim()).toBe('ASC');
}); });
})); }));
@@ -187,10 +186,10 @@ describe('EditProcessFilterCloudComponent', () => {
fixture.detectChanges(); fixture.detectChanges();
let expansionPanel = fixture.debugElement.nativeElement.querySelector('mat-expansion-panel-header'); let expansionPanel = fixture.debugElement.nativeElement.querySelector('mat-expansion-panel-header');
expansionPanel.click(); expansionPanel.click();
let stateElement = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-cloud-edit-process-property-state"] .mat-select-trigger'); let stateElement = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-cloud-edit-process-property-status"] .mat-select-trigger');
stateElement.click(); stateElement.click();
fixture.detectChanges(); fixture.detectChanges();
const saveButton = fixture.debugElement.nativeElement.querySelector('#adf-save-id'); const saveButton = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-filter-action-save"]');
const options = fixture.debugElement.queryAll(By.css('.mat-option-text')); const options = fixture.debugElement.queryAll(By.css('.mat-option-text'));
options[2].nativeElement.click(); options[2].nativeElement.click();
fixture.detectChanges(); fixture.detectChanges();
@@ -203,7 +202,7 @@ describe('EditProcessFilterCloudComponent', () => {
fixture.detectChanges(); fixture.detectChanges();
let expansionPanel = fixture.debugElement.nativeElement.querySelector('mat-expansion-panel-header'); let expansionPanel = fixture.debugElement.nativeElement.querySelector('mat-expansion-panel-header');
expansionPanel.click(); expansionPanel.click();
const stateElement = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-cloud-edit-process-property-state"] .mat-select-trigger'); const stateElement = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-cloud-edit-process-property-status"] .mat-select-trigger');
stateElement.click(); stateElement.click();
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => { fixture.whenStable().then(() => {
@@ -237,6 +236,9 @@ describe('EditProcessFilterCloudComponent', () => {
expect(orderOptions.length).toEqual(2); expect(orderOptions.length).toEqual(2);
}); });
})); }));
});
describe('Process filterProperties', () => {
it('should able to build a editProcessFilter form with default properties if input is empty', async(() => { it('should able to build a editProcessFilter form with default properties if input is empty', async(() => {
let processFilterIDchange = new SimpleChange(undefined, 'mock-process-filter-id', true); let processFilterIDchange = new SimpleChange(undefined, 'mock-process-filter-id', true);
@@ -244,12 +246,12 @@ describe('EditProcessFilterCloudComponent', () => {
component.filterProperties = []; component.filterProperties = [];
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => { fixture.whenStable().then(() => {
const stateController = component.editProcessFilterForm.get('state'); const stateController = component.editProcessFilterForm.get('status');
const sortController = component.editProcessFilterForm.get('sort'); const sortController = component.editProcessFilterForm.get('sort');
const orderController = component.editProcessFilterForm.get('order'); const orderController = component.editProcessFilterForm.get('order');
fixture.detectChanges(); fixture.detectChanges();
expect(component.processFilterProperties).toBeDefined(); expect(component.processFilterProperties).toBeDefined();
expect(component.processFilterProperties.length).toBe(3); expect(component.processFilterProperties.length).toBe(4);
expect(component.editProcessFilterForm).toBeDefined(); expect(component.editProcessFilterForm).toBeDefined();
expect(stateController).toBeDefined(); expect(stateController).toBeDefined();
expect(sortController).toBeDefined(); expect(sortController).toBeDefined();
@@ -259,18 +261,13 @@ describe('EditProcessFilterCloudComponent', () => {
expect(orderController.value).toBe('ASC'); expect(orderController.value).toBe('ASC');
}); });
})); }));
});
describe('Process filterProperties', () => {
beforeEach(() => {
component.filterProperties = ['appName', 'processInstanceId', 'processName'];
});
it('should able to fetch running applications when appName property defined in the input', async(() => { it('should able to fetch running applications when appName property defined in the input', async(() => {
fixture.detectChanges(); fixture.detectChanges();
let processFilterIDchange = new SimpleChange(undefined, 'mock-process-filter-id', true); let processFilterIDchange = new SimpleChange(undefined, 'mock-process-filter-id', true);
component.ngOnChanges({'id': processFilterIDchange}); component.ngOnChanges({'id': processFilterIDchange});
fixture.detectChanges();
component.filterProperties = ['appName', 'processName'];
const appController = component.editProcessFilterForm.get('appName'); const appController = component.editProcessFilterForm.get('appName');
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => { fixture.whenStable().then(() => {
@@ -280,26 +277,54 @@ describe('EditProcessFilterCloudComponent', () => {
}); });
})); }));
it('should able to build a editProcessFilter form with given input properties', async(() => { it('should able to filter filterProperties when input is defined', async(() => {
fixture.detectChanges(); component.id = 'mock-process-filter-id';
getProcessFilterByIdSpy.and.returnValue({ appName: 'mock-app-name', processInstanceId: 'process-instance-id', processName: 'mock-process-name' });
let processFilterIDchange = new SimpleChange(undefined, 'mock-process-filter-id', true); let processFilterIDchange = new SimpleChange(undefined, 'mock-process-filter-id', true);
component.ngOnChanges({'id': processFilterIDchange}); component.ngOnChanges({'id': processFilterIDchange});
fixture.detectChanges(); component.filterProperties = ['appName', 'processName'];
const appController = component.editProcessFilterForm.get('appName');
const processNameController = component.editProcessFilterForm.get('processName');
const processInsIdController = component.editProcessFilterForm.get('processInstanceId');
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => { fixture.whenStable().then(() => {
fixture.detectChanges(); fixture.detectChanges();
expect(getRunningApplicationsSpy).toHaveBeenCalled(); expect(component.processFilterProperties.length).toBe(2);
expect(component.processFilterProperties).toBeDefined(); });
expect(component.editProcessFilterForm).toBeDefined(); }));
expect(component.processFilterProperties.length).toBe(3); });
expect(appController).toBeDefined();
expect(processNameController).toBeDefined(); describe('sort properties', () => {
expect(processInsIdController).toBeDefined();
expect(appController.value).toBe('mock-app-name'); it('should display default sort properties', async(() => {
fixture.detectChanges();
let processFilterIdchange = new SimpleChange(undefined, 'mock-process-filter-id', true);
component.ngOnChanges({ 'id': processFilterIdchange});
fixture.detectChanges();
let expansionPanel = fixture.debugElement.nativeElement.querySelector('mat-expansion-panel-header');
expansionPanel.click();
fixture.detectChanges();
let sortElement = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-cloud-edit-process-property-sort"]');
sortElement.click();
fixture.detectChanges();
fixture.whenStable().then(() => {
const sortController = component.editProcessFilterForm.get('sort');
const sortOptions = fixture.debugElement.queryAll(By.css('.mat-option-text'));
expect(sortController).toBeDefined();
expect(sortController.value).toBe('id');
expect(sortOptions.length).toEqual(4);
});
}));
it('should display sort properties when sort properties are specified', async(() => {
component.sortProperties = ['id', 'processName', 'processDefinitionId'];
fixture.detectChanges();
let processFilterIdchange = new SimpleChange(undefined, 'mock-process-filter-id', true);
component.ngOnChanges({ 'id': processFilterIdchange});
fixture.detectChanges();
fixture.whenStable().then(() => {
fixture.detectChanges();
const sortController = component.editProcessFilterForm.get('sort');
const sortProperties = component.processFilterProperties[1].options;
fixture.detectChanges();
expect(sortController).toBeDefined();
expect(sortProperties.length).toBe(3);
}); });
})); }));
}); });
@@ -321,10 +346,10 @@ describe('EditProcessFilterCloudComponent', () => {
const expansionPanel = fixture.debugElement.nativeElement.querySelector('mat-expansion-panel-header'); const expansionPanel = fixture.debugElement.nativeElement.querySelector('mat-expansion-panel-header');
expansionPanel.click(); expansionPanel.click();
fixture.detectChanges(); fixture.detectChanges();
const stateElement = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-cloud-edit-process-property-state"] .mat-select-trigger'); const stateElement = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-cloud-edit-process-property-status"] .mat-select-trigger');
stateElement.click(); stateElement.click();
fixture.detectChanges(); fixture.detectChanges();
const saveButton = fixture.debugElement.nativeElement.querySelector('#adf-save-id'); const saveButton = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-filter-action-save"]');
const stateOptions = fixture.debugElement.queryAll(By.css('.mat-option-text')); const stateOptions = fixture.debugElement.queryAll(By.css('.mat-option-text'));
stateOptions[2].nativeElement.click(); stateOptions[2].nativeElement.click();
saveButton.click(); saveButton.click();
@@ -344,10 +369,10 @@ describe('EditProcessFilterCloudComponent', () => {
const expansionPanel = fixture.debugElement.nativeElement.querySelector('mat-expansion-panel-header'); const expansionPanel = fixture.debugElement.nativeElement.querySelector('mat-expansion-panel-header');
expansionPanel.click(); expansionPanel.click();
fixture.detectChanges(); fixture.detectChanges();
const stateElement = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-cloud-edit-process-property-state"] .mat-select-trigger'); const stateElement = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-cloud-edit-process-property-status"] .mat-select-trigger');
stateElement.click(); stateElement.click();
fixture.detectChanges(); fixture.detectChanges();
const deleteButton = fixture.debugElement.nativeElement.querySelector('#adf-delete-id'); const deleteButton = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-filter-action-delete"]');
deleteButton.click(); deleteButton.click();
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => { fixture.whenStable().then(() => {
@@ -365,10 +390,10 @@ describe('EditProcessFilterCloudComponent', () => {
const expansionPanel = fixture.debugElement.nativeElement.querySelector('mat-expansion-panel-header'); const expansionPanel = fixture.debugElement.nativeElement.querySelector('mat-expansion-panel-header');
expansionPanel.click(); expansionPanel.click();
fixture.detectChanges(); fixture.detectChanges();
const stateElement = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-cloud-edit-process-property-state"] .mat-select-trigger'); const stateElement = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-cloud-edit-process-property-status"] .mat-select-trigger');
stateElement.click(); stateElement.click();
fixture.detectChanges(); fixture.detectChanges();
const saveButton = fixture.debugElement.nativeElement.querySelector('#adf-save-as-id'); const saveButton = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-filter-action-saveAs"]');
const stateOptions = fixture.debugElement.queryAll(By.css('.mat-option-text')); const stateOptions = fixture.debugElement.queryAll(By.css('.mat-option-text'));
stateOptions[2].nativeElement.click(); stateOptions[2].nativeElement.click();
fixture.detectChanges(); fixture.detectChanges();
@@ -380,5 +405,63 @@ describe('EditProcessFilterCloudComponent', () => {
expect(dialog.open).toHaveBeenCalled(); expect(dialog.open).toHaveBeenCalled();
}); });
})); }));
it('should display default filter actions', async(() => {
fixture.detectChanges();
component.toggleFilterActions = true;
let expansionPanel = fixture.debugElement.nativeElement.querySelector('mat-expansion-panel-header');
expansionPanel.click();
fixture.detectChanges();
fixture.whenStable().then(() => {
fixture.detectChanges();
const saveAsButton = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-filter-action-saveAs"]');
const saveButton = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-filter-action-save"]');
const deleteButton = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-filter-action-delete"]');
expect(component.processFilterActions).toBeDefined();
expect(component.processFilterActions.length).toBe(3);
expect(saveButton).toBeDefined();
expect(saveAsButton).toBeDefined();
expect(deleteButton).toBeDefined();
expect(saveButton.disabled).toBeTruthy();
expect(saveAsButton.disabled).toBeTruthy(false);
expect(deleteButton.disabled).toBe(false);
});
}));
it('should filter actions when input actions are specified', async(() => {
component.actions = ['save'];
fixture.detectChanges();
let processFilterIDchange = new SimpleChange(undefined, 'mock-process-filter-id', true);
component.ngOnChanges({'id': processFilterIDchange});
fixture.detectChanges();
fixture.whenStable().then(() => {
expect(component.processFilterActions).toBeDefined();
expect(component.actions.length).toBe(1);
expect(component.processFilterActions.length).toBe(1);
});
}));
it('should display default filter actions when input is empty', async(() => {
fixture.detectChanges();
component.actions = [];
component.toggleFilterActions = true;
fixture.detectChanges();
let expansionPanel = fixture.debugElement.nativeElement.querySelector('mat-expansion-panel-header');
expansionPanel.click();
fixture.detectChanges();
fixture.whenStable().then(() => {
const saveAsButton = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-filter-action-saveAs"]');
const saveButton = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-filter-action-save"]');
const deleteButton = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-filter-action-delete"]');
expect(component.processFilterActions).toBeDefined();
expect(component.processFilterActions.length).toBe(3);
expect(saveButton).toBeDefined();
expect(saveAsButton).toBeDefined();
expect(deleteButton).toBeDefined();
expect(saveButton.disabled).toBeTruthy();
expect(saveAsButton.disabled).toBeTruthy(false);
expect(deleteButton.disabled).toBe(false);
});
}));
}); });
}); });

198
lib/process-services-cloud/src/lib/process/process-filters/components/edit-process-filter-cloud.component.ts
View File

@@ -23,7 +23,7 @@ import moment from 'moment-es6';
import { ApplicationInstanceModel } from '../../../app/models/application-instance.model'; import { ApplicationInstanceModel } from '../../../app/models/application-instance.model';
import { AppsProcessCloudService } from '../../../app/services/apps-process-cloud.service'; import { AppsProcessCloudService } from '../../../app/services/apps-process-cloud.service';
import { ProcessFilterCloudModel, ProcessFilterActionType, ProcessFilterProperties } from '../models/process-filter-cloud.model'; import { ProcessFilterCloudModel, ProcessFilterProperties, ProcessFilterAction, ProcessFilterOptions } from '../models/process-filter-cloud.model';
import { TranslationService } from '@alfresco/adf-core'; import { TranslationService } from '@alfresco/adf-core';
import { ProcessFilterCloudService } from '../services/process-filter-cloud.service'; import { ProcessFilterCloudService } from '../services/process-filter-cloud.service';
import { ProcessFilterDialogCloudComponent } from './process-filter-dialog-cloud.component'; import { ProcessFilterDialogCloudComponent } from './process-filter-dialog-cloud.component';
@@ -35,12 +35,17 @@ import { ProcessFilterDialogCloudComponent } from './process-filter-dialog-cloud
}) })
export class EditProcessFilterCloudComponent implements OnChanges { export class EditProcessFilterCloudComponent implements OnChanges {
public static ACTION_SAVE = 'SAVE'; public static ACTION_SAVE = 'save';
public static ACTION_SAVE_AS = 'SAVE_AS'; public static ACTION_SAVE_AS = 'saveAs';
public static ACTION_DELETE = 'DELETE'; public static ACTION_DELETE = 'delete';
public static APPLICATION_NAME: string = 'appName'; public static APPLICATION_NAME: string = 'appName';
public static APP_RUNNING_STATUS: string = 'Running'; public static APP_RUNNING_STATUS: string = 'Running';
public static DEFAULT_PROCESS_FILTER_PROPERTIES = ['state', 'sort', 'order']; public static LAST_MODIFIED: string = 'lastModified';
public static SORT: string = 'sort';
public static ORDER: string = 'order';
public static DEFAULT_PROCESS_FILTER_PROPERTIES = ['status', 'sort', 'order'];
public static DEFAULT_SORT_PROPERTIES = ['id', 'name', 'status', 'startDate'];
public static DEFAULT_ACTIONS = ['save', 'saveAs', 'delete'];
public FORMAT_DATE: string = 'DD/MM/YYYY'; public FORMAT_DATE: string = 'DD/MM/YYYY';
/** The name of the application. */ /** The name of the application. */
@@ -53,7 +58,15 @@ export class EditProcessFilterCloudComponent implements OnChanges {
/** List of process filter properties to display */ /** List of process filter properties to display */
@Input() @Input()
filterProperties: string[] = EditProcessFilterCloudComponent.DEFAULT_PROCESS_FILTER_PROPERTIES; // default ['state', 'sort', 'order'] filterProperties: string[] = EditProcessFilterCloudComponent.DEFAULT_PROCESS_FILTER_PROPERTIES;
/** List of sort properties to display. */
@Input()
sortProperties: string[] = EditProcessFilterCloudComponent.DEFAULT_SORT_PROPERTIES;
/** List of sort actions. */
@Input()
actions: string[] = EditProcessFilterCloudComponent.DEFAULT_ACTIONS;
/** Toggles editing of process filter actions. */ /** Toggles editing of process filter actions. */
@Input() @Input()
@@ -69,18 +82,11 @@ export class EditProcessFilterCloudComponent implements OnChanges {
/** Emitted when a filter action occurs i.e Save, SaveAs, Delete. */ /** Emitted when a filter action occurs i.e Save, SaveAs, Delete. */
@Output() @Output()
action: EventEmitter<ProcessFilterActionType> = new EventEmitter(); action: EventEmitter<ProcessFilterAction> = new EventEmitter();
processFilter: ProcessFilterCloudModel; processFilter: ProcessFilterCloudModel;
changedProcessFilter: ProcessFilterCloudModel; changedProcessFilter: ProcessFilterCloudModel;
columns = [
{ value: 'id', label: 'ID' },
{ value: 'name', label: 'NAME' },
{ value: 'status', label: 'STATUS' },
{ value: 'startDate', label: 'START DATE' }
];
status = [ status = [
{ label: 'ALL', value: '' }, { label: 'ALL', value: '' },
{ label: 'RUNNING', value: 'RUNNING' }, { label: 'RUNNING', value: 'RUNNING' },
@@ -91,7 +97,8 @@ export class EditProcessFilterCloudComponent implements OnChanges {
applicationNames: any[] = []; applicationNames: any[] = [];
formHasBeenChanged = false; formHasBeenChanged = false;
editProcessFilterForm: FormGroup; editProcessFilterForm: FormGroup;
processFilterProperties: any[] = []; processFilterProperties: ProcessFilterProperties[] = [];
processFilterActions: ProcessFilterAction[] = [];
toggleFilterActions: boolean = false; toggleFilterActions: boolean = false;
constructor( constructor(
@@ -105,6 +112,7 @@ export class EditProcessFilterCloudComponent implements OnChanges {
const id = changes['id']; const id = changes['id'];
if (id && id.currentValue !== id.previousValue) { if (id && id.currentValue !== id.previousValue) {
this.processFilterProperties = this.createAndFilterProperties(); this.processFilterProperties = this.createAndFilterProperties();
this.processFilterActions = this.createAndFilterActions();
this.buildForm(this.processFilterProperties); this.buildForm(this.processFilterProperties);
} }
} }
@@ -145,7 +153,7 @@ export class EditProcessFilterCloudComponent implements OnChanges {
}); });
} }
createAndFilterProperties() { createAndFilterProperties(): ProcessFilterProperties[] {
this.checkMandatoryFilterProperties(); this.checkMandatoryFilterProperties();
if (this.checkForApplicationNameProperty()) { if (this.checkForApplicationNameProperty()) {
this.applicationNames = []; this.applicationNames = [];
@@ -153,7 +161,15 @@ export class EditProcessFilterCloudComponent implements OnChanges {
} }
this.processFilter = this.retrieveProcessFilter(); this.processFilter = this.retrieveProcessFilter();
const defaultProperties = this.createProcessFilterProperties(this.processFilter); const defaultProperties = this.createProcessFilterProperties(this.processFilter);
return defaultProperties.filter((filterProperty: ProcessFilterProperties) => this.isValidProperty(this.filterProperties, filterProperty)); let filteredProperties = defaultProperties.filter((filterProperty: ProcessFilterProperties) => this.isValidProperty(this.filterProperties, filterProperty));
if (!this.hasSortProperty()) {
filteredProperties = this.removeOrderProperty(filteredProperties);
}
if (this.hasLastModifiedProperty()) {
filteredProperties = [...filteredProperties, ...this.createLastModifiedProperty()];
}
return filteredProperties;
} }
checkMandatoryFilterProperties() { checkMandatoryFilterProperties() {
@@ -170,6 +186,54 @@ export class EditProcessFilterCloudComponent implements OnChanges {
return filterProperties ? filterProperties.indexOf(filterProperty.key) >= 0 : true; return filterProperties ? filterProperties.indexOf(filterProperty.key) >= 0 : true;
} }
hasSortProperty(): boolean {
return this.filterProperties.indexOf(EditProcessFilterCloudComponent.SORT) >= 0;
}
hasLastModifiedProperty(): boolean {
return this.filterProperties.indexOf(EditProcessFilterCloudComponent.LAST_MODIFIED) >= 0;
}
removeOrderProperty(filteredProperties: ProcessFilterProperties[]) {
if (filteredProperties && filteredProperties.length > 0) {
const propertiesWithOutOrderProperty = filteredProperties.filter(
(property: ProcessFilterProperties) => {
return property.key !== EditProcessFilterCloudComponent.ORDER;
});
return propertiesWithOutOrderProperty;
}
}
createSortProperties(): any {
this.checkMandatorySortProperties();
const sortProperties = this.sortProperties.map((property: string) => {
return <ProcessFilterOptions> { label: property.charAt(0).toUpperCase() + property.slice(1), value: property };
});
return sortProperties;
}
checkMandatorySortProperties() {
if (this.sortProperties === undefined || this.sortProperties.length === 0) {
this.sortProperties = EditProcessFilterCloudComponent.DEFAULT_SORT_PROPERTIES;
}
}
createAndFilterActions() {
this.checkMandatoryActions();
const actions = this.createFilterActions();
return actions.filter((action: ProcessFilterAction) => this.isValidAction(this.actions, action));
}
checkMandatoryActions() {
if (this.actions === undefined || this.actions.length === 0) {
this.actions = EditProcessFilterCloudComponent.DEFAULT_ACTIONS;
}
}
private isValidAction(actions: string[], action: any): boolean {
return actions ? actions.indexOf(action.actionType) >= 0 : true;
}
isFormValid(): boolean { isFormValid(): boolean {
return this.editProcessFilterForm.valid; return this.editProcessFilterForm.valid;
} }
@@ -220,27 +284,39 @@ export class EditProcessFilterCloudComponent implements OnChanges {
}); });
} }
executeFilterActions(action: ProcessFilterAction): void {
if (action.actionType === EditProcessFilterCloudComponent.ACTION_SAVE) {
this.save(action);
} else if (action.actionType === EditProcessFilterCloudComponent.ACTION_SAVE_AS) {
this.saveAs(action);
} else if (action.actionType === EditProcessFilterCloudComponent.ACTION_DELETE) {
this.delete(action);
}
}
/** /**
* Save a process instance filter * Save a process instance filter
*/ */
onSave() { save(saveAction: ProcessFilterAction) {
this.processFilterCloudService.updateFilter(this.changedProcessFilter); this.processFilterCloudService.updateFilter(this.changedProcessFilter);
this.action.emit({ actionType: EditProcessFilterCloudComponent.ACTION_SAVE, filter: this.changedProcessFilter }); saveAction.filter = this.changedProcessFilter;
this.action.emit(saveAction);
this.formHasBeenChanged = this.compareFilters(this.changedProcessFilter, this.processFilter); this.formHasBeenChanged = this.compareFilters(this.changedProcessFilter, this.processFilter);
} }
/** /**
* Delete a process instance filter * Delete a process instance filter
*/ */
onDelete() { delete(deleteAction: ProcessFilterAction) {
this.processFilterCloudService.deleteFilter(this.processFilter); this.processFilterCloudService.deleteFilter(this.processFilter);
this.action.emit({ actionType: EditProcessFilterCloudComponent.ACTION_DELETE, filter: this.processFilter }); deleteAction.filter = this.processFilter;
this.action.emit(deleteAction);
} }
/** /**
* Save As a process instance filter * Save As a process instance filter
*/ */
onSaveAs() { saveAs(saveAsAction: ProcessFilterAction) {
const dialogRef = this.dialog.open(ProcessFilterDialogCloudComponent, { const dialogRef = this.dialog.open(ProcessFilterDialogCloudComponent, {
data: { data: {
name: this.translateService.instant(this.processFilter.name) name: this.translateService.instant(this.processFilter.name)
@@ -260,7 +336,8 @@ export class EditProcessFilterCloudComponent implements OnChanges {
}; };
const resultFilter: ProcessFilterCloudModel = Object.assign({}, this.changedProcessFilter, newFilter); const resultFilter: ProcessFilterCloudModel = Object.assign({}, this.changedProcessFilter, newFilter);
this.processFilterCloudService.addFilter(resultFilter); this.processFilterCloudService.addFilter(resultFilter);
this.action.emit({ actionType: EditProcessFilterCloudComponent.ACTION_SAVE_AS, filter: resultFilter }); saveAsAction.filter = resultFilter;
this.action.emit(saveAsAction);
} }
}); });
} }
@@ -307,6 +384,55 @@ export class EditProcessFilterCloudComponent implements OnChanges {
return property.type === 'text'; return property.type === 'text';
} }
hasFormChanged(action: any): boolean {
if (action.actionType === EditProcessFilterCloudComponent.ACTION_SAVE) {
return !this.formHasBeenChanged;
}
if (action.actionType === EditProcessFilterCloudComponent.ACTION_SAVE_AS) {
return !this.formHasBeenChanged;
}
if (action.actionType === EditProcessFilterCloudComponent.ACTION_DELETE) {
return false;
}
}
createFilterActions(): ProcessFilterAction[] {
return [
new ProcessFilterAction({
actionType: EditProcessFilterCloudComponent.ACTION_SAVE,
icon: 'save',
tooltip: 'ADF_CLOUD_EDIT_PROCESS_FILTER.TOOL_TIP.SAVE'
}),
new ProcessFilterAction({
actionType: EditProcessFilterCloudComponent.ACTION_SAVE_AS,
icon: 'unarchive',
tooltip: 'ADF_CLOUD_EDIT_PROCESS_FILTER.TOOL_TIP.SAVE_AS'
}),
new ProcessFilterAction({
actionType: EditProcessFilterCloudComponent.ACTION_DELETE,
icon: 'delete',
tooltip: 'ADF_CLOUD_EDIT_PROCESS_FILTER.TOOL_TIP.DELETE'
})
];
}
createLastModifiedProperty(): ProcessFilterProperties[] {
return [
new ProcessFilterProperties({
label: 'ADF_CLOUD_EDIT_PROCESS_FILTER.LABEL.LAST_MODIFIED_DATE_FORM',
type: 'date',
key: 'lastModifiedFrom',
value: ''
}),
new ProcessFilterProperties({
label: 'ADF_CLOUD_EDIT_PROCESS_FILTER.LABEL.LAST_MODIFIED_TO',
type: 'date',
key: 'lastModifiedTo',
value: ''
})
];
}
createProcessFilterProperties(currentProcessFilter: ProcessFilterCloudModel): ProcessFilterProperties[] { createProcessFilterProperties(currentProcessFilter: ProcessFilterCloudModel): ProcessFilterProperties[] {
return [ return [
new ProcessFilterProperties({ new ProcessFilterProperties({
@@ -337,8 +463,8 @@ export class EditProcessFilterCloudComponent implements OnChanges {
new ProcessFilterProperties({ new ProcessFilterProperties({
label: 'ADF_CLOUD_EDIT_PROCESS_FILTER.LABEL.STATUS', label: 'ADF_CLOUD_EDIT_PROCESS_FILTER.LABEL.STATUS',
type: 'select', type: 'select',
key: 'state', key: 'status',
value: currentProcessFilter.state || this.status[0].value, value: currentProcessFilter.status || this.status[0].value,
options: this.status options: this.status
}), }),
new ProcessFilterProperties({ new ProcessFilterProperties({
@@ -353,24 +479,12 @@ export class EditProcessFilterCloudComponent implements OnChanges {
key: 'processDefinitionKey', key: 'processDefinitionKey',
value: currentProcessFilter.processDefinitionKey || '' value: currentProcessFilter.processDefinitionKey || ''
}), }),
new ProcessFilterProperties({
label: 'ADF_CLOUD_EDIT_PROCESS_FILTER.LABEL.LAST_MODIFIED_DATE_FORM',
type: 'date',
key: 'lastModifiedFrom',
value: ''
}),
new ProcessFilterProperties({
label: 'ADF_CLOUD_EDIT_PROCESS_FILTER.LABEL.LAST_MODIFIED_TO',
type: 'date',
key: 'lastModifiedTo',
value: ''
}),
new ProcessFilterProperties({ new ProcessFilterProperties({
label: 'ADF_CLOUD_EDIT_PROCESS_FILTER.LABEL.SORT', label: 'ADF_CLOUD_EDIT_PROCESS_FILTER.LABEL.SORT',
type: 'select', type: 'select',
key: 'sort', key: 'sort',
value: currentProcessFilter.sort || this.columns[0].value, value: currentProcessFilter.sort || this.createSortProperties[0].value,
options: this.columns options: this.createSortProperties()
}), }),
new ProcessFilterProperties({ new ProcessFilterProperties({
label: 'ADF_CLOUD_EDIT_PROCESS_FILTER.LABEL.DIRECTION', label: 'ADF_CLOUD_EDIT_PROCESS_FILTER.LABEL.DIRECTION',
@@ -378,6 +492,12 @@ export class EditProcessFilterCloudComponent implements OnChanges {
key: 'order', key: 'order',
value: currentProcessFilter.order || this.directions[0].value, value: currentProcessFilter.order || this.directions[0].value,
options: this.directions options: this.directions
}),
new ProcessFilterProperties({
label: 'ADF_CLOUD_EDIT_PROCESS_FILTER.LABEL.START_DATE',
type: 'date',
key: 'startDate',
value: ''
}) })
]; ];
} }

6
lib/process-services-cloud/src/lib/process/process-filters/components/process-filters-cloud.component.spec.ts
View File

@@ -36,21 +36,21 @@ describe('ProcessFiltersCloudComponent', () => {
name: 'FakeAllProcesses', name: 'FakeAllProcesses',
icon: 'adjust', icon: 'adjust',
id: '10', id: '10',
state: '' status: ''
}), }),
new ProcessFilterCloudModel({ new ProcessFilterCloudModel({
name: 'FakeRunningProcesses', name: 'FakeRunningProcesses',
key: 'FakeRunningProcesses', key: 'FakeRunningProcesses',
icon: 'inbox', icon: 'inbox',
id: '11', id: '11',
state: 'RUNNING' status: 'RUNNING'
}), }),
new ProcessFilterCloudModel({ new ProcessFilterCloudModel({
name: 'FakeCompletedProcesses', name: 'FakeCompletedProcesses',
key: 'completed-processes', key: 'completed-processes',
icon: 'done', icon: 'done',
id: '12', id: '12',
state: 'COMPLETED' status: 'COMPLETED'
}) })
]; ];

17
lib/process-services-cloud/src/lib/process/process-filters/models/process-filter-cloud.model.ts
View File

@@ -24,7 +24,7 @@ export class ProcessFilterCloudModel {
appName: string; appName: string;
processName: string; processName: string;
initiator: string; initiator: string;
state: string; status: string;
sort: string; sort: string;
order: string; order: string;
processDefinitionId: string; processDefinitionId: string;
@@ -45,7 +45,7 @@ export class ProcessFilterCloudModel {
this.appName = obj.appName || null; this.appName = obj.appName || null;
this.processName = obj.processName || null; this.processName = obj.processName || null;
this.initiator = obj.initiator || null; this.initiator = obj.initiator || null;
this.state = obj.state || null; this.status = obj.status || null;
this.sort = obj.sort || null; this.sort = obj.sort || null;
this.order = obj.order || null; this.order = obj.order || null;
this.processDefinitionId = obj.processDefinitionId || null; this.processDefinitionId = obj.processDefinitionId || null;
@@ -59,9 +59,20 @@ export class ProcessFilterCloudModel {
} }
} }
export interface ProcessFilterActionType { export class ProcessFilterAction {
actionType: string; actionType: string;
icon: string;
tooltip: string;
filter: ProcessFilterCloudModel; filter: ProcessFilterCloudModel;
constructor(obj?: any) {
if (obj) {
this.actionType = obj.actionType || null;
this.icon = obj.icon || null;
this.tooltip = obj.tooltip || null;
this.filter = obj.filter || null;
}
}
} }
export interface ProcessFilterOptions { export interface ProcessFilterOptions {

6
lib/process-services-cloud/src/lib/process/process-filters/services/process-filter-cloud.service.ts
View File

@@ -142,7 +142,7 @@ export class ProcessFilterCloudService {
icon: 'adjust', icon: 'adjust',
appName: appName, appName: appName,
sort: 'startDate', sort: 'startDate',
state: '', status: '',
order: 'DESC' order: 'DESC'
}); });
} }
@@ -159,7 +159,7 @@ export class ProcessFilterCloudService {
key: 'running-processes', key: 'running-processes',
appName: appName, appName: appName,
sort: 'startDate', sort: 'startDate',
state: 'RUNNING', status: 'RUNNING',
order: 'DESC' order: 'DESC'
}); });
} }
@@ -176,7 +176,7 @@ export class ProcessFilterCloudService {
key: 'completed-processes', key: 'completed-processes',
appName: appName, appName: appName,
sort: 'startDate', sort: 'startDate',
state: 'COMPLETED', status: 'COMPLETED',
order: 'DESC' order: 'DESC'
}); });
} }