diff --git a/lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.html b/lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.html
index 4c305c5858..52d4df1dde 100644
--- a/lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.html
+++ b/lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.html
@@ -22,11 +22,11 @@
-
+
{
@@ -51,7 +52,7 @@ describe('DateWidgetComponent', () => {
widget.ngOnInit();
- const expected = format(new Date(minValue), widget.DATE_FORMAT);
+ const expected = format(new Date(minValue), DATE_FORMAT_CLOUD);
expect(widget.minDate).toEqual(expected);
});
@@ -74,7 +75,7 @@ describe('DateWidgetComponent', () => {
});
widget.ngOnInit();
- const expected = format(new Date(maxValue), widget.DATE_FORMAT);
+ const expected = format(new Date(maxValue), DATE_FORMAT_CLOUD);
expect(widget.maxDate).toEqual(expected);
});
@@ -91,7 +92,7 @@ describe('DateWidgetComponent', () => {
widget.field = field;
const todayDate = new Date();
- widget.onDateChanged({ value: format(todayDate, widget.DATE_FORMAT) });
+ widget.onDateChanged({ value: format(todayDate, DATE_FORMAT_CLOUD) });
expect(widget.onFieldChanged).toHaveBeenCalledWith(field);
});
@@ -293,7 +294,7 @@ describe('DateWidgetComponent', () => {
await fixture.whenStable();
const todayDate = new Date();
- const expected = format(subDays(todayDate, widget.field.minDateRangeValue), widget.DATE_FORMAT);
+ const expected = format(subDays(todayDate, widget.field.minDateRangeValue), DATE_FORMAT_CLOUD);
expect(widget.minDate).toEqual(expected);
});
@@ -343,7 +344,7 @@ describe('DateWidgetComponent', () => {
await fixture.whenStable();
const todayDate = new Date();
- const expected = format(addDays(todayDate, widget.field.maxDateRangeValue), widget.DATE_FORMAT);
+ const expected = format(addDays(todayDate, widget.field.maxDateRangeValue), DATE_FORMAT_CLOUD);
expect(widget.maxDate).toEqual(expected);
});
@@ -403,7 +404,7 @@ describe('DateWidgetComponent', () => {
fixture.detectChanges();
await fixture.whenStable();
- const expectedMinValueString = format(new Date('2022-07-21'), widget.DATE_FORMAT);
+ const expectedMinValueString = format(new Date('2022-07-21'), DATE_FORMAT_CLOUD);
expect(widget.field.minValue).toEqual(expectedMinValueString);
expect(widget.maxDate).toBeUndefined();
@@ -423,7 +424,7 @@ describe('DateWidgetComponent', () => {
fixture.detectChanges();
await fixture.whenStable();
- const expectedMaxValueString = format(new Date('2022-07-30'), widget.DATE_FORMAT);
+ const expectedMaxValueString = format(new Date('2022-07-30'), DATE_FORMAT_CLOUD);
expect(widget.field.maxValue).toEqual(expectedMaxValueString);
expect(widget.minDate).toBeUndefined();
@@ -462,8 +463,8 @@ describe('DateWidgetComponent', () => {
fixture.detectChanges();
await fixture.whenStable();
- const expectedMaxValueString = format(new Date('2022-07-30'), widget.DATE_FORMAT);
- const expectedMinValueString = format(new Date('2022-07-12'), widget.DATE_FORMAT);
+ const expectedMaxValueString = format(new Date('2022-07-30'), DATE_FORMAT_CLOUD);
+ const expectedMinValueString = format(new Date('2022-07-12'), DATE_FORMAT_CLOUD);
expect(widget.field.maxValue).toEqual(expectedMaxValueString);
expect(widget.field.minValue).toEqual(expectedMinValueString);
diff --git a/lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.ts b/lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.ts
index ebb9def188..67690d007c 100644
--- a/lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.ts
+++ b/lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.ts
@@ -17,13 +17,14 @@
/* eslint-disable @angular-eslint/component-selector */
-import { Component, OnInit, ViewEncapsulation, OnDestroy } from '@angular/core';
-import { DateAdapter, MAT_DATE_FORMATS } from '@angular/material/core';
+import { Component, OnInit, ViewEncapsulation, OnDestroy, Inject } from '@angular/core';
+import { DateAdapter, MAT_DATE_FORMATS, MatDateFormats } from '@angular/material/core';
import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
import { WidgetComponent, UserPreferencesService, UserPreferenceValues, FormService, DateFnsUtils } from '@alfresco/adf-core';
import { addDays, format, isValid, subDays } from 'date-fns';
import { DateFnsAdapter, MAT_DATE_FNS_FORMATS } from '@angular/material-date-fns-adapter';
+import { DATE_FORMAT_CLOUD } from '../../../../models/date-format-cloud.model';
@Component({
selector: 'date-widget',
@@ -57,7 +58,8 @@ export class DateCloudWidgetComponent extends WidgetComponent implements OnInit,
constructor(public formService: FormService,
private dateAdapter: DateAdapter,
- private userPreferencesService: UserPreferencesService) {
+ private userPreferencesService: UserPreferencesService,
+ @Inject(MAT_DATE_FORMATS) private dateFormatConfig: MatDateFormats) {
super(formService);
}
@@ -67,25 +69,27 @@ export class DateCloudWidgetComponent extends WidgetComponent implements OnInit,
.pipe(takeUntil(this.onDestroy$))
.subscribe(locale => this.dateAdapter.setLocale(DateFnsUtils.getLocaleFromString(locale)));
+ this.dateFormatConfig.display.dateInput = this.field.dateDisplayFormat;
+
if (this.field) {
if (this.field.dynamicDateRangeSelection) {
const today = this.getTodaysFormattedDate();
if (Number.isInteger(this.field.minDateRangeValue)) {
- this.minDate = format(subDays(today, this.field.minDateRangeValue), this.DATE_FORMAT);
+ this.minDate = format(subDays(today, this.field.minDateRangeValue), DATE_FORMAT_CLOUD);
this.field.minValue = this.minDate;
}
if (Number.isInteger(this.field.maxDateRangeValue)) {
- this.maxDate = format(addDays(today, this.field.maxDateRangeValue), this.DATE_FORMAT);
+ this.maxDate = format(addDays(today, this.field.maxDateRangeValue), DATE_FORMAT_CLOUD);
this.field.maxValue = this.maxDate;
}
} else {
if (this.field.minValue) {
- this.minDate = format(new Date(this.field.minValue), this.DATE_FORMAT);
+ this.minDate = format(new Date(this.field.minValue), DATE_FORMAT_CLOUD);
}
if (this.field.maxValue) {
- this.maxDate = format(new Date(this.field.maxValue), this.DATE_FORMAT);
+ this.maxDate = format(new Date(this.field.maxValue), DATE_FORMAT_CLOUD);
}
}
}
@@ -103,7 +107,7 @@ export class DateCloudWidgetComponent extends WidgetComponent implements OnInit,
onDateChanged(newDateValue) {
const date = new Date(newDateValue);
if (isValid(date)) {
- this.field.value = format(date, this.DATE_FORMAT);
+ this.field.value = format(date, this.field.dateDisplayFormat);
} else {
this.field.value = newDateValue;
}
diff --git a/lib/process-services-cloud/src/lib/models/date-format-cloud.model.ts b/lib/process-services-cloud/src/lib/models/date-format-cloud.model.ts
index 786c8c316b..79f48c0033 100644
--- a/lib/process-services-cloud/src/lib/models/date-format-cloud.model.ts
+++ b/lib/process-services-cloud/src/lib/models/date-format-cloud.model.ts
@@ -15,4 +15,4 @@
* limitations under the License.
*/
-export const DATE_FORMAT_CLOUD = 'YYYY-MM-DD';
+export const DATE_FORMAT_CLOUD = 'yyyy-MM-dd';