Fixe merge

src/app/pages/gabinete-digital/event-list/approve-event-modal/approve-event-modal.page.html

@@ -1,11 +1,11 @@
 <ion-header class="ion-no-border">
-  <div class="header-content  mx-20 d-flex justify-start">
+  <div class="header-content  mx-20 d-flex justify-between">
     <div class="header-icon-left">
       <button class="btn-no-color" (click)="close()">
         <ion-icon src="assets/images/icons-arrow-arrow-left.svg"></ion-icon>
       </button>
     </div>
-    <div class="header-title flex-md-grow-1">
+    <div class="header-title flex-grow-1">
       <label>{{loadedEvent.workflowInstanceDataFields.Subject}}</label>
     </div>
     <div class="header-icon-right">
@@ -38,23 +38,24 @@
 </ion-menu>
 
 <ion-content id="main-content">
-  <div class="upper-content">
-    <div class="content-location">
-      <div class="location-detail">
+  <div class="upper-content d-flex width-100">
+    <div class="content-location d-flex justify-between width-100">
+      <div class="location-detail flex-grow-1">
         <ion-label >{{loadedEvent.workflowInstanceDataFields.Location}}</ion-label>
+        <div class="content-details">
+          <ion-label>
+            <p>1 {{customDate}}</p>
+            <p>2 das {{loadedEvent.workflowInstanceDataFields.StartDate | date: 'hh:mm'}} às {{loadedEvent.workflowInstanceDataFields.EndDate | date: 'hh:mm'}}</p>
+            <p *ngIf="!loadedEvent.workflowInstanceDataFields.IsRecurring">3 (Não se repete)</p>
+            <p *ngIf="loadedEvent.workflowInstanceDataFields.IsRecurring">4 Repete</p>
+          </ion-label>
+        </div>
       </div>
-      <div class="button-calendar-type">
+      <div class="button-calendar-type d-flex flex-grow-1 justify-end">
         <ion-button  class="button-calendar-type" slot="end">{{loadedEvent.workflowInstanceDataFields.Agenda}}</ion-button>
       </div>
     </div>
-    <div class="content-details">
-      <ion-label>
-        <p>{{customDate}}</p>
-        <p>das {{loadedEvent.workflowInstanceDataFields.StartDate | date: 'hh:mm'}} às {{loadedEvent.workflowInstanceDataFields.EndDate | date: 'hh:mm'}}</p>
-        <p *ngIf="!loadedEvent.workflowInstanceDataFields.IsRecurring">(Não se repete)</p>
-        <p *ngIf="loadedEvent.workflowInstanceDataFields.IsRecurring">Repete</p>
-      </ion-label>
-    </div>
+
   </div>
   <div class="middle-content">
     <div *ngIf="loadedEvent.workflowInstanceDataFields.Participants">

src/app/pages/gabinete-digital/event-list/approve-event-modal/approve-event-modal.page.scss

@@ -18,7 +18,6 @@ ion-menu{
   float: left;
 }
 .header-title{
-  width: 264px;
   font-family: Roboto;
   font-size: 25px;
   margin: 0 5px 0 5px;
@@ -33,19 +32,17 @@ ion-menu{
   overflow: auto;
 }
 .upper-content{
-  margin-left: 50px;
+  padding-left: 50px;
   overflow: auto;
   font-size: 18px;
 
   .content-location{
-    width: 360px;
     margin: 0 auto;
     padding: 0;
     overflow: auto;
   }
 
   .location-detail{
-    width: 210px;
     font-weight: 700;
     font-size: 18px;
     float: left;
@@ -79,7 +76,6 @@ ion-menu{
 }
 
 .bottom-content{
-  width: 360px;
   margin: 0 auto;
   
   .bottom-content h3{

src/app/pages/gabinete-digital/event-list/approve-event-modal/approve-event-modal.page.ts

@@ -38,14 +38,14 @@ export class ApproveEventModalPage implements OnInit {
     private activatedRoute: ActivatedRoute,
   ) {
     this.activatedRoute.paramMap.subscribe(paramMap =>
-      {
-        if (!paramMap.has("serialNumber")){
-          return;
-        }
-        else{
-          this.serialNumber = paramMap.get('serialNumber'); 
-        }
-      });
+    {
+      if (!paramMap.has("serialNumber")){
+        return;
+      }
+      else{
+        this.serialNumber = paramMap.get('serialNumber'); 
+      }
+    });
   }
 
   ngOnInit() {

src/app/pages/gabinete-digital/event-list/approve-event/approve-event.page.html

@@ -1,9 +1,9 @@
 <ion-header class="ion-no-border">
-  <div *ngIf="loadedEvent" class="header-content">
+  <div *ngIf="loadedEvent" class="header-content d-flex justify-between">
     <div class="header-icon-left">
       <ion-icon (click)="close()" src="assets/images/icons-arrow-arrow-left.svg"></ion-icon>
     </div>
-    <div class="header-title">
+    <div class="header-title flex-grow-1">
       <label>{{loadedEvent.workflowInstanceDataFields.Subject}}</label>
     </div>
     <div class="header-icon-right">
@@ -55,7 +55,7 @@
     </div>
   </div>
   <div class="line"></div>
-  <div class="middle-content" *ngIf="loadedEvent">
+  <div class="middle-content overflow-y-auto" *ngIf="loadedEvent">
     <h5>Intervenientes</h5>
     <ion-item>
       <ion-label>

src/app/pages/gabinete-digital/expediente/book-meeting-modal/book-meeting-modal.page.html

@@ -155,7 +155,7 @@
           </div>
         </div>
 
-        <div hidden class="ion-item-container-no-border">
+        <div class="ion-item-container-no-border">
           <ion-label>
             <div class="attach-icon">
               <ion-icon src="assets/images/icons-attach-doc.svg"></ion-icon>
@@ -166,19 +166,23 @@
           </ion-label>
         </div>
 
-        <div *ngIf="loadedAttachments">
-          <ion-item>
-            <ion-label>Documentos Anexados</ion-label>
-          </ion-item>
+        <div class="list "  *ngFor="let document of documents; let i = index" > 
           <ion-list>
-            <ion-item *ngFor="let attachment of loadedAttachments">
+            <ion-item>
             <ion-label>
-              <h4 class="attach-title-item">{{attachment.Description}}</h4>
-              <p><span class="span-left">{{attachment.Stakeholders}}</span><span class="span-right"> {{ attachment.CreateDate | date: 'dd/MM/yyyy' }}</span></p>
+              <p class="d-flex ion-justify-content-between"> 
+                <span class="attach-title-item">{{document.Assunto}}</span> 
+                <span class="app-name">{{document.appName}}</span> 
+                <span class="close-button text-black" (click)="removeAttachment(i)" >
+                  <ion-icon class="font-20" src="assets/images/icons-delete-25.svg"></ion-icon>
+                </span>
+              </p> 
+              <p><span class="span-left">{{document.EntidadeOrganicaNome}}</span><span class="span-right"> {{document.Data | date: 'dd-MM-yy'}} </span></p>
             </ion-label>
           </ion-item>
           </ion-list>
         </div>
+        
       </div>
       
     </div>

src/app/pages/gabinete-digital/expediente/book-meeting-modal/book-meeting-modal.page.scss

@@ -145,4 +145,65 @@
   justify-content: space-between;
   padding: 20px;
   overflow: auto;
+}
+
+
+ .attach-icon{
+      width: 37px;
+      font-size: 35px;
+      float: left;
+    }
+    .attach-title-item{
+      width: 100%;
+      font-size: 15px;
+      color:#0d89d1;
+    }
+    /* SPAN */
+    .span-left{
+      float: left;
+      font-size: 15x;
+    }
+    .span-right{
+    text-align: right;
+    float: right;
+    font-size: 13px;
+    }
+
+
+
+
+    
+
+  .app-name{
+    background: #42b9f2;
+    border-radius: 18px;
+    text-align: center;
+    display: flex;
+    align-items: center;
+    padding: 0px 5px;
+    color: white;
+    font-size: 9pt;
+    font-weight: 500;
+    height: 19px;
+    -webkit-border-radius: 18px;
+    -moz-border-radius: 18px;
+    -ms-border-radius: 18px;
+    -o-border-radius: 18px;
+  }
+  
+  
+.close-button {
+  display: none;
+}
+
+
+.list:hover {
+
+  .app-name {
+    display: none;
+  }
+
+  .close-button {
+    display: block !important;
+  }
 }

src/app/pages/gabinete-digital/expediente/book-meeting-modal/book-meeting-modal.page.ts

@@ -10,6 +10,8 @@ import { EventPerson } from 'src/app/models/eventperson.model';
 import { EventsService } from 'src/app/services/events.service';
 import { DiscartExpedientModalPage } from '../../discart-expedient-modal/discart-expedient-modal.page';
 import { AttachmentsService } from 'src/app/services/attachments.service';
+import { SearchPage } from 'src/app/pages/search/search.page';
+import { SearchDocument } from 'src/app/models/search-document';
 
 @Component({
   selector: 'app-book-meeting-modal',
@@ -26,6 +28,7 @@ export class BookMeetingModalPage implements OnInit {
   
   taskDocId:string;
   loadedAttachments:any;
+  documents:SearchDocument[] = [];
 
   adding: "intervenient" | "CC" = "intervenient";
 
@@ -220,6 +223,32 @@ export class BookMeetingModalPage implements OnInit {
 
     modal.onDidDismiss();
   }
+
+
+  async getDoc(){
+    const modal = await this.modalController.create({
+      component: SearchPage,
+      cssClass: 'modal-width-100-width-background modal',
+      componentProps: {
+        type: 'AccoesPresidenciais & ArquivoDespachoElect',
+        showSearchInput: true 
+      }
+    });
+    await modal.present();
+      modal.onDidDismiss().then((res)=> {
+        if(res){
+          const data = res.data;
+          this.documents.push(data.selected);
+        }
+    });
+  }
+
+  removeAttachment(index: number){
+
+    this.documents = this.documents.filter( (e, i) =>  index != i);
+
+  }
+
   
   validateFormInputs(){
     let formLocation = this.postData.Location.trim();

src/app/pages/gabinete-digital/expediente/expedient-task-modal/expedient-task-modal.page.html

@@ -89,8 +89,8 @@
         </div>
       </div>
 
-      <div hidden class="ion-item-container-no-border">
-        <ion-label>
+      <div class="ion-item-container-no-border" (click)="getDoc()">
+        <ion-label class="d-flex ">
           <div class="attach-icon">
             <ion-icon src="assets/images/icons-attach-doc.svg"></ion-icon>
           </div>
@@ -100,19 +100,23 @@
         </ion-label>
       </div>
 
-      <div *ngIf="loadedAttachments">
-        <ion-item>
-          <ion-label>Documentos Anexados</ion-label>
-        </ion-item>
+      <div class="list "  *ngFor="let document of documents; let i = index" > 
         <ion-list>
-          <ion-item *ngFor="let attachment of loadedAttachments">
+          <ion-item>
           <ion-label>
-            <h4 class="attach-title-item">{{attachment.Description}}</h4>
-            <p><span class="span-left">{{attachment.Stakeholders}}</span><span class="span-right"> {{ attachment.CreateDate | date: 'dd/MM/yyyy' }}</span></p>
+            <p class="d-flex ion-justify-content-between"> 
+              <span class="attach-title-item">{{document.Assunto}}</span> 
+              <span class="app-name">{{document.appName}}</span> 
+              <span class="close-button text-black" (click)="removeAttachment(i)" >
+                <ion-icon class="font-20" src="assets/images/icons-delete-25.svg"></ion-icon>
+              </span>
+            </p> 
+            <p><span class="span-left">{{document.EntidadeOrganicaNome}}</span><span class="span-right"> {{document.Data | date: 'dd-MM-yy'}} </span></p>
           </ion-label>
         </ion-item>
         </ion-list>
       </div>
+      
     </div>
 
     

src/app/pages/gabinete-digital/expediente/expedient-task-modal/expedient-task-modal.page.scss

@@ -125,4 +125,101 @@
   .aside-content{
     display: block;
   }
+}
+
+
+
+.attach-icon{
+  width: 37px;
+  font-size: 35px;
+  float: left;
+}
+.attach-title-item{
+  width: 100%;
+  font-size: 15px;
+  color:#0d89d1;
+}
+/* SPAN */
+.span-left{
+  float: left;
+  font-size: 15x;
+}
+.span-right{
+text-align: right;
+float: right;
+font-size: 13px;
+}
+
+
+
+
+.app-name{
+  background: #42b9f2;
+  border-radius: 18px;
+  text-align: center;
+  display: flex;
+  align-items: center;
+  padding: 0px 5px;
+  color: white;
+  font-size: 9pt;
+  font-weight: 500;
+  height: 19px;
+  -webkit-border-radius: 18px;
+  -moz-border-radius: 18px;
+  -ms-border-radius: 18px;
+  -o-border-radius: 18px;
+}
+
+
+.close-button {
+display: none;
+}
+
+
+.list:hover {
+
+.app-name {
+  display: none;
+}
+
+.close-button {
+  display: block !important;
+}
+}
+
+
+
+
+.app-name{
+  background: #42b9f2;
+  border-radius: 18px;
+  text-align: center;
+  display: flex;
+  align-items: center;
+  padding: 0px 5px;
+  color: white;
+  font-size: 9pt;
+  font-weight: 500;
+  height: 19px;
+  -webkit-border-radius: 18px;
+  -moz-border-radius: 18px;
+  -ms-border-radius: 18px;
+  -o-border-radius: 18px;
+}
+
+
+.close-button {
+display: none;
+}
+
+
+.list:hover {
+
+.app-name {
+  display: none;
+}
+
+.close-button {
+  display: block !important;
+}
 }

src/app/pages/gabinete-digital/expediente/expedient-task-modal/expedient-task-modal.page.ts

@@ -14,6 +14,10 @@ import { DiscartExpedientModalPage } from '../../discart-expedient-modal/discart
 import { AttachmentsService } from 'src/app/services/attachments.service';
 import { ExpedienteDetailPage } from '../expediente-detail/expediente-detail.page';
 import { AlertService } from 'src/app/services/alert.service';
+import { SearchPage } from 'src/app/pages/search/search.page';
+import { SearchDocument } from 'src/app/models/search-document';
+import { EventAttachment } from 'src/app/models/attachment.model';
+import { User } from 'src/app/models/user.model';
 
 @Component({
   selector: 'app-expedient-task-modal',
@@ -36,7 +40,10 @@ export class ExpedientTaskModalPage implements OnInit {
   taskDate: Date;
   taskDescription: string;
   user: string;
+  
   loadedAttachments:any;
+  documents:SearchDocument[] = [];
+
   subjectTypes:any;
 
   postData: Despacho;
@@ -53,6 +60,10 @@ export class ExpedientTaskModalPage implements OnInit {
   emptyTextDescription = "Sem intervenientes selecionados";
   showEmptyContainer = true;
 
+  taskResult: any = {}
+
+  loggeduser: User;
+
   constructor(
     private modalController: ModalController,
     private router:Router,
@@ -60,7 +71,12 @@ export class ExpedientTaskModalPage implements OnInit {
     private attachmentsService: AttachmentsService,
     private navParams: NavParams,
     private alertController: AlertService,
-    private authService: AuthService) {
+    private authService: AuthService,
+    private userAuth: AuthService) {
+
+
+      this.loggeduser = userAuth.ValidatedUser;
+
       this.user = environment.defaultuser +'@'+ environment.domain;
       this.task = this.navParams.get('task');
 
@@ -124,7 +140,8 @@ export class ExpedientTaskModalPage implements OnInit {
     this.modalController.dismiss(null);
     
   }
-  saveTask(){
+
+  async saveTask(){
 
     if(this.postData.Priority=='99999861'){
       this.dispatchFolder.DeadlineType = 'Normal';
@@ -140,6 +157,7 @@ export class ExpedientTaskModalPage implements OnInit {
     }
     
     let attendees = this.taskParticipants.concat(this.taskParticipantsCc);
+
     attendees = attendees.map(function(val) {
       return {
         UserEmail: val.EmailAddress,
@@ -147,6 +165,16 @@ export class ExpedientTaskModalPage implements OnInit {
       };
     })
 
+
+    const DocumentToSave = this.documents.map((e) => {
+      return {
+        ProcessInstanceID: '',
+        "Source": "webTRIX",
+        "UserId": this.loggeduser.UserId.toString(),
+        "Attachment": `${e.ApplicationType}@DOC@${e.Id}`
+      };
+    });
+
     if(this.taskParticipants.length > 0) {
       switch (this.taskType) {
         case '0':
@@ -158,9 +186,10 @@ export class ExpedientTaskModalPage implements OnInit {
             SubjectTypeId: this.postData.SubjectTypeId,
             UsersSelected: attendees,
             DispatchFolder: this.dispatchFolder,
+            AttachmentList: DocumentToSave
           }
           console.log('this.postData', this.postData, this.taskType);
-          this.processes.postDespatcho(this.postData);
+          this.taskResult = await this.processes.postDespatcho(this.postData);
           break;
         case '1':
           this.postData = {
@@ -171,9 +200,10 @@ export class ExpedientTaskModalPage implements OnInit {
             SubjectTypeId: this.postData.SubjectTypeId,
             UsersSelected: attendees,
             DispatchFolder: this.dispatchFolder,
+            AttachmentList: DocumentToSave
           }
           console.log(this.postData);
-          this.processes.postParecer(this.postData);
+          this.taskResult = await this.processes.postParecer(this.postData);
           break;
         case '2':
           this.postData = {
@@ -184,9 +214,10 @@ export class ExpedientTaskModalPage implements OnInit {
             SubjectTypeId: this.postData.SubjectTypeId,
             UsersSelected: attendees,
             DispatchFolder: this.dispatchFolder,
+            AttachmentList: DocumentToSave
           }
           console.log(this.postData);
-          this.processes.postDeferimento(this.postData);
+          this.taskResult = await this.processes.postDeferimento(this.postData);
           break;
       }
 
@@ -363,6 +394,28 @@ export class ExpedientTaskModalPage implements OnInit {
   }
 
 
+  async getDoc(){
+    const modal = await this.modalController.create({
+      component: SearchPage,
+      cssClass: 'modal-width-100-width-background modal',
+      componentProps: {
+        type: 'AccoesPresidenciais & ArquivoDespachoElect',
+        showSearchInput: true 
+      }
+    });
+    await modal.present();
+      modal.onDidDismiss().then((res)=>{
+        if(res){
+          const data = res.data;
+          this.documents.push(data.selected);
+        }
+    });
+  }
 
+  removeAttachment(index: number){
+
+    this.documents = this.documents.filter( (e, i) =>  index != i);
+
+  }
 
 }

src/app/pages/gabinete-digital/expediente/expediente-detail/expediente-detail.page.html

@@ -24,15 +24,15 @@
   </ion-header>
   <ion-content>
     <ion-list>
-      <ion-item (click)="openExpedientActionsModal('0',fulltask)">
+      <ion-item (click)="openExpedientActionsModal('0', fulltask)">
         <ion-icon name="documents" slot="start"></ion-icon>
         <ion-label>Efectuar Despacho</ion-label>
       </ion-item>
-      <ion-item (click)="openExpedientActionsModal('1',fulltask)">
+      <ion-item (click)="openExpedientActionsModal('1', fulltask)">
         <ion-icon name="arrow-undo" slot="start"></ion-icon>
         <ion-label>Pedido de Parecer</ion-label>
       </ion-item>
-      <ion-item (click)="openExpedientActionsModal('2',fulltask)">
+      <ion-item (click)="openExpedientActionsModal('2', fulltask)">
         <ion-icon name="arrow-redo" slot="start"></ion-icon>
         <ion-label>Pedido de Deferimento</ion-label>
       </ion-item>
@@ -58,10 +58,10 @@
 <ion-content>
   <div class="main-content d-flex height-100">
     <div class="content d-flex flex-column" *ngIf="task">
-      <div class="main-header">
-        <div class="title-content">
+      <div class="main-header" style="overflow: unset !important;">
+        <div class="title-content d-flex justify-between">
           <app-btn-modal-dismiss></app-btn-modal-dismiss>
-          <div class="middle">
+          <div class="middle flex-grow-1">
             <ion-label class="title">{{ task.Folio}}</ion-label>
           </div>
           <div class="div-icon">
@@ -71,7 +71,7 @@
           </div>
         </div>
       </div>
-      <div class="upper-content">
+      <div class="upper-content" style="overflow: unset !important;">
         <div class="content-details">
           <ion-label>
             <p><span class="date">{{customDate}}</span><span class="label">Expediente</span></p>
@@ -80,72 +80,75 @@
         </div>
       </div>
       <div class="line"></div>
-      <div class="middle-content">
-        <h5 *ngIf="intervenientes">Intervenientes</h5>
-        <ion-item class="ion-no-margin ion-no-padding">
-          <ion-label>
-            <div *ngFor="let interveniente of intervenientes">
-              <p>{{interveniente.Name}}</p>
-            </div>
-          </ion-label>
-        </ion-item>
-        <div *ngIf="cc.length > 0">
-          <h5>Com conhecimento</h5>
+
+      <div class="overflow-y-auto">
+        <div class="middle-content">
+          <h5 *ngIf="intervenientes">Intervenientes</h5>
           <ion-item class="ion-no-margin ion-no-padding">
             <ion-label>
-              <div *ngFor="let c of cc">
-                <p>{{c.Name}}</p>
+              <div *ngFor="let interveniente of intervenientes">
+                <p>{{interveniente.Name}}</p>
               </div>
             </ion-label>
           </ion-item>
-        </div>
-        <h5>Detalhes</h5>
-        <ion-item class="ion-no-margin ion-no-padding">
-            <p [innerHTML]="task.Note"></p>
-        </ion-item>
-      </div>
-      <div class="bottom-content width-100">
-        <ion-list>
-          <h5>Documentos Anexados</h5>
-          <ion-item class="ion-no-margin ion-no-padding">
-          <ion-label
-          (click)="viewDocument()">
-            <p class="attach-title-item">{{ task.Folio }}<span class="span-right color-red btn-size"><ion-icon hidden name="close"></ion-icon></span></p>
-            <p><span class="span-left">{{task.Remetente}}</span><span class="span-right">{{ task.CreateDate | date: 'dd/MM/yy' }}</span></p>
-          </ion-label>
-        </ion-item>
-        </ion-list>
-      </div>
-
-      <div *ngIf="eventsList">
-        <h3 class="h3-event-title">Eventos Associados</h3>
-        <ion-list>
-          <div *ngIf="eventsList">
-            <ion-item-sliding>
-              <ion-item 
-                class="Rectangle" lines="none" 
-                *ngFor="let event of eventsList"
-                (click)="viewEventDetail(event.EventId)"
-              >
-                  <!-- [routerLink]="['/home/events', event.EventId, 'events']" -->
-                  <div class="content-{{profile}}-{{event.CalendarName}}">
-                    <div class="approve-event-time">
-                      <p>{{event.StartDate | date: 'hh:mm'}}</p>
-                      <p>{{event.EndDate | date: 'hh:mm'}}</p>
-                    </div>
-                    <div class="approve-event-detail">
-                      <p *ngIf="event.StartDate != event.EndDate">{{event.StartDate | date: 'd/M/yy' }} - {{ event.EndDate | date: 'dd/mm/yy'}}  |  {{event.Location}}</p>
-                      <p *ngIf="event.StartDate == event.EndDate">{{event.StartDate | date: 'd/M/yy' }}  |  {{event.Location}}</p>
-                      <h3>{{event.Subject}}</h3>
-                    </div>
-                  </div>
-                </ion-item>
-            </ion-item-sliding>
+          <div *ngIf="cc.length > 0">
+            <h5>Com conhecimento</h5>
+            <ion-item class="ion-no-margin ion-no-padding">
+              <ion-label>
+                <div *ngFor="let c of cc">
+                  <p>{{c.Name}}</p>
+                </div>
+              </ion-label>
+            </ion-item>
           </div>
-        </ion-list>
+          <h5>Detalhes</h5>
+          <ion-item class="ion-no-margin ion-no-padding">
+              <p [innerHTML]="task.Note"></p>
+          </ion-item>
+        </div>
+        <div class="bottom-content width-100">
+          <ion-list>
+            <h5>Documentos Anexados</h5>
+            <ion-item class="ion-no-margin ion-no-padding">
+            <ion-label
+            (click)="viewDocument()">
+              <p class="attach-title-item">{{ task.Folio }}<span class="span-right color-red btn-size"><ion-icon hidden name="close"></ion-icon></span></p>
+              <p><span class="span-left">{{task.Remetente}}</span><span class="span-right">{{ task.CreateDate | date: 'dd/MM/yy' }}</span></p>
+            </ion-label>
+          </ion-item>
+          </ion-list>
+        </div>
+  
+        <div *ngIf="eventsList">
+          <h3 class="h3-event-title">Eventos Associados</h3>
+          <ion-list>
+            <div *ngIf="eventsList">
+              <ion-item-sliding>
+                <ion-item 
+                  class="Rectangle" lines="none" 
+                  *ngFor="let event of eventsList"
+                  (click)="viewEventDetail(event.EventId)"
+                >
+                    <!-- [routerLink]="['/home/events', event.EventId, 'events']" -->
+                    <div class="content-{{profile}}-{{event.CalendarName}} width-100 ">
+                      <div class="approve-event-time">
+                        <p>{{event.StartDate | date: 'hh:mm'}}</p>
+                        <p>{{event.EndDate | date: 'hh:mm'}}</p>
+                      </div>
+                      <div class="approve-event-detail">
+                        <p *ngIf="event.StartDate != event.EndDate">{{event.StartDate | date: 'd/M/yy' }} - {{ event.EndDate | date: 'dd/mm/yy'}}  |  {{event.Location}}</p>
+                        <p *ngIf="event.StartDate == event.EndDate">{{event.StartDate | date: 'd/M/yy' }}  |  {{event.Location}}</p>
+                        <h3>{{event.Subject}}</h3>
+                      </div>
+                    </div>
+                  </ion-item>
+              </ion-item-sliding>
+            </div>
+          </ion-list>
+        </div>
       </div>
-
     </div>
+
     <div class="aside-right flex-column height-100">
       <div class="buttons">
         <button (click)="openExpedientActionsModal('0',fulltask)" class="btn-ok" shape="round" >Efectuar Despacho</button>
@@ -201,6 +204,7 @@
         </ion-button>
       </ion-list>
     </div>
+
   </div>
 </ion-content>
 

src/app/pages/gabinete-digital/gabinete-digital.page.html

@@ -20,7 +20,7 @@
         </div>
         
         <div class="aside overflow-y-auto d-flex  flex-wrap width-100">
-          <div [class.active]="selectedElement == 'approval'" (click)="openEventsToApprovePage('MDGPR');selectedElement='approval'"  class="exp-card d-flex flex-column" >
+          <div [class.active]="selectedElementF('approval')" (click)="openEventsToApprovePage('MDGPR');selectedElement='approval'"  class="exp-card d-flex flex-column" >
             <div class="d-flex justify-center">
               <ion-icon  src="assets/images/icons-agenda.svg"></ion-icon>
             </div>
@@ -28,7 +28,7 @@
             <p class="text-center exp-card-content">{{count_ev_md+count_ev_pr}} <span class="title1">Documentos</span></p>
           </div>
 
-          <div [class.active]="selectedElement == 'Correspondence'" (click)="openExpedientListPage(); selectedElement='Correspondence'" class="exp-card d-flex flex-column justify-center" >
+          <div [class.active]="selectedElementF('Correspondence')" (click)="openExpedientListPage(); selectedElement='Correspondence'" class="exp-card d-flex flex-column justify-center" >
             <div class="d-flex justify-center">
               <ion-icon  src="assets/images/icons-correspondencia.svg"></ion-icon>
             </div>
@@ -36,7 +36,8 @@
             <p class="text-center exp-card-content">{{count_exp_dailywork}} <span class="title1">Documentos</span></p>
           </div>
 
-          <div  [class.active]="selectedElement == 'Pending'" (click)="openPendentesPage(); selectedElement='Pending'" class="exp-card d-flex flex-column justify-center" >
+          <!-- <div  [class.active]="selectedElement == 'Pending'" (click)="openPendentesPage(); selectedElement='Pending'" class="exp-card d-flex flex-column justify-center" > -->
+          <div  [class.active]="selectedElementF('Pending')" (click)="notImplemented()" class="exp-card d-flex flex-column justify-center" >
             <div class="d-flex justify-center">
               <ion-icon  src="assets/images/icons-expediente-pendente.svg"></ion-icon>
             </div>
@@ -45,7 +46,7 @@
             <p class="text-center exp-card-content"><span class="number">{{this.count_desp_pending + count_def_pending + count_par_pending}}</span> <span class="title1">Documentos</span></p>
           </div>
 
-          <div [class.active]="selectedElement == 'Dispatches'" class="exp-card d-flex flex-column justify-center" (click)="openDespachosPage(); selectedElement='Dispatches'">
+          <div [class.active]="selectedElementF('Dispatches') " class="exp-card d-flex flex-column justify-center" (click)="openDespachosPage(); selectedElement='Dispatches'">
             <div class="d-flex justify-center">
               <ion-icon  src="assets/images/icons-despachos-presidente.svg"></ion-icon>
             </div>
@@ -53,7 +54,7 @@
             <p class="text-center exp-card-content">{{count_desp_dailywork}}<span class="title1">Documentos</span> </p>
           </div>
 
-          <div [class.active]="selectedElement == 'RequestsForOpinion'" class="exp-card d-flex flex-column justify-center" (click)="openPedidosPage('parecer'); selectedElement='RequestsForOpinion'">
+          <div [class.active]="selectedElementF('RequestsForOpinion')" class="exp-card d-flex flex-column justify-center" (click)="openPedidosPage('parecer'); selectedElement='RequestsForOpinion'">
             <div class="d-flex justify-center">
               <ion-icon  src="assets/images/icons-expediente-parecer.svg"></ion-icon>
             </div>
@@ -61,14 +62,16 @@
             <p class="text-center exp-card-content">{{count_par_dailywork}} <span class="title1">Documentos</span></p>
           </div>
 
-          <div [class.active]="selectedElement == 'RequestForApproval'" class="exp-card d-flex flex-column justify-center" (click)="openPedidosPage('deferimento'); selectedElement = 'RequestForApproval'">
+          <div [class.active]="selectedElementF('RequestForApproval')" class="exp-card d-flex flex-column justify-center" (click)="openPedidosPage('deferimento'); selectedElement = 'RequestForApproval'">
             <div class="d-flex justify-center">
               <ion-icon  src="assets/images/icons-expediente-deferimento.svg"></ion-icon>
             </div>
             <p class="text-center exp-card-title ">Pedidos de Deferimento</p>
             <p class="text-center exp-card-content">{{count_def_dailywork}} <span class="title1">Documentos</span></p>
           </div>
-          <div [class.active]="selectedElement == '£££££££'" class="exp-card d-flex d-none flex-column justify-center" (click)="notImplemented()">
+
+          <!-- Desktop -->
+          <div [class.active]="selectedElementF('£££££££')" class="exp-card d-md-flex d-none flex-column justify-center" (click)="notImplemented()">
             <div class="d-flex justify-center">
               <ion-icon  src="assets/images/icons-expediente-presidente.svg"></ion-icon>
             </div>
@@ -76,7 +79,8 @@
             <p class="text-center exp-card-content"><span class="number">-</span> <span class="title1">Documentos</span></p>
           </div>
 
-          <div [class.active]="selectedElement == '£££££££'" class="exp-card d-flex d-none flex-column justify-center" (click)="notImplemented()">
+          <!-- Desktop -->
+          <div [class.active]="selectedElementF('£££££££')" class="exp-card d-md-flex d-none flex-column justify-center" (click)="notImplemented()">
             <div class="d-flex justify-center">
               <ion-icon  src="assets/images/icons-despachos-presidente.svg"></ion-icon>
             </div>
@@ -84,7 +88,8 @@
             <p class="text-center exp-card-content"><span class="number">-</span> <span class="title1">Documentos</span> </p>
           </div>
 
-          <div [class.active]="selectedElement == '£££££££'" class="exp-card-long justify-center width-100" (click)="notImplemented()">
+          <div [class.active]="selectedElementF('£££££££')" class="exp-card-long justify-center width-90 ma-0 my-5 background-white" (click)="notImplemented()"
+            style=" box-shadow: 0 0 10px 0 rgb(0 0 0 / 7%);">
             <div class="center-div">
               <div class="exp-card-icon">
                 <ion-icon  src="assets/images/icons-expediente-presidente.svg"></ion-icon>
@@ -96,7 +101,8 @@
             </div>
           </div>
 
-          <div [class.active]="selectedElement == '£££££££'" class="exp-card-long width-100" (click)="notImplemented()">
+          <div [class.active]="selectedElementF('£££££££')" class="exp-card-long width-90 ma-0 my-5 background-white" (click)="notImplemented()"
+            style="box-shadow: 0 0 10px 0 rgb(0 0 0 / 7%);">
             <div class="center-div">
               <div class="exp-card-icon">
                 <ion-icon  src="assets/images/icons-despachos-presidente.svg"></ion-icon>
@@ -108,7 +114,7 @@
             </div>
           </div>
 
-          <div [class.active]="selectedElement == '£££££££'" class="exp-card d-flex flex-column justify-center" (click)="notImplemented()">
+          <div [class.active]="selectedElementF('£££££££')" class="exp-card d-flex flex-column justify-center" (click)="notImplemented()">
             <div class="d-flex justify-center">
               <ion-icon  src="assets/images/icons-expediente-diploma.svg"></ion-icon>
             </div>
@@ -116,7 +122,7 @@
             <p class="text-center exp-card-content"><span class="number">-</span> <span class="title1">Documentos</span> </p>
           </div>
 
-          <div [class.active]="selectedElement == '£££££££'" class="exp-card d-flex flex-column justify-center" (click)="notImplemented()">
+          <div [class.active]="selectedElementF('£££££££')" class="exp-card d-flex flex-column justify-center" (click)="notImplemented()">
             <div class="d-flex justify-center">
               <ion-icon  src="assets/images/icons-diplomas-assinados-presidente.svg"></ion-icon>
             </div>

src/app/pages/gabinete-digital/gabinete-digital.page.ts

@@ -289,4 +289,11 @@ export class GabineteDigitalPage implements OnInit {
 
   }
 
+  selectedElementF(element:string) {
+    if (window.innerWidth >= 800) {
+      return element ==  this.selectedElement
+    }
+    return false;
+  }
+
 }