diff --git a/src/app/components/event/event.component.css b/src/app/components/event/event.component.css
index 86bb390..d631cbe 100644
--- a/src/app/components/event/event.component.css
+++ b/src/app/components/event/event.component.css
@@ -1,3 +1,12 @@
table, th, td {
border: .05em solid black;
}
+
+p.has-error {
+ color: red;
+}
+
+td.has-error {
+ border-color: red;
+ border-width: 2px;
+}
diff --git a/src/app/components/event/event.component.html b/src/app/components/event/event.component.html
index 572e3c2..830134f 100644
--- a/src/app/components/event/event.component.html
+++ b/src/app/components/event/event.component.html
@@ -1,67 +1,64 @@
-
-
- {{this.event?.calendarId}}
-
-
- {{this.event?.calendarId}}
-
- |
-
-
+
+
+ {{event?.calendarId}}
+ |
+
-
-
- {{this.event?.name}}
-
- |
-
-
-
-
-
- {{this.event?.description}}
-
- |
-
-
-
-
-
- {{this.event?.startDateTime}}
-
- |
-
-
-
-
-
- {{this.event?.endDateTime}}
-
- |
-
-
-
-
-
- {{this.event?.location}}
-
- |
-
-
-
-
-
- {{this.event?.createdBy}}
-
- |
-
-
-
-
-
- {{this.event?.url}}
-
- |
-
-
- |
+ |
+
+
+ |
+
+
+
+ |
+
+
+
+ |
+
+
+ |
+
+ {{event?.createdBy}}
+ |
+
+
+ |
+
+
+ Start Date must not be after end date!
+ Required fields are missing!
+ |
+
+
+
+ {{event?.calendarId}}
+ |
+
+ {{event?.name}}
+ |
+
+ {{event?.description}}
+ |
+
+
+
+ |
+
+
+
+ |
+
+ {{event?.location}}
+ |
+
+ {{event?.createdBy}}
+ |
+
+ {{event?.url}}
+ |
+
+
+ |
+
diff --git a/src/app/components/event/event.component.ts b/src/app/components/event/event.component.ts
index 50b7fe7..88e2497 100644
--- a/src/app/components/event/event.component.ts
+++ b/src/app/components/event/event.component.ts
@@ -11,20 +11,119 @@ export class EventComponent implements OnInit {
@Input() event: Event | undefined;
- editActive: boolean = false;
+ @Input() editActive: boolean = false;
+ newStartDate: string | undefined;
+ newStartTime: string | undefined;
+ newEndDate: string | undefined;
+ newEndTime: string | undefined;
+ showDateError: boolean = false;
+ requiredFieldsMissing: boolean = false;
+
constructor(private api: ApiService) {
}
ngOnInit(): void {
+ if (this.event) {
+ this.newStartDate = this.serializeDate(this.event.startDateTime);
+ this.newStartTime = this.serializeTime(this.event.startDateTime);
+ this.newEndDate = this.serializeDate(this.event.endDateTime);
+ this.newEndTime = this.serializeTime(this.event.endDateTime);
+ }
}
toggleEdit() {
- if(this.editActive && this.event !== undefined) {
- this.api.updateEvent(this.event).subscribe((res: any) => {
- console.log(res);
- });
+ if (this.editActive && this.event !== undefined) {
+ // Prevent save if endDateTime is before startDateTime
+ if(this.event.endDateTime < this.event.startDateTime) {
+ this.showDateError = true;
+ return;
+ }
+
+ // Check required fields
+ if(
+ this.isNullOrBlank(this.event.name) ||
+ this.isNullOrBlank(this.event.createdBy) ||
+ this.event.startDateTime == undefined ||
+ this.event.endDateTime == undefined
+ ) {
+ this.requiredFieldsMissing = true;
+ return;
+ }
+
+ if(this.event.eventId === undefined) {
+ this.api.createEvent(this.event).subscribe((res: any) => {
+ console.log(res);
+ this.event!.eventId = res.eventId;
+ });
+ } else {
+ // Update existing event
+ this.api.updateEvent(this.event).subscribe((res: any) => {
+ console.log(res);
+ });
+ }
}
this.editActive = !this.editActive;
}
+
+ setStartDateTime() {
+ if (this.newStartDate && this.event) {
+ let newDate: Date = this.parseDate(this.newStartDate);
+
+ this.event.startDateTime.setFullYear(newDate.getFullYear());
+ this.event.startDateTime.setMonth(newDate.getMonth());
+ this.event.startDateTime.setDate(newDate.getDate());
+ }
+ if (this.newStartTime && this.event) {
+ let newTime: Date = this.parseTime(this.newStartTime);
+
+ this.event.startDateTime.setHours(newTime.getHours());
+ this.event.startDateTime.setMinutes(newTime.getMinutes());
+ this.event.startDateTime.setSeconds(0);
+ }
+ }
+
+ setEndDateTime() {
+ if (this.newEndDate && this.event) {
+ let newDate: Date = this.parseDate(this.newEndDate);
+
+ this.event.endDateTime.setFullYear(newDate.getFullYear());
+ this.event.endDateTime.setMonth(newDate.getMonth());
+ this.event.endDateTime.setDate(newDate.getDate());
+ }
+ if (this.newEndTime && this.event) {
+ let newTime: Date = this.parseTime(this.newEndTime);
+
+ this.event.endDateTime.setHours(newTime.getHours());
+ this.event.endDateTime.setMinutes(newTime.getMinutes());
+ this.event.endDateTime.setSeconds(0);
+ }
+ }
+
+ serializeDate(date: Date): string {
+ let year = date.getFullYear();
+ let month = (date.getMonth() + 1).toString().padStart(2, '0');
+ let day = date.getDate().toString().padStart(2, '0');
+
+ return `${year}-${month}-${day}`;
+ }
+
+ serializeTime(date: Date): string {
+ let hours = date.getHours().toString().padStart(2, '0');
+ let minutes = date.getMinutes().toString().padStart(2, '0');
+
+ return `${hours}:${minutes}`;
+ }
+
+ parseDate(text: string): Date {
+ return new Date(text);
+ }
+
+ parseTime(text: string): Date {
+ return new Date(`2000-01-01T${text}:00`);
+ }
+
+ isNullOrBlank(str: string | null): boolean {
+ return str === null || str === undefined || str.trim() === '';
+ }
}
diff --git a/src/app/components/events-table/events-table.component.html b/src/app/components/events-table/events-table.component.html
index 6da37cb..dc15afc 100644
--- a/src/app/components/events-table/events-table.component.html
+++ b/src/app/components/events-table/events-table.component.html
@@ -10,5 +10,6 @@
URL |
Edit |
-
+
+
diff --git a/src/app/components/events-table/events-table.component.ts b/src/app/components/events-table/events-table.component.ts
index e484e35..3cc1313 100644
--- a/src/app/components/events-table/events-table.component.ts
+++ b/src/app/components/events-table/events-table.component.ts
@@ -1,5 +1,6 @@
import {Component, Input, OnInit} from '@angular/core';
import {Event} from '../../models/event';
+import {UtilsService} from '../../services/utils.service';
@Component({
selector: 'app-events-table',
@@ -9,10 +10,20 @@ import {Event} from '../../models/event';
export class EventsTableComponent implements OnInit {
@Input() events: Event[] = [];
+ @Input() selectedCalendar: number = -1;
constructor() {
}
ngOnInit(): void {
}
+ addEvent() {
+ this.events.push({
+ calendarId: this.selectedCalendar,
+ startDateTime: new Date(),
+ endDateTime: new Date(),
+ createdDate: new Date(),
+ createdBy: UtilsService.getNameFromLocalStorage()
+ } as Event);
+ }
}
diff --git a/src/app/pages/admin/admin.component.html b/src/app/pages/admin/admin.component.html
index 59808fc..c41926b 100644
--- a/src/app/pages/admin/admin.component.html
+++ b/src/app/pages/admin/admin.component.html
@@ -4,11 +4,11 @@
-
diff --git a/src/app/pages/admin/admin.component.ts b/src/app/pages/admin/admin.component.ts
index e0c98de..76955cd 100644
--- a/src/app/pages/admin/admin.component.ts
+++ b/src/app/pages/admin/admin.component.ts
@@ -49,4 +49,22 @@ export class AdminComponent implements OnInit {
this.isLoggedIn = true;
this.getEvents();
}
+
+ handleCalendarChange() {
+ this.events = [];
+ this.getEvents();
+ }
+
+ getCalendarId(text: string): number {
+ switch(text) {
+ case 'public':
+ return 1;
+ case 'members':
+ return 2;
+ case 'management':
+ return 3;
+ default:
+ return -1;
+ }
+ }
}
diff --git a/src/app/services/api.service.ts b/src/app/services/api.service.ts
index 4aaa5db..5e95643 100644
--- a/src/app/services/api.service.ts
+++ b/src/app/services/api.service.ts
@@ -37,12 +37,25 @@ export class ApiService {
updateEvent.password = password;
- console.log(event);
-
return this.http.put(this.apiUrl + updateEvent.eventId, updateEvent);
} catch (exception) {
console.log('Error fetching events from API');
}
return new Observable();
}
+
+ createEvent(event: Event): Observable {
+ try {
+ let password = UtilsService.getPasswordFromLocalStorage();
+
+ let createEvent: any = event;
+
+ createEvent.password = password;
+
+ return this.http.post(this.apiUrl, createEvent);
+ } catch (exception) {
+ console.log('Error fetching events from API');
+ }
+ return new Observable();
+ }
}
diff --git a/src/app/services/utils.service.ts b/src/app/services/utils.service.ts
index 963ab83..4bec2b5 100644
--- a/src/app/services/utils.service.ts
+++ b/src/app/services/utils.service.ts
@@ -16,4 +16,8 @@ export class UtilsService {
static getPasswordFromLocalStorage(): string {
return localStorage.getItem('password') ?? '';
}
+
+ static getNameFromLocalStorage(): string {
+ return localStorage.getItem('name') ?? '';
+ }
}