diff --git a/demo-shell/src/app/components/process-service/process-service.component.html b/demo-shell/src/app/components/process-service/process-service.component.html index c057f5384e..1d5ef12e45 100644 --- a/demo-shell/src/app/components/process-service/process-service.component.html +++ b/demo-shell/src/app/components/process-service/process-service.component.html @@ -131,7 +131,7 @@ -
``` +### Show custom template when processList is empty + +You can add your own template or message as shown in the example below: + +```html + + + Your Content + + +``` + ## See also - [Data column component](../core/data-column.component.md) diff --git a/lib/process-services/i18n/en.json b/lib/process-services/i18n/en.json index d3d7dd5591..938bdda1fa 100644 --- a/lib/process-services/i18n/en.json +++ b/lib/process-services/i18n/en.json @@ -153,7 +153,8 @@ }, "ADF_PROCESS_LIST": { "LIST": { - "NONE": "No process instances found", + "TITLE": "No Processes Found", + "SUBTITLE":"Create a new process that you want to easily find later", "SUMMARY": "{{total}} process instances found", "ERROR": "Couldn't load processes instances. Try again or share the following message with your IT Team: {{errorMessage}}" }, diff --git a/lib/process-services/process-list/components/process-list.component.html b/lib/process-services/process-list/components/process-list.component.html index f21086c778..6a1dcb4056 100644 --- a/lib/process-services/process-list/components/process-list.component.html +++ b/lib/process-services/process-list/components/process-list.component.html @@ -1,5 +1,4 @@ -
- - -
- {{ (requestNode ? 'ADF_PROCESS_LIST.LIST.NONE' : 'ADF_PROCESS_LIST.FILTERS.MESSAGES.NONE') | translate }} -
+ + +
-
diff --git a/lib/process-services/process-list/components/process-list.component.spec.ts b/lib/process-services/process-list/components/process-list.component.spec.ts index b422271a8d..db69c5148c 100644 --- a/lib/process-services/process-list/components/process-list.component.spec.ts +++ b/lib/process-services/process-list/components/process-list.component.spec.ts @@ -15,9 +15,11 @@ * limitations under the License. */ -import { Component, SimpleChange, ViewChild } from '@angular/core'; +import { Component, SimpleChange, ViewChild, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core'; import { async, ComponentFixture, fakeAsync, TestBed, tick } from '@angular/core/testing'; import { Observable } from 'rxjs/Observable'; +import { By } from '@angular/platform-browser'; + import { ProcessInstanceListComponent } from './process-list.component'; import { AppConfigService, setupTestBed, CoreModule } from '@alfresco/adf-core'; @@ -552,3 +554,42 @@ describe('CustomProcessListComponent', () => { expect(component.processList.data.getColumns().length).toEqual(3); }); }); + +@Component({ + template: ` + + +

No Process Instance

+
+
+ ` +}) +class EmptyTemplateComponent { +} + +describe('Custom EmptyTemplateComponent', () => { + let component: EmptyTemplateComponent; + let fixture: ComponentFixture; + + setupTestBed({ + imports: [ProcessTestingModule], + declarations: [EmptyTemplateComponent], + schemas: [ CUSTOM_ELEMENTS_SCHEMA ] + }); + + beforeEach(() => { + fixture = TestBed.createComponent(EmptyTemplateComponent); + fixture.detectChanges(); + component = fixture.componentInstance; + }); + + it('should render the custom template', async(() => { + fixture.whenStable().then(() => { + fixture.detectChanges(); + let title = fixture.debugElement.query(By.css('#custom-id')); + expect(title).not.toBeNull(); + expect(title.nativeElement.innerText).toBe('No Process Instance'); + expect(fixture.debugElement.query(By.css('.adf-empty-content'))).toBeNull(); + }); + })); +}); diff --git a/lib/process-services/process-list/components/process-list.component.ts b/lib/process-services/process-list/components/process-list.component.ts index 90138011f1..2965f8532b 100644 --- a/lib/process-services/process-list/components/process-list.component.ts +++ b/lib/process-services/process-list/components/process-list.component.ts @@ -23,7 +23,8 @@ import { DataTableAdapter, ObjectDataColumn, ObjectDataRow, - ObjectDataTableAdapter + ObjectDataTableAdapter, + EmptyCustomContentDirective } from '@alfresco/adf-core'; import { AppConfigService, @@ -60,6 +61,8 @@ export class ProcessInstanceListComponent implements OnChanges, AfterContentInit @ContentChild(DataColumnListComponent) columnList: DataColumnListComponent; + @ContentChild(EmptyCustomContentDirective) emptyCustomContent: EmptyCustomContentDirective; + @ViewChild('dataTable') dataTable: DataTableComponent; /** The id of the app. */ diff --git a/lib/process-services/process-list/process-list.module.ts b/lib/process-services/process-list/process-list.module.ts index 8ec470c0af..3d29c43a4d 100644 --- a/lib/process-services/process-list/process-list.module.ts +++ b/lib/process-services/process-list/process-list.module.ts @@ -20,7 +20,7 @@ import { NgModule } from '@angular/core'; import { FlexLayoutModule } from '@angular/flex-layout'; import { FormsModule, ReactiveFormsModule } from '@angular/forms'; import { TranslateModule } from '@ngx-translate/core'; -import { FormModule, CommentsModule } from '@alfresco/adf-core'; +import { CoreModule } from '@alfresco/adf-core'; import { MaterialModule } from '../material.module'; import { ProcessCommentsModule } from '../process-comments/process-comments.module'; import { CardViewModule, DataColumnModule, DataTableModule, DirectiveModule, PipeModule } from '@alfresco/adf-core'; @@ -40,7 +40,7 @@ import { StartProcessInstanceComponent } from './components/start-process.compon imports: [ CommonModule, DataTableModule, - FormModule, + CoreModule, TaskListModule, MaterialModule, FlexLayoutModule, @@ -52,7 +52,6 @@ import { StartProcessInstanceComponent } from './components/start-process.compon DataColumnModule, DirectiveModule, PeopleModule, - CommentsModule, ContentWidgetModule, ProcessCommentsModule ],