EVOgeek
/
Vmeda.Online
1
0
Fork 1
Code Issues Pull Requests Packages Projects Releases Wiki Activity

MOBILE-3021 calendar: Open day when clicking any part of the cell

main
Albert Gasset 2019-08-06 14:07:42 +02:00
parent 39b9d1700d
commit 949467a11b
2 changed files with 9 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/addon/calendar/components/calendar/addon-calendar-calendar.html
View File

@ -38,8 +38,8 @@
<!-- Weeks. --> <!-- Weeks. -->
<ion-row *ngFor="let week of weeks" class="addon-calendar-week"> <ion-row *ngFor="let week of weeks" class="addon-calendar-week">
<ion-col *ngFor="let value of week.prepadding" class="dayblank addon-calendar-day"></ion-col> <!-- Empty slots (first week). --> <ion-col *ngFor="let value of week.prepadding" class="dayblank addon-calendar-day"></ion-col> <!-- Empty slots (first week). -->
<ion-col text-center *ngFor="let day of week.days" [ngClass]='{"hasevents": day.hasevents, "today": day.istoday, "weekend": day.isweekend, "duration_finish": day.haslastdayofevent}' class="addon-calendar-day"> <ion-col text-center *ngFor="let day of week.days" (click)="dayClicked(day.mday)" [ngClass]='{"hasevents": day.hasevents, "today": day.istoday, "weekend": day.isweekend, "duration_finish": day.haslastdayofevent}' class="addon-calendar-day">
<p class="addon-calendar-day-number" (click)="dayClicked(day.mday)">{{ day.mday }}</p> <p class="addon-calendar-day-number">{{ day.mday }}</p>
<!-- In phone, display some dots to indicate the type of events. --> <!-- In phone, display some dots to indicate the type of events. -->
<p class="hidden-tablet addon-calendar-dot-types"><span *ngFor="let type of day.calendareventtypes" class="calendar_event_type calendar_event_{{type}}"></span></p> <p class="hidden-tablet addon-calendar-dot-types"><span *ngFor="let type of day.calendareventtypes" class="calendar_event_type calendar_event_{{type}}"></span></p>
@ -47,7 +47,7 @@
<!-- In tablet, display list of events. --> <!-- In tablet, display list of events. -->
<div class="hidden-phone addon-calendar-day-events"> <div class="hidden-phone addon-calendar-day-events">
<ng-container *ngFor="let event of day.filteredEvents | slice:0:4; let index = index"> <ng-container *ngFor="let event of day.filteredEvents | slice:0:4; let index = index">
<p *ngIf="index < 3 || day.filteredEvents.length == 4" class="addon-calendar-event" (click)="eventClicked(event)"> <p *ngIf="index < 3 || day.filteredEvents.length == 4" class="addon-calendar-event" (click)="eventClicked(event, $event)">
<span class="calendar_event_type calendar_event_{{event.formattedType}}"></span> <span class="calendar_event_type calendar_event_{{event.formattedType}}"></span>
<ion-icon *ngIf="event.offline && !event.deleted" name="time"></ion-icon> <ion-icon *ngIf="event.offline && !event.deleted" name="time"></ion-icon>
<ion-icon *ngIf="event.deleted" name="trash"></ion-icon> <ion-icon *ngIf="event.deleted" name="trash"></ion-icon>
@ -56,7 +56,7 @@
<span class="addon-calendar-event-name">{{event.name}}</span> <span class="addon-calendar-event-name">{{event.name}}</span>
</p> </p>
</ng-container> </ng-container>
<p *ngIf="day.filteredEvents.length > 4" class="addon-calendar-day-more" (click)="dayClicked(day.mday)"><b>{{ 'core.nummore' | translate:{$a: day.filteredEvents.length - 3} }}</b></p> <p *ngIf="day.filteredEvents.length > 4" class="addon-calendar-day-more"><b>{{ 'core.nummore' | translate:{$a: day.filteredEvents.length - 3} }}</b></p>
</div> </div>
</ion-col> </ion-col>
<ion-col *ngFor="let value of week.postpadding" class="dayblank addon-calendar-day"></ion-col> <!-- Empty slots (last week). --> <ion-col *ngFor="let value of week.postpadding" class="dayblank addon-calendar-day"></ion-col> <!-- Empty slots (last week). -->

8
src/addon/calendar/components/calendar/calendar.ts
View File

@ -305,10 +305,12 @@ export class AddonCalendarCalendarComponent implements OnInit, OnChanges, OnDest
/** /**
* An event was clicked. * An event was clicked.
* *
* @param {any} event Event. * @param {any} calendarEvent Calendar event..
* @param {MouseEvent} event Mouse event.
*/ */
eventClicked(event: any): void { eventClicked(calendarEvent: any, event: MouseEvent): void {
this.onEventClicked.emit(event.id); this.onEventClicked.emit(calendarEvent.id);
event.stopPropagation();
} }
/** /**