From d47a5bfbbf02c7dec9b29956d9eeaf17e3a1d333 Mon Sep 17 00:00:00 2001 From: davidcanonieto Date: Tue, 14 Aug 2018 09:27:59 +0200 Subject: [PATCH] [ADF-3432 ]Added size and page control to task list demo (#3674) * [ADF-3432] Added size and page control to task listdemo * [ADF-3432] Removed console log * [ADF-3432] Errors catched on TaskList component when a bad query is made * [ADF-3432] It reloads task list content when form is reset * [ADF-3432] Fixed missing whitespace lint error * remove unused dependency --- .../task-list-demo.component.html | 22 +++++++-- .../task-list-demo.component.ts | 46 +++++++++++++------ .../task-list/models/task-list.model.ts | 6 ++- .../task-list/services/tasklist.service.ts | 31 +++++++------ 4 files changed, 71 insertions(+), 34 deletions(-) diff --git a/demo-shell/src/app/components/task-list-demo/task-list-demo.component.html b/demo-shell/src/app/components/task-list-demo/task-list-demo.component.html index 2beb162991..f8e9153fa9 100644 --- a/demo-shell/src/app/components/task-list-demo/task-list-demo.component.html +++ b/demo-shell/src/app/components/task-list-demo/task-list-demo.component.html @@ -7,9 +7,6 @@ matInput class="form-control" [formControl]="taskAppId"> - - {{ 'TASK_LIST_DEMO.ERROR_MESSAGE.APP_ID_REQUIRED_ERROR' | translate }} - {{ 'TASK_LIST_DEMO.ERROR_MESSAGE.APP_ID_TYPE_ERROR' | translate }} @@ -61,6 +58,22 @@ E.g. 12345 + + Items per page + + + + + Page + + + Process Instance diff --git a/demo-shell/src/app/components/task-list-demo/task-list-demo.component.ts b/demo-shell/src/app/components/task-list-demo/task-list-demo.component.ts index 1d319c7ca0..2b76ecb000 100644 --- a/demo-shell/src/app/components/task-list-demo/task-list-demo.component.ts +++ b/demo-shell/src/app/components/task-list-demo/task-list-demo.component.ts @@ -18,7 +18,6 @@ import { Component, OnInit } from '@angular/core'; import { FormGroup, FormBuilder, Validators, FormControl, AbstractControl } from '@angular/forms'; import { ActivatedRoute, Params } from '@angular/router'; -import { NotificationService } from '@alfresco/adf-core'; import { debounceTime } from 'rxjs/operators'; @Component({ @@ -52,6 +51,10 @@ export class TaskListDemoComponent implements OnInit { start: number; + size: number; + + page: number; + includeProcessInstance: boolean; assignmentOptions = [ @@ -78,8 +81,7 @@ export class TaskListDemoComponent implements OnInit { ]; constructor(private route: ActivatedRoute, - private formBuilder: FormBuilder, - private notificationService: NotificationService) { + private formBuilder: FormBuilder) { } ngOnInit() { @@ -87,8 +89,6 @@ export class TaskListDemoComponent implements OnInit { this.route.params.forEach((params: Params) => { if (params['id']) { this.defaultAppId = +params['id']; - } else { - this.defaultAppId = 0; } }); } @@ -101,7 +101,7 @@ export class TaskListDemoComponent implements OnInit { buildForm() { this.taskListForm = this.formBuilder.group({ - taskAppId: new FormControl(this.defaultAppId, [Validators.required, Validators.pattern('^[0-9]*$')]), + taskAppId: new FormControl(this.defaultAppId, [Validators.pattern('^[0-9]*$')]), taskName: new FormControl(''), taskId: new FormControl(''), taskProcessDefinitionId: new FormControl(''), @@ -109,6 +109,8 @@ export class TaskListDemoComponent implements OnInit { taskAssignment: new FormControl(''), taskState: new FormControl(''), taskSort: new FormControl(''), + taskSize: new FormControl(''), + taskPage: new FormControl(''), taskStart: new FormControl('', [Validators.pattern('^[0-9]*$')]), taskIncludeProcessInstance: new FormControl('') }); @@ -134,19 +136,29 @@ export class TaskListDemoComponent implements OnInit { this.state = taskFilter.taskState; this.sort = taskFilter.taskSort; this.start = taskFilter.taskStart; + this.size = taskFilter.taskSize; + this.page = taskFilter.taskPage; this.includeProcessInstance = taskFilter.taskIncludeProcessInstance === 'include'; } - onError($event) { - const errorMessage = JSON.parse($event.message).message; - this.notificationService.openSnackMessageAction(errorMessage, 'Reset', 5000).onAction().subscribe(() => { - this.resetTaskForm(); - }); - } - resetTaskForm() { this.taskListForm.reset(); + this.resetQueryParameters(); + } + + resetQueryParameters() { + this.appId = null; + this.id = null; + this.processDefinitionId = null; + this.processInstanceId = null; + this.name = null; + this.assignment = null; + this.state = null; + this.sort = null; + this.start = null; + this.size = null; + this.page = null; } isFormValid() { @@ -192,4 +204,12 @@ export class TaskListDemoComponent implements OnInit { get taskStart(): AbstractControl { return this.taskListForm.get('taskStart'); } + + get taskSize(): AbstractControl { + return this.taskListForm.get('taskSize'); + } + + get taskPage(): AbstractControl { + return this.taskListForm.get('taskPage'); + } } diff --git a/lib/process-services/task-list/models/task-list.model.ts b/lib/process-services/task-list/models/task-list.model.ts index c9bda7b85d..8b9972e313 100644 --- a/lib/process-services/task-list/models/task-list.model.ts +++ b/lib/process-services/task-list/models/task-list.model.ts @@ -17,11 +17,13 @@ import { TaskDetailsModel } from './task-details.model'; -export interface TaskListModel { +export class TaskListModel { size: number; total: number; start: number; length: number; - data: TaskDetailsModel []; + data: TaskDetailsModel[] = []; + constructor() { + } } diff --git a/lib/process-services/task-list/services/tasklist.service.ts b/lib/process-services/task-list/services/tasklist.service.ts index 6f08be86c5..25e8f3c220 100644 --- a/lib/process-services/task-list/services/tasklist.service.ts +++ b/lib/process-services/task-list/services/tasklist.service.ts @@ -17,7 +17,7 @@ import { AlfrescoApiService, LogService } from '@alfresco/adf-core'; import { Injectable } from '@angular/core'; -import { Observable, from, forkJoin, throwError } from 'rxjs'; +import { Observable, from, forkJoin, throwError, of } from 'rxjs'; import { map, catchError, switchMap, flatMap, filter } from 'rxjs/operators'; import { FilterRepresentationModel, TaskQueryRequestRepresentationModel } from '../models/filter.model'; import { Form } from '../models/form.model'; @@ -66,7 +66,7 @@ export class TaskListService { * @param filter The filter you want to check * @returns The filter if it is related or null otherwise */ - isTaskRelatedToFilter(taskId: string, filterModel: FilterRepresentationModel): Observable { + isTaskRelatedToFilter(taskId: string, filterModel: FilterRepresentationModel): Observable { let requestNodeForFilter = this.generateTaskRequestNodeFromFilter(filterModel); return from(this.callApiTasksFiltered(requestNodeForFilter)) .pipe( @@ -99,7 +99,8 @@ export class TaskListService { if (state) { requestNode.state = state; } - return this.getTasks(requestNode); + return this.getTasks(requestNode) + .pipe(catchError(() => of(new TaskListModel()))); } /** @@ -128,15 +129,15 @@ export class TaskListService { */ findAllTasksWithoutState(requestNode: TaskQueryRequestRepresentationModel): Observable { return forkJoin( - this.findTasksByState(requestNode, 'open'), - this.findAllTaskByState(requestNode, 'completed'), - (activeTasks: TaskListModel, completedTasks: TaskListModel) => { - const tasks = Object.assign({}, activeTasks); - tasks.total += completedTasks.total; - tasks.data = tasks.data.concat(completedTasks.data); - return tasks; - } - ); + this.findTasksByState(requestNode, 'open'), + this.findAllTaskByState(requestNode, 'completed'), + (activeTasks: TaskListModel, completedTasks: TaskListModel) => { + const tasks = Object.assign({}, activeTasks); + tasks.total += completedTasks.total; + tasks.data = tasks.data.concat(completedTasks.data); + return tasks; + } + ); } /** @@ -177,7 +178,7 @@ export class TaskListService { * Gets all available reusable forms. * @returns Array of form details */ - getFormList(): Observable
{ + getFormList(): Observable { let opts = { 'filter': 'myReusableForms', // String | filter 'sort': 'modifiedDesc', // String | sort @@ -204,7 +205,7 @@ export class TaskListService { * @returns Null response notifying when the operation is complete */ attachFormToATask(taskId: string, formId: number): Observable { - return from(this.apiService.taskApi.attachForm(taskId, {'formId': formId})) + return from(this.apiService.taskApi.attachForm(taskId, { 'formId': formId })) .pipe( catchError(err => this.handleError(err)) ); @@ -299,7 +300,7 @@ export class TaskListService { * @returns Details of the assigned task */ assignTask(taskId: string, requestNode: any): Observable { - let assignee = {assignee: requestNode.id}; + let assignee = { assignee: requestNode.id }; return from(this.callApiAssignTask(taskId, assignee)) .pipe( map((response: TaskDetailsModel) => {