mirror of
https://code.equilibrium.co.ao/ITO/doneit-web.git
synced 2026-04-19 21:06:06 +00:00
agenda change timeline
This commit is contained in:
Peter Maquiran
@@ -217,45 +217,40 @@
|
||||
<div class="timeline-container height-100 d-flex pt-10 pl-20 filter-{{segment}}" >
|
||||
|
||||
<div class="ss-timeline timeline-mobile flex-grow-1 pr-10 text-black height-100 width-100 overflow-y-auto" >
|
||||
<div class="timeline-date align-center" *ngIf="isSelectedDayHasEvent && hasEventToday">
|
||||
<!-- <div class="timeline-date align-center" *ngIf="isSelectedDayHasEvent && hasEventToday">
|
||||
<span >Hoje, </span> {{ timelineDate }}
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
<div *ngFor="let events of TimelineMDList | keyvalue; " >
|
||||
<div *ngFor="let events of TimelineMDList " >
|
||||
|
||||
<div class="EventListBox-container" >
|
||||
<div class="day " [class.dayShow]="isSelectedDayHasEvent && hasEventToday" >
|
||||
{{ TimelineDay(events.key)}} <div style="text-transform: capitalize; display: inline;">{{ viewTitle }}</div>
|
||||
</div>
|
||||
|
||||
<div *ngFor="let event of events.value" class="EventListBox mb-10" >
|
||||
<div class="EventListBox mb-10" >
|
||||
|
||||
<div class="d-flex content-{{event.profile}}-{{event.event.CalendarName}} mt-10 cursor-pointer width-100 " (click)="eventClicked(event)"
|
||||
*ngIf="viewEventMonth <= dateMonth(event) ">
|
||||
<div class=" content-{{events.profile}}-{{events.calendarName}} mt-10 cursor-pointer width-100 "
|
||||
(click)="eventClicked(events)" >
|
||||
|
||||
<div class="schedule-time" *ngIf="!event.event.IsAllDayEvent">
|
||||
<div class="schedule-time" >
|
||||
|
||||
<div *ngIf="event.startMany && !event.middle" class="time-start labelb">Início</div>
|
||||
<div *ngIf="event.endMany && !event.middle " class="time-end labelb">Fim</div>
|
||||
<div class="time-start">
|
||||
<ion-icon slot="start" src="assets/images/icons-calendar.svg"></ion-icon>
|
||||
{{ events.startTime | date: 'dd-MM-yyyy HH:mm' }}
|
||||
</div>
|
||||
<div class="time-end">
|
||||
<ion-icon slot="start" src="assets/images/icons-calendar.svg"></ion-icon>
|
||||
{{ events.endTime | date: 'dd-MM-yyyy HH:mm' }}
|
||||
</div>
|
||||
|
||||
<div *ngIf="!(event.endMany && !event.middle) && !event.middle" class="time-start">{{event.event.StartDate | date: 'HH:mm'}}</div>
|
||||
<div *ngIf="!(event.startMany && !event.middle) && !event.middle" class="time-end"> {{event.event.EndDate | date: 'HH:mm'}} </div>
|
||||
|
||||
<div *ngIf="event.middle" class="time-start"> Todo </div>
|
||||
<div *ngIf="event.middle" class="time-end text-center"> o dia </div>
|
||||
|
||||
</div>
|
||||
<div class="schedule-time" *ngIf="event.event.IsAllDayEvent">
|
||||
<div class="time-start">Todo </div>
|
||||
<div class="time-end text-center">o dia</div>
|
||||
</div>
|
||||
<div class="schedule-details">
|
||||
<div class="description">
|
||||
<p class="m-0">{{event.event.Subject}}</p>
|
||||
<div class="location">
|
||||
<ion-icon slot="start" src="assets/images/icons-location.svg"></ion-icon>
|
||||
{{events.event.Location}}
|
||||
</div>
|
||||
<div class="location">{{event.event.Location}}</div>
|
||||
<div class="font-13 calendar-owner"*ngIf="eventService.getCalendarOwnNameByCalendarId(event.event.CalendarId) == 'Meu calendario'">{{SessionStore.user.FullName}} </div>
|
||||
<ng-template #other_content>{{eventService.getCalendarOwnNameByCalendarId(event.event.CalendarId)}}</ng-template>
|
||||
<div class="description">
|
||||
<p class="m-0">{{events.event.Subject}}</p>
|
||||
</div>
|
||||
<!-- <div class="font-13 calendar-owner"*ngIf="eventService.getCalendarOwnNameByCalendarId(event.event.CalendarId) == 'Meu calendario'">{{SessionStore.user.FullName}} </div> -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -485,17 +485,16 @@ td.monthview-primary-with-event {
|
||||
}
|
||||
|
||||
|
||||
|
||||
.schedule-time{
|
||||
margin-right: 10px;
|
||||
min-width: 33px;
|
||||
min-width: 150px;
|
||||
.time-start{
|
||||
color: #797979 !important;
|
||||
color: black !important;
|
||||
font-family: Roboto;
|
||||
font-size: rem(13);
|
||||
}
|
||||
.time-end{
|
||||
color: #797979 !important;
|
||||
color: black !important;
|
||||
font-family: Roboto;
|
||||
font-size: rem(13);
|
||||
}
|
||||
@@ -1005,67 +1004,6 @@ $font-size: rem(15);
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
@media only screen and (min-width: 100px) {
|
||||
|
||||
.week-5 {
|
||||
.calendar-title-container {
|
||||
font-size: 14px;
|
||||
}
|
||||
.height-75 {
|
||||
height: 75px;
|
||||
}
|
||||
|
||||
.height-356 {
|
||||
height: 324px;
|
||||
}
|
||||
}
|
||||
|
||||
.week-6 {
|
||||
.calendar-title-container {
|
||||
font-size: 14px;
|
||||
}
|
||||
.height-75 {
|
||||
height: 75px;
|
||||
}
|
||||
|
||||
.height-356 {
|
||||
height: 360px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 500px) {
|
||||
.week-5 {
|
||||
.calendar-title-container {
|
||||
font-size: 16px;
|
||||
}
|
||||
.height-75 {
|
||||
height: 75px;
|
||||
}
|
||||
|
||||
.height-356 {
|
||||
height: 356px;
|
||||
}
|
||||
}
|
||||
|
||||
.week-6 {
|
||||
.calendar-title-container {
|
||||
font-size: 16px;
|
||||
}
|
||||
.height-75 {
|
||||
height: 75px;
|
||||
}
|
||||
|
||||
.height-356 {
|
||||
height: 395px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.calendar-conteiner-height {
|
||||
height: 100%;
|
||||
transition: 0.5s;
|
||||
|
||||
@@ -181,8 +181,7 @@ export class AgendaPage implements OnInit {
|
||||
private backgroundservice: BackgroundService,
|
||||
public ThemeService: ThemeService,
|
||||
public p: PermissionService,
|
||||
public RoleIdService: RoleIdService,
|
||||
private ContactsService: ContactsService
|
||||
public RoleIdService: RoleIdService
|
||||
) {
|
||||
|
||||
this.dateAdapter.setLocale('es');
|
||||
@@ -239,7 +238,7 @@ export class AgendaPage implements OnInit {
|
||||
this.reloadCalendar()
|
||||
}
|
||||
|
||||
|
||||
this.weekToShow()
|
||||
}
|
||||
|
||||
tigerUpdate() {
|
||||
@@ -291,7 +290,7 @@ export class AgendaPage implements OnInit {
|
||||
}, 1000)
|
||||
}
|
||||
|
||||
height = '75px'
|
||||
height = 'unset'
|
||||
|
||||
weekToShow() {
|
||||
|
||||
@@ -323,7 +322,6 @@ export class AgendaPage implements OnInit {
|
||||
}, 100)
|
||||
}
|
||||
}, 250)
|
||||
|
||||
}
|
||||
|
||||
setCalendarByDefault() {
|
||||
@@ -623,6 +621,7 @@ export class AgendaPage implements OnInit {
|
||||
this.CalendarStore.pushEvent(eventsList, label);
|
||||
|
||||
this.listToPresent = this.CalendarStore.getEventsByCalendarIds(selectedCalendarIds)
|
||||
this.updateEventListBox()
|
||||
|
||||
this.showTimelinePR = true;
|
||||
|
||||
@@ -703,160 +702,19 @@ export class AgendaPage implements OnInit {
|
||||
|
||||
}
|
||||
|
||||
// trasnformData(response, profile) {
|
||||
|
||||
// response.forEach(element => {
|
||||
// let event = {
|
||||
// startTime: new Date(element.StartDate),
|
||||
// endTime: new Date(element.EndDate),
|
||||
// allDay: false,
|
||||
// event: element,
|
||||
// calendarName: element.CalendarName,
|
||||
// profile: profile,
|
||||
// id: element.EventId,
|
||||
// }
|
||||
// this.array.push(event)
|
||||
// });
|
||||
// this.listToPresent = this.array;
|
||||
|
||||
// }
|
||||
|
||||
// //Deve ser removido para ficar só um method transform
|
||||
// trasnformDataDB(response) {
|
||||
|
||||
// if(response) {
|
||||
|
||||
// response.forEach(element => {
|
||||
// let event = {
|
||||
// startTime: new Date(element.StartDate),
|
||||
// endTime: new Date(element.EndDate),
|
||||
// allDay: false,
|
||||
// event: element,
|
||||
// calendarName: element.CalendarName,
|
||||
// profile: element.Profile,
|
||||
// id: element.EventId,
|
||||
// }
|
||||
// this.array.push(event)
|
||||
// });
|
||||
// this.listToPresent = this.array;
|
||||
|
||||
// }
|
||||
|
||||
// }
|
||||
|
||||
// addEventToDB(response, profile) {
|
||||
// if (this.platform.is('desktop') || this.platform.is('mobileweb')) {
|
||||
// let responseArray = [];
|
||||
// response.forEach(element => {
|
||||
// let event = {
|
||||
// CalendarId: element.CalendarId,
|
||||
// CalendarName: element.CalendarName,
|
||||
// EndDate: element.EndDate,
|
||||
// EventId: element.EventId,
|
||||
// HasAttachments: element.HasAttachments,
|
||||
// HumanDate: element.HumanDate,
|
||||
// IsAllDayEvent: element.IsAllDayEvent,
|
||||
// Location: element.Location,
|
||||
// StartDate: element.StartDate,
|
||||
// Subject: element.Subject,
|
||||
// Profile: profile
|
||||
// }
|
||||
// responseArray.push(event)
|
||||
|
||||
// });
|
||||
|
||||
// this.storage.set('agendaResponse',responseArray).then(() => {
|
||||
|
||||
// })
|
||||
// } else {
|
||||
// if (response.length > 0) {
|
||||
|
||||
// response.forEach(element => {
|
||||
// let event = {
|
||||
// CalendarId: element.CalendarId,
|
||||
// CalendarName: element.CalendarName,
|
||||
// EndDate: element.EndDate,
|
||||
// EventId: element.EventId,
|
||||
// HasAttachments: element.HasAttachments,
|
||||
// HumanDate: element.HumanDate,
|
||||
// IsAllDayEvent: element.IsAllDayEvent,
|
||||
// Location: element.Location,
|
||||
// StartDate: element.StartDate,
|
||||
// Subject: element.Subject,
|
||||
// Profile: profile
|
||||
// }
|
||||
// this.sqliteservice.addEvent(event)
|
||||
|
||||
// });
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
// getFromDB() {
|
||||
|
||||
// if (this.platform.is('desktop') || this.platform.is('mobileweb')) {
|
||||
// this.storage.get('agendaResponse').then((events) => {
|
||||
// this.trasnformDataDB(events)
|
||||
// this.updateEventListBox()
|
||||
|
||||
// this.myCal.update();
|
||||
// this.myCal.loadEvents();
|
||||
|
||||
// this.showLoader = false;
|
||||
// this.showTimeline = true;
|
||||
// })
|
||||
// } else {
|
||||
// this.sqliteservice.getAllEvents().then((events: any[] = []) => {
|
||||
|
||||
// let eventArray = [];
|
||||
|
||||
// this.trasnformDataDB(events)
|
||||
// this.updateEventListBox()
|
||||
|
||||
// this.myCal.update();
|
||||
// this.myCal.loadEvents();
|
||||
|
||||
// this.showLoader = false;
|
||||
// this.showTimeline = true;
|
||||
|
||||
|
||||
// })
|
||||
// }
|
||||
|
||||
// }
|
||||
|
||||
|
||||
// getEventsFromDB () {
|
||||
|
||||
// new Promise((resolve, reject) => {
|
||||
// if (this.platform.is('desktop') || this.platform.is('mobileweb')) {
|
||||
// this.storage.get('agendaResponse').then((events) => {
|
||||
// resolve(events)
|
||||
// })
|
||||
// } else {
|
||||
// this.sqliteservice.getAllEvents().then((events: any[] = []) => {
|
||||
// resolve(events)
|
||||
// })
|
||||
// }
|
||||
// }).catch ((error) => {
|
||||
// console.error(error);
|
||||
// });
|
||||
|
||||
// }
|
||||
|
||||
updateEventListBox() {
|
||||
|
||||
const selectedCalendarIds = this.getSelectedAgendaCalendars();
|
||||
this.listToPresent = this.CalendarStore.getEventsByCalendarIds(selectedCalendarIds)
|
||||
//this.listToPresent = this.CalendarStore.getEventsByCalendarIds(selectedCalendarIds);
|
||||
|
||||
this.TimelineMDList = this.listBoxService.list(this.listToPresent, 'md', this.rangeStartDate, this.rangeEndDate, { segment: this.segment, selectedDate: this.eventSelectedDate })
|
||||
|
||||
const selectedDay = momentG(this.eventSelectedDate, 'dd', 'pt');
|
||||
if(this.TimelineMDList[selectedDay]) {
|
||||
this.hasEventToday = true
|
||||
} else {
|
||||
this.hasEventToday = false
|
||||
}
|
||||
// const selectedDay = momentG(this.eventSelectedDate, 'dd', 'pt');
|
||||
// if(this.TimelineMDList[selectedDay]) {
|
||||
// this.hasEventToday = true
|
||||
// } else {
|
||||
// this.hasEventToday = false
|
||||
// }
|
||||
|
||||
|
||||
this.isSelectedDayHasEvent = momentG(new Date(), 'dd MMMM yyyy', 'pt') == momentG(this.eventSelectedDate, 'dd MMMM yyyy', 'pt');
|
||||
|
||||
Reference in New Issue
Block a user