Added events to Agenda

This commit is contained in:
Tiago Kayaya
2020-08-24 12:45:42 +01:00
parent 88a12ffda5
commit d8f224a4e3
5 changed files with 146 additions and 190 deletions
+79 -2
View File
@@ -1948,6 +1948,79 @@
}
}
},
"@fullcalendar/angular": {
"version": "5.3.0",
"resolved": "https://registry.npmjs.org/@fullcalendar/angular/-/angular-5.3.0.tgz",
"integrity": "sha512-6i1BzG72UbQOWaRWnS8HgKZ19rInJuWk7IC5vvR4OCWwxfTwHfZd6Z+nWAOFTSpT1BGtoBpfdoTB0GwV9+iaYA==",
"requires": {
"@fullcalendar/core": "~5.3.0",
"fast-deep-equal": "^3.1.1"
}
},
"@fullcalendar/common": {
"version": "5.3.0",
"resolved": "https://registry.npmjs.org/@fullcalendar/common/-/common-5.3.0.tgz",
"integrity": "sha512-TYWV2hx9tKNWjRWX8Im3nyikXMekpPBurqxM6jRxEdKzfhzKEHlJEyBi8Buz8Xg4Qyg2KkjuWwq2+ImGg0hcOw==",
"requires": {
"tslib": "^2.0.0"
},
"dependencies": {
"tslib": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.0.1.tgz",
"integrity": "sha512-SgIkNheinmEBgx1IUNirK0TUD4X9yjjBRTqqjggWCU3pUEqIk3/Uwl3yRixYKT6WjQuGiwDv4NomL3wqRCj+CQ=="
}
}
},
"@fullcalendar/core": {
"version": "5.3.0",
"resolved": "https://registry.npmjs.org/@fullcalendar/core/-/core-5.3.0.tgz",
"integrity": "sha512-blA6r4dFKRyFxB3tiG8eeF2kl75rep8aavYZGpALGZEfPLf/T3xqPf4ulgYZ5bojsUXS9FQM0NqFM9jD/XSnOg==",
"requires": {
"@fullcalendar/common": "~5.3.0",
"preact": "^10.0.5",
"tslib": "^2.0.0"
},
"dependencies": {
"tslib": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.0.1.tgz",
"integrity": "sha512-SgIkNheinmEBgx1IUNirK0TUD4X9yjjBRTqqjggWCU3pUEqIk3/Uwl3yRixYKT6WjQuGiwDv4NomL3wqRCj+CQ=="
}
}
},
"@fullcalendar/daygrid": {
"version": "5.3.0",
"resolved": "https://registry.npmjs.org/@fullcalendar/daygrid/-/daygrid-5.3.0.tgz",
"integrity": "sha512-YDE7Pnxf+jkkQjogYPEgHDn4mahgUl2eNJRSytQOBJDVrsWcR/nAXI0PhsWHKi86BZVviEiEjzuLv+e4jeIVCg==",
"requires": {
"@fullcalendar/common": "~5.3.0",
"tslib": "^2.0.0"
},
"dependencies": {
"tslib": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.0.1.tgz",
"integrity": "sha512-SgIkNheinmEBgx1IUNirK0TUD4X9yjjBRTqqjggWCU3pUEqIk3/Uwl3yRixYKT6WjQuGiwDv4NomL3wqRCj+CQ=="
}
}
},
"@fullcalendar/interaction": {
"version": "5.3.0",
"resolved": "https://registry.npmjs.org/@fullcalendar/interaction/-/interaction-5.3.0.tgz",
"integrity": "sha512-ls1OlE55axFUEVHdk3k+gRThx6dvOtk7XKTYHCy1nQmKafWhvW8wuf8v8Pa5uUAndRkNVZZNfbha842P4zb+NA==",
"requires": {
"@fullcalendar/common": "~5.3.0",
"tslib": "^2.0.0"
},
"dependencies": {
"tslib": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.0.1.tgz",
"integrity": "sha512-SgIkNheinmEBgx1IUNirK0TUD4X9yjjBRTqqjggWCU3pUEqIk3/Uwl3yRixYKT6WjQuGiwDv4NomL3wqRCj+CQ=="
}
}
},
"@ionic-native/core": {
"version": "5.27.0",
"resolved": "https://registry.npmjs.org/@ionic-native/core/-/core-5.27.0.tgz",
@@ -6565,8 +6638,7 @@
"fast-deep-equal": {
"version": "3.1.3",
"resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
"integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
"dev": true
"integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q=="
},
"fast-glob": {
"version": "3.2.4",
@@ -11074,6 +11146,11 @@
"integrity": "sha512-97DXOFbQJhk71ne5/Mt6cOu6yxsSfM0QGQyl0L25Gca4yGWEGJaig7l7gbCX623VqTBNGLRLaVUCnNkcedlRSQ==",
"dev": true
},
"preact": {
"version": "10.4.7",
"resolved": "https://registry.npmjs.org/preact/-/preact-10.4.7.tgz",
"integrity": "sha512-DtnnPbOm7oxW7Sxf5Co+KSIOxo7bGm0vLfJN/wGey7G2sAGKnGP5+bFyE2YIgutMISQl6xFVTsOd6l/Au88VVw=="
},
"prepend-http": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/prepend-http/-/prepend-http-1.0.4.tgz",
+3
View File
@@ -21,6 +21,9 @@
"@angular/router": "~9.1.6",
"@capacitor/android": "^2.4.0",
"@capacitor/core": "2.4.0",
"@fullcalendar/angular": "^5.3.0",
"@fullcalendar/daygrid": "^5.3.0",
"@fullcalendar/interaction": "^5.3.0",
"@ionic-native/core": "^5.0.7",
"@ionic-native/splash-screen": "^5.0.0",
"@ionic-native/status-bar": "^5.0.0",
+23 -15
View File
@@ -2,6 +2,19 @@
<ion-toolbar>
<ion-title>Agenda</ion-title>
</ion-toolbar>
<ion-toolbar>
<ion-segment [(ngModel)]="segment">
<ion-segment-button value="combinada">
Combinada
</ion-segment-button>
<ion-segment-button value="oficial">
Oficial
</ion-segment-button>
<ion-segment-button value="pessoal">
Pessoal
</ion-segment-button>
</ion-segment>
</ion-toolbar>
</ion-header>
<!--
<ion-content> -->
@@ -19,19 +32,14 @@
</ion-segment>
</ion-toolbar> -->
<ion-content>
<ion-toolbar>
<ion-segment [(ngModel)]="segment">
<ion-segment-button value="combinada">
Combinada
</ion-segment-button>
<ion-segment-button value="oficial">
Oficial
</ion-segment-button>
<ion-segment-button value="pessoal">
Pessoal
</ion-segment-button>
</ion-segment>
</ion-toolbar>
<ion-refresher name="refresher" slot="fixed" (ionRefresh)="refreshAgenda($event)">
<ion-refresher-content
pullingIcon="chevron-down-circle-outline"
pullingText="deslize para actualizar"
refreshingSpinner="circles"
refreshingText="a actualizar...">
</ion-refresher-content>
</ion-refresher>
<ion-row>
<!-- <ion-col size="6">
@@ -77,6 +85,8 @@
[currentDate]="calendar.currentDate"
(onEventSelected)="onEventSelected($event)"
(onTitleChanged)="onViewTitleChanged($event)"
(onRangeChanged)="onRangeChanged($event)"
queryMode="remote"
startHour="6"
endHour="20"
step="30"
@@ -97,8 +107,6 @@
</div>
</ng-template>
<ion-fab vertical="bottom" horizontal="end" slot="fixed">
<ion-fab-button>
<ion-icon name="add" (click)="openCalModal()"></ion-icon>
+39 -173
View File
@@ -4,9 +4,10 @@ import { AlertController, ModalController } from '@ionic/angular';
import { formatDate } from '@angular/common';
import { CalModalPage } from '../cal-modal/cal-modal.page';
import { EventsService } from 'src/app/services/events.service';
import { Observable } from 'rxjs';
import { Observable, ObjectUnsubscribedError } from 'rxjs';
import { Event } from '../../models/event.model';
import { parse } from 'date-fns';
import { Router } from '@angular/router';
@Component({
selector: 'app-agenda',
@@ -15,16 +16,6 @@ import { parse } from 'date-fns';
})
export class AgendaPage implements OnInit {
event = {
title: 'Teste',
desc: 'Desc',
startTime: '2020,21,08',
endTime: '2020,22,08',
allDay: false
};
/* minDate = new Date().toDateString(); */
/* List of events of our calendar */
eventSource = [];
/* The title of the calendar */
@@ -42,31 +33,24 @@ export class AgendaPage implements OnInit {
segment:string;
eventsList: Event[];
responseEventId:string = '';
loadedEvent: Event;
eventItem: Observable<Event>;
constructor(
private alertCtrl: AlertController,
@Inject(LOCALE_ID) private locale: string,
private modalCtrl: ModalController,
private eventService: EventsService
private eventService: EventsService,
private router: Router
) {}
ngOnInit() {
//Inicializar segment
this.segment = "combinada";
this.createdEvent();
/* this.resetEvent(); */
}
/* resetEvent(){
this.event = {
title: '',
desc: '',
startTime: new Date().toDateString(),
endTime: new Date().toDateString(),
allDay: false
};
} */
//Go to the next view of the calendar month/week/day
next(){
this.myCal.slideNext();
@@ -80,172 +64,54 @@ export class AgendaPage implements OnInit {
this.viewTitle = title;
}
//Show information of the event
async onEventSelected(event){
//Using Angular date pipe for conversion
let start = formatDate(event.startTime, 'medium', this.locale);
let end = formatDate(event.endTime, 'medium', this.locale);
const alert = await this.alertCtrl.create({
header: event.title,
subHeader: event.desc,
message: 'From' + start + '<br><br>To:' + end,
buttons: ['OK'],
});
alert.present();
async onEventSelected(ev: { event: Event}){
console.log(ev.event.EventId);
this.router.navigate(["/home/events", ev.event.EventId]);
}
createRandomEvents(){
var events = [];
for(var i = 0; i < 50; i += 1 ){
var date = new Date();
var eventType = Math.floor(Math.random() * 2);
var startDay = Math.floor(Math.random() * 90) - 45;
var endDay = Math.floor(Math.random() * 2) + startDay;
var startTime;
var endTime;
if(eventType === 0){
startTime = new Date(
Date.UTC(
date.getUTCFullYear(),
date.getUTCMonth(),
date.getUTCDate() + startDay
)
);
if(endDay === startDay){
endDay += 1;
}
endTime = new Date(
Date.UTC(
date.getUTCFullYear(),
date.getUTCMonth(),
date.getUTCDate() + endDay
)
);
events.push({
title: 'Todo o dia - ' + i,
startTime: startTime,
endTime: endTime,
allDay: true,
});
} else {
var startMinute = Math.floor(Math.random() * 24 * 60);
var endMinute = Math.floor(Math.random()* 180) + startMinute;
startTime = new Date(
date.getFullYear(),
date.getMonth(),
date.getDate() + endDay,
0,
date.getMinutes() + startMinute
);
endTime = new Date(
date.getFullYear(),
date.getMonth(),
date.getDate() + endDay,
0,
date.getMinutes() + endMinute
);
events.push({
title: 'Evento - ' + i,
startTime: startTime,
endTime: endTime,
allDay: false
});
}
}
/* Here you might get your events from the API */
this.eventSource = events;
}
removeEvents(){
this.eventSource = [];
}
onTimeSelected(ev){
}
onRangeChanged (ev: { startTime: Date, endTime: Date }) {
this.loadRangeEvents(ev.startTime, ev.endTime);
};
async openCalModal() {
const modal = await this.modalCtrl.create({
component: CalModalPage,
cssClass: 'cal-modal',
backdropDismiss: false
});
await modal.present();
modal.onDidDismiss().then((result) => {
if (result.data && result.data.event) {
let event = result.data.event;
if (event.allDay) {
let start = event.startTime;
event.startTime = new Date(
Date.UTC(
start.getUTCFullYear(),
start.getUTCMonth(),
start.getUTCDate()
)
);
event.endTime = new Date(
Date.UTC(
start.getUTCFullYear(),
start.getUTCMonth(),
start.getUTCDate() + 1
)
);
}
/* Here you save the data entered */
this.eventSource.push(result.data.event);
/* Here you load the data saved */
this.myCal.loadEvents();
}
});
modal.onDidDismiss();
this.loading();
}
async createdEvent(){
var s = '01-01-1970 00:03:44';
var d = new Date(s);
console.log(d);
const defaultStartDate = new Date();
const test = parse('Fri Aug 21 2020 14:20:06 GMT+0100 (West Africa Standard Time)', 'd/M/yyyy HH:mm:ss', new Date());
console.log(test);
const defaultEndDate = new Date();
await this.eventService.getAllEvents("2020-01-01","2020-12-31").subscribe(
async loadRangeEvents(startTime: Date, endTime: Date){
this.eventService.getAllEvents(formatDate(startTime, 'yyyy-MM-dd HH:mm:ss', 'pt'), formatDate(endTime, 'yyyy-MM-dd HH:mm:ss', 'pt')).subscribe(
response => {
this.eventsList = response;
console.log(this.eventsList[0].EventId);
for(let i=0; i<this.eventsList.length; i++){
console.log(this.eventsList[i].EndDate);
/* 2020-08-14 23:59:59 */
let eventCopy = {
title: this.eventsList[i].Subject,
desc: 'Desc',
startTime: new Date(), /* this.eventsList[i].StartDate, */
endTime:new Date(), /* this.eventsList[i].EndDate, */
allDay: false
}
this.eventSource.push(eventCopy);
this.myCal.loadEvents();
console.log(eventCopy.startTime);
console.log(eventCopy.endTime);
}
this.eventsList.forEach(element => {
this.eventSource.push({
title: element.Subject,
startTime: new Date(element.StartDate),
endTime: new Date(element.EndDate),
allDay: false,
event: element
});
this.loading();
});
}
);
/* console.log(this.eventsList[0].Subject);
console.log(this.eventsList[0].StartDate);
console.log('Size'+this.eventsList.length); */
/* this.myCal.loadEvents(); */
}
loading(){
this.myCal.loadEvents();
}
refreshAgenda(event){
this.loading();
setTimeout(() => {
event.target.complete();
}, 2000);
}
}
@@ -34,6 +34,8 @@ export class EventDetailPage implements OnInit {
/* this.loadedEvent = this.eventsService.getEvent(eventId); */
this.eventItem = this.eventsService.getEvent(eventId);
/* console.log(this.eventItem); */
this.eventsService.getEvent(eventId).subscribe(response =>
{
this.loadedEvent = response;