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

[AAE-4241] Populate date and datetime widgets on retrieve metadata (#6412)

Browse Source 
* AAE-4241 Populate date and datetime widget on retrieve metadata

* AAE-4241 Trigger build

* AAE-4241 Use on change to allow inline editing

* AAE-4241 Fix unit tests

* AAE-4241 Increase coverage

* AAE-4241 Add coverage
This commit is contained in:
Pablo Martinez Garcia
2021-01-11 10:39:24 +01:00
committed by GitHub
parent 9947d6aa40
commit dd09c3ac02
4 changed files with 231 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

107
lib/core/form/components/widgets/date-time/date-time.widget.spec.ts
View File

@@ -24,6 +24,7 @@ import { setupTestBed } from '../../../../testing/setup-test-bed';
import { CoreTestingModule } from '../../../../testing/core.testing.module';
import { TranslateModule } from '@ngx-translate/core';
import { MatTooltipModule } from '@angular/material/tooltip';
import { SimpleChanges } from '@angular/core';
describe('DateTimeWidgetComponent', () => {
@@ -185,4 +186,110 @@ describe('DateTimeWidgetComponent', () => {
expect(tooltip).toEqual(widget.field.tooltip);
}));
});
it('should display always the json value', () => {
const field = new FormFieldModel(new FormModel(), {
id: 'date-field-id',
name: 'datetime-field-name',
value: '12-30-9999 10:30 AM',
type: 'datetime',
readOnly: 'false'
});
field.isVisible = true;
field.dateDisplayFormat = 'MM-DD-YYYY HH:mm A';
widget.field = field;
widget.ngOnInit();
fixture.detectChanges();
fixture.whenStable()
.then(() => {
expect(element.querySelector('#date-field-id')).toBeDefined();
expect(element.querySelector('#date-field-id')).not.toBeNull();
const dateElement: any = element.querySelector('#date-field-id');
expect(dateElement.value).toContain('12-30-9999 10:30 AM');
const newField = { ...field, value: '03-02-2020 12:00 AM' };
const changes: SimpleChanges = {
'field': {
previousValue: field,
currentValue: newField,
firstChange: false,
isFirstChange(): boolean { return this.firstChange; }
}
};
widget.ngOnChanges(changes);
fixture.detectChanges();
fixture.whenStable()
.then(() => {
expect(dateElement.value).toContain('03-02-2020 12:00 AM');
});
});
});
it('should not call on change when is first change or field is not set or the field value does not change', () => {
const field = new FormFieldModel(new FormModel(), {
id: 'datetime-field-id',
name: 'datetime-field-name',
value: '12-30-9999 10:30 AM',
type: 'datetime',
readOnly: 'false'
});
field.isVisible = true;
field.dateDisplayFormat = 'MM-DD-YYYY HH:mm A',
widget.field = field;
widget.ngOnInit();
fixture.detectChanges();
fixture.whenStable()
.then(() => {
expect(element.querySelector('#datetime-field-id')).toBeDefined();
expect(element.querySelector('#datetime-field-id')).not.toBeNull();
const dateTimeElement: any = element.querySelector('#datetime-field-id');
expect(dateTimeElement.value).toContain('12-30-9999 10:30 AM');
const newField = { ...field, value: '03-02-2020 12:00 AM' };
let changes: SimpleChanges = {
'field': {
previousValue: field,
currentValue: newField,
firstChange: true,
isFirstChange(): boolean { return this.firstChange; }
}
};
widget.ngOnChanges(changes);
fixture.detectChanges();
fixture.whenStable()
.then(() => {
expect(dateTimeElement.value).toContain('12-30-9999 10:30 AM');
changes = {};
widget.ngOnChanges(changes);
fixture.detectChanges();
fixture.whenStable()
.then(() => {
expect(dateTimeElement.value).toContain('12-30-9999 10:30 AM');
changes = {
'field': {
previousValue: field,
currentValue: field,
firstChange: false,
isFirstChange(): boolean { return this.firstChange; }
}
};
widget.ngOnChanges(changes);
fixture.detectChanges();
fixture.whenStable()
.then(() => {
expect(dateTimeElement.value).toContain('12-30-9999 10:30 AM');
changes = null;
widget.ngOnChanges(changes);
fixture.detectChanges();
fixture.whenStable()
.then(() => {
expect(dateTimeElement.value).toContain('12-30-9999 10:30 AM');
});
});
});
});
});
});
});

11
lib/core/form/components/widgets/date-time/date-time.widget.ts
View File

@@ -17,7 +17,7 @@
/* tslint:disable:component-selector */
import { Component, OnInit, ViewEncapsulation, OnDestroy } from '@angular/core';
import { Component, OnInit, ViewEncapsulation, OnDestroy, OnChanges, SimpleChanges } from '@angular/core';
import { DateAdapter, MAT_DATE_FORMATS } from '@angular/material/core';
import { DatetimeAdapter, MAT_DATETIME_FORMATS } from '@mat-datetimepicker/core';
import { MomentDatetimeAdapter, MAT_MOMENT_DATETIME_FORMATS } from '@mat-datetimepicker/moment';
@@ -43,7 +43,7 @@ import { takeUntil } from 'rxjs/operators';
styleUrls: ['./date-time.widget.scss'],
encapsulation: ViewEncapsulation.None
})
export class DateTimeWidgetComponent extends WidgetComponent implements OnInit, OnDestroy {
export class DateTimeWidgetComponent extends WidgetComponent implements OnInit, OnDestroy, OnChanges {
minDate: Moment;
maxDate: Moment;
@@ -81,6 +81,13 @@ export class DateTimeWidgetComponent extends WidgetComponent implements OnInit,
'minutes');
}
ngOnChanges(changes: SimpleChanges): void {
if (changes && changes.field && !changes.field.firstChange && changes.field.currentValue.value !== changes.field.previousValue.value) {
this.displayDate = moment(changes.field.currentValue.value, this.field.dateDisplayFormat)
.add(moment(changes.field.currentValue.value, this.field.dateDisplayFormat).utcOffset(), 'minutes');
}
}
ngOnDestroy() {
this.onDestroy$.next(true);
this.onDestroy$.complete();