From 33fc2373ae5f143eb1ecbe2929f3a576d9523f4d Mon Sep 17 00:00:00 2001 From: Maurizio Vitale Date: Wed, 19 Jul 2017 16:22:32 +0100 Subject: [PATCH] [ADF-1108] Task header - Show the parent name as a clickable value (#2098) * Add a MapItem component inside the CardVied Add a way to define a property clickable * Fix unit test * Add basic documentation Unify css class name * Fix class name * remove unused class --- ng2-components/README.md | 1 + .../src/components/task-details.component.ts | 7 +- .../src/components/task-header.component.ts | 5 +- ng2-components/ng2-alfresco-core/README.md | 32 ++++- ng2-components/ng2-alfresco-core/index.ts | 2 + .../view/card-view-dateitem.component.spec.ts | 10 +- .../view/card-view-mapitem.component.html | 9 ++ .../view/card-view-mapitem.component.scss | 7 + .../view/card-view-mapitem.component.spec.ts | 129 ++++++++++++++++++ .../view/card-view-mapitem.component.ts | 45 ++++++ .../view/card-view-textitem.component.html | 7 +- .../view/card-view-textitem.component.scss | 6 +- .../view/card-view-textitem.component.spec.ts | 10 +- .../view/card-view-textitem.component.ts | 8 ++ .../src/components/view/card-view.module.ts | 3 + .../src/models/card-view-baseitem.model.ts | 3 + .../src/models/card-view-mapitem.model.ts | 44 ++++++ .../src/services/card-view-update.service.ts | 12 ++ 18 files changed, 319 insertions(+), 21 deletions(-) create mode 100644 ng2-components/ng2-alfresco-core/src/components/view/card-view-mapitem.component.html create mode 100644 ng2-components/ng2-alfresco-core/src/components/view/card-view-mapitem.component.scss create mode 100644 ng2-components/ng2-alfresco-core/src/components/view/card-view-mapitem.component.spec.ts create mode 100644 ng2-components/ng2-alfresco-core/src/components/view/card-view-mapitem.component.ts create mode 100644 ng2-components/ng2-alfresco-core/src/models/card-view-mapitem.model.ts diff --git a/ng2-components/README.md b/ng2-components/README.md index 3c7072b6b8..603cc1e7f8 100644 --- a/ng2-components/README.md +++ b/ng2-components/README.md @@ -24,6 +24,7 @@ - [adf-card-view](ng2-alfresco-core/README.md) - [adf-card-view-textitem](ng2-alfresco-core/README.md) +- [adf-card-view-mapitem](ng2-alfresco-core/README.md) - [adf-card-view-item-dispatcher](ng2-alfresco-core/README.md) - [adf-card-view-dateitem](ng2-alfresco-core/README.md) - [adf-context-menu-holder](ng2-alfresco-core/README.md) diff --git a/ng2-components/ng2-activiti-tasklist/src/components/task-details.component.ts b/ng2-components/ng2-activiti-tasklist/src/components/task-details.component.ts index 6e4395843b..b73e1858e5 100644 --- a/ng2-components/ng2-activiti-tasklist/src/components/task-details.component.ts +++ b/ng2-components/ng2-activiti-tasklist/src/components/task-details.component.ts @@ -27,7 +27,7 @@ import { Component, ViewChild } from '@angular/core'; import { ContentLinkModel, FormModel, FormOutcomeEvent, FormService } from 'ng2-activiti-form'; -import { AlfrescoAuthenticationService, AlfrescoTranslationService, CardViewUpdateService, LogService, UpdateNotification } from 'ng2-alfresco-core'; +import { AlfrescoAuthenticationService, AlfrescoTranslationService, CardViewUpdateService, LogService, UpdateNotification, ClickNotification } from 'ng2-alfresco-core'; import { TaskQueryRequestRepresentationModel } from '../models/filter.model'; import { TaskDetailsModel } from '../models/task-details.model'; import { User } from '../models/user.model'; @@ -161,6 +161,7 @@ export class TaskDetailsComponent implements OnInit, OnChanges { } this.cardViewUpdateService.itemUpdated$.subscribe(this.updateTaskDetails.bind(this)); + this.cardViewUpdateService.itemClicked$.subscribe(this.clickTaskDetails.bind(this)); } ngOnChanges(changes: SimpleChanges): void { @@ -206,6 +207,10 @@ export class TaskDetailsComponent implements OnInit, OnChanges { ); } + private clickTaskDetails(clickNotification: ClickNotification) { + console.log(clickNotification.target); + } + /** * Load the activiti task details * @param taskId diff --git a/ng2-components/ng2-activiti-tasklist/src/components/task-header.component.ts b/ng2-components/ng2-activiti-tasklist/src/components/task-header.component.ts index edbb19f920..520536c5c4 100644 --- a/ng2-components/ng2-activiti-tasklist/src/components/task-header.component.ts +++ b/ng2-components/ng2-activiti-tasklist/src/components/task-header.component.ts @@ -16,7 +16,7 @@ */ import { Component, EventEmitter, Input, OnChanges, Output, SimpleChanges } from '@angular/core'; -import { AlfrescoTranslationService, CardViewDateItemModel, CardViewItem, CardViewTextItemModel, LogService } from 'ng2-alfresco-core'; +import { AlfrescoTranslationService, CardViewDateItemModel, CardViewItem, CardViewTextItemModel, CardViewMapItemModel, LogService } from 'ng2-alfresco-core'; import { TaskDetailsModel } from '../models/task-details.model'; import { TaskListService } from './../services/tasklist.service'; @@ -54,12 +54,13 @@ export class TaskHeaderComponent implements OnChanges { refreshData() { if (this.taskDetails) { - + let valueMap = new Map([[this.taskDetails.processDefinitionId, this.taskDetails.processDefinitionName]]) this.properties = [ new CardViewTextItemModel({ label: 'Assignee', value: this.taskDetails.getFullName(), key: 'assignee', default: 'No assignee' } ), new CardViewTextItemModel({ label: 'Status', value: this.getTaskStatus(), key: 'status' }), new CardViewDateItemModel({ label: 'Due Date', value: this.taskDetails.dueDate, key: 'dueDate', default: 'No date', editable: true }), new CardViewTextItemModel({ label: 'Category', value: this.taskDetails.category, key: 'category', default: 'No category' }), + new CardViewMapItemModel({ label: 'Parent name', value: valueMap, key: 'parentName', default: 'No parent name', clickable: true }), new CardViewTextItemModel({ label: 'Created By', value: this.taskDetails.getFullName(), key: 'created-by', default: 'No assignee' }), new CardViewDateItemModel({ label: 'Created', value: this.taskDetails.created, key: 'created' }), new CardViewTextItemModel({ label: 'Id', value: this.taskDetails.id, key: 'id' }), diff --git a/ng2-components/ng2-alfresco-core/README.md b/ng2-components/ng2-alfresco-core/README.md index 048832b35e..2845f6bea1 100644 --- a/ng2-components/ng2-alfresco-core/README.md +++ b/ng2-components/ng2-alfresco-core/README.md @@ -33,6 +33,8 @@ * [Defining properties](#defining-properties) * [Card Text Item](#card-text-item) + [Options](#options) + * [Card Map Item](#card-map-item) + + [Options](#options) * [Card Date Item](#card-date-item) + [Options](#options-1) * [Defining your custom card Item](#defining-your-custom-card-item) @@ -645,9 +647,10 @@ export interface CardViewItem { } ``` -At the moment two models are defined out of the box: +At the moment three models are defined out of the box: - **[CardViewTextItemModel](#card-text-item)** - *for text items* +- **[CardViewMapItemModel](#card-map-item)** - *for map items* - **[CardViewDateItemModel](#card-date-item)** - *for date items* Each of them are extending the abstract CardViewBaseItemModel class, and each of them are adding some custom functionality to the basic behaviour. @@ -661,6 +664,13 @@ Each of them are extending the abstract CardViewBaseItemModel class, and each of default: 'default bar' , multiline: false }), + new CardViewMapItemModel({ + label: 'My map', + value: new Map([['999', 'My Value']]), + key: 'map', + default: 'default map value' , + clickable: true + }), new CardViewDateItemModel({ label: 'Birth of date', value: someDate, @@ -691,8 +701,28 @@ const textItemProperty = new CardViewTextItemModel(options); | default | any | --- | The default value to render in case the value is empty | | displayValue* | string | --- | The value to render | | editable | boolean | false | Whether the property editable or not | +| clickable | boolean | false | Whether the property clikable or not | | multiline | string | false | Single or multiline text | +### Card Map Item + +CardViewMapItemModel is a property type for map properties. + +```js +const mapItemProperty = new CardViewMapItemModel(options); +``` + +#### Options + +| Name | Type | Default | Description | +| --- | --- | --- | --- | +| label* | string | --- | The label to render | +| value* | Map | --- | A map that contains the key value pairs | +| key* | string | --- | the key of the property. Have an important role when editing the property. | +| default | any | --- | The default value to render in case the value is empty | +| displayValue* | string | --- | The value to render | +| clickable | boolean | false | Whether the property clickable or not | + ### Card Date Item CardViewDateItemModel is a property type for date properties. diff --git a/ng2-components/ng2-alfresco-core/index.ts b/ng2-components/ng2-alfresco-core/index.ts index 3014dd2d13..c5b1237d7a 100644 --- a/ng2-components/ng2-alfresco-core/index.ts +++ b/ng2-components/ng2-alfresco-core/index.ts @@ -82,6 +82,7 @@ export { ThumbnailService } from './src/services/thumbnail.service'; export { UploadService } from './src/services/upload.service'; export { CardViewUpdateService } from './src/services/card-view-update.service'; export { UpdateNotification } from './src/services/card-view-update.service'; +export { ClickNotification } from './src/services/card-view-update.service'; export { AppConfigModule } from './src/services/app-config.service'; export { UserPreferencesService } from './src/services/user-preferences.service'; @@ -119,6 +120,7 @@ export * from './src/events/folder-created.event'; export * from './src/events/file.event'; export * from './src/models/card-view-textitem.model'; +export * from './src/models/card-view-mapitem.model'; export * from './src/models/card-view-dateitem.model'; export * from './src/models/file.model'; export * from './src/models/permissions.enum'; diff --git a/ng2-components/ng2-alfresco-core/src/components/view/card-view-dateitem.component.spec.ts b/ng2-components/ng2-alfresco-core/src/components/view/card-view-dateitem.component.spec.ts index 2590ab9775..e197bc1b4f 100644 --- a/ng2-components/ng2-alfresco-core/src/components/view/card-view-dateitem.component.spec.ts +++ b/ng2-components/ng2-alfresco-core/src/components/view/card-view-dateitem.component.spec.ts @@ -46,18 +46,14 @@ describe('CardViewDateItemComponent', () => { beforeEach(() => { fixture = TestBed.createComponent(CardViewDateItemComponent); component = fixture.componentInstance; - component.property = { - type: 'date', + component.property = new CardViewDateItemModel ({ label: 'Date label', value: new Date('07/10/2017'), key: 'datekey', default: '', format: '', - editable: false, - get displayValue(): string { - return 'Jul 10 2017'; - } - }; + editable: false + }); }); afterEach(() => { diff --git a/ng2-components/ng2-alfresco-core/src/components/view/card-view-mapitem.component.html b/ng2-components/ng2-alfresco-core/src/components/view/card-view-mapitem.component.html new file mode 100644 index 0000000000..26da35150e --- /dev/null +++ b/ng2-components/ng2-alfresco-core/src/components/view/card-view-mapitem.component.html @@ -0,0 +1,9 @@ +
{{ property.label }}
+
+
+ {{ property.displayValue }} + + {{ property.displayValue }} + +
+
diff --git a/ng2-components/ng2-alfresco-core/src/components/view/card-view-mapitem.component.scss b/ng2-components/ng2-alfresco-core/src/components/view/card-view-mapitem.component.scss new file mode 100644 index 0000000000..5a42b14ba1 --- /dev/null +++ b/ng2-components/ng2-alfresco-core/src/components/view/card-view-mapitem.component.scss @@ -0,0 +1,7 @@ +@import 'theming'; + +.#{$ADF} { + &-mapitem-clickable-value { + cursor: pointer; + } +} diff --git a/ng2-components/ng2-alfresco-core/src/components/view/card-view-mapitem.component.spec.ts b/ng2-components/ng2-alfresco-core/src/components/view/card-view-mapitem.component.spec.ts new file mode 100644 index 0000000000..ea06a181d4 --- /dev/null +++ b/ng2-components/ng2-alfresco-core/src/components/view/card-view-mapitem.component.spec.ts @@ -0,0 +1,129 @@ +/*! + * @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 { DebugElement } from '@angular/core'; +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; +import { FormsModule } from '@angular/forms'; +import { MdDatepickerModule, MdIconModule, MdInputModule, MdNativeDateModule } from '@angular/material'; +import { By } from '@angular/platform-browser'; +import { NoopAnimationsModule } from '@angular/platform-browser/animations'; +import { CardViewMapItemModel } from '../../models/card-view-mapitem.model'; +import { CardViewUpdateService } from '../../services/card-view-update.service'; +import { CardViewMapItemComponent } from './card-view-mapitem.component'; + +describe('CardViewMapItemComponent', () => { + let service: CardViewUpdateService; + + let fixture: ComponentFixture; + let component: CardViewMapItemComponent; + let debug: DebugElement; + let element: HTMLElement; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + imports: [ + FormsModule, + NoopAnimationsModule, + MdDatepickerModule, + MdIconModule, + MdInputModule, + MdNativeDateModule + ], + declarations: [ + CardViewMapItemComponent + ], + providers: [ + CardViewUpdateService + ] + }).compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(CardViewMapItemComponent); + service = TestBed.get(CardViewUpdateService); + component = fixture.componentInstance; + debug = fixture.debugElement; + element = fixture.nativeElement; + }); + + afterEach(() => { + fixture.destroy(); + TestBed.resetTestingModule(); + }); + + it('should render the default if the value is empty', () => { + component.property = new CardViewMapItemModel({ + label: 'Map label', + value: null, + key: 'mapkey', + default: 'Fake default' + }); + + fixture.detectChanges(); + + let labelValue = debug.query(By.css('.adf-property-label')); + expect(labelValue).not.toBeNull(); + expect(labelValue.nativeElement.innerText).toBe('Map label'); + + let value = debug.query(By.css(`[data-automation-id="card-mapitem-value-${component.property.key}"]`)); + expect(value).not.toBeNull(); + expect(value.nativeElement.innerText.trim()).toBe('Fake default'); + }); + + it('should render the label and value', () => { + component.property = new CardViewMapItemModel({ + label: 'Map label', + value: new Map([['999', 'fakeProcessName']]), + key: 'mapkey', + default: '' + }); + + fixture.detectChanges(); + + let labelValue = debug.query(By.css('.adf-property-label')); + expect(labelValue).not.toBeNull(); + expect(labelValue.nativeElement.innerText).toBe('Map label'); + + let value = debug.query(By.css(`[data-automation-id="card-mapitem-value-${component.property.key}"]`)); + expect(value).not.toBeNull(); + expect(value.nativeElement.innerText.trim()).toBe('fakeProcessName'); + }); + + it('should render a clickable value', (done) => { + component.property = new CardViewMapItemModel({ + label: 'Map label', + value: new Map([['999', 'fakeProcessName']]), + key: 'mapkey', + default: 'Fake default', + clickable: true + }); + + fixture.detectChanges(); + let value: any = element.querySelector('.adf-mapitem-clickable-value'); + + service.itemClicked$.subscribe((response) => { + expect(response.target).not.toBeNull(); + expect(response.target.type).toEqual('map'); + expect(response.target.clickable).toBeTruthy(); + expect(response.target.displayValue).toEqual('fakeProcessName'); + done(); + }); + + value.click(); + }); + +}); diff --git a/ng2-components/ng2-alfresco-core/src/components/view/card-view-mapitem.component.ts b/ng2-components/ng2-alfresco-core/src/components/view/card-view-mapitem.component.ts new file mode 100644 index 0000000000..bac11f547c --- /dev/null +++ b/ng2-components/ng2-alfresco-core/src/components/view/card-view-mapitem.component.ts @@ -0,0 +1,45 @@ +/*! + * @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 { Component, Input, OnChanges } from '@angular/core'; +import { CardViewMapItemModel } from '../../models/card-view-mapitem.model'; +import { CardViewUpdateService } from '../../services/card-view-update.service'; + +@Component({ + selector: 'adf-card-view-mapitem', + templateUrl: './card-view-mapitem.component.html', + styleUrls: ['./card-view-mapitem.component.scss'] +}) + +export class CardViewMapItemComponent implements OnChanges { + @Input() + property: CardViewMapItemModel; + + constructor(private cardViewUpdateService: CardViewUpdateService) {} + + ngOnChanges() { + console.log(); + } + + isClickable() { + return this.property.clickable; + } + + clicked(): void { + this.cardViewUpdateService.clicked(this.property); + } +} diff --git a/ng2-components/ng2-alfresco-core/src/components/view/card-view-textitem.component.html b/ng2-components/ng2-alfresco-core/src/components/view/card-view-textitem.component.html index db42631255..50d80a32ea 100644 --- a/ng2-components/ng2-alfresco-core/src/components/view/card-view-textitem.component.html +++ b/ng2-components/ng2-alfresco-core/src/components/view/card-view-textitem.component.html @@ -1,7 +1,10 @@
{{ property.label }}
- {{ property.displayValue }} + {{ property.displayValue }} + + {{ property.displayValue }} +
@@ -36,4 +39,4 @@ [attr.data-automation-id]="'card-textitem-reset-' + property.key">clear
-
\ No newline at end of file + diff --git a/ng2-components/ng2-alfresco-core/src/components/view/card-view-textitem.component.scss b/ng2-components/ng2-alfresco-core/src/components/view/card-view-textitem.component.scss index e9111148dc..fe91450fc3 100644 --- a/ng2-components/ng2-alfresco-core/src/components/view/card-view-textitem.component.scss +++ b/ng2-components/ng2-alfresco-core/src/components/view/card-view-textitem.component.scss @@ -23,6 +23,10 @@ } } + &-textitem-clickable-value { + cursor: pointer; + } + &-textitem-editable { display: flex; @@ -77,4 +81,4 @@ &-textitem-editable /deep/ input.mat-input-element:focus { margin-bottom: -7px; } -} \ No newline at end of file +} diff --git a/ng2-components/ng2-alfresco-core/src/components/view/card-view-textitem.component.spec.ts b/ng2-components/ng2-alfresco-core/src/components/view/card-view-textitem.component.spec.ts index ecef3b4a5c..07ba047d23 100644 --- a/ng2-components/ng2-alfresco-core/src/components/view/card-view-textitem.component.spec.ts +++ b/ng2-components/ng2-alfresco-core/src/components/view/card-view-textitem.component.spec.ts @@ -51,17 +51,13 @@ describe('CardViewTextItemComponent', () => { beforeEach(() => { fixture = TestBed.createComponent(CardViewTextItemComponent); component = fixture.componentInstance; - component.property = { - type: 'text', + component.property = new CardViewTextItemModel ({ label: 'Text label', value: 'Lorem ipsum', key: 'textkey', default: '', - editable: false, - get displayValue(): string { - return 'Lorem ipsum'; - } - }; + editable: false + }); }); afterEach(() => { diff --git a/ng2-components/ng2-alfresco-core/src/components/view/card-view-textitem.component.ts b/ng2-components/ng2-alfresco-core/src/components/view/card-view-textitem.component.ts index 4a85597b1a..13c3257ad7 100644 --- a/ng2-components/ng2-alfresco-core/src/components/view/card-view-textitem.component.ts +++ b/ng2-components/ng2-alfresco-core/src/components/view/card-view-textitem.component.ts @@ -47,6 +47,10 @@ export class CardViewTextItemComponent implements OnChanges { return this.editable && this.property.editable; } + isClickable() { + return this.property.clickable; + } + setEditMode(editStatus: boolean): void { this.inEdit = editStatus; setTimeout(() => { @@ -62,4 +66,8 @@ export class CardViewTextItemComponent implements OnChanges { update(): void { this.cardViewUpdateService.update(this.property, { [this.property.key]: this.editedValue }); } + + clicked(): void { + this.cardViewUpdateService.clicked(this.property); + } } diff --git a/ng2-components/ng2-alfresco-core/src/components/view/card-view.module.ts b/ng2-components/ng2-alfresco-core/src/components/view/card-view.module.ts index 4f0a9e0a92..5b5daa062d 100644 --- a/ng2-components/ng2-alfresco-core/src/components/view/card-view.module.ts +++ b/ng2-components/ng2-alfresco-core/src/components/view/card-view.module.ts @@ -23,6 +23,7 @@ import { CardViewContentProxyDirective } from './card-view-content-proxy.directi import { CardViewDateItemComponent } from './card-view-dateitem.component'; import { CardViewItemDispatcherComponent } from './card-view-item-dispatcher.component'; import { CardViewTextItemComponent } from './card-view-textitem.component'; +import { CardViewMapItemComponent } from './card-view-mapitem.component'; import { CardViewComponent } from './card-view.component'; @NgModule({ @@ -40,10 +41,12 @@ import { CardViewComponent } from './card-view.component'; CardViewItemDispatcherComponent, CardViewContentProxyDirective, CardViewTextItemComponent, + CardViewMapItemComponent, CardViewDateItemComponent ], entryComponents: [ CardViewTextItemComponent, + CardViewMapItemComponent, CardViewDateItemComponent ], exports: [ diff --git a/ng2-components/ng2-alfresco-core/src/models/card-view-baseitem.model.ts b/ng2-components/ng2-alfresco-core/src/models/card-view-baseitem.model.ts index 4da54a4adc..47f170e4f7 100644 --- a/ng2-components/ng2-alfresco-core/src/models/card-view-baseitem.model.ts +++ b/ng2-components/ng2-alfresco-core/src/models/card-view-baseitem.model.ts @@ -29,6 +29,7 @@ export interface CardViewItemProperties { key: any; default?: string; editable?: boolean; + clickable?: boolean; } export abstract class CardViewBaseItemModel { @@ -37,6 +38,7 @@ export abstract class CardViewBaseItemModel { key: any; default: string; editable: boolean; + clickable: boolean; constructor(obj: CardViewItemProperties) { this.label = obj.label || ''; @@ -44,5 +46,6 @@ export abstract class CardViewBaseItemModel { this.key = obj.key; this.default = obj.default; this.editable = obj.editable || false; + this.clickable = obj.clickable || false; } } diff --git a/ng2-components/ng2-alfresco-core/src/models/card-view-mapitem.model.ts b/ng2-components/ng2-alfresco-core/src/models/card-view-mapitem.model.ts new file mode 100644 index 0000000000..47a21ca494 --- /dev/null +++ b/ng2-components/ng2-alfresco-core/src/models/card-view-mapitem.model.ts @@ -0,0 +1,44 @@ +/*! + * @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. + */ + +/** + * + * This object represent the basic structure of a card view. + * + * + * @returns {CardViewMapItemModel} . + */ + +import { CardViewItem } from '../interface/card-view-item.interface'; +import { CardViewBaseItemModel, CardViewItemProperties } from './card-view-baseitem.model'; + +export class CardViewMapItemModel extends CardViewBaseItemModel implements CardViewItem { + type: string = 'map'; + value: Map; + + constructor(obj: CardViewItemProperties) { + super(obj); + } + + get displayValue() { + if (this.value && this.value.size > 0) { + return this.value.values().next().value; + } else { + return this.default; + } + } +} diff --git a/ng2-components/ng2-alfresco-core/src/services/card-view-update.service.ts b/ng2-components/ng2-alfresco-core/src/services/card-view-update.service.ts index 3821af74ab..e2e2be4bb2 100644 --- a/ng2-components/ng2-alfresco-core/src/services/card-view-update.service.ts +++ b/ng2-components/ng2-alfresco-core/src/services/card-view-update.service.ts @@ -24,6 +24,10 @@ export interface UpdateNotification { changed: any; } +export interface ClickNotification { + target: any; +} + @Injectable() export class CardViewUpdateService { @@ -33,10 +37,18 @@ export class CardViewUpdateService { // Observable streams public itemUpdated$ = this.itemUpdatedSource.asObservable(); + public itemClicked$: Subject = new Subject(); + update(property: CardViewBaseItemModel, changed: any) { this.itemUpdatedSource.next({ target: property, changed }); } + + clicked(property: CardViewBaseItemModel) { + this.itemClicked$.next({ + target: property + }); + } }