add new features

src/app/app-routing.module.ts

@@ -265,9 +265,17 @@ const routes = [
   {
     path: 'chat-options-popover',
     loadChildren:() => import('./shared/popover/chat-options-popover/chat-options-popover.module').then( m => m.ChatOptionsPopoverPageModule)
+  },
+  {
+    path: 'task-listt-header',
+    loadChildren: () => import('./shared/gabinete-digital/generic/task-listt-header/task-listt-header.module').then( m => m.TaskListtHeaderPageModule)
+  },
+  {
+    path: 'task-list-header',
     loadChildren: () => import('./shared/gabinete-digital/generic/task-list-header/task-list-header.module').then( m => m.TaskListHeaderPageModule)
   }
 
+
 
  /*
     path: 'chat',

src/app/pages/gabinete-digital/despachos-pr/despachos-pr.module.ts

@@ -23,6 +23,9 @@ import { ReactiveFormsModule } from '@angular/forms';
 import { MatButtonModule } from '@angular/material/button';
 import { MatSelectModule } from '@angular/material/select';
 import { NgxMatMomentModule } from '@angular-material-components/moment-adapter';
+import { TaskListPageModule } from 'src/app/shared/gabinete-digital/generic/task-list/task-list.module'
+import { TaskListHeaderPageModule } from 'src/app/shared/gabinete-digital/generic/task-list-header/task-list-header.module';
+
 
 @NgModule({
   imports: [
@@ -32,6 +35,8 @@ import { NgxMatMomentModule } from '@angular-material-components/moment-adapter'
 
     DespachosPrPageRoutingModule,
     BtnModalDismissPageModule,
+    TaskListPageModule,
+    TaskListHeaderPageModule,
     //
     MatInputModule,
     MatNativeDateModule,

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

@@ -1,63 +1,14 @@
-<ion-header class="ion-no-border">
-  <!-- <app-header > </app-header> -->
-</ion-header>
-
 <ion-header class="ion-no-border header-2">
-  <div class="main-header">
+  <app-task-list-header
-    <app-btn-modal-dismiss (click)="goBack()" ></app-btn-modal-dismiss>
+    [goBackButton] = true
-    <div class="thetitle">
+    [headerName] = environment.dispatchPR
-      <ion-label  >{{environment.dispatchPR }}</ion-label>
+    [ordinance] = ordinance
-    </div>
+    [loading] = skeletonLoader
-    <div class="theicon btn-refresh d-flex align-center">
+    [loaderTop] = true
-
+    (reorderList) = reorderList($event)
-      <div class="d-flex" (click)="reorderList('old')" *ngIf="ordinance == 'recent' ">
+    (changeFilterName) = changeFilterName($event)
-
+    (goBack) = goBack()
-        <ion-icon  class="mr-10"  src="assets/images/theme/gov/crescente.svg" ></ion-icon>
+  ></app-task-list-header>
-      </div>
-
-      <div class="d-flex" (click)="reorderList('recent')" *ngIf="ordinance != 'recent' ">
-        <ion-icon  class="mr-10"  src="assets/images/theme/gov/decrescente.svg" ></ion-icon>
-      </div>
-
-      <mat-form-field class="task-filter-input" appearance="none"   color="ion-color-secondary"  placeholder="Selecione agenda">
-        <mat-select [(value)]="filterName">
-
-          <mat-option value="Para hoje" >
-            Para hoje
-          </mat-option>
-
-          <mat-option value="Novos" >
-            Novos
-          </mat-option>
-
-          <mat-option value="Lidos" >
-            Lidos
-          </mat-option>
-
-          <mat-option value="Não lidos" >
-            Não lidos
-          </mat-option>
-
-
-          <mat-option value="OverdueTasks">
-            Em atraso
-          </mat-option>
-
-          <mat-option value="Todos" >
-            Todos
-          </mat-option>
-
-          
-        </mat-select>
-      </mat-form-field>
-      <button class="btn-no-color" (click)="doRefresh($event)">
-        <ion-icon slot="end" class="title-icon font-awesome" name="reload-circle"></ion-icon>
-      </button>
-    </div>
-  </div>
-  <!-- <div *ngIf="SessionStore.user.Profile =='MDGPR'" class="bottom-title d-flex">
-    <h3 class="bottom-text">Presidente da República</h3>
-  </div> -->
 </ion-header>
 <ion-content>
   <ion-refresher name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
@@ -69,82 +20,13 @@
       </ion-refresher-content>
   </ion-refresher>
 
-    <div  class="main-content width-100 overflow-y-auto height-100">
+  <app-task-list
-      <ion-progress-bar type="indeterminate" *ngIf="skeletonLoader"></ion-progress-bar>
+    [taskList] = list
-
+    [skeletonLoader] = skeletonLoader
-      <div >
+    (viewTaskDetail)="goToDespachoPr($event)"
-        <ion-list>
+    [filterName]="filterName"
-          <div
-            class="ion-no-padding ion-no-margin cursor-pointer"  
-            *ngFor = "let task of list; let i = index"
-            (click)="goToDespachoPr(task.SerialNumber)"
   >
-            <!--  [routerLink]="['/home/gabinete-digital/expediente',task.SerialNumber]" -->
+  </app-task-list>
-            <div class="item width-100 expediente" *ngIf="TaskService.filter(task, filterName)">
-              <div class="exp-top-detail">
-                <div class="subject d-flex align-center">
-                  <ion-label [class.gb-seen]="TaskService.seen(task)">{{ task.Folio }}</ion-label>
-                  <span class="dead-line ml-10" *ngIf="TaskService.deadlineIsToday(task.Deadline)">Para hoje</span>
-                  <span class="new-task ml-10" *ngIf="TaskService.lessThen24Hours(task.TaskReceiveDate)">Nova</span>
-                </div>
-                <div class="exp-icon">
-                  <ion-icon *ngIf="ThemeService.currentTheme == 'default' " src="assets/images/icons-expediente-attachment.svg"></ion-icon>
-                  <ion-icon *ngIf="ThemeService.currentTheme == 'gov' " src="assets/images/theme/gov/icons-expediente-attachment.svg"></ion-icon>
-                  <label *ngIf="task.DocumentsQty != 0">{{task.DocumentsQty}}</label>
-                </div>
-              </div>
-              <div class="exp-bottom-detail">
-                <div class="exp-remetente">
-                  <ion-label>{{task.Senders}}</ion-label>
-                </div>
-              </div>
-              <div class="exp-middle-detail">
-                <div class="exp-workflow">
-                  <span class="label">{{task.activityInstanceName}}</span>
-                </div>
-                <div class="exp-date">
-                  <ion-label>{{ task.CreateDate | date: 'dd-MM-yyyy HH:mm' }}</ion-label>
-                </div>
-              </div>
-            </div>
-          </div>
-        </ion-list>
-
-      </div>
-
-      <div 
-        *ngIf="!skeletonLoader && despachoprstore.list.length == 0" 
-        class="empty-list d-flex height-100 align-center justify-content-center"
-      >
-        <span>Lista vazia</span>
-      </div>
-
-      <!-- <div *ngIf="skeletonLoader && despachoprstore.list.length == 0">
-        <ion-list>
-          <ion-item>
-            <ion-thumbnail slot="end">
-              <ion-skeleton-text animated></ion-skeleton-text>
-            </ion-thumbnail>
-            <ion-label>
-              <h3><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></h3>
-              <p><ion-skeleton-text animated style="width: 80%"></ion-skeleton-text></p>
-              <p><ion-skeleton-text animated style="width: 60%"></ion-skeleton-text></p>
-            </ion-label>
-          </ion-item>
-          <ion-item>
-            <ion-thumbnail slot="end">
-              <ion-skeleton-text animated></ion-skeleton-text>
-            </ion-thumbnail>
-            <ion-label>
-              <h3><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></h3>
-              <p><ion-skeleton-text animated style="width: 80%"></ion-skeleton-text></p>
-              <p><ion-skeleton-text animated style="width: 60%"></ion-skeleton-text></p>
-            </ion-label>
-          </ion-item>
-        </ion-list>
-      </div> -->
-
-    </div>
 
 </ion-content>
 

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

@@ -6,11 +6,12 @@
 .header-2 {
   border-top-right-radius: 24px;
   border-top-left-radius: 24px;
+  background-color: white;
 }
 
-ion-content, .header-2, .main-content{
+ion-content, .main-content{
-  padding: 30px 20px 0 20px !important;
   background-color: white;
+  padding: 30px 20px 0 20px !important;
 }
 .main-content {
   padding-top: 0px !important;

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

@@ -115,6 +115,10 @@ export class DespachosPrPage implements OnInit {
     this.dynamicSearch();
   }
 
+  changeFilterName(filterName) {
+    this.filterName = filterName
+  }
+
   async dynamicSearch() {
 
     if(this.showSearch && this.searchSubject) {
@@ -138,8 +142,8 @@ export class DespachosPrPage implements OnInit {
     this.LoadList();
   }
 
-  goToDespachoPr(serialNumber: any) {
+  goToDespachoPr({SerialNumber}) {
-    this.router.navigate(['/home/gabinete-digital/despachos-pr', serialNumber, 'gabinete-digital']);
+    this.router.navigate(['/home/gabinete-digital/despachos-pr', SerialNumber, 'gabinete-digital']);
   }
 
   notImplemented() {

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

@@ -1,9 +1,9 @@
 <ion-content class="container-wrapper">
   <div class="main-content d-flex height-100 overflow-hidden">
-    <div class="content d-flex flex-column" *ngIf="task">
+    <div class="content d-flex align-center flex-column" *ngIf="task">
       <div class="main-header">
-        <div class="title-content width-100 d-flex justify-space-between">
+        <div class="title-content width-100 d-flex align-center justify-space-between">
-          <div class="font-30 cursor-pointer" (click)="goBack()" defaultHref="#">
+          <div class="font-30 cursor-pointer d-flex align-center" (click)="goBack()" defaultHref="#">
             <ion-icon  *ngIf="ThemeService.currentTheme == 'default' " slot="end" src='assets/images/icons-arrow-arrow-left.svg'></ion-icon>
             <ion-icon *ngIf="ThemeService.currentTheme == 'doneIt' " src="assets/images/theme/doneIt/icons-calendar-arrow-left.svg"></ion-icon>
             <ion-icon *ngIf="ThemeService.currentTheme == 'gov' " slot="end" src='assets/images/theme/gov/icons-calendar-arrow-left.svg'></ion-icon>

src/app/pages/gabinete-digital/diplomas/diplomas.module.ts

@@ -23,6 +23,7 @@ import { ReactiveFormsModule } from '@angular/forms';
 import { MatButtonModule } from '@angular/material/button';
 import { MatSelectModule } from '@angular/material/select';
 import { NgxMatMomentModule } from '@angular-material-components/moment-adapter';
+import { TaskListHeaderPageModule } from 'src/app/shared/gabinete-digital/generic/task-list-header/task-list-header.module';
 
 
 @NgModule({
@@ -32,6 +33,7 @@ import { NgxMatMomentModule } from '@angular-material-components/moment-adapter'
     IonicModule,
     DiplomasPageRoutingModule,
     BtnModalDismissPageModule,
+    TaskListHeaderPageModule,
     //
     MatInputModule,
     MatNativeDateModule,

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

@@ -2,90 +2,18 @@
   <ion-refresher name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
     <ion-refresher-content></ion-refresher-content>
   </ion-refresher>
-  <div class="title">
-    <app-btn-modal-dismiss (click)="goBack()" ></app-btn-modal-dismiss>
-    <div class="thetitle"><ion-label >Diplomas</ion-label></div>
-    <div class="theicon d-flex align-center">
-      <!-- <div>
-        <div title="Pesquisa" *ngIf="!hideSearchBtn" class="mr-20 d-flex align-center cursor-pointer">
-          <div (click)="openSearch();showSearch=true" *ngIf="!showSearch" class="d-flex">
-            <ion-icon title="Perfil" *ngIf="ThemeService.currentTheme == 'doneIt' " class="font-35" src="assets/images/theme/doneIt/icons-search.svg"></ion-icon>
-            <ion-icon title="Perfil" *ngIf="ThemeService.currentTheme == 'default' " class="font-35" src='assets/images/icons-search.svg'></ion-icon>
-            <ion-icon title="Perfil" *ngIf="ThemeService.currentTheme == 'gov' " class="font-35" src='assets/images/theme/gov/icons-search.svg'></ion-icon>
-          </div>
-          <button title="Fechar" class="btn-no-color d-flex" (click)="closeSearch();showSearch=false;searchSubject=''" *ngIf="showSearch">
-            <ion-icon *ngIf="ThemeService.currentTheme == 'default' || ThemeService.currentTheme == 'doneIt' " class="font-35" name="restaurant-outline" src="assets/images/icons-search-close.svg"></ion-icon>
-            <ion-icon *ngIf="ThemeService.currentTheme == 'gov' " class="font-35" name="restaurant-outline" src="assets/images/theme/gov/icons-search-close.svg"></ion-icon>
-          </button>
 
-          <div *ngIf="showSearch">
+  <app-task-list-header
-            <div class="d-flex search-input-container ml-10 justify-between" *ngIf="showSearch">
+    [goBackButton] = true
+    [headerName] = "headerName"
+    [ordinance] = ordinance
+    [loading] = skeletonLoader
+    [loaderTop] = true
+    (reorderList) = reorderList($event)
+    (changeFilterName) = changeFilterName($event)
+    (goBack) = goBack()
+  ></app-task-list-header>
 
-              <div class="input-text d-flex ion-align-items-center">
-                <ion-input (keyup.enter)="basicSearch()" [(ngModel)]='searchSubject' (ngModelChange)="dynamicSearch()"
-                  class="search-input text-black" type="search" placeholder="Pesquisar"></ion-input>
-              </div>
-              
-
-              <div (click)="basicSearch()"  class="d-flex align-center icon">
-
-                <ion-icon  class="icon-z" slot="end" src="assets/images/theme/gov/search.svg"></ion-icon>
-    
-              </div>
-            </div>
-          </div>
-        </div>
-      </div> -->
-
-      <div>
-        <div class="d-flex" (click)="reorderList('old')" *ngIf="ordinance == 'recent' ">
-
-          <ion-icon  class="mr-10"  src="assets/images/theme/gov/crescente.svg" ></ion-icon>
-        </div>
-  
-        <div class="d-flex" (click)="reorderList('recent')" *ngIf="ordinance != 'recent' ">
-          <ion-icon  class="mr-10"  src="assets/images/theme/gov/decrescente.svg" ></ion-icon>
-        </div>
-      </div>
-      
-      <div>
-        <mat-form-field class="task-filter-input" appearance="none"   color="ion-color-secondary"  placeholder="Selecione agenda">
-          <mat-select [(value)]="filterName">
-  
-            <mat-option value="Para hoje" >
-              Para hoje
-            </mat-option>
-  
-            <mat-option value="Novos" >
-              Novos
-            </mat-option>
-  
-            <mat-option value="Lidos" >
-              Lidos
-            </mat-option>
-  
-            <mat-option value="Não lidos" >
-              Não lidos
-            </mat-option>
-  
-  
-            <mat-option value="OverdueTasks">
-              Em atraso
-            </mat-option>
-  
-            <mat-option value="Todos" >
-              Todos
-            </mat-option>
-  
-  
-          </mat-select>
-        </mat-form-field>
-      </div>
-      <!-- <button title="Atualizar" class="btn-no-color" (click)="doRefresh($event)">
-        <ion-icon slot="end" class="title-icon font-awesome" name="reload-circle"></ion-icon>
-      </button> -->
-    </div>
-  </div>
   <ion-toolbar>
     <ion-segment [(ngModel)]="segment" (ionChange)="segmentChanged($event)">
       <ion-segment-button value="validar" *ngIf="p.userPermission([p.permissionList.Gabinete.md_tasks])">
@@ -116,7 +44,7 @@
             (click)="goToDiploma(task.SerialNumber)"
             lines="none"
             >
-            <div class="item width-100 expediente">
+            <div class="item width-100 expediente" *ngIf="TaskService.filter(task, filterName)">
               <div class="exp-top-detail">
                 <div class="subject d-flex align-center">
                   <ion-label [class.gb-seen]="TaskService.seen(task)">{{ task.Folio }}</ion-label>
@@ -183,12 +111,12 @@
       <ion-list *ngSwitchCase="'assinados'">
         <div *ngIf="listDiplomasAssinadosPR.length >= 1">
           <ion-item 
-          class="expediente ion-no-padding cursor-pointer"
+          class=" ion-no-padding cursor-pointer"
           *ngFor = "let task of listDiplomasAssinadosPR"
           (click)="goToDiploma(task.SerialNumber)"
           lines="none"
         >
-        <div class="item width-100">
+        <div class="item width-100 expediente" *ngIf="TaskService.filter(task, filterName)">
           <div class="exp-top-detail">
             <div class="subject d-flex">
               <ion-label [class.gb-seen]="TaskService.seen(task)">{{ task.Folio }}</ion-label>

src/app/pages/gabinete-digital/diplomas/diplomas.page.scss

@@ -7,9 +7,10 @@
   .header-2 {
     border-top-right-radius: 24px;
     border-top-left-radius: 24px;
+    background-color: white;
   }
   
-  ion-content, .header-2, .main-content{
+  ion-content, .main-content{
     padding: 30px 20px 0 20px !important;
     background-color: white;
   }

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

@@ -21,6 +21,7 @@ export class DiplomasPage implements OnInit, OnDestroy {
   showLoader: boolean;
   totalDocs: any;
   serialNumber: string;
+  headerName = "Diplomas"
 
   segment: string;
 
@@ -114,6 +115,10 @@ export class DiplomasPage implements OnInit, OnDestroy {
     this.dynamicSearch();
   }
 
+  changeFilterName(filterName) {
+    this.filterName = filterName
+  }
+
   async dynamicSearch() {
 
     if(this.showSearch && this.searchSubject) {

src/app/pages/gabinete-digital/expediente/expediente.module.ts

@@ -21,6 +21,8 @@ import { ReactiveFormsModule } from '@angular/forms';
 import { MatButtonModule } from '@angular/material/button';
 import { MatSelectModule } from '@angular/material/select';
 import { NgxMatMomentModule } from '@angular-material-components/moment-adapter';
+import { TaskListPageModule } from 'src/app/shared/gabinete-digital/generic/task-list/task-list.module'
+
 
 
 @NgModule({
@@ -28,6 +30,7 @@ import { NgxMatMomentModule } from '@angular-material-components/moment-adapter'
     CommonModule,
     FormsModule,
     IonicModule,
+    TaskListPageModule,
     //
     MatInputModule,
     MatNativeDateModule,

src/app/pages/gabinete-digital/expedientes-pr/expedientes-pr.module.ts

@@ -8,6 +8,7 @@ import { ExpedientesPrPageRoutingModule } from './expedientes-pr-routing.module'
 
 import { ExpedientesPrPage } from './expedientes-pr.page';
 import { BtnModalDismissPageModule } from 'src/app/shared/btn-modal-dismiss/btn-modal-dismiss.module';
+import { TaskListPageModule } from 'src/app/shared/gabinete-digital/generic/task-list/task-list.module'
 
 
 import { MatInputModule } from '@angular/material/input';
@@ -23,6 +24,7 @@ import { ReactiveFormsModule } from '@angular/forms';
 import { MatButtonModule } from '@angular/material/button';
 import { MatSelectModule } from '@angular/material/select';
 import { NgxMatMomentModule } from '@angular-material-components/moment-adapter';
+import { TaskListHeaderPageModule } from 'src/app/shared/gabinete-digital/generic/task-list-header/task-list-header.module';
 
 @NgModule({
   imports: [
@@ -31,6 +33,8 @@ import { NgxMatMomentModule } from '@angular-material-components/moment-adapter'
     IonicModule,
     ExpedientesPrPageRoutingModule,
     BtnModalDismissPageModule,
+    TaskListPageModule,
+    TaskListHeaderPageModule,
     //
     MatInputModule,
     MatNativeDateModule,

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

@@ -1,142 +1,33 @@
-<ion-header class="ion-no-border">
-  <!-- <app-header > </app-header> -->
-</ion-header>
 
 <ion-header class="ion-no-border header-2">
+  <app-task-list-header
+    [goBackButton] = true
+    [headerName] = "headerName"
+    [ordinance] = ordinance
+    [loading] = skeletonLoader
+    [loaderTop] = true
+    (reorderList) = reorderList($event)
+    (changeFilterName) = changeFilterName($event)
+    (goBack) = goBack()
+  ></app-task-list-header>
 
-  <app-btn-modal-dismiss (click)="goBack()" ></app-btn-modal-dismiss>
-
-  <div class="title">
-    <div class="thetitle"><ion-label >Expediente</ion-label></div>
-    <div class="theicon btn-refresh d-flex align-center">
-
-      <div class="d-flex" (click)="reorderList('old')" *ngIf="ordinance == 'recent' ">
-
-        <ion-icon  class="mr-10"  src="assets/images/theme/gov/crescente.svg" ></ion-icon>
-      </div>
-
-      <div class="d-flex" (click)="reorderList('recent')" *ngIf="ordinance != 'recent' ">
-        <ion-icon  class="mr-10"  src="assets/images/theme/gov/decrescente.svg" ></ion-icon>
-      </div>
-
-      <mat-form-field class="task-filter-input" appearance="none"   color="ion-color-secondary"  placeholder="Selecione agenda">
-        <mat-select [(value)]="filterName">
-
-          <mat-option value="Para hoje" >
-            Para hoje
-          </mat-option>
-
-          <mat-option value="Novos" >
-            Novos
-          </mat-option>
-
-          <mat-option value="Lidos" >
-            Lidos
-          </mat-option>
-
-          <mat-option value="Não lidos" >
-            Não lidos
-          </mat-option>
-
-          <mat-option value="OverdueTasks">
-            Em atraso
-          </mat-option>
-
-          <mat-option value="Todos" >
-            Todos
-          </mat-option>
-
-        </mat-select>
-      </mat-form-field>
-      <button class="btn-no-color" (click)="refreshing()">
-        <ion-icon slot="end" class="title-icon font-awesome" name="reload-circle"></ion-icon>
-      </button>
-    </div>
-  </div>
 </ion-header>
 <ion-content>
 
-  <div class="main-content width-100 overflow-y-auto height-100">
-
   <ion-refresher  name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
     <ion-progress-bar type="indeterminate" *ngIf="showLoader"></ion-progress-bar>
     <ion-refresher-content>
     </ion-refresher-content>
   </ion-refresher>
 
-    <div class="width-100" >
+  <app-task-list
-      <ion-progress-bar type="indeterminate" *ngIf="skeletonLoader"></ion-progress-bar>
+    [taskList] = list
-      <ion-list>
+    [skeletonLoader] = skeletonLoader
-        <div
+    (viewTaskDetail)="goToExpediente($event)"
-          class=" ion-no-padding ion-no-margin cursor-pointer"
+    [filterName]="filterName"
-          *ngFor = "let task of expedienteGdStore.list"
-          (click)="goToExpediente(task.SerialNumber)"
   >
-          <div class="item width-100 expediente" *ngIf="TaskService.filter(task, filterName)">
-            <div class="exp-top-detail">
-              <div class="subject d-flex align-center">
-                <ion-label [class.gb-seen]="TaskService.seen(task)">{{ task.Subject }}</ion-label>
-                <span class="dead-line ml-10" *ngIf="TaskService.deadlineIsToday(task.Deadline)">Para hoje</span>
-                <span class="new-task ml-10" *ngIf="TaskService.lessThen24Hours(task.TaskReceiveDate)">Nova</span>
-              </div>
-              <div class="exp-icon">
-                <ion-icon *ngIf="ThemeService.currentTheme == 'default' "src="assets/images/icons-expediente-attachment.svg"></ion-icon>
-                <ion-icon *ngIf="ThemeService.currentTheme == 'gov' " src="assets/images/theme/gov/icons-expediente-attachment.svg"></ion-icon>
-                <label *ngIf="task.DocumentsQty != 0">{{task.DocumentsQty}}</label>
-              </div>
-            </div>
-            <div class="exp-bottom-detail">
-              <div class="exp-remetente">
-                <ion-label>{{task.Senders}}</ion-label>
-              </div>
-            </div>
-            <div class="exp-middle-detail">
-              <div class="exp-workflow">
-                <span class="label">{{task.activityInstanceName}}</span>
-              </div>
-              <div class="exp-date">
-                <ion-label>{{ task.CreateDate | date: 'dd-MM-yyyy HH:mm' }}</ion-label>
-              </div>
-            </div>
-          </div>
-        </div>
-      </ion-list>
-    </div>
   
-    <div
+  </app-task-list>
-      *ngIf="!skeletonLoader && expedienteGdStore.list.length == 0 && expedienteGdStore.list.length == 0"
-      class="empty-list d-flex height-100 align-center justify-content-center"
-    >
-      <span>Lista vazia</span>
-    </div>
-
-    <!-- Skeleton loader -->
-    <div *ngIf="skeletonLoader && expedienteGdStore.list.length == 0">
-
-      <ion-list>
-        <ion-item>
-          <ion-thumbnail slot="end">
-            <ion-skeleton-text animated></ion-skeleton-text>
-          </ion-thumbnail>
-          <ion-label>
-            <h3><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></h3>
-            <p><ion-skeleton-text animated style="width: 80%"></ion-skeleton-text></p>
-            <p><ion-skeleton-text animated style="width: 60%"></ion-skeleton-text></p>
-          </ion-label>
-        </ion-item>
-        <ion-item>
-          <ion-thumbnail slot="end">
-            <ion-skeleton-text animated></ion-skeleton-text>
-          </ion-thumbnail>
-          <ion-label>
-            <h3><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></h3>
-            <p><ion-skeleton-text animated style="width: 80%"></ion-skeleton-text></p>
-            <p><ion-skeleton-text animated style="width: 60%"></ion-skeleton-text></p>
-          </ion-label>
-        </ion-item>
-      </ion-list>
-    </div>
-  </div>
 
 </ion-content>
 

src/app/pages/gabinete-digital/expedientes-pr/expedientes-pr.page.scss

@@ -7,9 +7,10 @@
 .header-2 {
     border-top-right-radius: 24px;
     border-top-left-radius: 24px;
+    background-color: white;
 }
 
-ion-content, .header-2, .main-content{
+ion-content, .main-content{
     padding: 30px 20px 0 20px !important;
     background-color: white;
 }

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

@@ -41,6 +41,7 @@ export class ExpedientesPrPage implements OnInit {
   searchSubject = ''
   list = []
   ordinance: string =  'old'
+  headerName = "Expediente"
   
   constructor(
     private processes:ProcessesService,
@@ -85,6 +86,11 @@ export class ExpedientesPrPage implements OnInit {
     this.dynamicSearch();
   }
 
+
+  changeFilterName(filterName) {
+    this.filterName = filterName
+  }
+
   async dynamicSearch() {
 
     if(this.showSearch && this.searchSubject) {
@@ -136,9 +142,9 @@ export class ExpedientesPrPage implements OnInit {
     }, 2000);
   }
 
-  goToExpediente(serialNumber:any){
+  goToExpediente({SerialNumber}){
     //this.router.navigate(['/home/gabinete-digital/expedientes-pr',serialNumber,'gabinete-digital']);
-    this.router.navigate(['/home/gabinete-digital/expediente', serialNumber, 'gabinete-digital']);
+    this.router.navigate(['/home/gabinete-digital/expediente', SerialNumber, 'gabinete-digital']);
   }
 
   async viewExpedientDetail(serialNumber:any) {
@@ -159,12 +165,6 @@ export class ExpedientesPrPage implements OnInit {
   }
 
   goBack() {
-    // let navigationExtras: NavigationExtras = {
-    //   queryParams: {
-    //     "expedientes-pr": true,
-    //   }
-    // };
-    // this.router.navigate(['/home/gabinete-digital'], navigationExtras);
     
     this.RouteService.goBack();
 

src/app/pages/gabinete-digital/pedidos/pedidos.module.ts

@@ -24,6 +24,8 @@ import { MatButtonModule } from '@angular/material/button';
 import { MatSelectModule } from '@angular/material/select';
 import { NgxMatMomentModule } from '@angular-material-components/moment-adapter';
 
+import { TaskListHeaderPageModule } from 'src/app/shared/gabinete-digital/generic/task-list-header/task-list-header.module';
+
 
 @NgModule({
   imports: [

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

@@ -3,18 +3,27 @@
 </ion-header>
 
 <ion-header class="ion-no-border header-2">
-  <app-btn-modal-dismiss (click)="goBack()"></app-btn-modal-dismiss>
+  
-  <div class="title">
+  <div class="title d-flex justify-space-between">
+    <div class="d-flex align-center" (click)="goBack()">
+      <div class="d-flex align-center font-35">
+        <ion-icon *ngIf="ThemeService.currentTheme == 'default' " slot="end" src='assets/images/icons-arrow-arrow-left.svg'></ion-icon>
+        <ion-icon *ngIf="ThemeService.currentTheme == 'gov' " slot="end" src='assets/images/theme/gov/icons-calendar-arrow-left.svg'></ion-icon>
+        <ion-icon *ngIf="ThemeService.currentTheme == 'doneIt' " slot="end" src='assets/images/theme/{{ThemeService.currentTheme}}/icons-calendar-arrow-left.svg'></ion-icon>
+      </div>
       <div class="thetitle"><ion-label >Pedidos</ion-label></div>
-    <div class="theicon btn-refresh d-flex align-center"> 
+    </div>
 
+    <div class="theicon btn-refresh d-flex">
+
+      <div>
         <div class="d-flex" (click)="reorderList('old')" *ngIf="ordinance == 'recent' ">
-
+          <ion-icon  class="mr-10 font-25"  src="assets/images/theme/gov/crescente.svg" ></ion-icon>
-        <ion-icon  class="mr-10"  src="assets/images/theme/gov/crescente.svg" ></ion-icon>
         </div>
   
         <div class="d-flex" (click)="reorderList('recent')" *ngIf="ordinance != 'recent' ">
-        <ion-icon  class="mr-10"  src="assets/images/theme/gov/decrescente.svg" ></ion-icon>
+          <ion-icon  class="mr-10 font-25"  src="assets/images/theme/gov/decrescente.svg" ></ion-icon>
+        </div>
       </div>
 
       <mat-form-field class="task-filter-input" appearance="none"   color="ion-color-secondary"  placeholder="Selecione agenda">
@@ -53,6 +62,7 @@
       </button>
     </div>
   </div>
+
   <ion-toolbar>
     <ion-segment [(ngModel)]="segment" (ionChange)="segmentChanged($event)" >
       <ion-segment-button value="parecer">
@@ -77,40 +87,15 @@
       </ion-refresher-content>
     </ion-refresher>
 
-    <div class="d-flex ion-justify-content-between ion-align-items-center" style="
-      width: 300px;
-      margin: 0px auto;
-    ">
-    
-      <div class="d-flex sort-by ion-justify-content-center">
-        <p>
-          <span class="order">Order por:</span>
-          <span *ngIf="ordinance == 'recent'" class="order-labal">Mais Recentes</span>
-          <span *ngIf="ordinance == 'old'" class="order-labal">Mais Antigos</span>
-        </p>
-      </div>
-      <div>
-        <div  *ngIf="ordinance == 'old'" (click)="reorderList('recent')">
-          <ion-icon *ngIf="ThemeService.currentTheme == 'default' " src="assets/images/icons-arrow-arrow-up.svg"></ion-icon>
-          <ion-icon *ngIf="ThemeService.currentTheme == 'gov' " src="assets/images/theme/gov/icons-arrow-arrow-up.svg"></ion-icon>
-        </div>
-
-        <div *ngIf="ordinance == 'recent'" (click)="reorderList('old')">
-          <ion-icon  *ngIf="ThemeService.currentTheme == 'default' " src="assets/images/icons-arrow-arrow-down-25.svg"></ion-icon>
-          <ion-icon *ngIf="ThemeService.currentTheme == 'gov' " src="assets/images/theme/gov/icons-arrow-arrow-down.svg"></ion-icon>
-        </div>
-      </div>
-    </div>
-
     <div class="width-100" [ngSwitch]="segment">
       <ion-progress-bar type="indeterminate" *ngIf="skeletonLoader"></ion-progress-bar>
-      <div *ngIf="listPedidosParecer">
+      <div *ngIf="pedidosstorage.listparecer">
         <ion-list *ngSwitchCase="'parecer'">
-          <!-- *ngFor = "let task of listPedidosParecer; let i = index"
+          <!-- *ngFor = "let task of pedidosstorage.listparecer; let i = index"
           (click)="viewExpedientDetail(task.SerialNumber)" -->
           <div
             class="ion-no-padding ion-no-margin cursor-pointer"
-            *ngFor = "let task of listPedidosParecer"
+            *ngFor = "let task of pedidosstorage.listparecer"
             (click)="goToPedido(task.SerialNumber)"
           >
             <!-- (click)="viewExpedientDetail(task.SerialNumber)" -->
@@ -146,11 +131,11 @@
         </ion-list>
 
       </div>
-      <div *ngIf="listPedidosDeferimento">
+      <div *ngIf="pedidosstorage.listdeferimento">
         <ion-list *ngSwitchCase="'deferimento'">
           <div
             class="expediente ion-no-padding ion-no-margin cursor-pointer"
-            *ngFor = "let task of listPedidosDeferimento"
+            *ngFor = "let task of pedidosstorage.listdeferimento"
             (click)="goToPedido(task.SerialNumber)"
           >
             <!-- (click)="viewExpedientDetail(task.SerialNumber)" -->
@@ -190,7 +175,7 @@
     <div [ngSwitch]="segment">
     <div *ngSwitchCase="'parecer'" class="centered-div d-flex height-100 align-center justify-content-center" >
       <div
-        *ngIf="listPedidosParecer.length == 0"
+        *ngIf="pedidosstorage.listparecer.length == 0"
         class="empty-list d-flex height-100 align-center justify-content-center"
       >
         <span>Lista vazia</span>
@@ -199,7 +184,7 @@
 
     <div *ngSwitchCase="'deferimento'" class="centered-div d-flex height-100 align-center justify-content-center">
       <div
-        *ngIf="listPedidosDeferimento.length == 0"
+        *ngIf="pedidosstorage.listdeferimento.length == 0"
         class="empty-list d-flex height-100 align-center justify-content-center"
       >
         <span>Lista vazia</span>
@@ -207,7 +192,7 @@
     </div>
   </div>
 
-    <div *ngIf="skeletonLoader && listPedidosDeferimento.length == 0 && skeletonLoader && listPedidosParecer.length == 0">
+    <div *ngIf="skeletonLoader && pedidosstorage.listdeferimento.length == 0 && skeletonLoader && pedidosstorage.listparecer.length == 0">
 
       <ion-list>
         <ion-item>

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

@@ -121,7 +121,6 @@ export class PedidosPage implements OnInit {
 
       this.listPedidosParecer = this.TaskService.reorderList(this.ordinance, listPedidosParecer)
 
-
       const listPedidosDeferimento = this.pedidosstorage.listdeferimento.filter((task) => {
         let subject = task.Folio || task.Subject || task.workflowInstanceDataFields.Subject
         subject = subject.toLowerCase();

src/app/pages/gabinete-digital/pendentes/pendentes.module.ts

@@ -24,6 +24,7 @@ import { ReactiveFormsModule } from '@angular/forms';
 import { MatButtonModule } from '@angular/material/button';
 import { MatSelectModule } from '@angular/material/select';
 import { NgxMatMomentModule } from '@angular-material-components/moment-adapter';
+import { TaskListHeaderPageModule } from 'src/app/shared/gabinete-digital/generic/task-list-header/task-list-header.module';
 
 
 @NgModule({
@@ -35,6 +36,7 @@ import { NgxMatMomentModule } from '@angular-material-components/moment-adapter'
     BtnModalDismissPageModule,
     // entryComponents
     TaskListPageModule,
+    TaskListHeaderPageModule,
     //
     MatInputModule,
     MatNativeDateModule,

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

@@ -1,59 +1,14 @@
-<ion-header class="ion-no-border">
-  <!-- <app-header > </app-header> -->
-</ion-header>
-
-
 <ion-header class="ion-no-border header-2">
-  <app-btn-modal-dismiss (click)="goBack()" ></app-btn-modal-dismiss>
+  <app-task-list-header
-  <div class="title">
+    [goBackButton] = true
-    <div class="thetitle"><ion-label >Pendentes</ion-label></div>
+    [headerName] = "headerName"
-    <div class="theicon btn-refresh d-flex align-center">
+    [ordinance] = ordinance
-
+    [loading] = skeletonLoader
-      <div class="d-flex" (click)="reorderList('old')" *ngIf="ordinance == 'recent' ">
+    [loaderTop] = true
-
+    (reorderList) = reorderList($event)
-        <ion-icon  class="mr-10"  src="assets/images/theme/gov/crescente.svg" ></ion-icon>
+    (changeFilterName) = changeFilterName($event)
-      </div>
+    (goBack) = goBack()
-
+  ></app-task-list-header>
-      <div class="d-flex" (click)="reorderList('recent')" *ngIf="ordinance != 'recent' ">
-        <ion-icon  class="mr-10"  src="assets/images/theme/gov/decrescente.svg" ></ion-icon>
-      </div>
-
-      <mat-form-field class="task-filter-input" appearance="none"   color="ion-color-secondary"  placeholder="Selecione agenda">
-        <mat-select [(value)]="filterName">
-
-          <mat-option value="Para hoje" >
-            Para hoje
-          </mat-option>
-
-          <mat-option value="Novos" >
-            Novos
-          </mat-option>
-
-          <mat-option value="Lidos" >
-            Lidos
-          </mat-option>
-
-          <mat-option value="Não lidos" >
-            Não lidos
-          </mat-option>
-
-
-          <mat-option value="OverdueTasks">
-            Em atraso
-          </mat-option>
-
-          <mat-option value="Todos" >
-            Todos
-          </mat-option>
-
-          
-        </mat-select>
-      </mat-form-field>
-      <button class="btn-no-color" (click)="doRefresh($event)">
-        <ion-icon slot="end" class="title-icon font-awesome" name="reload-circle"></ion-icon>
-      </button>
-    </div>
-  </div>
 </ion-header>
 
 <ion-content style="background-color: white;">
@@ -71,6 +26,7 @@
   <app-task-list class="height-100"
     [taskList] = list
     [skeletonLoader] = skeletonLoader
+    [filterName] = "filterName"
     (viewTaskDetail)="viewTaskDetails($event)"
   > </app-task-list>
 

src/app/pages/gabinete-digital/pendentes/pendentes.page.scss

@@ -7,10 +7,6 @@
 .header-2 {
   border-top-right-radius: 24px;
   border-top-left-radius: 24px;
-}
-
-.header-2{
-  padding: 30px 20px 0 20px !important;
    background-color: white;
 }
 

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

@@ -46,6 +46,7 @@ export class PendentesPage implements OnInit {
   searchSubject = ''
   list = []
   ordinance: string =  'old'
+  headerName = "Pendentes"
 
   constructor(
     private processes: ProcessesService,
@@ -99,6 +100,11 @@ export class PendentesPage implements OnInit {
     this.dynamicSearch();
   }
 
+  changeFilterName(filterName) {
+    this.filterName = filterName
+  }
+
+
   async dynamicSearch() {
 
     if(this.showSearch && this.searchSubject) {

src/app/pages/publications/publications.page.ts

@@ -151,7 +151,7 @@ export class PublicationsPage implements OnInit {
       this.publicationsEventFolderList = folders.filter((e)=>e.ActionType == 'Evento')
       this.publicationsTravelFolderList = folders.filter((e)=>e.ActionType != 'Evento')
 
-      // ActionModel.create(folders)
+      ActionModel.create(folders)
 
       await this.storage.set('actionsEvents', this.publicationsEventFolderList);
       await this.storage.set('actionsViagens', this.publicationsTravelFolderList);

src/app/pipes/evento-approve.pipe.ts

@@ -31,6 +31,7 @@ export class EventoApprovePipe implements PipeTransform {
         "Status": fullTask.workflowInstanceDataFields.Status,
         "Deadline": fullTask.deadline,
         "TaskStatus": fullTask.taskStatus,
+        "TaskReceiveDate": fullTask.taskReceiveDate
       },
       obj
     )

src/app/services/events.service.ts

@@ -850,6 +850,9 @@ export class EventsService {
     const puturl = environment.apiURL + 'calendar/md';
     let params = new HttpParams();
 
+    const now = new Date();
+    event.TimeZone = now.getTimezoneOffset().toString()
+
     params = params.set("CalendarName", calendarName);
 
     let options: any;
@@ -878,6 +881,9 @@ export class EventsService {
     const puturl = environment.apiURL + 'calendar/pr';
     let params = new HttpParams();
 
+    const now = new Date();
+    event.TimeZone = now.getTimezoneOffset().toString()
+
     params = params.set("CalendarName", calendarName);
 
     let options: any;
@@ -908,6 +914,9 @@ export class EventsService {
     const puturl = environment.apiURL + 'Calendar/PostEvent';
     let params = new HttpParams();
 
+    const now = new Date()
+    event.TimeZone = now.getTimezoneOffset().toString()
+
     params = params.set("CalendarName", calendarName);
 
     let options: any;

src/app/services/task.service.ts

@@ -137,7 +137,7 @@ export class TaskService {
 
   sortArrayISODate(myArray: any): any[] {
 
-    return myArray.sort((a,b) => Date.parse(b.TaskReceiveDate || b.taskReceiveDate || b.taskStartDate || b.TaskStartDate) - Date.parse(a.TaskReceiveDate || a.taskReceiveDate || a.taskStartDate || a.TaskStartDate))
+    return myArray.sort((a,b) => Date.parse(b.CreateDate || b.taskStartDate || b.TaskStartDate || b.TaskReceiveDate || b.taskReceiveDate ) - Date.parse(a.CreateDate ||  b.taskStartDate || b.TaskStartDate || a.TaskReceiveDate || a.taskReceiveDate ))
   }
 
   reorderList(orderBy: string, list) {

src/app/shared/btn-modal-dismiss/btn-modal-dismiss.page.html

@@ -1,7 +1,6 @@
 <div class="btn-modal-dismiss">
   <button class="btn-no-color" (click)="close()">
     <ion-icon *ngIf="ThemeService.currentTheme == 'default' " slot="end" src='assets/images/icons-arrow-arrow-left.svg'></ion-icon>
-    <ion-icon *ngIf="ThemeService.currentTheme == 'doneIt' " src="assets/images/theme/doneIt/icons-calendar-arrow-left.svg"></ion-icon>
     <ion-icon *ngIf="ThemeService.currentTheme == 'gov' " slot="end" src='assets/images/theme/gov/icons-calendar-arrow-left.svg'></ion-icon>
     <ion-icon *ngIf="ThemeService.currentTheme == 'doneIt' " slot="end" src='assets/images/theme/{{ThemeService.currentTheme}}/icons-calendar-arrow-left.svg'></ion-icon>
   </button>

src/app/shared/gabinete-digital/despachos-pr/despachos-pr.module.ts

@@ -19,11 +19,11 @@ import {
   NgxMatTimepickerModule
 } from '@angular-material-components/datetime-picker';
 
-import { ReactiveFormsModule } from '@angular/forms';
+
 import { MatButtonModule } from '@angular/material/button';
 import { MatSelectModule } from '@angular/material/select';
 import { NgxMatMomentModule } from '@angular-material-components/moment-adapter';
-
+import { TaskListHeaderPageModule } from '../generic/task-list-header/task-list-header.module';
 
 
 @NgModule({
@@ -32,6 +32,7 @@ import { NgxMatMomentModule } from '@angular-material-components/moment-adapter'
     FormsModule,
     IonicModule,
     DespachosPrPageRoutingModule,
+    TaskListHeaderPageModule,
     // entryComponents
     TaskListPageModule,
     //

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

@@ -1,88 +1,14 @@
 <ion-header class="ion-no-border">
-  <ion-progress-bar type="indeterminate" *ngIf="skeletonLoader"></ion-progress-bar>
+  <app-task-list-header
-  <div class="main-header">
+    class="width-100 height-100"
-    <div class="thetitle">
+    [goBackButton] = false
-      <ion-label  >{{ environment.dispatchPR}}</ion-label>
+    [headerName] = environment.dispatchPR
-    </div>
+    [ordinance] = ordinance
-    <div class="theicon d-flex align-center ">
+    [loading] = skeletonLoader
-
+    [loaderTop] = true
-      <!-- <div>
+    (reorderList) = reorderList($event)
-        <div title="Pesquisa" *ngIf="!hideSearchBtn" class="mr-20 d-flex align-center cursor-pointer">
+    (changeFilterName) = changeFilterName($event)
-          <div (click)="openSearch();showSearch=true" *ngIf="!showSearch" class="d-flex">
+  ></app-task-list-header>
-            <ion-icon title="Perfil" *ngIf="ThemeService.currentTheme == 'doneIt' " class="font-35" src="assets/images/theme/doneIt/icons-search.svg"></ion-icon>
-            <ion-icon title="Perfil" *ngIf="ThemeService.currentTheme == 'default' " class="font-35" src='assets/images/icons-search.svg'></ion-icon>
-            <ion-icon title="Perfil" *ngIf="ThemeService.currentTheme == 'gov' " class="font-35" src='assets/images/theme/gov/icons-search.svg'></ion-icon>
-          </div>
-          <button title="Fechar" class="btn-no-color d-flex" (click)="closeSearch();showSearch=false;searchSubject=''" *ngIf="showSearch">
-            <ion-icon *ngIf="ThemeService.currentTheme == 'default' || ThemeService.currentTheme == 'doneIt' " class="font-35" name="restaurant-outline" src="assets/images/icons-search-close.svg"></ion-icon>
-            <ion-icon *ngIf="ThemeService.currentTheme == 'gov' " class="font-35" name="restaurant-outline" src="assets/images/theme/gov/icons-search-close.svg"></ion-icon>
-          </button>
-
-          <div *ngIf="showSearch">
-            <div class="d-flex search-input-container ml-10 justify-between" *ngIf="showSearch">
-              <div class="input-text d-flex ion-align-items-center">
-                <ion-input (keyup.enter)="basicSearch()" [(ngModel)]='searchSubject' (ngModelChange)="dynamicSearch()"
-                  class="search-input text-black" type="search" placeholder="Pesquisar"></ion-input>
-              </div>
-              
-              <div (click)="basicSearch()"  class="d-flex align-center icon">
-
-                <ion-icon  class="icon-z" slot="end" src="assets/images/theme/gov/search.svg"></ion-icon>
-    
-              </div>
-            </div>
-          </div>
-        </div>
-      </div> -->
-
-      <div>
-        <div class="d-flex" (click)="reorderList('old')" *ngIf="ordinance == 'recent' ">
-
-          <ion-icon  class="mr-10 font-25"  src="assets/images/theme/gov/crescente.svg" ></ion-icon>
-        </div>
-  
-        <div class="d-flex" (click)="reorderList('recent')" *ngIf="ordinance != 'recent' ">
-          <ion-icon  class="mr-10 font-25"  src="assets/images/theme/gov/decrescente.svg" ></ion-icon>
-        </div>
-      </div>
-
-      <div>
-        <mat-form-field class="task-filter-input" appearance="none"   color="ion-color-secondary"  placeholder="Selecione agenda">
-          <mat-select [(value)]="filterName">
-  
-            <mat-option value="Para hoje" >
-              Para hoje
-            </mat-option>
-  
-            <mat-option value="Novos" >
-              Novos
-            </mat-option>
-  
-            <mat-option value="Lidos" >
-              Lidos
-            </mat-option>
-  
-            <mat-option value="Não lidos" >
-              Não lidos
-            </mat-option>
-  
-            <mat-option value="OverdueTasks">
-              Em atraso
-            </mat-option>
-  
-            <mat-option value="Todos" >
-              Todos
-            </mat-option>
-  
-          </mat-select>
-        </mat-form-field>
-      </div>
-
-      <!-- <button title="Atualizar" class="btn-no-color" (click)="doRefresh($event)">
-        <ion-icon slot="end" class="title-icon font-awesome" name="reload-circle"></ion-icon>
-      </button> -->
-    </div>
-  </div>
 
 </ion-header>
 <ion-content>

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

@@ -65,6 +65,10 @@ constructor (
 
   }
 
+  changeFilterName(filterName) {
+    this.filterName = filterName
+  }
+
   async LoadList() {
 
     this.skeletonLoader = true;

src/app/shared/gabinete-digital/diplomas-assinar/diplomas-assinar.module.ts

@@ -7,6 +7,9 @@ import { IonicModule } from '@ionic/angular';
 import { DiplomasAssinarPageRoutingModule } from './diplomas-assinar-routing.module';
 
 import { DiplomasAssinarPage } from './diplomas-assinar.page';
+import { TaskListPageModule } from 'src/app/shared/gabinete-digital/generic/task-list/task-list.module'
+
+
 
 import { MatInputModule } from '@angular/material/input';
 import { MatNativeDateModule } from '@angular/material/core';
@@ -29,6 +32,7 @@ import { NgxMatMomentModule } from '@angular-material-components/moment-adapter'
     FormsModule,
     IonicModule,
     DiplomasAssinarPageRoutingModule,
+    TaskListPageModule,
     //
     MatInputModule,
     MatNativeDateModule,

src/app/shared/gabinete-digital/diplomas-assinar/diplomas-assinar.page.html

@@ -94,88 +94,13 @@
       </ion-refresher-content>
   </ion-refresher>
 
-
+  <app-task-list
-  <div class="main-container width-100 overflow-y-auto height-100">
+    [taskList] = list
-
+    [skeletonLoader] = skeletonLoader
-    <div  *ngIf="list.length >= 1">
+    (viewTaskDetail)="goToDiploma($event)"
-
+    [filterName]="filterName"
-
-      <ion-list >
-        <!-- *ngFor = "let task of parecerList; let i = index"
-        (click)="viewExpedientDetail(task.SerialNumber)" -->
-        <div
-          class=" item-hover ion-no-padding ion-no-margin cursor-pointer"
-          *ngFor = "let task of list"
-          (click)="goToDiploma(task.SerialNumber)"
   >
-          <!-- (click)="viewExpedientDetail(task.SerialNumber)" -->
+  </app-task-list>
-          <!--  [routerLink]="['/home/gabinete-digital/expediente',task.SerialNumber]" -->
-          <div class="item width-100 expediente" *ngIf="TaskService.filter(task, filterName)">
-            <div class="exp-top-detail">
-              <div class="subject d-flex">
-                <ion-label [class.gb-seen]="TaskService.seen(task)">{{ task.Folio || task.workflowInstanceDataFields.Subject }}</ion-label>
-                <span class="dead-line ml-10" *ngIf="TaskService.deadlineIsToday(task.Deadline)">Para hoje</span>
-                <span class="new-task ml-10" *ngIf="TaskService.lessThen24Hours(task.TaskReceiveDate)">Nova</span>
-              </div>
-              <div class="exp-icon">
-                <ion-icon *ngIf="ThemeService.currentTheme == 'default' " src="assets/images/icons-expediente-attachment.svg"></ion-icon>
-                <ion-icon *ngIf="ThemeService.currentTheme == 'gov' " src="assets/images/theme/gov/icons-expediente-attachment.svg"></ion-icon>
-                <label *ngIf="task.DocumentsQty != 0">{{task.DocumentsQty}}</label>
-              </div>
-            </div>
-            <div class="exp-bottom-detail">
-              <div class="exp-remetente">
-                <ion-label>{{task.Senders}}</ion-label>
-              </div>
-            </div>
-            <div class="exp-middle-detail">
-              <div class="exp-workflow">
-                <span class="label">{{task.activityInstanceName}}</span>
-              </div>
-              <div class="exp-date">
-                <ion-label>{{ task.CreateDate | date: 'dd-MM-yyyy HH:mm' }}</ion-label>
-              </div>
-            </div>
-          </div>
-        </div>
-
-      </ion-list>
-    </div>
-
-    <div
-      *ngIf="!skeletonLoader && list.length == 0"
-      class="empty-list d-flex height-100 align-center justify-content-center"
-    >
-      <span>Lista vazia</span>
-    </div>
-
-    <div *ngIf="skeletonLoader && list.length == 0">
-
-      <ion-list>
-        <ion-item>
-          <ion-thumbnail slot="end">
-            <ion-skeleton-text animated></ion-skeleton-text>
-          </ion-thumbnail>
-          <ion-label>
-            <h3><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></h3>
-            <p><ion-skeleton-text animated style="width: 80%"></ion-skeleton-text></p>
-            <p><ion-skeleton-text animated style="width: 60%"></ion-skeleton-text></p>
-          </ion-label>
-        </ion-item>
-        <ion-item>
-          <ion-thumbnail slot="end">
-            <ion-skeleton-text animated></ion-skeleton-text>
-          </ion-thumbnail>
-          <ion-label>
-            <h3><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></h3>
-            <p><ion-skeleton-text animated style="width: 80%"></ion-skeleton-text></p>
-            <p><ion-skeleton-text animated style="width: 60%"></ion-skeleton-text></p>
-          </ion-label>
-        </ion-item>
-      </ion-list>
-    </div>
-  </div>
-
 
 </ion-content>
 

src/app/shared/gabinete-digital/diplomas-assinar/diplomas-assinar.page.ts

@@ -95,8 +95,8 @@ export class DiplomasAssinarPage implements OnInit {
   }
 
 
-  goToDiploma(serialNumber:any){
+  goToDiploma({SerialNumber}){
-    this.router.navigate(['/home/gabinete-digital/diplomas-assinar',serialNumber,'gabinete-digital']);
+    this.router.navigate(['/home/gabinete-digital/diplomas-assinar',SerialNumber,'gabinete-digital']);
   }
 
   doRefresh(event) {

src/app/shared/gabinete-digital/diplomas-gerar/expedients/expedients.page.html

@@ -1,97 +0,0 @@
-<ion-header class="ion-no-border">
-  <ion-progress-bar type="indeterminate" *ngIf="skeletonLoader"></ion-progress-bar>
-  <div class="title">
-    <div class="thetitle"><ion-label >Expediente</ion-label></div>
-    <div class="theicon">
-      <button title="Atualizar" class="btn-no-color" (click)="doRefresh($event)">
-        <ion-icon slot="end" class="title-icon font-awesome" name="reload-circle"></ion-icon>
-      </button>
-    </div>
-  </div>
-</ion-header>
-<ion-content>
-  <ion-refresher name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
-      <ion-refresher-content
-        pullingIcon="chevron-down-circle-outline"
-        pullingText="deslize para actualizar"
-        refreshingSpinner="circles"
-        refreshingText="A actualizar...">
-      </ion-refresher-content>
-  </ion-refresher>
-
-  <div class="content width-100 overflow-y-auto height-100" >
-    <div >
-
-      <ion-list *ngIf="expedientegbstore.list.length >=0">
-        <div
-          class="expediente item-hover ion-no-padding ion-no-margin cursor-pointer"
-          *ngFor = "let task of expedientegbstore.list"
-          (click)="goToExpediente(task.SerialNumber)"
-        >
-          <div class="item width-100">
-            <div class="exp-top-detail">
-              <div class="subject d-flex">
-                <ion-label [class.gb-seen]="TaskService.seen(task)">{{ task.Subject }}</ion-label>
-                <span class="dead-line ml-10" *ngIf="TaskService.deadlineIsToday(task.Deadline)">Para hoje</span>
-                <span class="new-task ml-10" *ngIf="TaskService.lessThen24Hours(task.TaskReceiveDate)">Nova</span>
-              </div>
-              <div class="exp-icon">
-                <ion-icon *ngIf="ThemeService.currentTheme == 'default' "src="assets/images/icons-expediente-attachment.svg"></ion-icon>
-                <ion-icon *ngIf="ThemeService.currentTheme == 'gov' " src="assets/images/theme/gov/icons-expediente-attachment.svg"></ion-icon>
-                <label *ngIf="task.DocumentsQty != 0">{{task.DocumentsQty}}</label>
-              </div>
-            </div>
-            <div class="exp-bottom-detail">
-              <div class="exp-remetente">
-                <ion-label>{{task.Senders}}</ion-label>
-              </div>
-            </div>
-            <div class="exp-middle-detail">
-              <div class="exp-workflow">
-                <span class="label">{{task.activityInstanceName}}</span>
-              </div>
-              <div class="exp-date">
-                <ion-label>{{ task.CreateDate | date: 'dd-MM-yyyy HH:mm' }}</ion-label>
-              </div>
-            </div>
-          </div>
-        </div>
-      </ion-list>
-    </div>
-
-    <div
-      *ngIf="!skeletonLoader && expedientegbstore.list.length == 0"
-      class="empty-list d-flex height-100 align-center justify-content-center"
-    >
-      <span>Lista vazia</span>
-    </div>
-
-    <div *ngIf="skeletonLoader && expedientegbstore.list.length == 0">
-
-      <ion-list >
-        <ion-item>
-          <ion-thumbnail slot="end">
-            <ion-skeleton-text animated></ion-skeleton-text>
-          </ion-thumbnail>
-          <ion-label>
-            <h3><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></h3>
-            <p><ion-skeleton-text animated style="width: 80%"></ion-skeleton-text></p>
-            <p><ion-skeleton-text animated style="width: 60%"></ion-skeleton-text></p>
-          </ion-label>
-        </ion-item>
-        <ion-item>
-          <ion-thumbnail slot="end">
-            <ion-skeleton-text animated></ion-skeleton-text>
-          </ion-thumbnail>
-          <ion-label>
-            <h3><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></h3>
-            <p><ion-skeleton-text animated style="width: 80%"></ion-skeleton-text></p>
-            <p><ion-skeleton-text animated style="width: 60%"></ion-skeleton-text></p>
-          </ion-label>
-        </ion-item>
-      </ion-list>
-    </div>
-  </div>
-
-</ion-content>
-

src/app/shared/gabinete-digital/diplomas-gerar/expedients/expedients.page.scss

@@ -1,161 +0,0 @@
-@import '~src/function.scss';
-//CONTENT
-:host{
-    margin: 0;
-}
-.title{
-    font-family: Roboto;
-    font-size: 25px;
-    color:#000;
-    overflow: auto;
-    padding: 30px 20px 0 20px !important;
-
-    .thetitle{
-      width: fit-content;
-      float: left;
-    }
-    .theicon{
-      width: fit-content;
-      float: right;
-    }
-  }
-//DIV
-ion-item{
-  --background: none;
-}
-.item {
-    //border-radius: 15px;
-    //box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.07);
-    //Sborder: solid 1px #e9e9e9;
-    //background-color: var(--white);
-    margin: 0 auto;
-    //padding: 10px;
-    overflow: auto;
-  }
-
-/* New CSS */
-.content{
-  padding: 0px 20px 0 20px !important;
-}
-.expediente{
-  border-radius: 15px;
-  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.07);
-  border:1px solid #e9e9e9 !important;
-  //background-color: transparent;
-  margin-bottom: 10px !important;
-  padding: 15px;
-}
-.exp-list-item{
-  //width: 368px;
-  overflow: auto;
-  //border-bottom: 1px solid gray;
-  margin: 10px auto;
-}
-
-.exp-top-detail{
-  width: 100%;
-  float: left;
-  font-family: Roboto;
-  font-size: 12pt;
-  font-weight: 700;
-  color: var(--title-text-color);
-  padding-left: 3px;
-
-  .subject{
-    width: 84%;
-    float: left;
-  }
-
-  .exp-icon{
-    width: fit-content;
-    float: right;
-    //font-size: 13px;
-    margin: 0 !important;
-    padding: 0 !important;
-
-    ion-icon{
-      font-size: 12pt;
-      color: #42b9fe;
-      float: left;
-    }
-    label{
-      font-size: 10pt;
-    }
-  }
-}
-.exp-middle-detail, .exp-bottom-detail{
-  margin-bottom: 5px;
-
-}
-.exp-middle-detail{
-  font-size: 12pt;
-  width: 100%;
-  overflow: auto;
-
-  .exp-workflow{
-    float: left;
-    margin: 0 !important;
-
-    .label{
-      border-radius: 15px;
-      background: var(--label-bg-color);
-      //font-size: 12px;
-      float: right;
-      padding: 2.5px 13.5px 2.5px 13.5px;
-      color: #fff;
-  }
-  }
-  .exp-date{
-    width: auto;
-    font-family: Roboto;
-    font-size: 10pt;
-    font-weight: normal;
-    font-stretch: normal;
-    font-style: normal;
-    line-height: normal;
-    letter-spacing: normal;
-    color: #797979;
-    float: right;
-  }
-}
-.exp-bottom-detail{
-  font-size: 8pt;
-  width: 100%;
-  overflow: auto;
-  padding-left: 3px;
-
-  .exp-remetente{
-    //width: 200px;
-    font-family: Roboto;
-    //font-size: 13px;
-    font-weight: normal;
-    color: #000000;
-    float: left;
-    //border: 1px solid red;
-  }
-}
-.div-top-header{
-  width: 400px;
-  margin: 6px auto;
-  background-color: #0782c9;
-  overflow: auto;
-}
-.div-search{
-  font-size: 45px;
-  float: left;
-  margin: 0 0 0 10px
-}
-.div-logo{
-  background: transparent;
-  width: 150px;
-  margin: 2.5px 0 2.5px 71px;
-  float: left;
-}
-.div-logo img{
-  width: 100%;
-}
-.div-profile{
-  font-size: 45px;
-  float: right;
-  margin-right: 10px;
-}

src/app/shared/gabinete-digital/diplomas-gerar/expedients/expedients.page.ts

@@ -1,121 +0,0 @@
-import { Component, Input, OnInit } from '@angular/core';
-import { NavigationStart, Router } from '@angular/router';
-import { ProcessesService } from 'src/app/services/processes.service';
-import { ExpedienteGdStore } from 'src/app/store/expedientegd-store.service';
-import { ExpedienteTaskPipe } from 'src/app/pipes/expediente-task.pipe';
-import { ThemeService } from 'src/app/services/theme.service'
-import { SortService } from 'src/app/services/functions/sort.service';
-import { Storage } from '@ionic/storage';
-import { TaskService } from 'src/app/services/task.service'
-
-
-@Component({
-  selector: 'app-expedients',
-  templateUrl: './expedients.page.html',
-  styleUrls: ['./expedients.page.scss'],
-})
-export class ExpedientsPage implements OnInit {
-  segment: string;
-
-  serialNumber: string;
-
-  @Input() profile: string;
-  skeletonLoader = true
-  expedientegbstore = ExpedienteGdStore
-
-  expedienteTaskPipe = new ExpedienteTaskPipe()
-
-  constructor(
-    private processes: ProcessesService,
-    private router: Router,
-    public ThemeService: ThemeService,
-    private sortService: SortService,
-    private storage: Storage,
-    public TaskService: TaskService
-  ) {
-    this.profile = 'mdgpr';
-
-  }
-
-  ngOnInit() {
-    //Inicializar segment
-    this.segment = "expedientes";
-    this.LoadList()
-
-    this.router.events.forEach((event) => {
-      if (event instanceof NavigationStart &&
-        event.url.startsWith('/home/gabinete-digital?expedientes=true')) {
-        if (window.location.pathname.split('/').length >= 4 && window.location.pathname.startsWith('/home/gabinete-digital')) {
-          this.LoadList()
-        } else {
-          this.LoadList()
-        }
-      }
-    });
-
-  }
-
-  segmentChanged() {
-    this.LoadList();
-  }
-
-  LoadList() {
-
-    this.skeletonLoader = true
-
-    this.processes.GetTaskListExpediente(false).subscribe(result => {
-      let taskslist = [];
-
-      let res = result.filter(data => data.workflowInstanceDataFields.Status == "Active");
-      res.forEach(element => {
-        let task = this.expedienteTaskPipe.transform(element)
-        taskslist.push(task);
-
-      });
-      taskslist = this.sortService.sortDate(taskslist, 'CreateDate')
-      // this.addProcessTODb(taskslist);
-      taskslist = taskslist.filter(function(item) {
-        return item.activityInstanceName != 'Retificar Expediente'
-    })
-      this.expedientegbstore.reset(taskslist);
-
-    }, (error) => {
-      this.skeletonLoader = false
-      //this.getEventsFromLocalDb();
-      console.log('stop')
-    }, () =>{
-      this.skeletonLoader = false
-    });
-  }
-
-  // addProcessTODb(task) {
-  //   this.storage.set('gabinete-expediente', task).then(() => {
-      
-  //   })
-  // }
-
-  // getEventsFromLocalDb() {
-  //   this.storage.get('gabinete-expediente').then((expediente) => {
-  //     taskslist = expediente
-  //   })
-  // }
-
-  doRefresh(event) {
-    if (event) {
-      setTimeout(() => {
-        try {
-  event?.target?.complete();
-} catch(error) {}
-      }, 2000);
-    }
-      setTimeout(() => {
-        this.LoadList();
-      }, 1000)
-
-    }
-
-    goToExpediente(serialNumber: any) {
-      this.router.navigate(['/home/gabinete-digital/expediente', serialNumber, 'gabinete-digital']);
-    }
-
-  }

src/app/shared/gabinete-digital/diplomas/diplomas.module.ts

@@ -22,6 +22,8 @@ import { ReactiveFormsModule } from '@angular/forms';
 import { MatButtonModule } from '@angular/material/button';
 import { MatSelectModule } from '@angular/material/select';
 import { NgxMatMomentModule } from '@angular-material-components/moment-adapter';
+import { TaskListPageModule } from 'src/app/shared/gabinete-digital/generic/task-list/task-list.module'
+
 
 
 
@@ -31,6 +33,7 @@ import { NgxMatMomentModule } from '@angular-material-components/moment-adapter'
     FormsModule,
     IonicModule,
     DiplomasPageRoutingModule,
+    TaskListPageModule,
     //
     MatInputModule,
     MatNativeDateModule,

src/app/shared/gabinete-digital/diplomas/diplomas.page.html

@@ -32,7 +32,6 @@
           </div>
         </div>
       </div> -->
-
       <div>
         <div class="d-flex" (click)="reorderList('old')" *ngIf="ordinance == 'recent' ">
 

src/app/shared/gabinete-digital/events-to-approve/events-to-approve.page.ts

@@ -4,7 +4,6 @@ import { EventPerson } from 'src/app/models/eventperson.model';
 import { ProcessesService } from 'src/app/services/processes.service';
 import { ModalController } from '@ionic/angular';
 import { NavigationStart, Router } from '@angular/router';
-import { LoginUserRespose } from 'src/app/models/user.model';
 import { AuthService } from 'src/app/services/auth.service';
 import { EventoAprovacaoStore } from 'src/app/store/eventoaprovacao-store.service';
 import { SortService } from 'src/app/services/functions/sort.service';
@@ -99,13 +98,17 @@ export class EventsToApprovePage implements OnInit {
 
     if(this.showSearch && this.searchSubject) {
       
-      this.list = this.eventoaprovacaostore.get(this.segment).filter((task) => {
+      const list = this.eventoaprovacaostore.get(this.segment).filter((task) => {
         let subject = task.Folio || task.Subject || task.workflowInstanceDataFields.Subject
         subject = subject.toLowerCase();
         return subject.includes(this.searchSubject.toLowerCase())
       })
+
+      this.list = this.TaskService.reorderList(this.ordinance, list)
     } else {
-      this.list = this.eventoaprovacaostore.get(this.segment)
+      const list  = this.eventoaprovacaostore.get(this.segment)
+
+      this.list = this.TaskService.reorderList(this.ordinance, list)
     }
 
   }

src/app/shared/gabinete-digital/expedientes-pr/expedientes-pr.module.ts

@@ -22,6 +22,8 @@ import { MatButtonModule } from '@angular/material/button';
 import { MatSelectModule } from '@angular/material/select';
 import { NgxMatMomentModule } from '@angular-material-components/moment-adapter';
 
+import { TaskListPageModule } from 'src/app/shared/gabinete-digital/generic/task-list/task-list.module'
+
 
 
 @NgModule({
@@ -30,6 +32,7 @@ import { NgxMatMomentModule } from '@angular-material-components/moment-adapter'
     FormsModule,
     IonicModule,
     ExpedientesPrPageRoutingModule,
+    TaskListPageModule,
     //
     MatInputModule,
     MatNativeDateModule,

src/app/shared/gabinete-digital/expedientes-pr/expedientes-pr.page.html

@@ -88,78 +88,13 @@
 </ion-header>
 <ion-content>
 
-  <div class="content width-100 overflow-y-auto height-100">
+  <app-task-list
-
+    [taskList] = list
-    <ion-list *ngIf="list.length >= 1">
+    [skeletonLoader] = skeletonLoader
-      <div
+    (viewTaskDetail)="goToExpediente($event)"
-        class=" item-hover ion-no-padding ion-no-margin cursor-pointer"
+    [filterName]="filterName"
-        *ngFor = "let task of list"
-        (click)="goToExpediente(task.SerialNumber)"
   >
-        <div class="item width-100 expediente" *ngIf="TaskService.filter(task, filterName)">
+  </app-task-list>
-          <div class="exp-top-detail">
-            <div class="subject d-flex">
-              <ion-label [class.gb-seen]="TaskService.seen(task)">{{ task.Subject }}</ion-label>
-              <span class="dead-line ml-10" *ngIf="TaskService.deadlineIsToday(task.Deadline)">Para hoje</span>
-              <span class="new-task ml-10" *ngIf="TaskService.lessThen24Hours(task.TaskReceiveDate)">Nova</span>
-            </div>
-            <div class="exp-icon">
-              <ion-icon *ngIf="ThemeService.currentTheme == 'default'"  src="assets/images/icons-expediente-attachment.svg"></ion-icon>
-              <ion-icon *ngIf="ThemeService.currentTheme == 'gov'"  src="assets/images/theme/gov/icons-expediente-attachment.svg"></ion-icon>
-              <label *ngIf="task.DocumentsQty != 0">{{task.DocumentsQty}}</label>
-            </div>
-          </div>
-          <div class="exp-bottom-detail">
-            <div class="exp-remetente">
-              <ion-label>{{task.Senders}}</ion-label>
-            </div>
-          </div>
-          <div class="exp-middle-detail">
-            <div class="exp-workflow">
-              <span class="label">{{task.activityInstanceName}}</span>
-            </div>
-            <div class="exp-date">
-              <ion-label>{{ task.CreateDate | date: 'dd-MM-yyyy HH:mm' }}</ion-label>
-            </div>
-          </div>
-        </div>
-      </div>
-    </ion-list>
-
-
-    <div
-      *ngIf="!skeletonLoader && list.length == 0 && list.length == 0"
-      class="empty-list d-flex height-100 align-center justify-content-center"
-    >
-      <span>Lista vazia</span>
-    </div>
-
-    <div *ngIf="skeletonLoader && list.length == 0">
-
-      <ion-list>
-        <ion-item>
-          <ion-thumbnail slot="end">
-            <ion-skeleton-text animated></ion-skeleton-text>
-          </ion-thumbnail>
-          <ion-label>
-            <h3><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></h3>
-            <p><ion-skeleton-text animated style="width: 80%"></ion-skeleton-text></p>
-            <p><ion-skeleton-text animated style="width: 60%"></ion-skeleton-text></p>
-          </ion-label>
-        </ion-item>
-        <ion-item>
-          <ion-thumbnail slot="end">
-            <ion-skeleton-text animated></ion-skeleton-text>
-          </ion-thumbnail>
-          <ion-label>
-            <h3><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></h3>
-            <p><ion-skeleton-text animated style="width: 80%"></ion-skeleton-text></p>
-            <p><ion-skeleton-text animated style="width: 60%"></ion-skeleton-text></p>
-          </ion-label>
-        </ion-item>
-      </ion-list>
-    </div>
-  </div>
 
 </ion-content>
 

src/app/shared/gabinete-digital/expedientes-pr/expedientes-pr.page.ts

@@ -150,9 +150,9 @@ export class ExpedientesPrPage implements OnInit {
     }, 2000);
   }
 
-  goToExpediente(serialNumber:any){
+  goToExpediente({SerialNumber}){
     /* this.router.navigate(['/home/gabinete-digital/expedientes-pr',serialNumber,'gabinete-digital']); */
-    this.router.navigate(['/home/gabinete-digital/expediente', serialNumber, 'gabinete-digital']);
+    this.router.navigate(['/home/gabinete-digital/expediente', SerialNumber, 'gabinete-digital']);
   }
 
 }

src/app/shared/gabinete-digital/expedients/expedients.module.ts

@@ -22,6 +22,8 @@ import { ReactiveFormsModule } from '@angular/forms';
 import { MatButtonModule } from '@angular/material/button';
 import { MatSelectModule } from '@angular/material/select';
 import { NgxMatMomentModule } from '@angular-material-components/moment-adapter';
+import { TaskListPageModule } from 'src/app/shared/gabinete-digital/generic/task-list/task-list.module'
+
 
 
 @NgModule({
@@ -30,6 +32,7 @@ import { NgxMatMomentModule } from '@angular-material-components/moment-adapter'
     FormsModule,
     IonicModule,
     ExpedientsPageRoutingModule,
+    TaskListPageModule,
     //
     MatInputModule,
     MatNativeDateModule,

src/app/shared/gabinete-digital/expedients/expedients.page.html

@@ -67,7 +67,6 @@
               Não lidos
             </mat-option>
   
-  
             <mat-option value="OverdueTasks">
               Em atraso
             </mat-option>
@@ -96,78 +95,13 @@
       </ion-refresher-content>
   </ion-refresher>
 
-  <div class="content width-100 overflow-y-auto height-100" >
+  <app-task-list
-    <div >
+    [taskList] = list
-
+    [skeletonLoader] = skeletonLoader
-      <ion-list *ngIf="list.length >=0">
+    (viewTaskDetail)="goToExpediente($event)"
-        <div
+    [filterName]="filterName"
-          class=" item-hover ion-no-padding ion-no-margin cursor-pointer"
-          *ngFor = "let task of list"
-          (click)="goToExpediente(task.SerialNumber)"
   >
-          <div class="item width-100 expediente" *ngIf="TaskService.filter(task, filterName)">
+  </app-task-list>
-            <div class="exp-top-detail">
-              <div class="subjectc d-flex">
-                <ion-label [class.gb-seen]="TaskService.seen(task)">{{ task.Subject }}</ion-label>
-                <span class="dead-line ml-10" *ngIf="TaskService.deadlineIsToday(task.Deadline)">Para hoje</span>
-                <span class="new-task ml-10" *ngIf="TaskService.lessThen24Hours(task.TaskReceiveDate)">Nova</span>
-              </div>
-              <div class="exp-icon">
-                <ion-icon *ngIf="ThemeService.currentTheme == 'default' "src="assets/images/icons-expediente-attachment.svg"></ion-icon>
-                <ion-icon *ngIf="ThemeService.currentTheme == 'gov' " src="assets/images/theme/gov/icons-expediente-attachment.svg"></ion-icon>
-                <label *ngIf="task.DocumentsQty != 0">{{task.DocumentsQty}}</label>
-              </div>
-            </div>
-            <div class="exp-bottom-detail">
-              <div class="exp-remetente">
-                <ion-label>{{task.Senders}}</ion-label>
-              </div>
-            </div>
-            <div class="exp-middle-detail">
-              <div class="exp-workflow">
-                <span class="label">{{task.activityInstanceName}}</span>
-              </div>
-              <div class="exp-date">
-                <ion-label>{{ task.CreateDate | date: 'dd-MM-yyyy HH:mm' }}</ion-label>
-              </div>
-            </div>
-          </div>
-        </div>
-      </ion-list>
-    </div>
-
-    <div
-      *ngIf="!skeletonLoader && list.length == 0"
-      class="empty-list d-flex height-100 align-center justify-content-center"
-    >
-      <span>Lista vazia</span>
-    </div>
-
-    <div *ngIf="skeletonLoader && list.length == 0">
-      <ion-list *ngIf="list.length == 0">
-        <ion-item>
-          <ion-thumbnail slot="end">
-            <ion-skeleton-text animated></ion-skeleton-text>
-          </ion-thumbnail>
-          <ion-label>
-            <h3><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></h3>
-            <p><ion-skeleton-text animated style="width: 80%"></ion-skeleton-text></p>
-            <p><ion-skeleton-text animated style="width: 60%"></ion-skeleton-text></p>
-          </ion-label>
-        </ion-item>
-        <ion-item>
-          <ion-thumbnail slot="end">
-            <ion-skeleton-text animated></ion-skeleton-text>
-          </ion-thumbnail>
-          <ion-label>
-            <h3><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></h3>
-            <p><ion-skeleton-text animated style="width: 80%"></ion-skeleton-text></p>
-            <p><ion-skeleton-text animated style="width: 60%"></ion-skeleton-text></p>
-          </ion-label>
-        </ion-item>
-      </ion-list>
-    </div>
-  </div>
 
 </ion-content>
 

src/app/shared/gabinete-digital/expedients/expedients.page.ts

@@ -147,17 +147,6 @@ export class ExpedientsPage implements OnInit {
     });
   }
 
-  // addProcessTODb(task) {
-  //   this.storage.set('gabinete-expediente', task).then(() => {
-      
-  //   })
-  // }
-
-  // getEventsFromLocalDb() {
-  //   this.storage.get('gabinete-expediente').then((expediente) => {
-  //     this.taskslist = expediente
-  //   })
-  // }
 
   doRefresh(event) {
     if (event) {
@@ -174,8 +163,8 @@ export class ExpedientsPage implements OnInit {
 
   }
 
-  goToExpediente(serialNumber: any) {
+  goToExpediente({SerialNumber}) {
-    this.router.navigate(['/home/gabinete-digital/expediente', serialNumber, 'gabinete-digital']);
+    this.router.navigate(['/home/gabinete-digital/expediente', SerialNumber, 'gabinete-digital']);
   }
 
   }

src/app/shared/gabinete-digital/generic/task-list-header/task-list-header-routing.module.ts

@@ -1,12 +1,12 @@
 import { NgModule } from '@angular/core';
 import { Routes, RouterModule } from '@angular/router';
 
-import { ExpedientsPage } from './expedients.page';
+import { TaskListHeaderPage } from './task-list-header.page';
 
 const routes: Routes = [
   {
     path: '',
-    component: ExpedientsPage
+    component: TaskListHeaderPage
   }
 ];
 
@@ -14,4 +14,4 @@ const routes: Routes = [
   imports: [RouterModule.forChild(routes)],
   exports: [RouterModule],
 })
-export class ExpedientsPageRoutingModule {}
+export class TaskListHeaderPageRoutingModule {}

src/app/shared/gabinete-digital/generic/task-list-header/task-list-header.module.ts

@@ -0,0 +1,27 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+
+import { IonicModule } from '@ionic/angular';
+
+import { TaskListHeaderPageRoutingModule } from './task-list-header-routing.module';
+
+import { TaskListHeaderPage } from './task-list-header.page';
+import { MatSelectModule } from '@angular/material/select';
+import { BtnModalDismissPageModule } from 'src/app/shared/btn-modal-dismiss/btn-modal-dismiss.module';
+
+
+@NgModule({
+  imports: [
+    CommonModule,
+    FormsModule,
+    IonicModule,
+    TaskListHeaderPageRoutingModule,
+    //
+    MatSelectModule,
+    BtnModalDismissPageModule
+  ],
+  declarations: [TaskListHeaderPage],
+  exports: [TaskListHeaderPage]
+})
+export class TaskListHeaderPageModule {}

src/app/shared/gabinete-digital/generic/task-list-header/task-list-header.page.html

@@ -0,0 +1,92 @@
+<div>
+  <ion-progress-bar type="indeterminate" *ngIf="loading && loaderTop"></ion-progress-bar>
+  <div class="px-20 pt-30 d-flex justify-space-between">
+    <div class="d-flex align-center pointer">
+      <div class="font-35 d-flex" *ngIf="goBackButton" (click)="goBack.emit()">
+        <ion-icon *ngIf="ThemeService.currentTheme == 'default' " slot="end" src='assets/images/icons-arrow-arrow-left.svg'></ion-icon>
+        <ion-icon *ngIf="ThemeService.currentTheme == 'gov' " slot="end" src='assets/images/theme/gov/icons-calendar-arrow-left.svg'></ion-icon>
+        <ion-icon *ngIf="ThemeService.currentTheme == 'doneIt' " slot="end" src='assets/images/theme/{{ThemeService.currentTheme}}/icons-calendar-arrow-left.svg'></ion-icon>
+      </div>
+      <ion-label class="font-25"  >{{ headerName }}</ion-label>
+    </div>
+    <div class="d-flex align-center ">
+
+      <!-- <div>
+        <div title="Pesquisa" *ngIf="!hideSearchBtn" class="mr-20 d-flex align-center cursor-pointer">
+          <div (click)="openSearch();showSearch=true" *ngIf="!showSearch" class="d-flex">
+            <ion-icon title="Perfil" *ngIf="ThemeService.currentTheme == 'doneIt' " class="font-35" src="assets/images/theme/doneIt/icons-search.svg"></ion-icon>
+            <ion-icon title="Perfil" *ngIf="ThemeService.currentTheme == 'default' " class="font-35" src='assets/images/icons-search.svg'></ion-icon>
+            <ion-icon title="Perfil" *ngIf="ThemeService.currentTheme == 'gov' " class="font-35" src='assets/images/theme/gov/icons-search.svg'></ion-icon>
+          </div>
+          <button title="Fechar" class="btn-no-color d-flex" (click)="closeSearch();showSearch=false;searchSubject=''" *ngIf="showSearch">
+            <ion-icon *ngIf="ThemeService.currentTheme == 'default' || ThemeService.currentTheme == 'doneIt' " class="font-35" name="restaurant-outline" src="assets/images/icons-search-close.svg"></ion-icon>
+            <ion-icon *ngIf="ThemeService.currentTheme == 'gov' " class="font-35" name="restaurant-outline" src="assets/images/theme/gov/icons-search-close.svg"></ion-icon>
+          </button>
+
+          <div *ngIf="showSearch">
+            <div class="d-flex search-input-container ml-10 justify-between" *ngIf="showSearch">
+              <div class="input-text d-flex ion-align-items-center">
+                <ion-input (keyup.enter)="basicSearch()" [(ngModel)]='searchSubject' (ngModelChange)="dynamicSearch()"
+                  class="search-input text-black" type="search" placeholder="Pesquisar"></ion-input>
+              </div>
+              
+              <div (click)="basicSearch()"  class="d-flex align-center icon">
+
+                <ion-icon  class="icon-z" slot="end" src="assets/images/theme/gov/search.svg"></ion-icon>
+    
+              </div>
+            </div>
+          </div>
+        </div>
+      </div> -->
+
+      <div>
+        <div class="d-flex" (click)="reorderList.emit('old')" *ngIf="ordinance == 'recent' ">
+
+          <ion-icon  class="mr-10 font-25"  src="assets/images/theme/gov/crescente.svg" ></ion-icon>
+        </div>
+  
+        <div class="d-flex" (click)="reorderList.emit('recent')" *ngIf="ordinance != 'recent' ">
+          <ion-icon  class="mr-10 font-25"  src="assets/images/theme/gov/decrescente.svg" ></ion-icon>
+        </div>
+      </div>
+
+      <div>
+        <mat-form-field class="task-filter-input" appearance="none"   color="ion-color-secondary"  placeholder="Selecione agenda">
+          <mat-select [(value)]="filterName" (valueChange)="changeFilterName.emit(filterName)">
+  
+            <mat-option value="Para hoje" >
+              Para hoje
+            </mat-option>
+  
+            <mat-option value="Novos" >
+              Novos
+            </mat-option>
+  
+            <mat-option value="Lidos" >
+              Lidos
+            </mat-option>
+  
+            <mat-option value="Não lidos" >
+              Não lidos
+            </mat-option>
+  
+            <mat-option value="OverdueTasks">
+              Em atraso
+            </mat-option>
+  
+            <mat-option value="Todos" >
+              Todos
+            </mat-option>
+  
+          </mat-select>
+        </mat-form-field>
+      </div>
+
+      <!-- <button title="Atualizar" class="btn-no-color" (click)="doRefresh($event)">
+        <ion-icon slot="end" class="title-icon font-awesome" name="reload-circle"></ion-icon>
+      </button> -->
+    </div>
+  </div>
+  <ion-progress-bar class="px-20" type="indeterminate" *ngIf="loading && loaderBottom"></ion-progress-bar>
+</div>

src/app/shared/gabinete-digital/generic/task-list-header/task-list-header.page.scss

@@ -0,0 +1,17 @@
+.main-header{
+    font-family: Roboto;
+    font-size: 25px;
+    color:#000;
+    overflow: auto;
+    padding: 30px 20px 0 20px !important;
+    margin: 0;
+
+    .thetitle{
+      width: fit-content;
+      float: left;
+    }
+    .theicon{
+      width: fit-content;
+      float: right;
+    }
+}

src/app/shared/gabinete-digital/generic/task-list-header/task-list-header.page.spec.ts

@@ -1,19 +1,19 @@
 import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { IonicModule } from '@ionic/angular';
 
-import { ExpedientsPage } from './expedients.page';
+import { TaskListHeaderPage } from './task-list-header.page';
 
-describe('ExpedientsPage', () => {
+describe('TaskListHeaderPage', () => {
-  let component: ExpedientsPage;
+  let component: TaskListHeaderPage;
-  let fixture: ComponentFixture<ExpedientsPage>;
+  let fixture: ComponentFixture<TaskListHeaderPage>;
 
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
-      declarations: [ ExpedientsPage ],
+      declarations: [ TaskListHeaderPage ],
       imports: [IonicModule.forRoot()]
     }).compileComponents();
 
-    fixture = TestBed.createComponent(ExpedientsPage);
+    fixture = TestBed.createComponent(TaskListHeaderPage);
     component = fixture.componentInstance;
     fixture.detectChanges();
   }));

src/app/shared/gabinete-digital/generic/task-list-header/task-list-header.page.ts

@@ -0,0 +1,30 @@
+import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
+import { environment } from 'src/environments/environment';
+import { ThemeService } from 'src/app/services/theme.service';
+
+@Component({
+  selector: 'app-task-list-header',
+  templateUrl: './task-list-header.page.html',
+  styleUrls: ['./task-list-header.page.scss'],
+})
+export class TaskListHeaderPage implements OnInit {
+
+  @Input() headerName = 'name'
+  @Input() goBackButton = false
+  @Input() loading = true
+  @Input() loaderTop = false;
+  @Input() loaderBottom = false;
+  @Output() goBack = new EventEmitter<any>();
+  @Output() reorderList = new EventEmitter<any>();
+  @Output() changeFilterName = new EventEmitter<any>();
+
+  environment = environment
+  filterName: 'Para hoje' | 'Novos'| 'Lidos'| 'Não lidos'|  'OverdueTasks' | 'Todos' = 'Todos'
+  @Input() ordinance: string =  'old'
+
+  constructor(
+    public ThemeService: ThemeService,
+  ) { }
+
+  ngOnInit() {}
+}

src/app/shared/gabinete-digital/generic/task-list/task-list.page.html

@@ -1,8 +1,8 @@
 <ion-content>
-  <div class="overflow-y-auto height-100 width-100 px-20">
+  <div class="overflow-y-auto height-100 width-100 px-20 d-flex task-list-com">
 
-    <div *ngIf="taskList.length >= 0">
+    <div *ngIf="taskList.length >= 1" class="width-100">
-      <ion-list part="divo">
+      <ion-list part="divo" class="width-100">
         <div
           class=" item-hover ion-no-padding ion-no-margin cursor-pointer"
           *ngFor = "let task of taskList; let i = index"
@@ -43,12 +43,12 @@
 
     <div
       *ngIf="!skeletonLoader && taskList.length == 0"
-      class="empty-list d-flex height-100 align-center justify-content-center"
+      class="empty-list d-flex height-100 width-100 align-center justify-content-center"
     >
       <span>Lista vazia</span>
     </div>
 
-    <div *ngIf="skeletonLoader && taskList.length == 0">
+    <div class="width-100" *ngIf="skeletonLoader && taskList.length == 0">
 
       <ion-list>
         <ion-item>

src/app/shared/gabinete-digital/generic/task-list/task-list.page.ts

@@ -18,9 +18,7 @@ export class TaskListPage implements OnInit {
   constructor(
     public ThemeService: ThemeService,
     public TaskService: TaskService
-  ) {
+  ) {}
-    
-  }
 
   ngOnInit() {}
 

src/app/shared/gabinete-digital/generic/task-listt-header/task-listt-header-routing.module.ts

@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+
+import { TaskListtHeaderPage } from './task-listt-header.page';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: TaskListtHeaderPage
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class TaskListtHeaderPageRoutingModule {}

src/app/shared/gabinete-digital/generic/task-listt-header/task-listt-header.module.ts

@@ -4,18 +4,17 @@ import { FormsModule } from '@angular/forms';
 
 import { IonicModule } from '@ionic/angular';
 
-import { ExpedientsPageRoutingModule } from './expedients-routing.module';
+import { TaskListtHeaderPageRoutingModule } from './task-listt-header-routing.module';
 
-import { ExpedientsPage } from './expedients.page';
+import { TaskListtHeaderPage } from './task-listt-header.page';
 
 @NgModule({
   imports: [
     CommonModule,
     FormsModule,
     IonicModule,
-    ExpedientsPageRoutingModule
+    TaskListtHeaderPageRoutingModule
   ],
-  exports: [ExpedientsPage],
+  declarations: [TaskListtHeaderPage]
-  declarations: [ExpedientsPage]
 })
-export class ExpedientsPageModule {}
+export class TaskListtHeaderPageModule {}

src/app/shared/gabinete-digital/generic/task-listt-header/task-listt-header.page.html

@@ -0,0 +1,9 @@
+<ion-header>
+  <ion-toolbar>
+    <ion-title>taskListtHeader</ion-title>
+  </ion-toolbar>
+</ion-header>
+
+<ion-content>
+
+</ion-content>

src/app/shared/gabinete-digital/generic/task-listt-header/task-listt-header.page.spec.ts

@@ -0,0 +1,24 @@
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+import { IonicModule } from '@ionic/angular';
+
+import { TaskListtHeaderPage } from './task-listt-header.page';
+
+describe('TaskListtHeaderPage', () => {
+  let component: TaskListtHeaderPage;
+  let fixture: ComponentFixture<TaskListtHeaderPage>;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [ TaskListtHeaderPage ],
+      imports: [IonicModule.forRoot()]
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(TaskListtHeaderPage);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  }));
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/shared/gabinete-digital/generic/task-listt-header/task-listt-header.page.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-task-listt-header',
+  templateUrl: './task-listt-header.page.html',
+  styleUrls: ['./task-listt-header.page.scss'],
+})
+export class TaskListtHeaderPage implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}

src/environments/environment.ts

@@ -4,4 +4,4 @@ import { doneITDev } from './suport/doneIt'
 import { DevDev } from './suport/dev'
 
 
-export const environment: Environment = doneITDev
+export const environment: Environment = DevDev