diff --git a/admin/src/app/features/calendar/components/create-event-form/create-event-form.html b/admin/src/app/features/calendar/components/create-event-form/create-event-form.html index 9e02f83..1f11d64 100644 --- a/admin/src/app/features/calendar/components/create-event-form/create-event-form.html +++ b/admin/src/app/features/calendar/components/create-event-form/create-event-form.html @@ -62,12 +62,47 @@ [class.input-error]="interval?.invalid && interval?.touched" /> +
+ +
+ @for (day of weekDayOptions; track day.value) { + + } +
+
+ +
+ + +
+ Vesszővel elválasztott lista (pl. 1,15,31) +
+
+ +
+ + +
+ Vesszővel elválasztott lista (pl. 1,2,3) +
+
+
+ class="input input-bordered w-full" />
} diff --git a/admin/src/app/features/calendar/components/create-event-form/create-event-form.ts b/admin/src/app/features/calendar/components/create-event-form/create-event-form.ts index 8390e6c..2c83f54 100644 --- a/admin/src/app/features/calendar/components/create-event-form/create-event-form.ts +++ b/admin/src/app/features/calendar/components/create-event-form/create-event-form.ts @@ -51,8 +51,17 @@ export class CreateEventForm implements OnInit { frequency: 'YEARLY', label: 'Éves' } - ] + ]; + weekDayOptions = [ + { value: 'MO', label: 'Hétfő' }, + { value: 'TU', label: 'Kedd' }, + { value: 'WE', label: 'Szerda' }, + { value: 'TH', label: 'Csütörtök' }, + { value: 'FR', label: 'Péntek' }, + { value: 'SA', label: 'Szombat' }, + { value: 'SU', label: 'Vasárnap' }, + ]; constructor( private fb: FormBuilder, @@ -74,9 +83,9 @@ export class CreateEventForm implements OnInit { interval: [null] ,//number endDate: [null], // Date count: [null], // number - byDay: [null], // string. e.g.: "MO,TU,WE,TH,FR" - byMonthDay: [null], // number - byMonth: [null], // number + byDay: [null], // string + byMonthDay: [null], // string + byMonth: [null], // string }) }); @@ -85,18 +94,19 @@ export class CreateEventForm implements OnInit { ngOnInit(): void { this.isRecurring?.valueChanges.subscribe(isRecurring => { const recurringRule = this.form.get('recurringRule'); + const frequency = recurringRule?.get('frequency'); + const interval = recurringRule?.get('interval'); + if (isRecurring) { - recurringRule?.get('frequency')?.setValidators([Validators.required]); - recurringRule?.get('interval')?.setValidators([Validators.required, Validators.min(1)]); - recurringRule?.get('endDate')?.setValidators([Validators.required]); + frequency?.setValidators([Validators.required]); + interval?.setValidators([Validators.required, Validators.min(1)]); } else { - recurringRule?.get('frequency')?.clearValidators(); - recurringRule?.get('interval')?.clearValidators(); - recurringRule?.get('endDate')?.clearValidators(); + recurringRule?.reset(); + frequency?.clearValidators(); + interval?.clearValidators(); } - recurringRule?.get('frequency')?.updateValueAndValidity(); - recurringRule?.get('interval')?.updateValueAndValidity(); - recurringRule?.get('endDate')?.updateValueAndValidity(); + frequency?.updateValueAndValidity(); + interval?.updateValueAndValidity(); }); of(this.id()).pipe( @@ -147,6 +157,26 @@ export class CreateEventForm implements OnInit { }); } + onByDayChange(event: any) { + const target = event.target as HTMLInputElement; + const day = target.value; + const isChecked = target.checked; + + let currentByDay: string[] = this.byDay?.value ? this.byDay.value.split(',') : []; + + if (isChecked) { + currentByDay.push(day); + } else { + currentByDay = currentByDay.filter(d => d !== day); + } + + this.byDay?.setValue(currentByDay.join(',')); + } + + isDayChecked(day: string): boolean { + return this.byDay?.value ? this.byDay.value.split(',').includes(day) : false; + } + onSubmit(): void { if (this.form.invalid) { this.form.markAllAsTouched(); @@ -218,6 +248,18 @@ export class CreateEventForm implements OnInit { return this.form.get('recurringRule')?.get('endDate'); } + get byDay() { + return this.form.get('recurringRule')?.get('byDay'); + } + + get byMonthDay() { + return this.form.get('recurringRule')?.get('byMonthDay'); + } + + get byMonth() { + return this.form.get('recurringRule')?.get('byMonth'); + } + doReady(){ this.ready.emit(); }