Display name and date for process instances if no name present (#1515)

* Display name and date for process instances if no name present

Refs #1461

* Re-work tests for processlist and process details to reflect changes

Refs #1461
This commit is contained in:
Will Abson 2017-01-24 00:56:23 +00:00 committed by Mario Romano
parent 82603bbfef
commit e846a15aa8
7 changed files with 248 additions and 43 deletions

View File

@ -0,0 +1,74 @@
/*!
* @license
* Copyright 2016 Alfresco Software, Ltd.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { ProcessInstance } from '../models/process-instance.model';
export var fakeProcessInstances = [
new ProcessInstance({
id: 1,
name: 'Process 773443333',
processDefinitionId: 'fakeprocess:5:7507',
processDefinitionKey: 'fakeprocess',
processDefinitionName: 'Fake Process Name',
description: null, category: null,
started: '2015-11-09T12:36:14.184+0000',
startedBy: {
id: 3, firstName: 'tenant2', lastName: 'tenantLastname', email: 'tenant2@tenant'
}
}),
new ProcessInstance({
id: 2,
name: 'Process 382927392',
processDefinitionId: 'fakeprocess:5:7507',
processDefinitionKey: 'fakeprocess',
processDefinitionName: 'Fake Process Name',
description: null,
category: null,
started: '2017-11-09T12:37:25.184+0000',
startedBy: {
id: 3, firstName: 'tenant2', lastName: 'tenantLastname', email: 'tenant2@tenant'
}
})
];
export var fakeProcessInstancesWithNoName = [
new ProcessInstance({
id: 1,
name: null,
processDefinitionId: 'fakeprocess:5:7507',
processDefinitionKey: 'fakeprocess',
processDefinitionName: 'Fake Process Name',
description: null, category: null,
started: '2017-11-09T12:36:14.184+0000',
startedBy: {
id: 3, firstName: 'tenant2', lastName: 'tenantLastname', email: 'tenant2@tenant'
}
}),
new ProcessInstance({
id: 2,
name: '',
processDefinitionId: 'fakeprocess:5:7507',
processDefinitionKey: 'fakeprocess',
processDefinitionName: 'Fake Process Name',
description: null,
category: null,
started: '2017-11-09T12:37:25.184+0000',
startedBy: {
id: 3, firstName: 'tenant2', lastName: 'tenantLastname', email: 'tenant2@tenant'
}
})
];

View File

@ -50,3 +50,16 @@ export var exampleProcess = new ProcessInstance({
email: 'bob@app.activiti.com' email: 'bob@app.activiti.com'
} }
}); });
export var exampleProcessNoName = new ProcessInstance({
id: '123',
name: null,
started: '2016-11-10T03:37:30.010+0000',
startedBy: {
id: 1001,
firstName: 'Bob',
lastName: 'Jones',
email: 'bob@app.activiti.com'
},
processDefinitionName: 'My Process'
});

View File

@ -1,6 +1,6 @@
<div *ngIf="!processInstanceDetails">{{ 'DETAILS.MESSAGES.NONE'|translate }}</div> <div *ngIf="!processInstanceDetails">{{ 'DETAILS.MESSAGES.NONE'|translate }}</div>
<div *ngIf="processInstanceDetails"> <div *ngIf="processInstanceDetails">
<h2 class="mdl-card__title-text">{{processInstanceDetails.name}}</h2> <h2 class="mdl-card__title-text">{{ getProcessNameOrDescription('medium') }}</h2>
<activiti-process-instance-header [processInstance]="processInstanceDetails"></activiti-process-instance-header> <activiti-process-instance-header [processInstance]="processInstanceDetails"></activiti-process-instance-header>
<div class="mdl-card mdl-shadow--2dp activiti-process-container"> <div class="mdl-card mdl-shadow--2dp activiti-process-container">
<div class="mdl-cell mdl-cell--12-col"> <div class="mdl-cell mdl-cell--12-col">

View File

@ -27,7 +27,7 @@ import { ActivitiTaskListModule } from 'ng2-activiti-tasklist';
import { ActivitiProcessInstanceDetails } from './activiti-process-instance-details.component'; import { ActivitiProcessInstanceDetails } from './activiti-process-instance-details.component';
import { ActivitiProcessService } from './../services/activiti-process.service'; import { ActivitiProcessService } from './../services/activiti-process.service';
import { TranslationMock } from './../assets/translation.service.mock'; import { TranslationMock } from './../assets/translation.service.mock';
import { exampleProcess } from './../assets/activiti-process.model.mock'; import { exampleProcess, exampleProcessNoName } from './../assets/activiti-process.model.mock';
import { ProcessInstance } from '../models/process-instance.model'; import { ProcessInstance } from '../models/process-instance.model';
describe('ActivitiProcessInstanceDetails', () => { describe('ActivitiProcessInstanceDetails', () => {
@ -94,6 +94,18 @@ describe('ActivitiProcessInstanceDetails', () => {
}); });
})); }));
it('should display default details when the process instance has no name', async(() => {
getProcessSpy = getProcessSpy.and.returnValue(Observable.of(exampleProcessNoName));
fixture.detectChanges();
component.ngOnChanges({ 'processInstanceId': new SimpleChange(null, '123') });
fixture.whenStable().then(() => {
fixture.detectChanges();
let headerEl: DebugElement = fixture.debugElement.query(By.css('h2'));
expect(headerEl).not.toBeNull();
expect(headerEl.nativeElement.innerText).toBe('My Process - Nov 10, 2016, 3:37:30 AM');
});
}));
describe('change detection', () => { describe('change detection', () => {
let change = new SimpleChange('123', '456'); let change = new SimpleChange('123', '456');

View File

@ -15,6 +15,7 @@
* limitations under the License. * limitations under the License.
*/ */
import { DatePipe } from '@angular/common';
import { Component, Input, ViewChild, Output, EventEmitter, OnChanges, SimpleChanges } from '@angular/core'; import { Component, Input, ViewChild, Output, EventEmitter, OnChanges, SimpleChanges } from '@angular/core';
import { AlfrescoTranslationService, LogService } from 'ng2-alfresco-core'; import { AlfrescoTranslationService, LogService } from 'ng2-alfresco-core';
import { TaskDetailsEvent } from 'ng2-activiti-tasklist'; import { TaskDetailsEvent } from 'ng2-activiti-tasklist';
@ -115,4 +116,22 @@ export class ActivitiProcessInstanceDetails implements OnChanges {
onTaskClicked(event: TaskDetailsEvent) { onTaskClicked(event: TaskDetailsEvent) {
this.taskClick.emit(event); this.taskClick.emit(event);
} }
getProcessNameOrDescription(dateFormat): string {
let name = '';
if (this.processInstanceDetails) {
name = this.processInstanceDetails.name ||
this.processInstanceDetails.processDefinitionName + ' - ' + this.getFormatDate(this.processInstanceDetails.started, dateFormat);
}
return name;
}
getFormatDate(value, format: string) {
let datePipe = new DatePipe('en-US');
try {
return datePipe.transform(value, format);
} catch (err) {
this.logService.error(`ProcessListInstanceHeader: error parsing date ${value} to format ${format}`);
}
}
} }

View File

@ -23,33 +23,12 @@ import { ActivitiProcessInstanceListComponent } from './activiti-processlist.com
import { AlfrescoTranslationService, CoreModule } from 'ng2-alfresco-core'; import { AlfrescoTranslationService, CoreModule } from 'ng2-alfresco-core';
import { DataTableModule, ObjectDataRow, DataRowEvent, ObjectDataTableAdapter, DataSorting } from 'ng2-alfresco-datatable'; import { DataTableModule, ObjectDataRow, DataRowEvent, ObjectDataTableAdapter, DataSorting } from 'ng2-alfresco-datatable';
import { fakeProcessInstances, fakeProcessInstancesWithNoName } from '../assets/activiti-process-instances-list.mock';
import { TranslationMock } from './../assets/translation.service.mock'; import { TranslationMock } from './../assets/translation.service.mock';
import { ProcessInstance } from '../models/process-instance.model';
import { ActivitiProcessService } from '../services/activiti-process.service'; import { ActivitiProcessService } from '../services/activiti-process.service';
describe('ActivitiProcessInstanceListComponent', () => { describe('ActivitiProcessInstanceListComponent', () => {
let fakeGlobalProcesses = [
new ProcessInstance({
id: 1, name: 'process-name',
processDefinitionId: 'fakeprocess:5:7507',
processDefinitionKey: 'fakeprocess',
processDefinitionName: 'Fake Process Name',
description: null, category: null,
started: '2017-11-09T12:37:25.184+0000',
startedBy: {
id: 3, firstName: 'tenant2', lastName: 'tenantLastname', email: 'tenant2@tenant'
}
}),
new ProcessInstance({
id: 2, name: '', description: null, category: null,
started: '2015-11-09T12:37:25.184+0000',
startedBy: {
id: 3, firstName: 'tenant2', lastName: 'tenantLastname', email: 'tenant2@tenant'
}
})
];
let componentHandler: any; let componentHandler: any;
let fixture: ComponentFixture<ActivitiProcessInstanceListComponent>; let fixture: ComponentFixture<ActivitiProcessInstanceListComponent>;
let component: ActivitiProcessInstanceListComponent; let component: ActivitiProcessInstanceListComponent;
@ -72,7 +51,7 @@ describe('ActivitiProcessInstanceListComponent', () => {
component = fixture.componentInstance; component = fixture.componentInstance;
service = fixture.debugElement.injector.get(ActivitiProcessService); service = fixture.debugElement.injector.get(ActivitiProcessService);
getProcessInstancesSpy = spyOn(service, 'getProcessInstances').and.returnValue(Observable.of(fakeGlobalProcesses)); getProcessInstancesSpy = spyOn(service, 'getProcessInstances').and.returnValue(Observable.of(fakeProcessInstances));
componentHandler = jasmine.createSpyObj('componentHandler', [ componentHandler = jasmine.createSpyObj('componentHandler', [
'upgradeAllRegistered', 'upgradeAllRegistered',
@ -114,34 +93,122 @@ describe('ActivitiProcessInstanceListComponent', () => {
component.processDefinitionKey = null; component.processDefinitionKey = null;
fixture.detectChanges(); fixture.detectChanges();
tick(); tick();
expect(emitSpy).toHaveBeenCalledWith(fakeGlobalProcesses); expect(emitSpy).toHaveBeenCalledWith(fakeProcessInstances);
})); }));
it('should return the process instances list', (done) => { it('should return the process instances list in original order when datalist passed non-existent columns', (done) => {
component.data = new ObjectDataTableAdapter(
[],
[
{type: 'text', key: 'fake-id', title: 'Name'}
]
);
component.appId = '1'; component.appId = '1';
component.state = 'open'; component.state = 'open';
component.processDefinitionKey = null; component.processDefinitionKey = null;
component.onSuccess.subscribe( (res) => { component.onSuccess.subscribe((res) => {
expect(res).toBeDefined(); expect(res).toBeDefined();
expect(component.data).toBeDefined(); expect(component.data).toBeDefined();
expect(component.isListEmpty()).not.toBeTruthy(); expect(component.isListEmpty()).not.toBeTruthy();
expect(component.data.getRows().length).toEqual(2); expect(component.data.getRows().length).toEqual(2);
expect(component.data.getRows()[0].getValue('name')).toEqual('No name'); expect(component.data.getRows()[0].getValue('name')).toEqual('Process 773443333');
expect(component.data.getRows()[1].getValue('name')).toEqual('Process 382927392');
done();
});
fixture.detectChanges();
});
it('should order the process instances by name column when no sort passed', (done) => {
component.appId = '1';
component.state = 'open';
component.processDefinitionKey = null;
component.onSuccess.subscribe((res) => {
expect(res).toBeDefined();
expect(component.data).toBeDefined();
expect(component.isListEmpty()).not.toBeTruthy();
expect(component.data.getRows().length).toEqual(2);
expect(component.data.getRows()[0].getValue('name')).toEqual('Process 382927392');
expect(component.data.getRows()[1].getValue('name')).toEqual('Process 773443333');
done();
});
fixture.detectChanges();
});
it('should order the process instances by descending column when specified', (done) => {
component.appId = '1';
component.state = 'open';
component.processDefinitionKey = null;
component.sort = 'name-desc';
component.onSuccess.subscribe((res) => {
expect(res).toBeDefined();
expect(component.data).toBeDefined();
expect(component.isListEmpty()).not.toBeTruthy();
expect(component.data.getRows().length).toEqual(2);
expect(component.data.getRows()[0].getValue('name')).toEqual('Process 773443333');
expect(component.data.getRows()[1].getValue('name')).toEqual('Process 382927392');
done();
});
fixture.detectChanges();
});
it('should order the process instances by ascending column when specified', (done) => {
component.appId = '1';
component.state = 'open';
component.processDefinitionKey = null;
component.sort = 'started-asc';
component.onSuccess.subscribe((res) => {
expect(res).toBeDefined();
expect(component.data).toBeDefined();
expect(component.isListEmpty()).not.toBeTruthy();
expect(component.data.getRows().length).toEqual(2);
expect(component.data.getRows()[0].getValue('name')).toEqual('Process 773443333');
expect(component.data.getRows()[1].getValue('name')).toEqual('Process 382927392');
done();
});
fixture.detectChanges();
});
it('should order the process instances by descending start date when specified', (done) => {
component.appId = '1';
component.state = 'open';
component.processDefinitionKey = null;
component.sort = 'started-desc';
component.onSuccess.subscribe((res) => {
expect(res).toBeDefined();
expect(component.data).toBeDefined();
expect(component.isListEmpty()).not.toBeTruthy();
expect(component.data.getRows().length).toEqual(2);
expect(component.data.getRows()[0].getValue('name')).toEqual('Process 382927392');
expect(component.data.getRows()[1].getValue('name')).toEqual('Process 773443333');
done(); done();
}); });
fixture.detectChanges(); fixture.detectChanges();
}); });
it('should return the process instances list filtered by processDefinitionKey', (done) => { it('should return the process instances list filtered by processDefinitionKey', (done) => {
let key = 'fakeprocess';
component.appId = '1';
component.state = 'open';
component.processDefinitionKey = key;
component.onSuccess.subscribe((res) => {
let lastCall = getProcessInstancesSpy.calls.mostRecent();
expect(lastCall).toBeDefined();
let lastCallArgs = lastCall.args;
expect(lastCallArgs[0]).toBeDefined();
expect(lastCallArgs[0].processDefinitionKey).toEqual(key);
done();
});
fixture.detectChanges();
});
it('should return a default name if no name is specified on the process', (done) => {
getProcessInstancesSpy = getProcessInstancesSpy.and.returnValue(Observable.of(fakeProcessInstancesWithNoName));
component.appId = '1'; component.appId = '1';
component.state = 'open'; component.state = 'open';
component.processDefinitionKey = 'fakeprocess'; component.processDefinitionKey = 'fakeprocess';
component.onSuccess.subscribe( (res) => { component.onSuccess.subscribe( (res) => {
expect(res).toBeDefined(); expect(component.data.getRows()[0].getValue('name')).toEqual('Fake Process Name - Nov 9, 2017, 12:36:14 PM');
expect(component.data).toBeDefined(); expect(component.data.getRows()[1].getValue('name')).toEqual('Fake Process Name - Nov 9, 2017, 12:37:25 PM');
expect(component.isListEmpty()).not.toBeTruthy();
expect(component.data.getRows().length).toEqual(2);
expect(component.data.getRows()[0].getValue('name')).toEqual('No name');
done(); done();
}); });
fixture.detectChanges(); fixture.detectChanges();
@ -172,7 +239,7 @@ describe('ActivitiProcessInstanceListComponent', () => {
let emitSpy = spyOn(component.onSuccess, 'emit'); let emitSpy = spyOn(component.onSuccess, 'emit');
component.reload(); component.reload();
tick(); tick();
expect(emitSpy).toHaveBeenCalledWith(fakeGlobalProcesses); expect(emitSpy).toHaveBeenCalledWith(fakeProcessInstances);
})); }));
it('should reload processes when reload() is called', (done) => { it('should reload processes when reload() is called', (done) => {
@ -188,7 +255,7 @@ describe('ActivitiProcessInstanceListComponent', () => {
expect(component.data).toBeDefined(); expect(component.data).toBeDefined();
expect(component.isListEmpty()).not.toBeTruthy(); expect(component.isListEmpty()).not.toBeTruthy();
expect(component.data.getRows().length).toEqual(2); expect(component.data.getRows().length).toEqual(2);
expect(component.data.getRows()[1].getValue('name')).toEqual('No name'); expect(component.data.getRows()[0].getValue('name')).toEqual('Process 773443333');
done(); done();
}); });
component.reload(); component.reload();
@ -235,7 +302,7 @@ describe('ActivitiProcessInstanceListComponent', () => {
expect(component.data).toBeDefined(); expect(component.data).toBeDefined();
expect(component.isListEmpty()).not.toBeTruthy(); expect(component.isListEmpty()).not.toBeTruthy();
expect(component.data.getRows().length).toEqual(2); expect(component.data.getRows().length).toEqual(2);
expect(component.data.getRows()[1].getValue('name')).toEqual('No name'); expect(component.data.getRows()[0].getValue('name')).toEqual('Process 773443333');
done(); done();
}); });
@ -251,7 +318,7 @@ describe('ActivitiProcessInstanceListComponent', () => {
expect(component.data).toBeDefined(); expect(component.data).toBeDefined();
expect(component.isListEmpty()).not.toBeTruthy(); expect(component.isListEmpty()).not.toBeTruthy();
expect(component.data.getRows().length).toEqual(2); expect(component.data.getRows().length).toEqual(2);
expect(component.data.getRows()[1].getValue('name')).toEqual('No name'); expect(component.data.getRows()[0].getValue('name')).toEqual('Process 773443333');
done(); done();
}); });
@ -267,7 +334,7 @@ describe('ActivitiProcessInstanceListComponent', () => {
expect(component.data).toBeDefined(); expect(component.data).toBeDefined();
expect(component.isListEmpty()).not.toBeTruthy(); expect(component.isListEmpty()).not.toBeTruthy();
expect(component.data.getRows().length).toEqual(2); expect(component.data.getRows().length).toEqual(2);
expect(component.data.getRows()[1].getValue('name')).toEqual('No name'); expect(component.data.getRows()[0].getValue('name')).toEqual('Process 773443333');
done(); done();
}); });
@ -283,7 +350,7 @@ describe('ActivitiProcessInstanceListComponent', () => {
expect(component.data).toBeDefined(); expect(component.data).toBeDefined();
expect(component.isListEmpty()).not.toBeTruthy(); expect(component.isListEmpty()).not.toBeTruthy();
expect(component.data.getRows().length).toEqual(2); expect(component.data.getRows().length).toEqual(2);
expect(component.data.getRows()[1].getValue('name')).toEqual('No name'); expect(component.data.getRows()[0].getValue('name')).toEqual('Process 773443333');
done(); done();
}); });
@ -314,7 +381,7 @@ describe('ActivitiProcessInstanceListComponent', () => {
expect(component.data).toBeDefined(); expect(component.data).toBeDefined();
expect(component.isListEmpty()).not.toBeTruthy(); expect(component.isListEmpty()).not.toBeTruthy();
expect(component.data.getRows().length).toEqual(2); expect(component.data.getRows().length).toEqual(2);
expect(component.data.getRows()[1].getValue('name')).toEqual('No name'); expect(component.data.getRows()[0].getValue('name')).toEqual('Process 773443333');
done(); done();
}); });

View File

@ -15,6 +15,7 @@
* limitations under the License. * limitations under the License.
*/ */
import { DatePipe } from '@angular/common';
import { Component, Input, Output, EventEmitter, OnInit, OnChanges, SimpleChanges } from '@angular/core'; import { Component, Input, Output, EventEmitter, OnInit, OnChanges, SimpleChanges } from '@angular/core';
import { AlfrescoTranslationService } from 'ng2-alfresco-core'; import { AlfrescoTranslationService } from 'ng2-alfresco-core';
import { ObjectDataTableAdapter, DataTableAdapter, DataRowEvent, ObjectDataRow, DataSorting } from 'ng2-alfresco-datatable'; import { ObjectDataTableAdapter, DataTableAdapter, DataRowEvent, ObjectDataRow, DataSorting } from 'ng2-alfresco-datatable';
@ -154,7 +155,8 @@ export class ActivitiProcessInstanceListComponent implements OnInit, OnChanges {
instancesRows.push(new ObjectDataRow({ instancesRows.push(new ObjectDataRow({
id: row.id, id: row.id,
name: row.name, name: row.name,
started: row.started started: row.started,
processDefinitionName: row.processDefinitionName
})); }));
}); });
return instancesRows; return instancesRows;
@ -236,12 +238,30 @@ export class ActivitiProcessInstanceListComponent implements OnInit, OnChanges {
*/ */
private optimizeNames(instances: any[]) { private optimizeNames(instances: any[]) {
instances = instances.map(t => { instances = instances.map(t => {
t.obj.name = t.obj.name || 'No name'; t.obj.name = this.getProcessNameOrDescription(t.obj, 'medium');
return t; return t;
}); });
return instances; return instances;
} }
getProcessNameOrDescription(processInstance, dateFormat): string {
let name = '';
if (processInstance) {
name = processInstance.name ||
processInstance.processDefinitionName + ' - ' + this.getFormatDate(processInstance.started, dateFormat);
}
return name;
}
getFormatDate(value, format: string) {
let datePipe = new DatePipe('en-US');
try {
return datePipe.transform(value, format);
} catch (err) {
return '';
}
}
private createRequestNode() { private createRequestNode() {
let requestNode = { let requestNode = {
appDefinitionId: this.appId, appDefinitionId: this.appId,