external-events.component.ts 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158
  1. import { CustomDateFormatter } from './custom-date-formatter.provider';
  2. import { AuthServiceService } from './../../shared/auth-service.service';
  3. import { HttpClient } from '@angular/common/http';
  4. import {CalendarDateFormatter } from 'angular-calendar';
  5. import { Component, OnInit,
  6. ChangeDetectionStrategy,
  7. ViewChild,
  8. TemplateRef,
  9. Input} from '@angular/core';
  10. import { NgxSpinnerService } from 'ngx-spinner';
  11. import {
  12. startOfDay,
  13. endOfDay,
  14. subDays,
  15. addDays,
  16. endOfMonth,
  17. isSameDay,
  18. isSameMonth,
  19. addHours
  20. } from 'date-fns';
  21. import { Subject } from 'rxjs';
  22. import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
  23. import {
  24. CalendarEvent,
  25. CalendarEventAction,
  26. CalendarEventTimesChangedEvent,
  27. CalendarView
  28. } from 'angular-calendar';
  29. import { Router, NavigationExtras } from '@angular/router';
  30. const colors: any = {
  31. red: {
  32. primary: '#ad2121',
  33. secondary: '#FAE3E3'
  34. },
  35. blue: {
  36. primary: '#1e90ff',
  37. secondary: '#D1E8FF'
  38. },
  39. yellow: {
  40. primary: '#e3bc08',
  41. secondary: '#FDF1BA'
  42. }
  43. };
  44. @Component({
  45. selector: 'app-external-events',
  46. templateUrl: './external-events.component.html',
  47. styleUrls: ['./external-events.component.css'],
  48. providers: [
  49. {
  50. provide: CalendarDateFormatter,
  51. useClass: CustomDateFormatter
  52. }]
  53. })
  54. export class ExternalEventsComponent implements OnInit {
  55. events: CalendarEvent[] = [];
  56. refresh: Subject<any> = new Subject();
  57. dataLecture: any;
  58. showDetailsEvent:boolean = false;
  59. constructor(private modal: NgbModal,
  60. private http: HttpClient,
  61. private router: Router,
  62. private authSer: AuthServiceService,
  63. private spinner:NgxSpinnerService) {}
  64. ngOnInit() {
  65. //this.spinner.show();
  66. this.loadEvents();
  67. this.refresh.next();
  68. console.log('hfdfdsjkfhdsjkfhdkjfhsdkjfhskjfhsfkjfhkj',this.dataLecture);
  69. console.log("dddddddd"+new Date())
  70. }
  71. loadEvents(): void {
  72. this.http.get(this.authSer.pathApi + '/event_calendars_list').subscribe(
  73. (responce) => {
  74. this.dataLecture = responce['event_calendars'];
  75. for(let i=0; i< this.dataLecture.length; i++) {
  76. let event: any={};
  77. event['start'] = new Date(this.dataLecture[i].event_time);
  78. event['title'] = this.dataLecture[i].title;
  79. event['description'] = this.dataLecture[i].description;
  80. event['description_en'] = this.dataLecture[i].description_en;
  81. this.events.push(event);
  82. }
  83. console.log('eveeeeeeeeeeeeeeeeeeeeeeeeeeents', this.events);
  84. this.dayClicked({ date: new Date(), events: this.events });
  85. },
  86. (error) => {
  87. console.log(error);
  88. }
  89. )
  90. }
  91. @ViewChild('modalContent')
  92. modalContent: TemplateRef<any>;
  93. view: CalendarView = CalendarView.Month;
  94. CalendarView = CalendarView;
  95. viewDate: Date = new Date();
  96. modalData: {
  97. action: string;
  98. event: CalendarEvent;
  99. };
  100. activeDayIsOpen: boolean = true;
  101. dayClicked({ date, events }: { date: Date; events: CalendarEvent[] }): void {
  102. console.log(date)
  103. if (isSameMonth(date, this.viewDate)) {
  104. this.viewDate = date;
  105. if (
  106. (isSameDay(this.viewDate, date) && this.activeDayIsOpen === true) ||
  107. events.length === 0
  108. ) {
  109. this.activeDayIsOpen = false;
  110. } else {
  111. this.activeDayIsOpen = true;
  112. }
  113. }
  114. }
  115. handleEvent(ssss,event) {
  116. this.showDetailsEvent = true;
  117. console.log(ssss , event);
  118. this.dataLecture = event;
  119. localStorage.setItem('eventData', JSON.stringify(this.dataLecture));
  120. this.router.navigate(['ExternalPage/eventsDetails']);
  121. }
  122. closeDetailEvent() {
  123. this.showDetailsEvent = false;
  124. }
  125. }