# Implemented Calendar for task events.

backend/src/main/java/com/ios/backend/resources/CalendarListResource.java

@@ -0,0 +1,18 @@
+package com.ios.backend.resources;
+
+import java.util.List;
+
+public class CalendarListResource {
+
+ private List<CalendarResource> events;
+
+ public List<CalendarResource> getEvents() {
+ return events;
+ }
+
+ public void setEvents(List<CalendarResource> events) {
+ this.events = events;
+ }
+
+
+}

backend/src/main/java/com/ios/backend/resources/CalendarResource.java

@@ -0,0 +1,41 @@
+package com.ios.backend.resources;
+
+import java.time.LocalDateTime;
+
+import com.fasterxml.jackson.annotation.JsonFormat;
+
+public class CalendarResource {
+
+ private String title;
+
+ @JsonFormat(pattern = "yyyy-MM-dd HH:mm")
+ private LocalDateTime start;
+
+ @JsonFormat(pattern = "yyyy-MM-dd HH:mm")
+ private LocalDateTime end;
+
+ public String getTitle() {
+ return title;
+ }
+
+ public void setTitle(String title) {
+ this.title = title;
+ }
+
+ public LocalDateTime getStart() {
+ return start;
+ }
+
+ public void setStart(LocalDateTime start) {
+ this.start = start;
+ }
+
+ public LocalDateTime getEnd() {
+ return end;
+ }
+
+ public void setEnd(LocalDateTime end) {
+ this.end = end;
+ }
+
+}

frontend/src/app/framework/models/TaskCalendar.ts

@@ -0,0 +1,6 @@
+export class TaskCalendar {
+ title: string;
+ start: string;
+ end: string;
+ constructor() {}
+}

frontend/src/app/framework/models/TaskCalendarList.ts

@@ -0,0 +1,6 @@
+import { TaskCalendar } from './TaskCalendar';
+
+export class TaskCalendarList {
+ events: TaskCalendar[];
+ constructor() {}
+}

frontend/src/app/views/tasks/task-calendar/task-calendar.component.css

@@ -0,0 +1,4 @@
+:host >>> .fc-view-container {
+ height: 70%;
+ width: auto;
+}

frontend/src/app/views/tasks/task-calendar/task-calendar.component.html

@@ -0,0 +1,4 @@
+<div id="f-cal">
+ <p-fullCalendar [style]="{'height':'75%'}" [events]="events" [options]="options">
+ </p-fullCalendar>
+</div>

frontend/src/app/views/tasks/task-calendar/task-calendar.component.ts

@@ -0,0 +1,37 @@
+import { Component, OnInit } from '@angular/core';
+import { GlobalService } from 'src/app/framework/services/global.service';
+import { Router, ActivatedRoute } from '@angular/router';
+import { TaskService } from 'src/app/framework/services/task.service';
+import dayGridPlugin from '@fullcalendar/daygrid';
+import timeGridPlugin from '@fullcalendar/timegrid';
+import interactionPlugin from '@fullcalendar/interaction';
+
+@Component({
+ selector: 'app-task-calendar',
+ templateUrl: './task-calendar.component.html',
+ styleUrls: ['./task-calendar.component.css']
+})
+export class TaskCalendarComponent implements OnInit {
+
+ events: any[];
+ options: any;
+
+ constructor(private service: TaskService, private global: GlobalService, private router: Router, private route: ActivatedRoute) { }
+
+ ngOnInit() {
+ this.service.getAllTaskCalendar().subscribe(data => this.events = data.events);
+
+ this.options = {
+ plugins: [dayGridPlugin, timeGridPlugin, interactionPlugin],
+ defaultDate: Date.now(),
+ header: {
+ left: 'prev,next,month,agendaWeek,agendaDay',
+ center: 'title',
+ right: 'month,agendaWeek,agendaDay'
+ },
+ editable: true,
+ dateClick: (e) => { console.log(e); }
+ };
+ }
+
+}