rschneider/dvbooking
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor admin to use eventbus

Browse Source
This commit is contained in:
Roland Schneider
2025-12-11 22:47:54 +01:00
parent 93b1fb9610
commit 453d02612c
27 changed files with 298 additions and 225 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
admin/src/app/features/calendar/components/calendar-view/calendar-view.html
View File

@@ -1,23 +1,19 @@
<div>
<h1>Naptár</h1>
<!-- <div>-->
<!-- <input type="text" name="startHour" id="starthour" #startHour>-->
<!-- <a class="btn" (click)="addEvent($event)">add</a>-->
<!-- </div>-->
<full-calendar #calendar [options]="calendarOptions"></full-calendar>
</div>
@if (workflow() == 'event-create') {
@if (workflow() == 'event_create') {
<rs-daisy-modal [isOpen]="true" (closeClick)="closeDialog()" [modalBoxStyleClass]="'max-w-none w-2xl'">
<app-create-event-form (ready)="closeDialog()" [date]="selectedDate()"
[id]="undefined"></app-create-event-form>
</rs-daisy-modal>
}
@if (workflow() == 'event-dashboard' && selectedEvent()) {
@if (workflow() == 'event_dashboard' && selectedEvent()) {
<rs-daisy-modal [isOpen]="true" (closeClick)="closeDialog()" [modalBoxStyleClass]="'max-w-none w-2xl'">
<app-single-event-dashboard [event]="selectedEvent()"
(action)="onDashboardAction($event)"
(action)="setWorkFlow($event)"
></app-single-event-dashboard>
</rs-daisy-modal>
}

146
admin/src/app/features/calendar/components/calendar-view/calendar-view.ts
View File

@@ -27,6 +27,24 @@ import {
SingleEventDashboardEventActivation,
} from './single-event-dashboard-event-activation/single-event-dashboard-event-activation.component';
import { SingleEventDashboardEventEdit } from './single-event-dashboard-event-edit/single-event-dashboard-event-edit';
import { EventBusService } from '../../../../services/event-bus.service';
import { EventType } from '../../../../../types';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { SingleEventBookingCreate } from './single-event-booking-create/single-event-booking-create';
import { SingleEventBookingList } from './single-event-booking-list/single-event-booking-list';
export type WORKFLOW_TYPE = 'NO_DIALOG'
| 'event_delete'
| 'event_cancel'
| 'event_dashboard'
| 'event_create'
| 'event_activate'
| 'event_edit'
| 'booking_create'
| 'booking_list'
| 'booking_cancel'
;
@Component({
selector: 'app-calendar-view',
@@ -34,14 +52,16 @@ import { SingleEventDashboardEventEdit } from './single-event-dashboard-event-ed
templateUrl: './calendar-view.html',
styleUrl: './calendar-view.css',
})
export class CalendarView {
export class CalendarView {
@ViewChild('startHour') startHour!: ElementRef;
@ViewChild('calendar') calendarComponent: FullCalendarComponent | undefined;
private eventBus = inject(EventBusService);
calendarService = inject(CalendarService);
workflow = signal<string>('');
workflow = signal<WORKFLOW_TYPE>('NO_DIALOG');
selectedDate = signal<Date | undefined>(undefined);
selectedEvent = signal<CalendarEventDto | undefined>(undefined);
@@ -50,6 +70,24 @@ export class CalendarView {
constructor() {
this.eventBus.on(EventType.CALENDAR_VIEW_EVENT_SAVED)
.pipe(takeUntilDestroyed())
.subscribe({
next: (_) => {
this.closeDialog();
this.calendarComponent?.getApi().refetchEvents();
}
});
this.eventBus.on(EventType.CALENDAR_VIEW_DIALOG_CLOSED)
.pipe(takeUntilDestroyed())
.subscribe({
next: (_) => {
this.closeDialog();
}
})
this.calendarOptions = {
plugins: [dayGridPlugin, timeGridPlugin, listPlugin, interactionPlugin],
initialView: 'dayGridMonth',
@@ -65,12 +103,12 @@ export class CalendarView {
eventClick: (info) => {
this.selectedEvent.set(info.event.extendedProps['event']);
this.workflow.set('event-dashboard');
this.workflow.set('event_dashboard');
this.selectedDate.set(undefined);
},
dateClick: (info) => {
this.workflow.set('event-create');
this.workflow.set('event_create');
this.selectedDate.set(info.date);
this.selectedEvent.set(undefined);
},
@@ -80,13 +118,12 @@ export class CalendarView {
this.dialogs = [
{
component: SingleEventDashboardEventDelete,
isRendered: () => this.workflow() == 'event-delete',
isRendered: () => this.workflow() == 'event_delete',
closeClick: () => this.closeDialog(),
modalBoxStyleClass: 'max-w-none w-2xl',
componentInputs: () => {
return {
'event': this.selectedEvent(),
'onAction': this.handleAction,
};
},
@@ -94,14 +131,13 @@ export class CalendarView {
{
component: SingleEventDashboardEventActivation,
isRendered: () => this.workflow() == 'event-cancel',
isRendered: () => this.workflow() == 'event_cancel',
closeClick: () => this.closeDialog(),
modalBoxStyleClass: 'max-w-none w-2xl',
componentInputs: () => {
return {
'mode': 'cancel',
'event': this.selectedEvent(),
'onAction': this.handleAction,
};
},
},
@@ -114,26 +150,61 @@ export class CalendarView {
return {
'mode': 'activate',
'event': this.selectedEvent(),
'onAction': this.handleAction,
};
},
},
{
component: SingleEventDashboardEventEdit,
isRendered: () => this.workflow() == 'event-edit',
isRendered: () => this.workflow() == 'event_edit',
// isRendered: () => true,
closeClick: () => this.closeDialog(),
modalBoxStyleClass: 'max-w-none w-2xl',
componentInputs: () => {
return {
'event': this.selectedEvent(),
};
},
},
{
component: SingleEventBookingCreate,
isRendered: () => this.workflow() == 'booking_create',
// isRendered: () => true,
closeClick: () => this.closeDialog(),
modalBoxStyleClass: 'max-w-none w-2xl',
componentInputs: () => {
return {
'event': this.selectedEvent(),
};
},
},
{
component: SingleEventBookingList,
isRendered: () => this.workflow() == 'booking_list',
// isRendered: () => true,
closeClick: () => this.closeDialog(),
modalBoxStyleClass: 'max-w-none w-2xl',
componentInputs: () => {
return {
'event': this.selectedEvent(),
};
},
},
{
component: SingleEventBookingList,
isRendered: () => this.workflow() == 'booking_cancel',
// isRendered: () => true,
closeClick: () => this.closeDialog(),
modalBoxStyleClass: 'max-w-none w-2xl',
componentInputs: () => {
return {
'event': this.selectedEvent(),
'onAction': this.handleAction,
};
},
},
];
}
fetchEvents(fetchInfo: any, successCallback: (events: EventInput[]) => void, failureCallback: (error: any) => void): void {
console.info('fetching events', fetchInfo);
@@ -183,58 +254,21 @@ export class CalendarView {
);
}
// protected addEvent($event: PointerEvent) {
// let hourStr = this.startHour.nativeElement.value;
// const hour = parseInt(hourStr, 10);
// const date = new Date();
// const start = new Date(date.getTime());
// start.setHours(hour, 0, 0);
// const end = new Date(date.getTime());
// // end.setHours(3,0,0)
//
// this.calendarComponent?.getApi().addEvent({
// title: 'Event at ' + hour,
// start,
// });
// }
closeDialog() {
this.workflow.set('');
this.workflow.set('NO_DIALOG');
}
onDashboardAction(action: string) {
console.info('dashboard event', action);
switch (action) {
case 'event_delete':
this.workflow.set('event-delete');
break;
case 'event_cancel':
this.workflow.set('event-cancel');
break;
case 'event_edit':
this.workflow.set('event-edit');
break;
default:
this.workflow.set(action);
break;
}
/**
* Set dashboard workflow
* @param workflowType
*/
setWorkFlow(workflowType: WORKFLOW_TYPE) {
console.info('set workflow to', workflowType);
this.workflow.set(workflowType);
}
// This function is passed into the child
handleAction = (msg: string) => {
console.log('Parent received:', msg);
if (msg == 'close') {
this.closeDialog();
} else if ( msg == 'save-event-success'){
this.closeDialog();
this.calendarComponent?.getApi().refetchEvents();
}else{
}
};
}
export interface DialogConfig {

0
admin/src/app/features/calendar/components/calendar-view/single-event-booking-cancel/single-event-booking-cancel.css Normal file
View File

1
admin/src/app/features/calendar/components/calendar-view/single-event-booking-cancel/single-event-booking-cancel.html Normal file
View File

@@ -0,0 +1 @@
<p>single-event-booking-cancel works!</p>

14
admin/src/app/features/calendar/components/calendar-view/single-event-booking-cancel/single-event-booking-cancel.ts Normal file
View File

@@ -0,0 +1,14 @@
import { Component, inject, input } from '@angular/core';
import { EventBusService } from '../../../../../services/event-bus.service';
import { CalendarEventDto } from '../../../models/events-in-range-dto.model';
@Component({
selector: 'app-single-event-booking-cancel',
imports: [],
templateUrl: './single-event-booking-cancel.html',
styleUrl: './single-event-booking-cancel.css',
})
export class SingleEventBookingCancel {
eventBus = inject(EventBusService);
event = input<CalendarEventDto>();
}

0
admin/src/app/features/calendar/components/calendar-view/single-event-booking-create/single-event-booking-create.css Normal file
View File

1
admin/src/app/features/calendar/components/calendar-view/single-event-booking-create/single-event-booking-create.html Normal file
View File

@@ -0,0 +1 @@
<p>single-event-booking-create works!</p>

15
admin/src/app/features/calendar/components/calendar-view/single-event-booking-create/single-event-booking-create.ts Normal file
View File

@@ -0,0 +1,15 @@
import { Component, inject, input } from '@angular/core';
import { CalendarEventDto } from '../../../models/events-in-range-dto.model';
import { EventBusService } from '../../../../../services/event-bus.service';
@Component({
selector: 'app-single-event-booking-create',
imports: [],
templateUrl: './single-event-booking-create.html',
styleUrl: './single-event-booking-create.css',
})
export class SingleEventBookingCreate {
eventBus = inject(EventBusService);
event = input<CalendarEventDto>();
}

0
admin/src/app/features/calendar/components/calendar-view/single-event-booking-list/single-event-booking-list.css Normal file
View File

1
admin/src/app/features/calendar/components/calendar-view/single-event-booking-list/single-event-booking-list.html Normal file
View File

@@ -0,0 +1 @@
<p>single-event-booking-list works!</p>

14
admin/src/app/features/calendar/components/calendar-view/single-event-booking-list/single-event-booking-list.ts Normal file
View File

@@ -0,0 +1,14 @@
import { Component, inject, input } from '@angular/core';
import { EventBusService } from '../../../../../services/event-bus.service';
import { CalendarEventDto } from '../../../models/events-in-range-dto.model';
@Component({
selector: 'app-single-event-booking-list',
imports: [],
templateUrl: './single-event-booking-list.html',
styleUrl: './single-event-booking-list.css',
})
export class SingleEventBookingList {
eventBus = inject(EventBusService);
event = input<CalendarEventDto>();
}

14
admin/src/app/features/calendar/components/calendar-view/single-event-dashboard-event-activation/single-event-dashboard-event-activation.component.ts
View File

@@ -1,5 +1,5 @@
import { Component, inject, input } from '@angular/core';
import { CalendarEventDto, EventExceptionDto } from '../../../models/events-in-range-dto.model';
import { CalendarEventDto } from '../../../models/events-in-range-dto.model';
import {
SingleEventDashboardEventDetailsView,
} from '../single-event-dashboard-event-details-view/single-event-dashboard-event-details-view';
@@ -8,6 +8,8 @@ import { SvgIcons } from '../../../../../svg-icons';
import { SafeHtmlPipe } from '../../../../../pipes/safe-html-pipe';
import { CalendarService } from '../../../services/calendar.service';
import { CreateExceptionDto } from '../../../models/event-exception.model';
import { EventBusService } from '../../../../../services/event-bus.service';
import { EventType } from '../../../../../../types';
export type ACTIVATION_TYPE = 'cancel' | 'activate';
@@ -23,11 +25,10 @@ export type ACTIVATION_TYPE = 'cancel' | 'activate';
})
export class SingleEventDashboardEventActivation {
eventBus = inject(EventBusService);
mode = input<ACTIVATION_TYPE>('cancel');
calendarService = inject(CalendarService);
event = input<CalendarEventDto>();
onAction = input.required<(msg: string) => void>();
protected readonly SvgIcons = SvgIcons;
@@ -37,7 +38,7 @@ export class SingleEventDashboardEventActivation {
console.info('setEventOccurrenceActivation', event);
const eventId = this.event()?.id!;
const startTime = this.event()?.startTime!;
let payload: CreateExceptionDto | undefined = undefined;
let payload: CreateExceptionDto | undefined;
const eventException = event?.exceptions?.length ? event.exceptions[0] : undefined;
if (eventException) {
payload = {
@@ -57,9 +58,10 @@ export class SingleEventDashboardEventActivation {
this.calendarService.applyException(eventId, payload ).subscribe(
{
next: () => {
this.onAction()('save-event-success');
this.eventBus.emit(EventType.CALENDAR_VIEW_EVENT_SAVED, 'Event saved')
},
error: err => {
console.error(err);
alert('Failed to change event');
},
},
@@ -75,7 +77,7 @@ export class SingleEventDashboardEventActivation {
}
protected closeDialog() {
this.onAction()('close');
this.eventBus.emit(EventType.CALENDAR_VIEW_DIALOG_CLOSED, 'Event saved')
}
}

11
admin/src/app/features/calendar/components/calendar-view/single-event-dashboard-event-delete/single-event-dashboard-event-delete.html
View File

@@ -1,17 +1,14 @@
<h2 class="text-2xl">Törlés</h2>
<p>Esemény és az egész széria törlése</p>
@if (config) {
<app-detail-view
[config]="config"
></app-detail-view>
}
<app-single-event-dashboard-event-details-view [event]="event()">
</app-single-event-dashboard-event-details-view>
<div class="flex gap-2 mt-3">
<rs-daisy-button variant="error" (click)="doDelete()">
<rs-daisy-button variant="error" (click)="deleteEventTemplate()">
<span [outerHTML]="SvgIcons.heroTrash | safeHtml"></span>
Törlés
</rs-daisy-button>
<rs-daisy-button variant="primary" (click)="triggerAction()">
<rs-daisy-button variant="primary" (click)="closeDialog()">
<span [outerHTML]="SvgIcons.heroXcircle | safeHtml"></span>
Mégsem
</rs-daisy-button>

73
admin/src/app/features/calendar/components/calendar-view/single-event-dashboard-event-delete/single-event-dashboard-event-delete.ts
View File

@@ -1,76 +1,41 @@
import { Component, effect, inject, input, output } from '@angular/core';
import { Component, inject, input } from '@angular/core';
import { CalendarEventDto } from '../../../models/events-in-range-dto.model';
import { DetailView, DetailViewConfig } from '../../../../../components/detail-view/detail-view';
import { SvgIcons } from '../../../../../svg-icons';
import { SafeHtmlPipe } from '../../../../../pipes/safe-html-pipe';
import { Button } from '@rschneider/ng-daisyui';
import { CalendarService } from '../../../services/calendar.service';
import { EventBusService } from '../../../../../services/event-bus.service';
import {
SingleEventDashboardEventDetailsView
} from '../single-event-dashboard-event-details-view/single-event-dashboard-event-details-view';
import { EventType } from '../../../../../../types';
@Component({
selector: 'app-single-event-dashboard-event-delete',
imports: [
DetailView,
SafeHtmlPipe,
Button,
SingleEventDashboardEventDetailsView,
],
templateUrl: './single-event-dashboard-event-delete.html',
styleUrl: './single-event-dashboard-event-delete.css',
})
export class SingleEventDashboardEventDelete {
eventBus = inject(EventBusService);
calendarService = inject(CalendarService);
event = input<CalendarEventDto>();
// Define an input that expects a function
onAction = input.required<(msg: string) => void>();
config: DetailViewConfig<CalendarEventDto> | undefined;
constructor() {
effect(() => {
this.config = {
data: this.event()!,
rows: [{
attribute: 'id',
getTitle: 'Esemény azonosító',
},
{
attribute: 'title',
getTitle: 'Esemény neve',
},
{
attribute: 'startTime',
getTitle: 'Kezdési időpont',
format: 'datetime',
},
{
attribute: 'eventType',
getTitle: 'Esemény típusa',
getValue: obj => obj.eventType.name,
},
],
};
});
}
triggerAction() {
// Call the function passed from the parent
this.onAction()('close');
}
doDelete() {
this.calendarService.deleteEvent(this.event()!.id).subscribe(
{
next: ( ) => {
this.onAction()('save-event-success');
}
}
)
// Call the function passed from the parent
}
protected readonly SvgIcons = SvgIcons;
closeDialog() {
// Call the function passed from the parent
this.eventBus.emit(EventType.CALENDAR_VIEW_DIALOG_CLOSED, '')
}
protected deleteEventTemplate() {
this.calendarService.delete(this.event()!.id).subscribe(() => this.eventBus.emit(EventType.CALENDAR_VIEW_EVENT_SAVED, 'Event saved'))
}
}

8
admin/src/app/features/calendar/components/calendar-view/single-event-dashboard-event-edit/single-event-dashboard-event-edit.html
View File

@@ -1,3 +1,5 @@
<app-create-event-form (ready)="triggerAction($event)" [date]="selectedDate()"
[id]="event()?.id"></app-create-event-form>
<app-create-event-form
(ready)="triggerAction($event)"
[date]="selectedDate()"
[id]="event()?.id">
</app-create-event-form>

24
admin/src/app/features/calendar/components/calendar-view/single-event-dashboard-event-edit/single-event-dashboard-event-edit.ts
View File

@@ -1,31 +1,33 @@
import { Component, input, signal } from '@angular/core';
import { Component, inject, input, signal } from '@angular/core';
import { CalendarEventDto } from '../../../models/events-in-range-dto.model';
import { SvgIcons } from '../../../../../svg-icons';
import { CreateEventForm } from '../../create-event-form/create-event-form';
import { Modal } from '@rschneider/ng-daisyui';
import { CreateEventForm, ReadyType } from '../../create-event-form/create-event-form';
import { EventBusService } from '../../../../../services/event-bus.service';
import { EventType } from '../../../../../../types';
@Component({
selector: 'app-single-event-dashboard-event-edit',
imports: [
CreateEventForm,
Modal,
],
templateUrl: './single-event-dashboard-event-edit.html',
styleUrl: './single-event-dashboard-event-edit.css',
})
export class SingleEventDashboardEventEdit {
eventBus = inject(EventBusService);
selectedDate = signal<Date | undefined>(undefined);
event = input<CalendarEventDto>();
onAction = input.required<(msg: string) => void>();
protected readonly SvgIcons = SvgIcons;
/**
* proxy to ready event from form to parent
*/
protected triggerAction(action: string) {
console.info("event details dashboard", action)
this.onAction()(action)
protected triggerAction(action: ReadyType) {
if ( action == 'save-event-success'){
this.eventBus.emit(EventType.CALENDAR_VIEW_EVENT_SAVED,'');
}else if ( action == 'save-event-failed'){
this.eventBus.emit(EventType.CALENDAR_VIEW_DIALOG_CLOSED,'');
}else{
this.eventBus.emit(EventType.CALENDAR_VIEW_DIALOG_CLOSED,'');
}
}
}

9
admin/src/app/features/calendar/components/calendar-view/single-event-dashboard/single-event-dashboard.html
View File

@@ -4,11 +4,8 @@
@if (!event()?.isRecurring) {
<h2 class="text-xl">Esemény </h2>
}
@if (config) {
<app-detail-view
[config]="config"
></app-detail-view>
}
<app-single-event-dashboard-event-details-view [event]="event()">
</app-single-event-dashboard-event-details-view>
<div class="flex mt-3 gap-2 flex-wrap content-stretch ">
@for (card of cards(); let i = $index; track i) {
@@ -19,7 +16,7 @@
[description]="card.description"
[buttonTitle]="card.buttonTitle"
[styleClass]="'flex-1'"
(onAction)="onCardAction(card.action)"
(onAction)="onCardAction(card.workflow)"
></app-single-event-dashboard-card>
}

54
admin/src/app/features/calendar/components/calendar-view/single-event-dashboard/single-event-dashboard.ts
View File

@@ -3,12 +3,17 @@ import { CalendarEventDto } from '../../../models/events-in-range-dto.model';
import { DetailView, DetailViewConfig } from '../../../../../components/detail-view/detail-view';
import { SvgIcons } from '../../../../../svg-icons';
import { SingleEventDashboardCard } from '../single-event-dashboard-card/single-event-dashboard-card';
import { WORKFLOW_TYPE } from '../calendar-view';
import {
SingleEventDashboardEventDetailsView
} from '../single-event-dashboard-event-details-view/single-event-dashboard-event-details-view';
@Component({
selector: 'app-single-event-dashboard',
imports: [
DetailView,
SingleEventDashboardCard,
SingleEventDashboardEventDetailsView,
],
templateUrl: './single-event-dashboard.html',
styleUrl: './single-event-dashboard.css',
@@ -16,49 +21,20 @@ import { SingleEventDashboardCard } from '../single-event-dashboard-card/single-
export class SingleEventDashboard {
event = input<CalendarEventDto>();
action = output<string>();
config: DetailViewConfig<CalendarEventDto> | undefined;
action = output<WORKFLOW_TYPE>();
cards = signal<CardConfig[]>([]);
constructor() {
effect(() => {
console.info("dashboard", this.event());
this.config = {
data: this.event()!,
rows: [{
attribute: 'id',
getTitle: 'Esemény azonosító',
},
{
attribute: 'title',
getTitle: 'Esemény neve',
},
{
attribute: 'startTime',
getTitle: 'Kezdési időpont',
format: 'datetime',
},
{
attribute: 'eventType',
getTitle: 'Esemény típusa',
getValue: obj => obj.eventType.name,
},
],
};
this.cards.set( [
{
buttonTitle: 'Szerkesztés',
title: 'Szerkesztés',
svgIcon: SvgIcons.heorPencilSquare,
description: 'Az esemény módosítása',
action: 'event_edit',
workflow: 'event_edit',
},
this.event()?.isCancelled ?
@@ -68,48 +44,48 @@ export class SingleEventDashboard {
title: 'Előfordulás aktiválása',
svgIcon: SvgIcons.heroPlay,
description: 'Az esemény ezen előfordulásának aktiválása',
action: 'event_activate',
workflow: 'event_activate',
} :
{
buttonTitle: 'Lemondás',
title: 'Előfordulás lemondása',
svgIcon: SvgIcons.heroXcircle,
description: 'Az esemény ezen előfordulásának lemondása',
action: 'event_cancel',
workflow: 'event_cancel',
},
{
buttonTitle: 'Törlés',
title: 'Esemény törlése',
svgIcon: SvgIcons.heroTrash,
description: 'Az esemény törlése',
action: 'event_delete',
workflow: 'event_delete',
},
{
buttonTitle: 'Megnézem',
title: 'Foglalások',
svgIcon: SvgIcons.heroUserGroup,
description: 'Foglalások megtekintése',
action: 'event_bookings',
workflow: 'booking_list',
},
{
buttonTitle: 'Bejelentkezés',
title: 'Időpont foglalás',
svgIcon: SvgIcons.heroUserPlus,
description: 'Időpont foglalása eseményre',
action: 'user_booking',
workflow: 'booking_create',
},
{
buttonTitle: 'Lemondás',
title: 'Lemondás',
svgIcon: SvgIcons.heroUserMinus,
description: 'Az időpont lemondása',
action: 'user_cancel',
workflow: 'booking_cancel',
},
]);
});
}
onCardAction (action: string|undefined) {
onCardAction (action: WORKFLOW_TYPE) {
if ( action ){
this.action.emit(action);
}
@@ -125,5 +101,5 @@ export interface CardConfig {
description?: string;
buttonTitle?: string;
svgIcon?: string;
action?: string;
workflow: WORKFLOW_TYPE;
}

3
admin/src/app/features/calendar/components/create-event-form/create-event-form.ts
View File

@@ -16,6 +16,7 @@ export type FrequencyOption = {
frequency: Frequency,
label: string;
}
export type ReadyType = 'close' | 'save-event-success' | 'save-event-failed';
@Component({
selector: 'app-create-event-form',
@@ -28,7 +29,7 @@ export type FrequencyOption = {
export class CreateEventForm implements OnInit {
form: FormGroup;
isEditMode = false;
ready = output<string>();
ready = output<ReadyType>();
id = input<number | undefined>();
date = input<Date | undefined>();
eventTypes = signal<EventType[]>([]);