inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-05-26 17:24:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ADF-5390] [ADF-5391] Add multivalue cardview for Date, Datetime, Integers and Decimal properties. (#6980)

Browse Source 
* [ADF-5390] Addd multivalue cardview for Date, Datetime, Integers and Decimal properties

* Fix unit test

* Fix linting

* Fix e2e tests

* fix e2e

Co-authored-by: Eugenio Romano <eugenio.romano@alfresco.com>
This commit is contained in:
davidcanonieto 2021-05-09 04:05:26 +01:00 committed by GitHub
parent 71cad4c287
commit bd805cb34b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
23 changed files with 280 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
demo-shell/src/app/components/card-view/card-view.component.ts
View File

@ -125,6 +125,15 @@ export class CardViewComponent implements OnInit, OnDestroy {
format: 'shortDate',
editable: this.isEditable
}),
new CardViewDateItemModel({
label: 'CardView Date Item - Multivalue (chips)',
value: [new Date(1983, 11, 24, 10, 0, 30)],
key: 'date',
default: new Date(1983, 11, 24, 10, 0, 30),
format: 'shortDate',
editable: this.isEditable,
multivalued: true
}),
new CardViewDatetimeItemModel({
label: 'CardView Datetime Item',
value: new Date(1983, 11, 24, 10, 0, 0),
@ -133,6 +142,15 @@ export class CardViewComponent implements OnInit, OnDestroy {
format: 'short',
editable: this.isEditable
}),
new CardViewDatetimeItemModel({
label: 'CardView Datetime Item - Multivalue (chips)',
value: [new Date(1983, 11, 24, 10, 0, 0)],
key: 'datetime',
default: new Date(1983, 11, 24, 10, 0, 0),
format: 'short',
editable: this.isEditable,
multivalued: true
}),
new CardViewBoolItemModel({
label: 'CardView Boolean Item',
value: true,
@ -162,6 +180,15 @@ export class CardViewComponent implements OnInit, OnDestroy {
editable: this.isEditable,
pipes: [{ pipe: this.decimalNumberPipe }]
}),
new CardViewFloatItemModel({
label: 'CardView Float Item - Multivalue (chips)',
value: [9.9],
key: 'float',
default: 0.0,
editable: this.isEditable,
multivalued: true,
pipes: [{ pipe: this.decimalNumberPipe }]
}),
new CardViewKeyValuePairsItemModel({
label: 'CardView Key-Value Pairs Item',
value: [{ name: 'hey', value: 'you' }, { name: 'hey', value: 'you' }],

4
e2e/core/pages/metadata-view.page.ts
View File

@ -25,9 +25,9 @@ export class MetadataViewPage {
aspectTitle: Locator = by.css(`mat-panel-title`);
name = element(by.css(`[data-automation-id='card-textitem-value-properties.cm:name']`));
creator = element(by.css(`[data-automation-id='card-textitem-value-createdByUser.displayName']`));
createdDate = element(by.css(`span[data-automation-id='card-dateitem-createdAt'] span`));
createdDate = element(by.css(`span[data-automation-id='card-dateitem-createdAt']`));
modifier = element(by.css(`[data-automation-id='card-textitem-value-modifiedByUser.displayName']`));
modifiedDate = element(by.css(`span[data-automation-id='card-dateitem-modifiedAt'] span`));
modifiedDate = element(by.css(`span[data-automation-id='card-dateitem-modifiedAt']`));
mimetypeName = element(by.css(`[data-automation-id='card-textitem-value-content.mimeTypeName']`));
size = element(by.css(`[data-automation-id='card-textitem-value-content.sizeInBytes']`));
description = element(by.css(`span[data-automation-id='card-textitem-value-properties.cm:description']`));

2
e2e/process-services/pages/task-details.page.ts
View File

@ -35,7 +35,7 @@ export class TaskDetailsPage {
parentTaskIdField = element(by.css('[data-automation-id="card-textitem-value-parentTaskId"] '));
durationField = element(by.css('[data-automation-id="card-textitem-value-duration"] '));
endDateField = element.all(by.css('span[data-automation-id*="endDate"] span')).first();
createdField = element(by.css('span[data-automation-id="card-dateitem-created"] span'));
createdField = element(by.css('span[data-automation-id="card-dateitem-created"]'));
idField = element.all(by.css('[data-automation-id="card-textitem-value-id"]')).first();
descriptionField = element(by.css('[data-automation-id="card-textitem-value-description"]'));
dueDateField = element.all(by.css('span[data-automation-id*="dueDate"] span')).first();

25
lib/content-services/src/lib/content-metadata/services/property-groups-translator.service.ts
View File

@ -119,7 +119,7 @@ export class PropertyGroupTranslatorService {
if (this.isListOfValues(propertyDefinition.constraints)) {
const options = propertyDefinition.constraints[0].parameters.allowedValues.map((value) => ({ key: value, label: value }));
const properties = Object.assign(propertyDefinition, { options$: of(options) });
const properties = Object.assign(propertyDefinition, { options$: of(options) });
cardViewItemProperty = new CardViewSelectItemModel(properties);
} else {
@ -132,22 +132,35 @@ export class PropertyGroupTranslatorService {
case D_INT:
case D_LONG:
cardViewItemProperty = new CardViewIntItemModel(propertyDefinition);
cardViewItemProperty = new CardViewIntItemModel(Object.assign(propertyDefinition, {
multivalued: isMultiValued,
pipes: [{ pipe: this.multiValuePipe, params: [this.valueSeparator] }]
}));
break;
case D_FLOAT:
case D_DOUBLE:
cardViewItemProperty = new CardViewFloatItemModel(Object.assign(propertyDefinition, {
pipes: [{ pipe: this.decimalNumberPipe }]
multivalued: isMultiValued,
pipes: [
{ pipe: this.decimalNumberPipe },
{ pipe: this.multiValuePipe, params: [this.valueSeparator] }
]
}));
break;
case D_DATE:
cardViewItemProperty = new CardViewDateItemModel(propertyDefinition);
cardViewItemProperty = new CardViewDateItemModel(Object.assign(propertyDefinition, {
multivalued: isMultiValued,
pipes: [{ pipe: this.multiValuePipe, params: [this.valueSeparator] }]
}));
break;
case D_DATETIME:
cardViewItemProperty = new CardViewDatetimeItemModel(propertyDefinition);
cardViewItemProperty = new CardViewDatetimeItemModel(Object.assign(propertyDefinition, {
multivalued: isMultiValued,
pipes: [{ pipe: this.multiValuePipe, params: [this.valueSeparator] }]
}));
break;
case D_BOOLEAN:
@ -159,7 +172,7 @@ export class PropertyGroupTranslatorService {
cardViewItemProperty = new CardViewTextItemModel(Object.assign(propertyDefinition, {
multivalued: isMultiValued,
multiline: isMultiValued,
pipes: [{ pipe: this.multiValuePipe, params: [this.valueSeparator]}]
pipes: [{ pipe: this.multiValuePipe, params: [this.valueSeparator] }]
}));
}
}

56
lib/core/card-view/components/card-view-dateitem/card-view-dateitem.component.html
View File

@ -5,23 +5,23 @@
</div>
<div class="adf-property-value adf-property-value-padding-top">
<span *ngIf="!isEditable()"
<span *ngIf="!isEditable() && !property.multivalued"
[attr.data-automation-id]="'card-' + property.type + '-value-' + property.key">
<span [attr.data-automation-id]="'card-dateitem-' + property.key">
<span *ngIf="showProperty()"
(dblclick)="copyToClipboard(property.displayValue)"
matTooltipShowDelay="1000"
[matTooltip]="'CORE.METADATA.ACTIONS.COPY_TO_CLIPBOARD' | translate">{{ property.displayValue }}</span>
</span>
<span *ngIf="showProperty()"
[attr.data-automation-id]="'card-dateitem-' + property.key"
(dblclick)="copyToClipboard(property.displayValue)"
matTooltipShowDelay="1000"
[matTooltip]="'CORE.METADATA.ACTIONS.COPY_TO_CLIPBOARD' | translate">{{ property.displayValue}}</span>
</span>
<div *ngIf="isEditable()"
<div *ngIf="isEditable() && !property.multivalued"
class="adf-dateitem-editable">
<div class="adf-dateitem-editable-controls">
<span class="adf-datepicker-toggle"
[attr.data-automation-id]="'datepicker-label-toggle-' + property.key"
(click)="showDatePicker()">
<span *ngIf="showProperty(); else elseEmptyValueBlock"
[attr.data-automation-id]="'card-' + property.type + '-value-' + property.key">{{ property.displayValue }}</span>
[attr.data-automation-id]="'card-' + property.type + '-value-' + property.key">
{{ property.displayValue }}</span>
</span>
<mat-icon *ngIf="showClearAction()"
@ -55,4 +55,42 @@
<ng-template #elseEmptyValueBlock>
{{ property.default | translate }}
</ng-template>
<div *ngIf="property.multivalued"
class="adf-property-field adf-dateitem-chip-list-container adf-dateitem-editable">
<mat-chip-list #chipList
class="adf-textitem-chip-list">
<mat-chip *ngFor="let propertyValue of property.displayValue let idx = index"
[removable]="isEditable"
(removed)="removeValueFromList(idx)">
{{ propertyValue }}
<mat-icon *ngIf="isEditable()"
matChipRemove>cancel</mat-icon>
</mat-chip>
</mat-chip-list>
<mat-form-field *ngIf="isEditable()"
class="adf-property-field adf-dateitem-editable-controls"
[floatLabel]="'never'"
(click)="showDatePicker()">
<input matInput
class="adf-invisible-date-input"
[attr.tabIndex]="-1"
[matDatetimepicker]="datetimePicker"
(dateChange)="addDateToList($event)">
<mat-datetimepicker-toggle [attr.tabindex]="-1"
matSuffix
[attr.title]="'CORE.METADATA.ACTIONS.EDIT' | translate"
[attr.data-automation-id]="'datepickertoggle-' + property.key"
[for]="datetimePicker">
</mat-datetimepicker-toggle>
<mat-datetimepicker #datetimePicker
[type]="property.type"
timeInterval="5"
[attr.data-automation-id]="'datepicker-' + property.key"
[startAt]="valueDate">
</mat-datetimepicker>
</mat-form-field>
</div>
</div>

17
lib/core/card-view/components/card-view-dateitem/card-view-dateitem.component.scss
View File

@ -13,6 +13,22 @@
float: right;
}
&-dateitem-chip-list-container.adf-property-field {
margin-bottom: -7px !important;
border-bottom: 0;
cursor: pointer;
.adf-dateitem-editable-controls {
margin-top: 15px;
}
.mat-datetimepicker-toggle {
position: absolute;
right: 0;
top: -20px;
}
}
&-dateitem-editable {
cursor: pointer;
border-bottom: 1px solid mat-color($foreground, text, 0.42);
@ -53,6 +69,7 @@
padding-left: 8px;
opacity: 0.3;
}
&:hover mat-icon.adf-date-reset-icon {
opacity: 1;
}

43
lib/core/card-view/components/card-view-dateitem/card-view-dateitem.component.spec.ts
View File

@ -25,6 +25,7 @@ import { CardViewDateItemComponent } from './card-view-dateitem.component';
import { CoreTestingModule } from '../../../testing/core.testing.module';
import { ClipboardService } from '../../../clipboard/clipboard.service';
import { AppConfigService } from '@alfresco/adf-core';
import { CardViewDatetimeItemModel } from './../../models/card-view-datetimeitem.model';
import { TranslateModule } from '@ngx-translate/core';
describe('CardViewDateItemComponent', () => {
@ -192,7 +193,7 @@ describe('CardViewDateItemComponent', () => {
component.editable = true;
component.property.editable = true;
const cardViewUpdateService = TestBed.inject(CardViewUpdateService);
const expectedDate = moment('Jul 10 2017', 'MMM DD YY');
const expectedDate = moment('Jul 10 2017', 'MMM DD YYYY');
fixture.detectChanges();
const property = { ...component.property };
@ -231,7 +232,7 @@ describe('CardViewDateItemComponent', () => {
component.editable = false;
fixture.detectChanges();
const doubleClickEl = fixture.debugElement.query(By.css(`[data-automation-id="card-dateitem-${component.property.key}"] span`));
const doubleClickEl = fixture.debugElement.query(By.css(`[data-automation-id="card-dateitem-${component.property.key}"]`));
doubleClickEl.triggerEventHandler('dblclick', new MouseEvent('dblclick'));
fixture.detectChanges();
@ -346,4 +347,42 @@ describe('CardViewDateItemComponent', () => {
fixture.detectChanges();
expect(component.property.value).toEqual(expectedDate.toDate());
});
it('should render chips for multivalue dates when chips are enabled', async () => {
component.property = new CardViewDateItemModel({
label: 'Text label',
value: ['Jul 10 2017 00:01:00', 'Jul 11 2017 00:01:00', 'Jul 12 2017 00:01:00'],
key: 'textkey',
editable: true,
multivalued: true
});
fixture.detectChanges();
await fixture.whenStable();
const valueChips = fixture.debugElement.queryAll(By.css(`mat-chip`));
expect(valueChips).not.toBeNull();
expect(valueChips.length).toBe(3);
expect(valueChips[0].nativeElement.innerText.trim()).toBe('Jul 10, 2017');
expect(valueChips[1].nativeElement.innerText.trim()).toBe('Jul 11, 2017');
expect(valueChips[2].nativeElement.innerText.trim()).toBe('Jul 12, 2017');
});
it('should render chips for multivalue datetimes when chips are enabled', async () => {
component.property = new CardViewDatetimeItemModel({
label: 'Text label',
value: ['Jul 10 2017 00:01:00', 'Jul 11 2017 00:01:00', 'Jul 12 2017 00:01:00'],
key: 'textkey',
editable: true,
multivalued: true
});
fixture.detectChanges();
await fixture.whenStable();
const valueChips = fixture.debugElement.queryAll(By.css(`mat-chip`));
expect(valueChips).not.toBeNull();
expect(valueChips.length).toBe(3);
expect(valueChips[0].nativeElement.innerText.trim()).toBe('Jul 10, 2017, 0:01');
expect(valueChips[1].nativeElement.innerText.trim()).toBe('Jul 11, 2017, 0:01');
expect(valueChips[2].nativeElement.innerText.trim()).toBe('Jul 12, 2017, 0:01');
});
});

24
lib/core/card-view/components/card-view-dateitem/card-view-dateitem.component.ts
View File

@ -89,6 +89,8 @@ export class CardViewDateItemComponent extends BaseCardView<CardViewDateItemMode
if (this.property.value) {
this.valueDate = moment(this.property.value, this.dateFormat);
} else if (this.property.multivalued && !this.property.value) {
this.property.value = [];
}
}
@ -118,8 +120,8 @@ export class CardViewDateItemComponent extends BaseCardView<CardViewDateItemMode
const momentDate = moment(newDateValue.value, this.dateFormat, true);
if (momentDate.isValid()) {
this.valueDate = momentDate;
this.cardViewUpdateService.update(<CardViewDateItemModel> { ...this.property }, momentDate.toDate());
this.property.value = momentDate.toDate();
this.update();
}
}
}
@ -135,4 +137,24 @@ export class CardViewDateItemComponent extends BaseCardView<CardViewDateItemMode
const clipboardMessage = this.translateService.instant('CORE.METADATA.ACCESSIBILITY.COPY_TO_CLIPBOARD_MESSAGE');
this.clipboardService.copyContentToClipboard(valueToCopy, clipboardMessage);
}
addDateToList(newDateValue) {
if (newDateValue) {
const momentDate = moment(newDateValue.value, this.dateFormat, true);
if (momentDate.isValid()) {
this.property.value.push(momentDate.toDate());
this.update();
}
}
}
removeValueFromList(itemIndex: number) {
this.property.value.splice(itemIndex, 1);
this.update();
}
update() {
this.cardViewUpdateService.update(<CardViewDateItemModel> { ...this.property }, this.property.value);
}
}

2
lib/core/card-view/components/card-view-textitem/card-view-textitem.component.html
View File

@ -72,7 +72,7 @@
[floatLabel]="'never'">
<input matInput
class="adf-property-value"
[placeholder]="property.default | translate"
[placeholder]="editedValue ? '' : property.default | translate"
[matChipInputFor]="chipList"
[matChipInputAddOnBlur]="true"
(matChipInputTokenEnd)="addValueToList($event)"

41
lib/core/card-view/components/card-view-textitem/card-view-textitem.component.spec.ts
View File

@ -180,7 +180,48 @@ describe('CardViewTextItemComponent', () => {
expect(valueChips[0].nativeElement.innerText.trim()).toBe('item1');
expect(valueChips[1].nativeElement.innerText.trim()).toBe('item2');
expect(valueChips[2].nativeElement.innerText.trim()).toBe('item3');
});
it('should render chips for multivalue integers when chips are enabled', async () => {
component.property = new CardViewIntItemModel({
label: 'Text label',
value: [1, 2, 3],
key: 'textkey',
editable: true,
multivalued: true
});
component.useChipsForMultiValueProperty = true;
component.ngOnChanges({ property: new SimpleChange(null, null, true) });
fixture.detectChanges();
await fixture.whenStable();
const valueChips = fixture.debugElement.queryAll(By.css(`mat-chip`));
expect(valueChips).not.toBeNull();
expect(valueChips.length).toBe(3);
expect(valueChips[0].nativeElement.innerText.trim()).toBe('1');
expect(valueChips[1].nativeElement.innerText.trim()).toBe('2');
expect(valueChips[2].nativeElement.innerText.trim()).toBe('3');
});
it('should render chips for multivalue decimal numbers when chips are enabled', async () => {
component.property = new CardViewFloatItemModel({
label: 'Text label',
value: [1.1, 2.2, 3.3],
key: 'textkey',
editable: true,
multivalued: true
});
component.useChipsForMultiValueProperty = true;
component.ngOnChanges({ property: new SimpleChange(null, null, true) });
fixture.detectChanges();
await fixture.whenStable();
const valueChips = fixture.debugElement.queryAll(By.css(`mat-chip`));
expect(valueChips).not.toBeNull();
expect(valueChips.length).toBe(3);
expect(valueChips[0].nativeElement.innerText.trim()).toBe('1.1');
expect(valueChips[1].nativeElement.innerText.trim()).toBe('2.2');
expect(valueChips[2].nativeElement.innerText.trim()).toBe('3.3');
});
it('should render string for multivalue properties when chips are disabled', async () => {

15
lib/core/card-view/components/card-view-textitem/card-view-textitem.component.ts
View File

@ -15,7 +15,7 @@
* limitations under the License.
*/
import { Component, Input, OnChanges, SimpleChanges } from '@angular/core';
import { ChangeDetectorRef, Component, Input, OnChanges, SimpleChanges } from '@angular/core';
import { CardViewTextItemModel } from '../../models/card-view-textitem.model';
import { CardViewUpdateService } from '../../services/card-view-update.service';
import { BaseCardView } from '../base-card-view';
@ -68,7 +68,8 @@ export class CardViewTextItemComponent extends BaseCardView<CardViewTextItemMode
constructor(cardViewUpdateService: CardViewUpdateService,
private clipboardService: ClipboardService,
private translateService: TranslationService) {
private translateService: TranslationService,
private cd: ChangeDetectorRef) {
super(cardViewUpdateService);
}
@ -76,7 +77,7 @@ export class CardViewTextItemComponent extends BaseCardView<CardViewTextItemMode
if (changes.property && changes.property.firstChange) {
this.textInput.valueChanges
.pipe(
filter(textInputValue => textInputValue !== this.editedValue),
filter(textInputValue => textInputValue !== this.editedValue && textInputValue !== null),
debounceTime(50),
takeUntil(this.onDestroy$)
)
@ -125,9 +126,8 @@ export class CardViewTextItemComponent extends BaseCardView<CardViewTextItemMode
update(): void {
if (this.property.isValid(this.editedValue)) {
const updatedValue = this.prepareValueForUpload(this.property, this.editedValue);
this.cardViewUpdateService.update(<CardViewTextItemModel> { ...this.property }, updatedValue);
this.property.value = updatedValue;
this.property.value = this.prepareValueForUpload(this.property, this.editedValue);
this.cardViewUpdateService.update(<CardViewTextItemModel> { ...this.property }, this.property.value);
this.resetErrorMessages();
} else {
this.errors = this.property.getValidationErrors(this.editedValue);
@ -143,9 +143,10 @@ export class CardViewTextItemComponent extends BaseCardView<CardViewTextItemMode
}
removeValueFromList(itemIndex: number) {
if (typeof this.editedValue !== 'string') {
if (Array.isArray(this.editedValue)) {
this.editedValue.splice(itemIndex, 1);
this.update();
this.cd.detectChanges();
}
}

1
lib/core/card-view/interfaces/card-view-item-properties.interface.ts
View File

@ -29,4 +29,5 @@ export interface CardViewItemProperties {
validators?: CardViewItemValidator[];
data?: any;
constraints?: Constraint[];
multivalued?: boolean;
}

4
lib/core/card-view/models/card-view-baseitem.model.ts
View File

@ -29,6 +29,7 @@ export abstract class CardViewBaseItemModel {
validators?: CardViewItemValidator[];
data?: any;
type?: string;
multivalued?: boolean;
constructor(cardViewItemProperties: CardViewItemProperties) {
this.label = cardViewItemProperties.label || '';
@ -40,6 +41,7 @@ export abstract class CardViewBaseItemModel {
this.icon = cardViewItemProperties.icon || '';
this.validators = cardViewItemProperties.validators || [];
this.data = cardViewItemProperties.data || null;
this.multivalued = !!cardViewItemProperties.multivalued;
if (cardViewItemProperties?.constraints?.length ?? 0) {
for (const constraint of cardViewItemProperties.constraints) {
@ -51,7 +53,7 @@ export abstract class CardViewBaseItemModel {
}
isEmpty(): boolean {
return this.value === undefined || this.value === null || this.value === '';
return this.value === undefined || this.value === null || this.value.length === 0;
}
isValid(newValue: any): boolean {

16
lib/core/card-view/models/card-view-dateitem.model.ts
View File

@ -42,11 +42,19 @@ export class CardViewDateItemModel extends CardViewBaseItemModel implements Card
}
get displayValue() {
if (!this.value) {
return this.default;
if (this.multivalued) {
if (this.value) {
return this.value.map((date) => this.transformDate(date));
} else {
return this.default ? [this.default] : [];
}
} else {
this.localizedDatePipe = new LocalizedDatePipe();
return this.localizedDatePipe.transform(this.value, this.format, this.locale);
return this.value ? this.transformDate(this.value) : this.default;
}
}
transformDate(value: any) {
this.localizedDatePipe = new LocalizedDatePipe();
return this.localizedDatePipe.transform(value, this.format, this.locale);
}
}

6
lib/core/card-view/models/card-view-floatitem.model.ts
View File

@ -29,8 +29,12 @@ export class CardViewFloatItemModel extends CardViewTextItemModel implements Car
super(cardViewTextItemProperties);
this.validators.push(new CardViewItemFloatValidator());
if (cardViewTextItemProperties.value) {
if (cardViewTextItemProperties.value && !cardViewTextItemProperties.multivalued) {
this.value = parseFloat(cardViewTextItemProperties.value);
}
}
get displayValue(): string {
return this.applyPipes(this.value);
}
}

6
lib/core/card-view/models/card-view-intitem.model.ts
View File

@ -29,8 +29,12 @@ export class CardViewIntItemModel extends CardViewTextItemModel implements CardV
super(cardViewTextItemProperties);
this.validators.push(new CardViewItemIntValidator());
if (cardViewTextItemProperties.value) {
if (cardViewTextItemProperties.value && !cardViewTextItemProperties.multivalued) {
this.value = parseInt(cardViewTextItemProperties.value, 10);
}
}
get displayValue(): string {
return this.applyPipes(this.value);
}
}

4
lib/core/card-view/models/card-view-textitem.model.ts
View File

@ -24,14 +24,12 @@ export class CardViewTextItemModel extends CardViewBaseItemModel implements Card
type: string = 'text';
inputType: string = 'text';
multiline?: boolean;
multivalued?: boolean;
pipes?: CardViewTextItemPipeProperty[];
clickCallBack?: any;
constructor(cardViewTextItemProperties: CardViewTextItemProperties) {
super(cardViewTextItemProperties);
this.multiline = !!cardViewTextItemProperties.multiline;
this.multivalued = !!cardViewTextItemProperties.multivalued;
this.pipes = cardViewTextItemProperties.pipes || [];
this.clickCallBack = cardViewTextItemProperties.clickCallBack ? cardViewTextItemProperties.clickCallBack : null;
@ -44,7 +42,7 @@ export class CardViewTextItemModel extends CardViewBaseItemModel implements Card
return this.applyPipes(this.value);
}
private applyPipes(displayValue) {
applyPipes(displayValue) {
if (this.pipes.length) {
displayValue = this.pipes.reduce((accumulator, { pipe, params = [] }) => {
return pipe.transform(accumulator, ...params);

11
lib/core/card-view/validators/card-view-item-float.validator.ts
View File

@ -22,8 +22,13 @@ export class CardViewItemFloatValidator implements CardViewItemValidator {
message = 'CORE.CARDVIEW.VALIDATORS.FLOAT_VALIDATION_ERROR';
isValid(value: any): boolean {
return value === ''
|| !isNaN(parseFloat(value))
&& isFinite(value);
if (Array.isArray(value)) {
return value.every(this.isDecimalNumber);
}
return value === '' || this.isDecimalNumber(value);
}
isDecimalNumber(value: any): boolean {
return !isNaN(parseFloat(value)) && isFinite(value);
}
}

10
lib/core/card-view/validators/card-view-item-int.validator.ts
View File

@ -22,13 +22,15 @@ export class CardViewItemIntValidator implements CardViewItemValidator {
message = 'CORE.CARDVIEW.VALIDATORS.INT_VALIDATION_ERROR';
isValid(value: any): boolean {
return value === ''
|| !isNaN(value)
&& this.isIntegerNumber(value);
if (Array.isArray(value)) {
return value.every(this.isIntegerNumber);
}
return value === '' || !isNaN(value) && this.isIntegerNumber(value);
}
isIntegerNumber(value: any): boolean {
const parsedNumber = parseFloat(value);
const parsedNumber = Number(value);
return (parsedNumber | 0) === parsedNumber;
}
}

4
lib/core/pipes/decimal-number.pipe.ts
View File

@ -71,8 +71,8 @@ export class DecimalNumberPipe implements PipeTransform, OnDestroy {
const actualDigitsInfo = `${actualMinIntegerDigits}.${actualMinFractionDigits}-${actualMaxFractionDigits}`;
const actualLocale = locale || this.defaultLocale;
const datePipe: DecimalPipe = new DecimalPipe(actualLocale);
return datePipe.transform(value, actualDigitsInfo);
const decimalPipe: DecimalPipe = new DecimalPipe(actualLocale);
return decimalPipe.transform(value, actualDigitsInfo);
}
ngOnDestroy(): void {

7
lib/core/pipes/multi-value.pipe.spec.ts
View File

@ -36,11 +36,16 @@ describe('FullNamePipe', () => {
pipe = TestBed.inject(MultiValuePipe);
});
it('should add the separator when a list is provided', () => {
it('should add the separator when a string list is provided', () => {
const values = ['cat', 'house', 'dog'];
expect(pipe.transform(values)).toBe('cat, house, dog');
});
it('should add the separator when a number list is provided', () => {
const values = [1, 2, 3];
expect(pipe.transform(values)).toBe('1, 2, 3');
});
it('should add custom separator when set', () => {
const values = ['cat', 'house', 'dog'];
const customSeparator = ' - ';

7
lib/core/pipes/multi-value.pipe.ts
View File

@ -22,13 +22,12 @@ export class MultiValuePipe implements PipeTransform {
static DEFAULT_SEPARATOR = ', ';
transform(values: string | string [], valueSeparator: string = MultiValuePipe.DEFAULT_SEPARATOR): string {
transform(values: any | any[], valueSeparator: string = MultiValuePipe.DEFAULT_SEPARATOR): string {
if (values && values instanceof Array) {
const valueList = values.map((value) => value.trim());
return valueList.join(valueSeparator);
return values.join(valueSeparator);
}
return <string> values;
return values;
}
}

2
lib/testing/src/lib/process-services-cloud/pages/task-header-cloud-component.page.ts
View File

@ -28,7 +28,7 @@ export class TaskHeaderCloudPage {
priorityCardSelectItem = new CardSelectItemPage('priority');
dueDateField = element.all(by.css('span[data-automation-id*="dueDate"] span')).first();
categoryCardTextItem = new CardTextItemPage('category');
createdField = element(by.css('span[data-automation-id="card-dateitem-created"] span'));
createdField = element(by.css('span[data-automation-id="card-dateitem-created"]'));
parentNameCardTextItem = new CardTextItemPage('parentName');
parentTaskIdCardTextItem = new CardTextItemPage('parentTaskId');
endDateField = element.all(by.css('span[data-automation-id*="endDate"] span')).first();