english date picker format

main
Said Gedik 2024-07-31 16:00:45 +02:00
parent 8cbc259716
commit e7cf303a85
1 changed files with 27 additions and 5 deletions

View File

@ -3,7 +3,7 @@ import { Component, Inject, OnInit } from '@angular/core';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { MatSnackBar } from '@angular/material/snack-bar'; import { MatSnackBar } from '@angular/material/snack-bar';
import { DataService } from '../data.service'; import { DataService } from '../data.service';
import { MAT_DATE_FORMATS } from '@angular/material/core' import { DateAdapter, MAT_DATE_FORMATS, MAT_DATE_LOCALE } from '@angular/material/core'
import { FormGroup, FormBuilder } from '@angular/forms'; import { FormGroup, FormBuilder } from '@angular/forms';
export interface FilterAttribute { export interface FilterAttribute {
@ -27,8 +27,26 @@ export const MY_DATE_FORMATS = {
templateUrl: './filter-dialog.component.html', templateUrl: './filter-dialog.component.html',
styleUrls: ['./filter-dialog.component.css'], styleUrls: ['./filter-dialog.component.css'],
providers: [ providers: [
{ provide: MAT_DATE_FORMATS, useValue: MY_DATE_FORMATS } {
] provide: MAT_DATE_FORMATS,
useFactory: (languageService: LanguageService) => {
const isEnglish = languageService.language === 'EN';
return {
parse: {
dateInput: isEnglish ? 'MM/DD/YYYY' : 'DD.MM.YYYY',
},
display: {
dateInput: isEnglish ? 'M/D/YYYY' : 'DD.MM.YYYY',
monthYearLabel: isEnglish ? 'MMM YYYY' : 'MMMM YYYY',
dateA11yLabel: isEnglish ? 'MMMM D, YYYY' : 'LL',
monthYearA11yLabel: isEnglish ? 'MMMM YYYY' : 'MMMM YYYY',
},
};
},
deps: [LanguageService],
},
{ provide: MAT_DATE_LOCALE, useFactory: (languageService: LanguageService) => languageService.language === 'EN' ? 'en-US' : 'de-DE', deps: [LanguageService] },
],
}) })
/** /**
@ -86,7 +104,7 @@ export class FilterDialogComponent implements OnInit {
* @param data contains an array of Changes which should be sent to the backend for a status transition * @param data contains an array of Changes which should be sent to the backend for a status transition
* @param dataService injects the dataService for data management and backend communication * @param dataService injects the dataService for data management and backend communication
*/ */
constructor(public languageService: LanguageService, public dialogRef: MatDialogRef<FilterDialogComponent>, @Inject(MAT_DIALOG_DATA) public data: any, private dataService: DataService, private _snackBar: MatSnackBar, private fb: FormBuilder) { constructor(public languageService: LanguageService, private dateAdapter: DateAdapter<any>, public dialogRef: MatDialogRef<FilterDialogComponent>, @Inject(MAT_DIALOG_DATA) public data: any, private dataService: DataService, private _snackBar: MatSnackBar, private fb: FormBuilder) {
//dialogRef.beforeClosed().subscribe(() => dialogRef.close(this.dataToReturn)); //dialogRef.beforeClosed().subscribe(() => dialogRef.close(this.dataToReturn));
this.range = this.fb.group({ this.range = this.fb.group({
start: [null], start: [null],
@ -104,6 +122,10 @@ export class FilterDialogComponent implements OnInit {
console.log("\nNEW FETCHED USER SG IN FILTERCOMPONEN"); console.log("\nNEW FETCHED USER SG IN FILTERCOMPONEN");
this.userSupportGroup = res.name; this.userSupportGroup = res.name;
}); });
this.languageService.languageChangeEmitter.subscribe((language) => {
this.dateAdapter.setLocale(language === 'EN' ? 'en-US' : 'de-DE');
});
} }
/** /**
@ -340,7 +362,7 @@ export class FilterDialogComponent implements OnInit {
"criteria": [new Date(this.range.controls['start'].value), new Date(this.range.controls['end'].value)] "criteria": [new Date(this.range.controls['start'].value), new Date(this.range.controls['end'].value)]
}); });
} }
if (this.filterStartDate != null && this.filterEndDate != null) { if (this.filterStartDate != null && this.filterEndDate != null) {
filterElement.push({ filterElement.push({
"column": "D2", "column": "D2",