agenda change timeline

src/app/pages/agenda/agenda.page.html

@@ -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,&nbsp;</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  class="EventListBox mb-10"  >
+
+                    <div class=" content-{{events.profile}}-{{events.calendarName}} mt-10 cursor-pointer width-100 " 
+                      (click)="eventClicked(events)" >
+
+                      <div class="schedule-time" >
+
+                        <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 *ngFor="let event of events.value" 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="schedule-time" *ngIf="!event.event.IsAllDayEvent">
-
-                        <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 *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">
+                        <div class="location">
-                          <p class="m-0">{{event.event.Subject}}</p>
+                          <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="description">
-                        <div class="font-13 calendar-owner"*ngIf="eventService.getCalendarOwnNameByCalendarId(event.event.CalendarId) == 'Meu calendario'">{{SessionStore.user.FullName}} </div>
+                          <p class="m-0">{{events.event.Subject}}</p>
-                        <ng-template #other_content>{{eventService.getCalendarOwnNameByCalendarId(event.event.CalendarId)}}</ng-template>
+                        </div>
+                        <!-- <div class="font-13 calendar-owner"*ngIf="eventService.getCalendarOwnNameByCalendarId(event.event.CalendarId) == 'Meu calendario'">{{SessionStore.user.FullName}} </div> -->
                       </div>
                     </div>
 

src/app/pages/agenda/agenda.page.scss

@@ -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;

src/app/pages/agenda/agenda.page.ts

@@ -181,8 +181,7 @@ export class AgendaPage implements OnInit {
     private backgroundservice: BackgroundService,
     public ThemeService: ThemeService,
     public p: PermissionService,
-    public RoleIdService: RoleIdService,
+    public RoleIdService: RoleIdService
-    private ContactsService: ContactsService
   ) {
 
     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');
+    // const selectedDay = momentG(this.eventSelectedDate, 'dd', 'pt');
-    if(this.TimelineMDList[selectedDay]) {
+    // if(this.TimelineMDList[selectedDay]) {
-      this.hasEventToday = true
+    //   this.hasEventToday = true
-    } else {
+    // } else {
-      this.hasEventToday = false
+    //   this.hasEventToday = false
-    }
+    // }
 
 
     this.isSelectedDayHasEvent = momentG(new Date(), 'dd MMMM yyyy', 'pt') == momentG(this.eventSelectedDate, 'dd MMMM yyyy', 'pt');

src/app/services/agenda/list-box.service.ts

@@ -16,12 +16,16 @@ export class ListBoxService {
 		return eventSource.filter((e) => e.profile == profile)
 	}
 
-	getEventInsideRange(eventSource: EventListStore[], rangeStartDate, randEndDate) {
+	getEventInsideRange(eventSource: EventListStore[], rangeStartDate, randEndDate, selectedDate) {
 		return eventSource.filter((e)=> {
 			if(new Date(rangeStartDate).getTime() <= new Date(e.startTime).getTime() &&
 					new Date(randEndDate).getTime() >= new Date(e.endTime).getTime()) {
 				return true
+			} else if ( new Date(selectedDate).getMonth() == new Date(e.endTime).getMonth() || 
+				new Date(selectedDate).getMonth() == new Date(e.startTime).getMonth()) {
+				return true
 			}
+
 			return false
 		})
 	}
@@ -48,15 +52,13 @@ export class ListBoxService {
 			eventSource = this.filterSegment(eventSource, segment) 
 		}
 
+		eventSource = this.getEventInsideRange(eventSource, rangeStartDate, randEndDate, selectedDate)
+    
 		// if(profile != 'all') {
 		// 	eventSource = this.filterProfile(eventSource, profile)
 		// }
 
-    	let newStracture:CustomCalendarEvent[];
+		return eventSource
-
-		newStracture = this.encapsulation(eventSource);
-
-		return this.display(newStracture, selectedDate)
 	}
 
 	display(list: CustomCalendarEvent[], selectedDate) {

src/app/shared/gabinete-digital/despachos-pr/despachos-pr.page.scss

@@ -181,7 +181,7 @@ ion-item{
       /* font-size: rem(12); */
       float: right;
       padding: 2.5px 13.5px 2.5px 13.5px;
-      color: #fff;
+      color: black;
   }
   }
   .exp-date{

src/app/shared/gabinete-digital/despachos/despachos.page.scss

@@ -161,7 +161,7 @@ ion-item{
       /* font-size: 12px; */
       float: right;
       padding: 2.5px 13.5px 2.5px 13.5px;
-      color: #fff;
+      color: black;
   }
   }
   .exp-date{

src/global.scss

@@ -609,13 +609,13 @@ td.monthview-secondary-with-event, td.monthview-secondary-with-event[_ngcontent-
     tbody {
       tr {
         td {
-          padding: em(8) !important;
+          padding: rem(4) !important;
           div {
-            width: 30px !important;
+            width: rem(30)  !important;
-            height: 30px;
+            height: rem(30);
           }
           div.number {
-            font-size: em(18) !important;
+            font-size: rem(18) !important;
           }
         }
       }

version/git-version.ts

@@ -1,12 +1,12 @@
 export let versionData = {
-  "shortSHA": "ead20b5b4",
+  "shortSHA": "088ee19e5",
-  "SHA": "ead20b5b4eb7fbfa9d3f974b3ee3e8fe8697f99a",
+  "SHA": "088ee19e5ccf5ce4557d0c5e54a5bd8688239f6b",
   "branch": "developer-prod",
   "lastCommitAuthor": "'Peter Maquiran'",
-  "lastCommitTime": "'Mon Aug 28 17:32:11 2023 +0100'",
+  "lastCommitTime": "'Mon Aug 28 17:39:48 2023 +0100'",
-  "lastCommitMessage": "merge",
+  "lastCommitMessage": "add color black",
-  "lastCommitNumber": "5224",
+  "lastCommitNumber": "5225",
   "change": "",
-  "changeStatus": "On branch developer-prod\nChanges to be committed:\n  (use \"git restore --staged <file>...\" to unstage)\n\tmodified:   src/app/shared/gabinete-digital/all-processes/all-processes.page.scss\n\tmodified:   src/app/shared/gabinete-digital/diplomas/diplomas.page.scss\n\tmodified:   src/app/shared/gabinete-digital/generic/task-list/task-list.page.scss",
+  "changeStatus": "On branch developer-prod\nChanges to be committed:\n  (use \"git restore --staged <file>...\" to unstage)\n\tmodified:   src/app/pages/agenda/agenda.page.html\n\tmodified:   src/app/pages/agenda/agenda.page.scss\n\tmodified:   src/app/pages/agenda/agenda.page.ts\n\tmodified:   src/app/services/agenda/list-box.service.ts\n\tmodified:   src/app/shared/gabinete-digital/despachos-pr/despachos-pr.page.scss\n\tmodified:   src/app/shared/gabinete-digital/despachos/despachos.page.scss\n\tmodified:   src/global.scss",
   "changeAuthor": "peter.maquiran"
 }