Auto close modal for table

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

@@ -556,7 +556,7 @@ app-view-event{
   flex-direction: column;
 }
 
-app-edit-even{
+app-edit-event{
   display: flex;
   flex-direction: column;
   height: 100%;

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

@@ -147,6 +147,16 @@ export class AgendaPage implements OnInit {
         }
       }
     });
+
+
+    window.onresize = (event) => {
+      // if not table remove all component
+      if( window.innerWidth <= 1024){
+        console.log('mobile')
+        this.cloneAllmobileComponent();
+      }
+    };
+
   }
 
   //Go to the next view of the calendar month/week/day
@@ -211,8 +221,8 @@ export class AgendaPage implements OnInit {
   }
 
   onTimeSelected = (ev: { selectedTime: Date, events: any[] }) => {
-        console.log('Selected time: ' + ev.selectedTime + ', hasEvents: ' + (ev.events !== undefined && ev.events.length !== 0));
+    console.log('Selected time: ' + ev.selectedTime + ', hasEvents: ' + (ev.events !== undefined && ev.events.length !== 0));
-        this.eventSelectedDate2 = ev.selectedTime;
+    this.eventSelectedDate2 = ev.selectedTime;
   }; 
 
   onRangeChanged (ev: { startTime: Date, endTime: Date }) {

src/app/pages/agenda/approve-event-modal/approve-event-modal.page.ts

@@ -42,6 +42,13 @@ export class ApproveEventModalPage implements OnInit {
   ngOnInit() {
     this.getTask();
     this.getAttachments();
+
+    window.onresize = (event) => {
+      // if not mobile remove all component
+      if( window.innerWidth >= 1024){
+        this.modalController.dismiss(null);
+      }
+    };
   }
 
   notImplemented(){

src/app/pages/agenda/edit-event/edit-event.page.ts

@@ -49,6 +49,13 @@ export class EditEventPage implements OnInit {
     console.log(this.profile);
     console.log(this.postEvent);
 
+    window.onresize = (event) => {
+      // if not mobile remove all component
+      if( window.innerWidth >= 1024){
+        this.modalController.dismiss();
+      }
+    };
+    
   }
   close(){
     this.modalController.dismiss();

src/app/pages/agenda/new-event/new-event.page.ts

@@ -87,6 +87,15 @@ export class NewEventPage implements OnInit {
         HasAttachments: false,
       };
     }
+
+
+    window.onresize = (event) => {
+      // if not mobile remove all component
+      if( window.innerWidth >= 1024){
+        this.modalController.dismiss();
+      }
+    };
+
   }
   close(){
     this.modalController.dismiss();

src/app/pages/agenda/view-event/view-event.page.ts

@@ -56,6 +56,14 @@ export class ViewEventPage implements OnInit {
     this.loadEvent();
     this.getAttachments();
 
+
+    window.onresize = (event) => {
+      // if not mobile remove all component
+      if( window.innerWidth >= 1024){
+        this.modalController.dismiss(this.isEventEdited);
+      }
+    };
+    
   }
   close(){
     console.log(this.isEventEdited);

src/app/shared/agenda/edit-event/edit-event.component.html

@@ -1,4 +1,4 @@
-
+<ion-header  class="ion-no-border">
   <ion-toolbar class="header-toolbar">
     <div class="main-header">
       <div class="title-content">
@@ -8,12 +8,12 @@
       </div>
     </div>
   </ion-toolbar>
+</ion-header>
 
-
+<ion-content>
-
+  <div class="main-content">
-  <div class="main-content" >
     <div class="ion-item-container">
-      <ion-input class="text-black"  placeholder="Assunto" [(ngModel)]="postEvent.Subject"></ion-input>
+      <ion-input  placeholder="Assunto" [(ngModel)]="postEvent.Subject"></ion-input>
     </div>
     <div class="container-div">
       <div class="ion-item-class-2">
@@ -21,7 +21,7 @@
           <ion-icon slot="start" src="assets/images/icons-location.svg"></ion-icon>
         </div>
         <div class="ion-input-class">
-          <ion-input class="text-black" placeholder="Localização" [(ngModel)]="postEvent.Location"></ion-input>
+          <ion-input placeholder="Localização" [(ngModel)]="postEvent.Location"></ion-input>
         </div>
       </div>
       <!-- Error messages -->
@@ -39,7 +39,6 @@
         <div class="ion-input-class">
           <ion-select disabled  placeholder="Selecione agenda"
           selectedText="{{postEvent.CalendarName}}" 
-          class="text-black"
           [(ngModel)]="postEvent.CalendarName" 
           interface="action-sheet" Cancel-text="Cancelar" 
           required>
@@ -60,7 +59,6 @@
           [(ngModel)]="postEvent.Categories[0]"
           selectedText="{{postEvent.Categories[0]}}" 
           interface="action-sheet" 
-          class="text-black"
           Cancel-text="Cancelar" required>
             <ion-select-option value="Reunião">Reunião</ion-select-option>
             <ion-select-option value="Viagem">Viagem</ion-select-option>
@@ -85,7 +83,6 @@
             monthShortNames="Jan, Fev, Mar, Abr, Mai, Jun, Jul, Aug, Sep, Out, Nov, Dez"
             min="2018" 
             max="2022" 
-            class="text-black"
           >
           </ion-datetime>
           <!-- <ion-input placeholder="Data início" [(ngModel)]="postData.StartDate"></ion-input> -->
@@ -107,7 +104,6 @@
             monthShortNames="Jan, Fev, Mar, Abr, Mai, Jun, Jul, Aug, Sep, Out, Nov, Dez"
             min="2018" 
             max="2022" 
-            class="text-black"
           >
           </ion-datetime>
           <!-- <ion-input placeholder="Data fim" [(ngModel)]="postData.EndDate"></ion-input> -->
@@ -122,7 +118,6 @@
         </div>
         <div class="ion-input-class">
           <ion-select placeholder="Selecione repetição" 
-          class="text-black"
           [(ngModel)]="postEvent.IsRecurring"
           selectedText="{{isRecurring}}" 
           interface="action-sheet" 
@@ -212,10 +207,9 @@
       </ion-list>
     </div> 
   </div>    
-
+</ion-content>
-
+<ion-footer class="ion-no-border">
-
+  <ion-toolbar class="btn-div">
-  <ion-toolbar class="btn-div d-flex justofy-center">
     <ion-buttons slot="start">
       <ion-button class="btn-cancel" fill="clear" color="#061b52" (click)="close()">
         <ion-label>Cancelar</ion-label>
@@ -228,3 +222,4 @@
       </ion-button>
     </ion-buttons>
   </ion-toolbar>
+</ion-footer>