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

[ADF-4342] Create localized pipe and centralize date format (#4813)

Browse Source 
* [ADF-4342] Date Format defined in app config

* [ADF-4342] Create localized pipe and centralize date format

* Add unit test for new date pipe

* Add info internationalization docs

* Fix lining

* Fix linting

* Fix date pipe unit test

* [ADF-4342] Add supported language files

* Fix e2e tests
This commit is contained in:
davidcanonieto
2019-06-11 09:35:35 +01:00
committed by Denys Vuika
parent 990fa4625b
commit 7497822a46
38 changed files with 473 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
lib/core/form/components/widgets/date/date.widget.ts
View File

@@ -39,9 +39,10 @@ import { baseHost, WidgetComponent } from './../widget.component';
})
export class DateWidgetComponent extends WidgetComponent implements OnInit {
DATE_FORMAT = 'DD/MM/YYYY';
minDate: Moment;
maxDate: Moment;
displayDate: Moment;
constructor(public formService: FormService,
@@ -60,11 +61,11 @@ export class DateWidgetComponent extends WidgetComponent implements OnInit {
if (this.field) {
if (this.field.minValue) {
this.minDate = moment(this.field.minValue, 'DD/MM/YYYY');
this.minDate = moment(this.field.minValue, this.DATE_FORMAT);
}
if (this.field.maxValue) {
this.maxDate = moment(this.field.maxValue, 'DD/MM/YYYY');
this.maxDate = moment(this.field.maxValue, this.DATE_FORMAT);
}
}
this.displayDate = moment(this.field.value, this.field.dateDisplayFormat);

2
lib/core/form/components/widgets/dynamic-table/editors/date/date.editor.html
View File

@@ -1,6 +1,6 @@
<div>
<mat-form-field class="adf-date-editor">
<label [attr.for]="column.id">{{column.name}} (d-M-yyyy)</label>
<label [attr.for]="column.id">{{column.name}} (DATE_FORMAT)</label>
<input matInput
id="dateInput"
type="text"

1
lib/core/form/components/widgets/dynamic-table/editors/date/date.editor.ts
View File

@@ -18,6 +18,7 @@
/* tslint:disable:component-selector */
import { UserPreferencesService, UserPreferenceValues } from '../../../../../../services/user-preferences.service';
import { MomentDateAdapter } from '../../../../../../utils/momentDateAdapter';
import { MOMENT_DATE_FORMATS } from '../../../../../../utils/moment-date-formats.model';
import { Component, Input, OnInit } from '@angular/core';

20
lib/core/form/components/widgets/dynamic-table/editors/datetime/datetime.editor.html
View File

@@ -1,6 +1,6 @@
<div>
<mat-form-field class="adf-date-editor">
<label [attr.for]="column.id">{{column.name}} {{DATE_FORMAT}}</label>
<label [attr.for]="column.id">{{column.name}} {{DATE_TIME_FORMAT}}</label>
<input matInput
[matDatetimepicker]="datetimePicker"
[(ngModel)]="value"
@@ -9,12 +9,16 @@
[disabled]="!column.editable"
(focusout)="onDateChanged($event.srcElement.value)"
(dateChange)="onDateChanged($event)">
<mat-datetimepicker-toggle matSuffix [for]="datetimePicker"
*ngIf="column.editable"
class="adf-date-editor-button"></mat-datetimepicker-toggle>
<mat-datetimepicker-toggle
matSuffix
[for]="datetimePicker"
class="adf-date-editor-button">
</mat-datetimepicker-toggle>
</mat-form-field>
<mat-datetimepicker #datetimePicker
type="datetime"
openOnFocus="true"
timeInterval="5"></mat-datetimepicker>
<mat-datetimepicker
#datetimePicker
type="datetime"
openOnFocus="true"
timeInterval="5">
</mat-datetimepicker>
</div>

12
lib/core/form/components/widgets/dynamic-table/editors/datetime/datetime.editor.ts
View File

@@ -43,7 +43,7 @@ import { MomentDatetimeAdapter, MAT_MOMENT_DATETIME_FORMATS } from '@mat-datetim
})
export class DateTimeEditorComponent implements OnInit {
DATE_FORMAT: string = 'D-M-YYYY hh:mm A';
DATE_TIME_FORMAT: string = 'DD/MM/YYYY HH:mm';
value: any;
@@ -69,19 +69,19 @@ export class DateTimeEditorComponent implements OnInit {
});
const momentDateAdapter = <MomentDateAdapter> this.dateAdapter;
momentDateAdapter.overrideDisplayFormat = this.DATE_FORMAT;
momentDateAdapter.overrideDisplayFormat = this.DATE_TIME_FORMAT;
this.value = moment(this.table.getCellValue(this.row, this.column), this.DATE_FORMAT);
this.value = moment(this.table.getCellValue(this.row, this.column), this.DATE_TIME_FORMAT);
}
onDateChanged(newDateValue) {
if (newDateValue && newDateValue.value) {
const newValue = moment(newDateValue.value, this.DATE_FORMAT);
this.row.value[this.column.id] = newDateValue.value.format(this.DATE_FORMAT);
const newValue = moment(newDateValue.value, this.DATE_TIME_FORMAT);
this.row.value[this.column.id] = newDateValue.value.format(this.DATE_TIME_FORMAT);
this.value = newValue;
this.table.flushValue();
} else if (newDateValue) {
const newValue = moment(newDateValue, this.DATE_FORMAT);
const newValue = moment(newDateValue, this.DATE_TIME_FORMAT);
this.value = newValue;
this.row.value[this.column.id] = newDateValue;
this.table.flushValue();