From d4f57b8786d7305e11edb01f3033df2b54b7f34c Mon Sep 17 00:00:00 2001 From: siva kumar Date: Fri, 1 Jun 2018 14:09:09 +0530 Subject: [PATCH] [ADF-3039] Task List - Enanchement (#3404) * * Created DataColumnSchemaAssembler component to get column schema from html and app.config.json * Removed column related method from tasklist. * * Removed data property from the tasklist component * Using rows input property instead of data input property of the datatable * * Renamed DataColumnSchemaAssembler to DataTableSchema * Refactored DataTableSchema component * * Changed schem property into an input schemaColumns property in dataTable component * * Added selectFirstRow input property to select a first row of datatable * Removed unnecessary method from tasklist component * * Added test case for the recent changes * Added mock object for the tasklist spec * * Added testcases for recent changes in the datatable component * * Updated datatable and tasklist document for the recent changes * * Refactored process-service and task list component * Updated datatable document. * [ADF-3039] Task List - Enanchement * Changed schemaColumn name to columns * Updated datatable documentation. * data input Annotated with @deprecated in the tasklist component * * Added an sorting input to the datatable. * Updated datatable and tasklist documentation * Added method to get current sorting order. * * After rebasing * * Revert sorting changes * * After rebase * * fixed conflicts * * Fixed failing testcase after rebased. --- .../process-service.component.ts | 6 +- docs/core/datatable.component.md | 157 +++++++- docs/process-services/task-list.component.md | 40 +-- .../datatable/datatable.component.spec.ts | 37 ++ .../datatable/datatable.component.ts | 44 ++- lib/core/datatable/data/data-table.schema.ts | 80 +++++ lib/core/datatable/public-api.ts | 1 + lib/process-services/mock/public-api.ts | 1 + .../mock/task/task-list.mock.ts | 97 +++++ .../components/task-list.component.html | 3 + .../components/task-list.component.spec.ts | 334 +++++------------- .../components/task-list.component.ts | 166 +++------ 12 files changed, 546 insertions(+), 420 deletions(-) create mode 100644 lib/core/datatable/data/data-table.schema.ts create mode 100644 lib/process-services/mock/task/task-list.mock.ts diff --git a/demo-shell/src/app/components/process-service/process-service.component.ts b/demo-shell/src/app/components/process-service/process-service.component.ts index 403f127189..500619c2cc 100644 --- a/demo-shell/src/app/components/process-service/process-service.component.ts +++ b/demo-shell/src/app/components/process-service/process-service.component.ts @@ -54,7 +54,6 @@ import { } from '@alfresco/adf-process-services'; import { LogService } from '@alfresco/adf-core'; import { AlfrescoApiService, UserPreferencesService } from '@alfresco/adf-core'; -import { ObjectDataRow } from '@alfresco/adf-core'; import { Subscription } from 'rxjs/Subscription'; import { /*CustomEditorComponent*/ CustomStencil01 } from './custom-editor/custom-editor.component'; import { DemoFieldValidator } from './demo-field-validator'; @@ -164,7 +163,6 @@ export class ProcessServiceComponent implements AfterViewInit, OnDestroy, OnInit private location: Location, private preferenceService: UserPreferencesService) { - this.defaultProcessName = this.appConfig.get('adf-start-process.name'); this.defaultProcessDefinitionName = this.appConfig.get('adf-start-process.processDefinitionName'); @@ -446,11 +444,11 @@ export class ProcessServiceComponent implements AfterViewInit, OnDestroy, OnInit this.activeTab = this.tabs.tasks; const taskId = event.value.id; - const processTaskDataRow = new ObjectDataRow({ + const processTaskDataRow: any = { id: taskId, name: event.value.name || 'No name', created: event.value.created - }); + }; this.activitifilter.selectFilter(null); if (this.taskList) { this.taskList.setCustomDataSource([processTaskDataRow]); diff --git a/docs/core/datatable.component.md b/docs/core/datatable.component.md index 37f50d1245..ca3d753d04 100644 --- a/docs/core/datatable.component.md +++ b/docs/core/datatable.component.md @@ -80,7 +80,72 @@ export class DataTableDemo { } ``` -You can also use HTML-based schema declaration like shown below: +### Setting the rows and column schema + +You can set rows and columns to the ObjectDataTableAdapter like shown below: + +```ts +import { ObjectDataTableAdapter } from '@alfresco/adf-core'; + +@Component({...}) +export class DataTableDemo { + data: ObjectDataTableAdapter; + + constructor() { + this.data = new ObjectDataTableAdapter( + // data + [ + {id: 1, name: 'Name 1'}, + {id: 2, name: 'Name 2'} + ], + // columns + [ + { + type: 'text', + key: 'id', + title: 'Id', + sortable: true + }, + { + type: 'text', + key: 'name', + title: 'Name', + cssClass: 'full-width', + sortable: true + } + ] + ); + } +} +``` + +```html + + +``` + +You can also set rows and HTML-based schema declaration like shown below: + +```ts +import { ObjectDataTableAdapter } from '@alfresco/adf-core'; + +@Component({...}) +export class DataTableDemo { + data: ObjectDataTableAdapter; + + constructor() { + this.data = new ObjectDataTableAdapter( + // data + [ + {id: 1, name: 'Name 1'}, + {id: 2, name: 'Name 2'} + ], + [] + ); + } +} +``` ```html @@ -94,37 +159,96 @@ You can also use HTML-based schema declaration like shown below: ``` +You can also set rows to the ObjectDataTableAdapter and set columns as an input like shown below : + ```ts -import { ObjectDataTableAdapter } from '@alfresco/adf-core'; +import { ObjectDataTableAdapter } from '@alfresco/adf-core'; @Component({...}) export class DataTableDemo { data: ObjectDataTableAdapter; + schema: any; constructor() { this.data = new ObjectDataTableAdapter( // data [ - { - id: 1, - name: 'Name 1', - createdBy : { name: 'user'}, - createdOn: 123, - icon: 'http://example.com/img.png' + {id: 1, name: 'Name 1'}, + {id: 2, name: 'Name 2'} + ], + [] + ); + // columns + this.schema = + [ + { + type: 'text', + key: 'id', + title: 'Id', + sortable: true }, { - id: 2, - name: 'Name 2', - createdBy : { name: 'user 2'}, - createdOn: 123, - icon: 'http://example.com/img.png' + type: 'text', + key: 'name', + title: 'Name', + sortable: true } - ] - ); + ]; } } ``` +```html + + +``` + +You can also set rows and columns through inputs as shown below : + +```ts +import { ObjectDataTableAdapter } from '@alfresco/adf-core'; + +@Component({...}) +export class DataTableDemo { + rows: any; + schema: any; + + constructor() { + // data + this.rows = + [ + {id: 1, name: 'Name 1'}, + {id: 2, name: 'Name 2'} + ]; + // columns + this.schema = + [ + { + type: 'text', + key: 'id', + title: 'Id', + sortable: true + }, + { + type: 'text', + key: 'name', + title: 'Name', + sortable: true + } + ]; + } +} +``` + +```html + + +``` + ## Class members ### Properties @@ -134,6 +258,7 @@ export class DataTableDemo { | actions | `boolean` | false | Toggles the data actions column. | | actionsPosition | `string` | "right" | Position of the actions dropdown menu. Can be "left" or "right". | | allowDropFiles | `boolean` | false | Toggles file drop support for rows (see [Upload directive](upload.directive.md) for further details). | +| columns | `any[]` | `[]` | The columns that the datatable will show. | | contextMenu | `boolean` | false | Toggles custom context menu for the component. | | data | [`DataTableAdapter`](../../lib/core/datatable/data/datatable-adapter.ts) | | Data source for the table | | display | `string` | [`DisplayMode`](../../lib/core/datatable/components/datatable/datatable.component.ts).List | Selects the display mode of the table. Can be "list" or "gallery". | @@ -145,8 +270,8 @@ export class DataTableDemo { | rowStyleClass | `string` | "" | The CSS class to apply to every row. | | rows | `any[]` | \[] | The rows that the datatable will show. | | selectionMode | `string` | "single" | Row selection mode. Can be none, `single` or `multiple`. For `multiple` mode, you can use Cmd (macOS) or Ctrl (Win) modifier key to toggle selection for multiple rows. | +| selectFirstRow | `boolean` | `true` | Toggles the first row selection. | | showHeader | `boolean` | true | Toggles the header. | -| sorting | `any[]` | `[]` | Define the sorting order of the datatable. Possible values are : [`created`, `desc`], [`created`, `asc`], [`due`, `desc`], [`due`, `asc`] | ### Events diff --git a/docs/process-services/task-list.component.md b/docs/process-services/task-list.component.md index 483643f6eb..b1b88ec7b4 100644 --- a/docs/process-services/task-list.component.md +++ b/docs/process-services/task-list.component.md @@ -44,7 +44,7 @@ Renders a list containing all the tasks matched by the parameters specified. | -- | -- | -- | -- | | appId | `number` | | The id of the app. | | assignment | `string` | | The assignment of the process. Possible values are: "assignee" (the current user is the assignee), candidate (the current user is a task candidate", "group_x" (the task is assigned to a group where the current user is a member, no value(the current user is involved). | -| data | [`DataTableAdapter`](../../lib/core/datatable/data/datatable-adapter.ts) | | Data source object that represents the number and the type of the columns that you want to show. | +| data | [`DataTableAdapter`](../../lib/core/datatable/data/datatable-adapter.ts) | | Data source object that represents the number and the type of the columns that you want to show. **Deprecated:** in 2.4.0 | | landingTaskId | `string` | | Define which task id should be selected after reloading. If the task id doesn't exist or nothing is passed then the first task will be selected. | | multiselect | `boolean` | false | Toggles multiple row selection, renders checkboxes at the beginning of each row | | name | `string` | | Name of the tasklist. | @@ -54,7 +54,7 @@ Renders a list containing all the tasks matched by the parameters specified. | processInstanceId | `string` | | The Instance Id of the process. | | selectionMode | `string` | "single" | Row selection mode. Can be none, `single` or `multiple`. For `multiple` mode, you can use Cmd (macOS) or Ctrl (Win) modifier key to toggle selection for multiple rows. | | size | `number` | [`PaginationComponent`](../core/pagination.component.md).DEFAULT_PAGINATION.maxItems | The number of tasks to fetch. Default value: 25. | -| sort | `string` | | Define the sort order of the processes. Possible values are : `created-desc`, `created-asc`, `due-desc`, `due-asc` | +| sort | `string` | | Define the sort order of the tasks. Possible values are : `created-desc`, `created-asc`, `due-desc`, `due-asc` | | state | `string` | | Current state of the process. Possible values are: `completed`, `active`. | ### Events @@ -73,41 +73,7 @@ renders details of any chosen instance. ### Setting the column schema -You can pass a [DataTableAdapter instance](../core/datatable-adapter.interface.md) -to set a column schema for the tasklist as shown below : - -```ts -let data = new ObjectDataTableAdapter( - // Row data - [ - { id: 1, name: 'Name 1' }, - { id: 2, name: 'Name 2' } - ], - // Column schema - [ - { - type: 'text', - key: 'id', - title: 'Id', - sortable: true - }, - { - type: 'text', - key: 'name', - title: 'Name', - sortable: true - } - ] -); -``` - -```html - - -``` - -Alternatively, you can use an HTML-based schema declaration: +You can use an HTML-based schema declaration to set a column schema for the tasklist as shown below : ```html diff --git a/lib/core/datatable/components/datatable/datatable.component.spec.ts b/lib/core/datatable/components/datatable/datatable.component.spec.ts index 951da490aa..f09cdcb485 100644 --- a/lib/core/datatable/components/datatable/datatable.component.spec.ts +++ b/lib/core/datatable/components/datatable/datatable.component.spec.ts @@ -287,6 +287,43 @@ describe('DataTable', () => { expect(dataTable.resetSelection).toHaveBeenCalled(); }); + it('should select first row when selectFirstRow set to true', () => { + dataTable.selectFirstRow = true; + dataTable.rows = [{ name: 'TEST1' }, { name: 'FAKE2' }, { name: 'TEST2' }, { name: 'FAKE2' }]; + dataTable.data = new ObjectDataTableAdapter([], + [new ObjectDataColumn({ key: 'name' })] + ); + fixture.detectChanges(); + const rows = dataTable.data.getRows(); + expect(rows[0].isSelected).toBeTruthy(); + expect(rows[1].isSelected).toBeFalsy(); + expect(rows[2].isSelected).toBeFalsy(); + }); + + it('should not select first row when selectFirstRow set to false', () => { + dataTable.selectFirstRow = false; + const dataRows = + [ + { name: 'TEST1' }, + { name: 'FAKE2' }, + { name: 'TEST2' }, + { name: 'FAKE2' } + ]; + dataTable.data = new ObjectDataTableAdapter(dataRows, + [new ObjectDataColumn({ key: 'name' })] + ); + + dataTable.ngOnChanges({ + rows: new SimpleChange(null, dataRows, false) + }); + fixture.detectChanges(); + + const rows = dataTable.data.getRows(); + expect(rows[0].isSelected).toBeFalsy(); + expect(rows[1].isSelected).toBeFalsy(); + expect(rows[2].isSelected).toBeFalsy(); + }); + it('should select only one row with [single] selection mode', (done) => { dataTable.selectionMode = 'single'; dataTable.data = new ObjectDataTableAdapter( diff --git a/lib/core/datatable/components/datatable/datatable.component.ts b/lib/core/datatable/components/datatable/datatable.component.ts index 69c362d012..7868b18f6e 100644 --- a/lib/core/datatable/components/datatable/datatable.component.ts +++ b/lib/core/datatable/components/datatable/datatable.component.ts @@ -71,6 +71,14 @@ export class DataTableComponent implements AfterContentInit, OnChanges, DoCheck, @Input() sorting: any[] = []; + /** The columns that the datatable will show. */ + @Input() + columns: any[] = []; + + /* Toggles default selection of the first row */ + @Input() + selectFirstRow: boolean = true; + /** Row selection mode. Can be none, `single` or `multiple`. For `multiple` mode, * you can use Cmd (macOS) or Ctrl (Win) modifier key to toggle selection for multiple rows. */ @@ -158,8 +166,6 @@ export class DataTableComponent implements AfterContentInit, OnChanges, DoCheck, private clickObserver: Observer; private click$: Observable; - private schema: DataColumn[] = []; - private differ: any; private rowMenuCache: object = {}; @@ -293,7 +299,7 @@ export class DataTableComponent implements AfterContentInit, OnChanges, DoCheck, } private initTable() { - this.data = new ObjectDataTableAdapter(this.rows, this.schema); + this.data = new ObjectDataTableAdapter(this.rows, this.columns); this.setupData(this.data); this.rowMenuCache = {}; } @@ -323,16 +329,32 @@ export class DataTableComponent implements AfterContentInit, OnChanges, DoCheck, this.resetSelection(); } this.data.setRows(this.convertToRowsData(rows)); + this.selectFirst(); + } + } + + private selectFirst() { + if (this.selectFirstRow) { + if (this.data && this.data.getRows().length > 0) { + let row = this.data.getRows()[0]; + row.isSelected = true; + this.data.selectedRow = row; + } } } private setTableSchema() { - if (this.columnList && this.columnList.columns) { - this.schema = this.columnList.columns.map(c => c); + let schema = []; + if (!this.columns || this.columns.length === 0) { + schema = this.getSchemaFromHtml(); + } else { + schema = this.columns.concat(this.getSchemaFromHtml()); } - if (this.data && this.schema && this.schema.length > 0) { - this.data.setColumns(this.schema); + this.columns = schema; + + if (this.data && this.columns && this.columns.length > 0) { + this.data.setColumns(this.columns); } } @@ -342,6 +364,14 @@ export class DataTableComponent implements AfterContentInit, OnChanges, DoCheck, } } + public getSchemaFromHtml(): any { + let schema = []; + if (this.columnList && this.columnList.columns && this.columnList.columns.length > 0) { + schema = this.columnList.columns.map(c => c); + } + return schema; + } + onRowClick(row: DataRow, e: MouseEvent) { if (e) { e.preventDefault(); diff --git a/lib/core/datatable/data/data-table.schema.ts b/lib/core/datatable/data/data-table.schema.ts new file mode 100644 index 0000000000..6ff87c13d6 --- /dev/null +++ b/lib/core/datatable/data/data-table.schema.ts @@ -0,0 +1,80 @@ +/*! + * @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 { ContentChild, Input } from '@angular/core'; +import { AppConfigService } from '../../app-config/app-config.service'; +import { DataColumnListComponent } from '../../data-column/data-column-list.component'; +import { DataColumn } from './data-column.model'; +import { ObjectDataColumn } from './object-datacolumn.model'; + +export abstract class DataTableSchema { + + @ContentChild(DataColumnListComponent) columnList: DataColumnListComponent; + + /** Custom preset column schema in JSON format. */ + @Input() + presetColumn: string; + + columns: any; + + private layoutPresets = {}; + + constructor(private appConfigService: AppConfigService, + protected presetKey: string, + protected presetsModel: any) { } + + public createDatatableSchema(): void { + this.loadLayoutPresets(); + if (!this.columns || this.columns.length === 0) { + this.columns = this.mergeJsonAndHtmlSchema(); + } + } + + public loadLayoutPresets(): void { + const externalSettings = this.appConfigService.get(this.presetKey, null); + if (externalSettings) { + this.layoutPresets = Object.assign({}, this.presetsModel, externalSettings); + } else { + this.layoutPresets = this.presetsModel; + } + } + + public mergeJsonAndHtmlSchema(): any { + let customSchemaColumns = []; + customSchemaColumns = this.getSchemaFromConfig(this.presetColumn).concat(this.getSchemaFromHtml(this.columnList)); + if (customSchemaColumns.length === 0) { + customSchemaColumns = this.getDefaultLayoutPreset(); + } + return customSchemaColumns; + } + + public getSchemaFromHtml(columnList: DataColumnListComponent): any { + let schema = []; + if (columnList && columnList.columns && columnList.columns.length > 0) { + schema = columnList.columns.map(c => c); + } + return schema; + } + + public getSchemaFromConfig(presetColoumn: string): DataColumn[] { + return presetColoumn ? (this.layoutPresets[presetColoumn]).map(col => new ObjectDataColumn(col)) : []; + } + + private getDefaultLayoutPreset(): DataColumn[] { + return (this.layoutPresets['default']).map(col => new ObjectDataColumn(col)); + } +} diff --git a/lib/core/datatable/public-api.ts b/lib/core/datatable/public-api.ts index 74487ffe20..40b5543842 100644 --- a/lib/core/datatable/public-api.ts +++ b/lib/core/datatable/public-api.ts @@ -35,6 +35,7 @@ export * from './components/datatable/date-cell.component'; export * from './components/datatable/empty-list.component'; export * from './components/datatable/filesize-cell.component'; export * from './components/datatable/location-cell.component'; +export * from './data/data-table.schema'; export * from './directives/loading-template.directive'; export * from './directives/no-content-template.directive'; diff --git a/lib/process-services/mock/public-api.ts b/lib/process-services/mock/public-api.ts index ee2875b02c..9b9af53a6a 100644 --- a/lib/process-services/mock/public-api.ts +++ b/lib/process-services/mock/public-api.ts @@ -23,4 +23,5 @@ export * from './process/process.model.mock'; export * from './task/start-task.mock'; export * from './task/task-details.mock'; export * from './task/task-details.component.mock'; +export * from './task/task-list.mock'; export * from './task/tasklist-service.mock'; diff --git a/lib/process-services/mock/task/task-list.mock.ts b/lib/process-services/mock/task/task-list.mock.ts new file mode 100644 index 0000000000..c8c0a45e75 --- /dev/null +++ b/lib/process-services/mock/task/task-list.mock.ts @@ -0,0 +1,97 @@ +/*! + * @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 { ObjectDataColumn } from '@alfresco/adf-core'; + +export let fakeGlobalTask = { + size: 2, + start: 0, + total: 2, + data: [ + { + id: 14, name: 'nameFake1', + description: 'descriptionFake1', + category: 'categoryFake1', + assignee: { + id: 2, firstName: 'firstNameFake1', lastName: 'lastNameFake1', email: 'emailFake1' + }, + created: '2017-03-01T12:25:17.189+0000', + dueDate: '2017-04-02T12:25:17.189+0000', + endDate: '2017-05-03T12:25:31.129+0000', + duration: 13940, + priority: 50, + parentTaskId: 1, + parentTaskName: 'parentTaskNameFake', + processInstanceId: 2511, + processInstanceName: 'processInstanceNameFake', + processDefinitionId: 'myprocess:1:4', + processDefinitionName: 'processDefinitionNameFake', + processDefinitionDescription: 'processDefinitionDescriptionFake', + processDefinitionKey: 'myprocess', + processDefinitionCategory: 'http://www.activiti.org/processdef', + processDefinitionVersion: 1, + processDefinitionDeploymentId: '1', + formKey: 1, + processInstanceStartUserId: null, + initiatorCanCompleteTask: false, + adhocTaskCanBeReassigned: false, + taskDefinitionKey: 'sid-B6813AF5-8ACD-4481-A4D5-8BAAD1CB1416', + executionId: 2511, + memberOfCandidateGroup: false, + memberOfCandidateUsers: false, + managerOfCandidateGroup: false + }, + + { + id: 2, name: '', description: 'descriptionFake2', category: null, + assignee: { + id: 1, firstName: 'fistNameFake2', lastName: 'Administrator2', email: 'admin' + }, + created: '2017-03-01T12:25:17.189+0000', + dueDate: '2017-04-02T12:25:17.189+0000', + endDate: null + } + ] +}; + +export let fakeCutomSchema = + [ + new ObjectDataColumn({ + 'key': 'fakeName', + 'type': 'text', + 'title': 'ADF_TASK_LIST.PROPERTIES.FAKE', + 'sortable': true + }), + new ObjectDataColumn({ + 'key': 'fakeTaskName', + 'type': 'text', + 'title': 'ADF_TASK_LIST.PROPERTIES.TASK_FAKE', + 'sortable': true + }) + ]; + +export let fakeColumnSchema = { + 'default': [ + { + 'key': 'name', + 'type': 'text', + 'title': 'ADF_TASK_LIST.PROPERTIES.NAME', + 'sortable': true + } + ] + , fakeCutomSchema +}; diff --git a/lib/process-services/task-list/components/task-list.component.html b/lib/process-services/task-list/components/task-list.component.html index 5de34153ef..03a53f4924 100644 --- a/lib/process-services/task-list/components/task-list.component.html +++ b/lib/process-services/task-list/components/task-list.component.html @@ -2,8 +2,11 @@ { - - let fakeGlobalTask = { - size: 2, - start: 0, - total: 2, - data: [ - { - id: 14, name: 'nameFake1', - description: 'descriptionFake1', - category: 'categoryFake1', - assignee: { - id: 2, firstName: 'firstNameFake1', lastName: 'lastNameFake1', email: 'emailFake1' - }, - created: '2017-03-01T12:25:17.189+0000', - dueDate: '2017-04-02T12:25:17.189+0000', - endDate: '2017-05-03T12:25:31.129+0000', - duration: 13940, - priority: 50, - parentTaskId: 1, - parentTaskName: 'parentTaskNameFake', - processInstanceId: 2511, - processInstanceName: 'processInstanceNameFake', - processDefinitionId: 'myprocess:1:4', - processDefinitionName: 'processDefinitionNameFake', - processDefinitionDescription: 'processDefinitionDescriptionFake', - processDefinitionKey: 'myprocess', - processDefinitionCategory: 'http://www.activiti.org/processdef', - processDefinitionVersion: 1, - processDefinitionDeploymentId: '1', - formKey: 1, - processInstanceStartUserId: null, - initiatorCanCompleteTask: false, - adhocTaskCanBeReassigned: false, - taskDefinitionKey: 'sid-B6813AF5-8ACD-4481-A4D5-8BAAD1CB1416', - executionId: 2511, - memberOfCandidateGroup: false, - memberOfCandidateUsers: false, - managerOfCandidateGroup: false - }, - - { - id: 2, name: '', description: 'descriptionFake2', category: null, - assignee: { - id: 1, firstName: 'fistNameFake2', lastName: 'Administrator2', email: 'admin' - }, - created: '2017-03-01T12:25:17.189+0000', - dueDate: '2017-04-02T12:25:17.189+0000', - endDate: null - } - ] - }; - - let fakeCutomSchema = [ - { - 'key': 'fakeName', - 'type': 'text', - 'title': 'ADF_TASK_LIST.PROPERTIES.FAKE', - 'sortable': true - }, - { - 'key': 'fakeTaskName', - 'type': 'text', - 'title': 'ADF_TASK_LIST.PROPERTIES.TASK_FAKE', - 'sortable': true - } - ]; - - let fakeColumnSchema = { - 'default': [ - { - 'key': 'name', - 'type': 'text', - 'title': 'ADF_TASK_LIST.PROPERTIES.NAME', - 'sortable': true - }, - { - 'key': 'created', - 'type': 'text', - 'title': 'ADF_TASK_LIST.PROPERTIES.CREATED', - 'cssClass': 'hidden', - 'sortable': true - }, - { - 'key': 'assignee', - 'type': 'text', - 'title': 'ADF_TASK_LIST.PROPERTIES.ASSIGNEE', - 'cssClass': 'hidden', - 'sortable': true - } - ] - , fakeCutomSchema }; - let component: TaskListComponent; let fixture: ComponentFixture; let appConfig: AppConfigService; @@ -155,8 +64,7 @@ describe('TaskListComponent', () => { ] } } - } - ); + }); }); @@ -170,39 +78,27 @@ describe('TaskListComponent', () => { it('should use the default schemaColumn as default', () => { component.ngAfterContentInit(); - expect(component.data.getColumns()).toBeDefined(); - expect(component.data.getColumns().length).toEqual(3); - }); - - it('should use the schemaColumn passed in input', () => { - component.data = new ObjectDataTableAdapter( - [], - [ - {type: 'text', key: 'fake-id', title: 'Name'} - ] - ); - - component.ngAfterContentInit(); - expect(component.data.getColumns()).toBeDefined(); - expect(component.data.getColumns().length).toEqual(1); + expect(component.columns).toBeDefined(); + expect(component.columns.length).toEqual(3); }); it('should use the custom schemaColumn from app.config.json', () => { + component.presetColumn = 'fakeCutomSchema'; component.ngAfterContentInit(); fixture.detectChanges(); - expect(component.layoutPresets).toEqual(fakeColumnSchema); + expect(component.columns).toEqual(fakeCutomSchema); }); it('should fetch custom schemaColumn when the input presetColumn is defined', () => { component.presetColumn = 'fakeCutomSchema'; fixture.detectChanges(); - expect(component.data.getColumns()).toBeDefined(); - expect(component.data.getColumns().length).toEqual(2); + expect(component.columns).toBeDefined(); + expect(component.columns.length).toEqual(2); }); it('should return an empty task list when no input parameters are passed', () => { component.ngAfterContentInit(); - expect(component.data).toBeDefined(); + expect(component.rows).toBeDefined(); expect(component.isListEmpty()).toBeTruthy(); }); @@ -213,34 +109,34 @@ describe('TaskListComponent', () => { component.success.subscribe((res) => { expect(res).toBeDefined(); - expect(component.data).toBeDefined(); + expect(component.rows).toBeDefined(); expect(component.isListEmpty()).not.toBeTruthy(); - expect(component.data.getRows().length).toEqual(2); - expect(component.data.getRows()[0].getValue('name')).toEqual('nameFake1'); - expect(component.data.getRows()[0].getValue('description')).toEqual('descriptionFake1'); - expect(component.data.getRows()[0].getValue('category')).toEqual('categoryFake1'); - expect(component.data.getRows()[0].getValue('assignee').id).toEqual(2); - expect(component.data.getRows()[0].getValue('assignee').firstName).toEqual('firstNameFake1'); - expect(component.data.getRows()[0].getValue('assignee').lastName).toEqual('lastNameFake1'); - expect(component.data.getRows()[0].getValue('assignee').email).toEqual('emailFake1'); - expect(component.data.getRows()[0].getValue('created')).toEqual('2017-03-01T12:25:17.189+0000'); - expect(component.data.getRows()[0].getValue('dueDate')).toEqual('2017-04-02T12:25:17.189+0000'); - expect(component.data.getRows()[0].getValue('endDate')).toEqual('2017-05-03T12:25:31.129+0000'); - expect(component.data.getRows()[0].getValue('duration')).toEqual(13940); - expect(component.data.getRows()[0].getValue('priority')).toEqual(50); - expect(component.data.getRows()[0].getValue('parentTaskId')).toEqual(1); - expect(component.data.getRows()[0].getValue('parentTaskName')).toEqual('parentTaskNameFake'); - expect(component.data.getRows()[0].getValue('processInstanceId')).toEqual(2511); - expect(component.data.getRows()[0].getValue('processInstanceName')).toEqual('processInstanceNameFake'); - expect(component.data.getRows()[0].getValue('processDefinitionId')).toEqual('myprocess:1:4'); - expect(component.data.getRows()[0].getValue('processDefinitionName')).toEqual('processDefinitionNameFake'); - expect(component.data.getRows()[0].getValue('processDefinitionDescription')).toEqual('processDefinitionDescriptionFake'); - expect(component.data.getRows()[0].getValue('processDefinitionKey')).toEqual('myprocess'); - expect(component.data.getRows()[0].getValue('processDefinitionCategory')).toEqual('http://www.activiti.org/processdef'); + expect(component.rows.length).toEqual(2); + expect(component.rows[0]['name']).toEqual('nameFake1'); + expect(component.rows[0]['description']).toEqual('descriptionFake1'); + expect(component.rows[0]['category']).toEqual('categoryFake1'); + expect(component.rows[0]['assignee'].id).toEqual(2); + expect(component.rows[0]['assignee'].firstName).toEqual('firstNameFake1'); + expect(component.rows[0]['assignee'].lastName).toEqual('lastNameFake1'); + expect(component.rows[0][('assignee')].email).toEqual('emailFake1'); + expect(component.rows[0]['created']).toEqual('2017-03-01T12:25:17.189+0000'); + expect(component.rows[0]['dueDate']).toEqual('2017-04-02T12:25:17.189+0000'); + expect(component.rows[0]['endDate']).toEqual('2017-05-03T12:25:31.129+0000'); + expect(component.rows[0]['duration']).toEqual(13940); + expect(component.rows[0]['priority']).toEqual(50); + expect(component.rows[0]['parentTaskId']).toEqual(1); + expect(component.rows[0]['parentTaskName']).toEqual('parentTaskNameFake'); + expect(component.rows[0]['processInstanceId']).toEqual(2511); + expect(component.rows[0]['processInstanceName']).toEqual('processInstanceNameFake'); + expect(component.rows[0]['processDefinitionId']).toEqual('myprocess:1:4'); + expect(component.rows[0]['processDefinitionName']).toEqual('processDefinitionNameFake'); + expect(component.rows[0]['processDefinitionDescription']).toEqual('processDefinitionDescriptionFake'); + expect(component.rows[0]['processDefinitionKey']).toEqual('myprocess'); + expect(component.rows[0]['processDefinitionCategory']).toEqual('http://www.activiti.org/processdef'); done(); }); component.ngAfterContentInit(); - component.ngOnChanges({'state': state, 'processDefinitionKey': processDefinitionKey, 'assignment': assignment}); + component.ngOnChanges({ 'state': state, 'processDefinitionKey': processDefinitionKey, 'assignment': assignment }); fixture.detectChanges(); jasmine.Ajax.requests.mostRecent().respondWith({ @@ -257,15 +153,15 @@ describe('TaskListComponent', () => { component.success.subscribe((res) => { expect(res).toBeDefined(); - expect(component.data).toBeDefined(); + expect(component.rows).toBeDefined(); expect(component.isListEmpty()).not.toBeTruthy(); - expect(component.data.getRows().length).toEqual(2); - expect(component.data.getRows()[0].getValue('name')).toEqual('nameFake1'); + expect(component.rows.length).toEqual(2); + expect(component.rows[0]['name']).toEqual('nameFake1'); done(); }); component.ngAfterContentInit(); - component.ngOnChanges({'state': state, 'processDefinitionKey': processDefinitionKey, 'assignment': assignment}); + component.ngOnChanges({ 'state': state, 'processDefinitionKey': processDefinitionKey, 'assignment': assignment }); fixture.detectChanges(); jasmine.Ajax.requests.mostRecent().respondWith({ @@ -282,16 +178,16 @@ describe('TaskListComponent', () => { component.success.subscribe((res) => { expect(res).toBeDefined(); - expect(component.data).toBeDefined(); + expect(component.rows).toBeDefined(); expect(component.isListEmpty()).not.toBeTruthy(); - expect(component.data.getRows().length).toEqual(2); - expect(component.data.getRows()[0].getValue('name')).toEqual('nameFake1'); - expect(component.data.getRows()[0].getValue('processInstanceId')).toEqual(2511); + expect(component.rows.length).toEqual(2); + expect(component.rows[0]['name']).toEqual('nameFake1'); + expect(component.rows[0]['processInstanceId']).toEqual(2511); done(); }); component.ngAfterContentInit(); - component.ngOnChanges({'state': state, 'processInstanceId': processInstanceId, 'assignment': assignment}); + component.ngOnChanges({ 'state': state, 'processInstanceId': processInstanceId, 'assignment': assignment }); fixture.detectChanges(); jasmine.Ajax.requests.mostRecent().respondWith({ @@ -307,19 +203,19 @@ describe('TaskListComponent', () => { component.success.subscribe((res) => { expect(res).toBeDefined(); - expect(component.data).toBeDefined(); + expect(component.rows).toBeDefined(); expect(component.isListEmpty()).not.toBeTruthy(); - expect(component.data.getRows().length).toEqual(2); - expect(component.data.getRows()[0].getValue('name')).toEqual('nameFake1'); - expect(component.data.getRows()[0].getValue('processInstanceId')).toEqual(2511); - expect(component.data.getRows()[0].getValue('endDate')).toBeDefined(); - expect(component.data.getRows()[1].getValue('name')).toEqual('No name'); - expect(component.data.getRows()[1].getValue('endDate')).toBeNull(); + expect(component.rows.length).toEqual(2); + expect(component.rows[0]['name']).toEqual('nameFake1'); + expect(component.rows[0]['processInstanceId']).toEqual(2511); + expect(component.rows[0]['endDate']).toBeDefined(); + expect(component.rows[1]['name']).toEqual('No name'); + expect(component.rows[1]['endDate']).toBeNull(); done(); }); component.ngAfterContentInit(); - component.ngOnChanges({'state': state, 'processInstanceId': processInstanceId}); + component.ngOnChanges({ 'state': state, 'processInstanceId': processInstanceId }); fixture.detectChanges(); jasmine.Ajax.requests.mostRecent().respondWith({ @@ -340,24 +236,14 @@ describe('TaskListComponent', () => { expect(component.dataSort).toEqual(['fakeKey', 'fakeOrder']); }); - it('should return selected true for the selected task', () => { - component.data = new ObjectDataTableAdapter( - [ - {id: '999', name: 'Fake-name'}, - {id: '888', name: 'Fake-name-888'} - ], - [ - {type: 'text', key: 'id', title: 'Id'}, - {type: 'text', key: 'name', title: 'Name'} - ] - ); + it('should return selected id for the selected task', () => { + component.rows = [ + { id: '999', name: 'Fake-name' }, + { id: '888', name: 'Fake-name-888' } + ]; component.selectTask('888'); - const dataRow = component.data.getRows(); - expect(dataRow).toBeDefined(); - expect(dataRow[0].getValue('id')).toEqual('999'); - expect(dataRow[0].isSelected).toEqual(false); - expect(dataRow[1].getValue('id')).toEqual('888'); - expect(dataRow[1].isSelected).toEqual(true); + expect(component.rows).toBeDefined(); + expect(component.currentInstanceId).toEqual('888'); }); it('should reload tasks when reload() is called', (done) => { @@ -366,10 +252,10 @@ describe('TaskListComponent', () => { component.ngAfterContentInit(); component.success.subscribe((res) => { expect(res).toBeDefined(); - expect(component.data).toBeDefined(); + expect(component.rows).toBeDefined(); expect(component.isListEmpty()).not.toBeTruthy(); - expect(component.data.getRows().length).toEqual(2); - expect(component.data.getRows()[0].getValue('name')).toEqual('nameFake1'); + expect(component.rows.length).toEqual(2); + expect(component.rows[0]['name']).toEqual('nameFake1'); done(); }); fixture.detectChanges(); @@ -400,13 +286,7 @@ describe('TaskListComponent', () => { describe('component changes', () => { beforeEach(() => { - component.data = new ObjectDataTableAdapter( - [], - [ - {type: 'text', key: 'fake-id', title: 'Name'} - ] - ); - + component.rows = fakeGlobalTask.data; fixture.detectChanges(); }); @@ -414,43 +294,24 @@ describe('TaskListComponent', () => { spyOn(component, 'reload').and.stub(); component.currentInstanceId = '999'; - component.data = new ObjectDataTableAdapter( - [ - {id: '999', name: 'Fake-name'} - ], - [ - {type: 'text', key: 'id', title: 'Id'}, - {type: 'text', key: 'name', title: 'Name'} - ] - ); - + component.rows = [{ id: '999', name: 'Fake-name' }]; const landingTaskId = '999'; let change = new SimpleChange(null, landingTaskId, true); component.ngOnChanges({'landingTaskId': change}); expect(component.reload).not.toHaveBeenCalled(); - expect(component.data.getRows().length).toEqual(1); + expect(component.rows.length).toEqual(1); }); it('should reload the tasks if the loadingTaskId is different from the current task', (done) => { component.currentInstanceId = '999'; - - component.data = new ObjectDataTableAdapter( - [ - {id: '999', name: 'Fake-name'} - ], - [ - {type: 'text', key: 'id', title: 'Id'}, - {type: 'text', key: 'name', title: 'Name'} - ] - ); - + component.rows = [{ id: '999', name: 'Fake-name' }]; const landingTaskId = '888'; let change = new SimpleChange(null, landingTaskId, true); component.success.subscribe((res) => { expect(res).toBeDefined(); - expect(component.data).toBeDefined(); - expect(component.data.getRows().length).toEqual(2); + expect(component.rows).toBeDefined(); + expect(component.rows.length).toEqual(2); done(); }); @@ -463,9 +324,10 @@ describe('TaskListComponent', () => { }); }); - it('should NOT reload the process list when no parameters changed', () => { - expect(component.isListEmpty()).toBeTruthy(); + it('should NOT reload the task list when no parameters changed', () => { + component.rows = null; component.ngOnChanges({}); + fixture.detectChanges(); expect(component.isListEmpty()).toBeTruthy(); }); @@ -475,13 +337,13 @@ describe('TaskListComponent', () => { component.success.subscribe((res) => { expect(res).toBeDefined(); - expect(component.data).toBeDefined(); + expect(component.rows).toBeDefined(); expect(component.isListEmpty()).not.toBeTruthy(); - expect(component.data.getRows().length).toEqual(2); - expect(component.data.getRows()[1].getValue('name')).toEqual('No name'); + expect(component.rows.length).toEqual(2); + expect(component.rows[1]['name']).toEqual('No name'); done(); }); - component.ngOnChanges({'appId': change}); + component.ngOnChanges({ 'appId': change }); jasmine.Ajax.requests.mostRecent().respondWith({ 'status': 200, @@ -496,14 +358,14 @@ describe('TaskListComponent', () => { component.success.subscribe((res) => { expect(res).toBeDefined(); - expect(component.data).toBeDefined(); + expect(component.rows).toBeDefined(); expect(component.isListEmpty()).not.toBeTruthy(); - expect(component.data.getRows().length).toEqual(2); - expect(component.data.getRows()[1].getValue('name')).toEqual('No name'); + expect(component.rows.length).toEqual(2); + expect(component.rows[1]['name']).toEqual('No name'); done(); }); - component.ngOnChanges({'processDefinitionKey': change}); + component.ngOnChanges({ 'processDefinitionKey': change }); jasmine.Ajax.requests.mostRecent().respondWith({ 'status': 200, @@ -518,14 +380,14 @@ describe('TaskListComponent', () => { component.success.subscribe((res) => { expect(res).toBeDefined(); - expect(component.data).toBeDefined(); + expect(component.rows).toBeDefined(); expect(component.isListEmpty()).not.toBeTruthy(); - expect(component.data.getRows().length).toEqual(2); - expect(component.data.getRows()[1].getValue('name')).toEqual('No name'); + expect(component.rows.length).toEqual(2); + expect(component.rows[1]['name']).toEqual('No name'); done(); }); - component.ngOnChanges({'state': change}); + component.ngOnChanges({ 'state': change }); jasmine.Ajax.requests.mostRecent().respondWith({ 'status': 200, @@ -540,14 +402,14 @@ describe('TaskListComponent', () => { component.success.subscribe((res) => { expect(res).toBeDefined(); - expect(component.data).toBeDefined(); + expect(component.rows).toBeDefined(); expect(component.isListEmpty()).not.toBeTruthy(); - expect(component.data.getRows().length).toEqual(2); - expect(component.data.getRows()[1].getValue('name')).toEqual('No name'); + expect(component.rows.length).toEqual(2); + expect(component.rows[1]['name']).toEqual('No name'); done(); }); - component.ngOnChanges({'sort': change}); + component.ngOnChanges({ 'sort': change }); jasmine.Ajax.requests.mostRecent().respondWith({ 'status': 200, @@ -562,14 +424,14 @@ describe('TaskListComponent', () => { component.success.subscribe((res) => { expect(res).toBeDefined(); - expect(component.data).toBeDefined(); + expect(component.rows).toBeDefined(); expect(component.isListEmpty()).not.toBeTruthy(); - expect(component.data.getRows().length).toEqual(2); - expect(component.data.getRows()[1].getValue('name')).toEqual('No name'); + expect(component.rows.length).toEqual(2); + expect(component.rows[1]['name']).toEqual('No name'); done(); }); - component.ngOnChanges({'name': change}); + component.ngOnChanges({ 'name': change }); jasmine.Ajax.requests.mostRecent().respondWith({ 'status': 200, @@ -584,14 +446,14 @@ describe('TaskListComponent', () => { component.success.subscribe((res) => { expect(res).toBeDefined(); - expect(component.data).toBeDefined(); + expect(component.rows).toBeDefined(); expect(component.isListEmpty()).not.toBeTruthy(); - expect(component.data.getRows().length).toEqual(2); - expect(component.data.getRows()[1].getValue('name')).toEqual('No name'); + expect(component.rows.length).toEqual(2); + expect(component.rows[1]['name']).toEqual('No name'); done(); }); - component.ngOnChanges({'assignment': change}); + component.ngOnChanges({ 'assignment': change }); jasmine.Ajax.requests.mostRecent().respondWith({ 'status': 200, @@ -645,10 +507,10 @@ describe('CustomTaskListComponent', () => { it('should fetch custom schemaColumn from html', () => { fixture.detectChanges(); - expect(component.taskList.data.getColumns()).toBeDefined(); - expect(component.taskList.data.getColumns()[0].title).toEqual('ADF_TASK_LIST.PROPERTIES.NAME'); - expect(component.taskList.data.getColumns()[2].title).toEqual('ADF_TASK_LIST.PROPERTIES.CREATED'); - expect(component.taskList.data.getColumns().length).toEqual(3); + expect(component.taskList.columnList).toBeDefined(); + expect(component.taskList.columns[0]['title']).toEqual('ADF_TASK_LIST.PROPERTIES.NAME'); + expect(component.taskList.columns[1]['title']).toEqual('ADF_TASK_LIST.PROPERTIES.CREATED'); + expect(component.taskList.columns.length).toEqual(3); }); }); diff --git a/lib/process-services/task-list/components/task-list.component.ts b/lib/process-services/task-list/components/task-list.component.ts index dc310d974d..462bb668ea 100644 --- a/lib/process-services/task-list/components/task-list.component.ts +++ b/lib/process-services/task-list/components/task-list.component.ts @@ -15,10 +15,9 @@ * limitations under the License. */ -import { DataColumn, DataRowEvent, DataTableAdapter, ObjectDataColumn, - ObjectDataRow, ObjectDataTableAdapter, EmptyCustomContentDirective } from '@alfresco/adf-core'; +import { DataRowEvent, DataTableAdapter, DataTableSchema, EmptyCustomContentDirective } from '@alfresco/adf-core'; import { - AppConfigService, DataColumnListComponent, PaginationComponent, PaginatedComponent, + AppConfigService, PaginationComponent, PaginatedComponent, UserPreferencesService, UserPreferenceValues, PaginationModel } from '@alfresco/adf-core'; import { AfterContentInit, Component, ContentChild, EventEmitter, @@ -36,13 +35,14 @@ import { TaskListService } from './../services/tasklist.service'; templateUrl: './task-list.component.html', styleUrls: ['./task-list.component.css'] }) -export class TaskListComponent implements OnChanges, AfterContentInit, PaginatedComponent { +export class TaskListComponent extends DataTableSchema implements OnChanges, AfterContentInit, PaginatedComponent { + + static PRESET_KEY = 'adf-task-list.presets'; + + @ContentChild(EmptyCustomContentDirective) emptyCustomContent: EmptyCustomContentDirective; requestNode: TaskQueryRequestRepresentationModel; - @ContentChild(DataColumnListComponent) columnList: DataColumnListComponent; - @ContentChild(EmptyCustomContentDirective) emptyCustomContent: EmptyCustomContentDirective; - /** The id of the app. */ @Input() appId: number; @@ -69,7 +69,7 @@ export class TaskListComponent implements OnChanges, AfterContentInit, Paginated @Input() assignment: string; - /** Define the sort order of the processes. Possible values are : `created-desc`, + /** Define the sort order of the tasks. Possible values are : `created-desc`, * `created-asc`, `due-desc`, `due-asc` */ @Input() @@ -88,6 +88,7 @@ export class TaskListComponent implements OnChanges, AfterContentInit, Paginated /** Data source object that represents the number and the type of the columns that * you want to show. */ + /** @deprecated 2.4.0 */ @Input() data: DataTableAdapter; @@ -98,14 +99,14 @@ export class TaskListComponent implements OnChanges, AfterContentInit, Paginated @Input() selectionMode: string = 'single'; // none|single|multiple - /** Custom preset column schema in JSON format. */ - @Input() - presetColumn: string; - /** Toggles multiple row selection, renders checkboxes at the beginning of each row */ @Input() multiselect: boolean = false; + /* Toggles default selection of the first row */ + @Input() + selectFirstRow: boolean = true; + /** Emitted when a task in the list is clicked */ @Output() rowClick: EventEmitter = new EventEmitter(); @@ -124,7 +125,6 @@ export class TaskListComponent implements OnChanges, AfterContentInit, Paginated currentInstanceId: string; selectedInstances: any[]; - layoutPresets = {}; pagination: BehaviorSubject; /** The page number of the tasks to fetch. */ @@ -135,6 +135,7 @@ export class TaskListComponent implements OnChanges, AfterContentInit, Paginated @Input() size: number = PaginationComponent.DEFAULT_PAGINATION.maxItems; + rows: any[] = []; isLoading: boolean = true; sorting: any[] = ['created', 'desc']; @@ -148,9 +149,9 @@ export class TaskListComponent implements OnChanges, AfterContentInit, Paginated hasCustomDataSource: boolean = false; constructor(private taskListService: TaskListService, - private appConfig: AppConfigService, + appConfigService: AppConfigService, private userPreferences: UserPreferencesService) { - + super(appConfigService, TaskListComponent.PRESET_KEY, taskPresetsDefaultModel); this.userPreferences.select(UserPreferenceValues.PaginationSize).subscribe((pageSize) => { this.size = pageSize; }); @@ -163,23 +164,20 @@ export class TaskListComponent implements OnChanges, AfterContentInit, Paginated } ngAfterContentInit() { - this.loadLayoutPresets(); - this.setupSchema(); + this.createDatatableSchema(); + if (this.data && this.data.getColumns().length === 0) { + this.data.setColumns(this.columns); + } + if (this.appId) { this.reload(); } } - /** - * Setup html-based (html definitions) or code behind (data adapter) schema. - * If component is assigned with an empty data adater the default schema settings applied. - */ - setupSchema(): void { - let schema = this.getSchema(); - if (!this.data) { - this.data = new ObjectDataTableAdapter([], schema); - } else if (this.data.getColumns().length === 0) { - this.data.setColumns(schema); + setCustomDataSource(rows: any[]): void { + if (rows) { + this.rows = rows; + this.hasCustomDataSource = true; } } @@ -189,13 +187,6 @@ export class TaskListComponent implements OnChanges, AfterContentInit, Paginated } } - setCustomDataSource(rows: ObjectDataRow[]): void { - if (this.data) { - this.data.setRows(rows); - this.hasCustomDataSource = true; - } - } - private isPropertyChanged(changes: SimpleChanges): boolean { let changed: boolean = true; @@ -217,6 +208,8 @@ export class TaskListComponent implements OnChanges, AfterContentInit, Paginated if (!this.hasCustomDataSource) { this.requestNode = this.createRequestNode(); this.load(this.requestNode); + } else { + this.isLoading = false; } } @@ -224,8 +217,7 @@ export class TaskListComponent implements OnChanges, AfterContentInit, Paginated this.isLoading = true; this.loadTasksByState().subscribe( (tasks) => { - let instancesRow = this.createDataRow(tasks.data); - this.renderInstances(instancesRow); + this.rows = this.optimizeNames(tasks.data); this.selectTask(this.landingTaskId); this.success.emit(tasks); this.isLoading = false; @@ -247,57 +239,25 @@ export class TaskListComponent implements OnChanges, AfterContentInit, Paginated : this.taskListService.findTasksByState(this.requestNode); } - /** - * Create an array of ObjectDataRow - * @param instances - */ - private createDataRow(instances: any[]): ObjectDataRow[] { - let instancesRows: ObjectDataRow[] = []; - instances.forEach((row) => { - instancesRows.push(new ObjectDataRow(row)); - }); - return instancesRows; - } - - /** - * Render the instances list - * - * @param instances - */ - private renderInstances(instances: any[]) { - instances = this.optimizeNames(instances); - this.data.setRows(instances); - } - /** * Select the task given in input if present */ selectTask(taskIdSelected: string): void { if (!this.isListEmpty()) { - let rows = this.data.getRows(); - if (rows.length > 0) { - let dataRow; - if (taskIdSelected) { - dataRow = rows.find((currentRow: any) => { - return currentRow.getValue('id') === taskIdSelected; - }); - - if (!dataRow) { - dataRow = rows[0]; - } - } else { - dataRow = rows[0]; + let dataRow; + if (taskIdSelected) { + dataRow = this.rows.find((currentRow: any) => { + return currentRow['id'] === taskIdSelected; + }); + if (!dataRow) { + dataRow = this.rows[0]; } - - this.data.selectedRow = dataRow; - dataRow.isSelected = true; - this.currentInstanceId = dataRow.getValue('id'); + } else { + dataRow = this.rows[0]; } + this.rows[0] = dataRow; + this.currentInstanceId = dataRow['id']; } else { - if (this.data) { - this.data.selectedRow = null; - } - this.currentInstanceId = null; } } @@ -329,8 +289,7 @@ export class TaskListComponent implements OnChanges, AfterContentInit, Paginated * Check if the list is empty */ isListEmpty(): boolean { - return this.data === undefined || - (this.data && this.data.getRows() && this.data.getRows().length === 0); + return !this.rows || this.rows.length === 0; } onRowClick(item: DataRowEvent) { @@ -360,12 +319,14 @@ export class TaskListComponent implements OnChanges, AfterContentInit, Paginated * Optimize name field * @param istances */ - private optimizeNames(istances: any[]): any[] { - istances = istances.map(t => { - t.obj.name = t.obj.name || 'No name'; + private optimizeNames(instances: any[]): any[] { + instances = instances.map(t => { + if (!t.name) { + t.name = 'No name'; + } return t; }); - return istances; + return instances; } private createRequestNode() { @@ -386,41 +347,6 @@ export class TaskListComponent implements OnChanges, AfterContentInit, Paginated return new TaskQueryRequestRepresentationModel(requestNode); } - private loadLayoutPresets(): void { - const externalSettings = this.appConfig.get('adf-task-list.presets', null); - - if (externalSettings) { - this.layoutPresets = Object.assign({}, taskPresetsDefaultModel, externalSettings); - } else { - this.layoutPresets = taskPresetsDefaultModel; - } - } - - getSchema(): any { - let customSchemaColumns = []; - customSchemaColumns = this.getSchemaFromConfig(this.presetColumn).concat(this.getSchemaFromHtml()); - if (customSchemaColumns.length === 0) { - customSchemaColumns = this.getDefaultLayoutPreset(); - } - return customSchemaColumns; - } - - getSchemaFromHtml(): any { - let schema = []; - if (this.columnList && this.columnList.columns && this.columnList.columns.length > 0) { - schema = this.columnList.columns.map(c => c); - } - return schema; - } - - private getSchemaFromConfig(name: string): DataColumn[] { - return name ? (this.layoutPresets[name]).map(col => new ObjectDataColumn(col)) : []; - } - - private getDefaultLayoutPreset(): DataColumn[] { - return (this.layoutPresets['default']).map(col => new ObjectDataColumn(col)); - } - updatePagination(params: PaginationModel) { const needsReload = params.maxItems || params.skipCount; this.size = params.maxItems;