changes

2026-04-20 21:35:50 +00:00 · 2023-05-25 16:41:39 +01:00
parent d61f5b2045 11d9e22f11
commit 451718422a
117 changed files with 1685 additions and 1853 deletions
@@ -1,289 +1,297 @@
-import { NgModule } from '@angular/core';
-import { PreloadAllModules, RouterModule, Routes } from '@angular/router';
-
-const routes = [
-  {
-    path: '',
-    loadChildren: () => import('./index/index.module').then(m => m.IndexPageModule)
+import { NgModule } from '@angular/core';
+import { PreloadAllModules, RouterModule, Routes } from '@angular/router';
+
+const routes = [
+  {
+    path: '',
+    loadChildren: () => import('./index/index.module').then(m => m.IndexPageModule)
+  },
+  {
+    path: '',
+    loadChildren: () => import('./home/home.module').then( m => m.HomePageModule)
+  },
+  {
+    path: 'empty-chat',
+    loadChildren: () => import('./shared/chat/empty-chat/empty-chat.module').then( m => m.EmptyChatPageModule)
+  },
+  {
+    path: 'empty-container',
+    loadChildren: () => import('./shared/empty-container/empty-container.module').then( m => m.EmptyContainerPageModule)
+  },
+  {
+    path: 'events-to-approve',
+    loadChildren: () => import('./shared/gabinete-digital/events-to-approve/events-to-approve.module').then( m => m.EventsToApprovePageModule)
+  },
+  {
+    path: 'expedients',
+    loadChildren: () => import('./shared/gabinete-digital/expedients/expedients.module').then( m => m.ExpedientsPageModule)
+  },
+  {
+    path: 'document-detail',
+    loadChildren: () => import('./modals/document-detail/document-detail.module').then( m => m.DocumentDetailPageModule)
+  },
+  {
+    path: 'edit-group',
+    loadChildren: () => import('./shared/chat/edit-group/edit-group.module').then( m => m.EditGroupPageModule)
+  },
+  {
+    path: 'pedidos',
+    loadChildren: () => import('./shared/gabinete-digital/pedidos/pedidos.module').then( m => m.PedidosPageModule)
+  },
+  {
+    path: 'event-list',
+    loadChildren: () => import('./pages/gabinete-digital/event-list/event-list.module').then(m =>m.EventListPageModule)
+  },
+  {
+    path: 'despachos',
+    loadChildren: () => import('./shared/gabinete-digital/despachos/despachos.module').then( m => m.DespachosPageModule)
+  },
+  {
+    path: 'create-process',
+    loadChildren: () => import('./modals/create-process/create-process.module').then( m => m.CreateProcessPageModule)
+  },
+  {
+    path: 'pendentes',
+    loadChildren: () => import('./shared/gabinete-digital/pendentes/pendentes.module').then( m => m.PendentesPageModule)
+  },
+  {
+    path: 'delegar',
+    loadChildren: () => import('./modals/delegar/delegar.module').then( m => m.DelegarPageModule)
+  },
+  {
+    path: 'add-note',
+    loadChildren: () => import('./modals/add-note/add-note.module').then( m => m.AddNotePageModule)
+  },
+  {
+    path: 'dar-parecer',
+    loadChildren: () => import('./modals/dar-parecer/dar-parecer.module').then( m => m.DarParecerPageModule)
+  },
+  {
+    path: 'opts-expediente',
+    loadChildren: () => import('./shared/popover/opts-expediente/opts-expediente.module').then( m => m.OptsExpedientePageModule)
+  },
+  {
+    path: 'despachos-pr',
+    loadChildren: () => import('./shared/gabinete-digital/despachos-pr/despachos-pr.module').then( m => m.DespachosPrPageModule)
+  },
+  {
+    path: 'diplomas',
+    loadChildren: () => import('./shared/gabinete-digital/diplomas/diplomas.module').then( m => m.DiplomasPageModule)
+  },
+  {
+    path: 'expedientes-pr',
+    loadChildren: () => import('./shared/gabinete-digital/expedientes-pr/expedientes-pr.module').then( m => m.ExpedientesPrPageModule)
+  },
+  {
+    path: 'diplomas-assinar',
+    loadChildren: () => import('./shared/gabinete-digital/diplomas-assinar/diplomas-assinar.module').then( m => m.DiplomasAssinarPageModule)
+  },
+  {
+    path: 'opts-expediente-pr',
+    loadChildren: () => import('./shared/popover/opts-expediente-pr/opts-expediente-pr.module').then( m => m.OptsExpedientePrPageModule)
+  },
+  {
+    path: 'despachos-options',
+    loadChildren: () => import('./shared/popover/despachos-options/despachos-options.module').then( m => m.DespachosOptionsPageModule)
+  },
+  {
+    path: 'despachos-pr-options',
+    loadChildren: () => import('./shared/popover/despachos-pr-options/despachos-pr-options.module').then( m => m.DespachosPrOptionsPageModule)
+  },
+  {
+    path: 'deploma-options',
+    loadChildren: () => import('./shared/popover/deploma-options/deploma-options.module').then( m => m.DeplomaOptionsPageModule)
+  },
+  {
+    path: 'pin',
+    loadChildren: () => import('./shared/pin/pin.module').then( m => m.PinPageModule)
+  },
+  {
+    path: 'fingerprint',
+    loadChildren: () => import('./shared/fingerprint/fingerprint.module').then( m => m.FingerprintPageModule)
+  },
+  {
+    path: 'new-event',
+    loadChildren: () => import('./shared/agenda/new-event/new-event.module').then( m => m.NewEventPageModule)
+  },
+  {
+    path: 'event-list',
+    loadChildren: () => import('./shared/agenda/event-list/event-list.module').then( m => m.EventListPageModule)
+  },
+  {
+    path: 'approve-event',
+    loadChildren: () => import('./shared/agenda/approve-event/approve-event.module').then( m => m.ApproveEventPageModule)
+  },
+  {
+    path: 'bad-request',
+    loadChildren: () => import('./shared/popover/bad-request/bad-request.module').then( m => m.BadRequestPageModule)
+  },
+  {
+    path: 'success-message',
+    loadChildren: () => import('./shared/popover/success-message/success-message.module').then( m => m.SuccessMessagePageModule)
+  },
+  {
+    path: 'forward',
+    loadChildren: () => import('./modals/forward/forward.module').then( m => m.ForwardPageModule)
+  },
+  {
+    path: 'edit-event-to-approve',
+    loadChildren: () => import('./shared/agenda/edit-event-to-approve/edit-event-to-approve.module').then( m => m.EditEventToApprovePageModule)
+  },
+  {
+    path: 'actions-options',
+    loadChildren: () => import('./shared/popover/actions-options/actions-options.module').then( m => m.ActionsOptionsPageModule)
+  },
+  {
+    path: 'edit-action',
+    loadChildren: () => import('./shared/publication/edit-action/edit-action.module').then( m => m.EditActionPageModule)
+  },
+  {
+    path: 'eliminate-event',
+    loadChildren: () => import('./modals/eliminate-event/eliminate-event.module').then( m => m.EliminateEventPageModule)
+  },
+  {
+    path: 'inactivity',
+    loadChildren: () => import('./pages/inactivity/inactivity.module').then( m => m.InactivityPageModule)
+  },
+  {
+    path: 'document-set-up-meeting',
+    loadChildren: () => import('./modals/document-set-up-meeting/document-set-up-meeting.module').then( m => m.DocumentSetUpMeetingPageModule)
+  },
+  {
+    path: 'profile',
+    loadChildren: () => import('./modals/profile/profile.module').then( m => m.ProfilePageModule)
+  },
+  {
+    path: 'all-processes',
+    loadChildren: () => import('./shared/gabinete-digital/all-processes/all-processes.module').then( m => m.AllProcessesPageModule)
+  },
+  {
+    path: 'searched-document-options',
+    loadChildren: () => import('./shared/popover/searched-document-options/searched-document-options.module').then( m => m.SearchedDocumentOptionsPageModule)
+  },
+  {
+    path: 'task-list',
+    loadChildren: () => import('./shared/gabinete-digital/generic/task-list/task-list.module').then( m => m.TaskListPageModule)
+  },
+  {
+    path: 'task-list',
+    loadChildren: () => import('./shared/gabinete-digital/generic/task-list/task-list.module').then( m => m.TaskListPageModule)
+  },
+  {
+    path: 'task-detailde',
+    loadChildren: () => import('./shared/gabinete-digital/generic/task-detailde/task-detailde.module').then( m => m.TaskDetaildePageModule)
+  },
+  {
+    path: 'task-details',
+    loadChildren: () => import('./shared/gabinete-digital/generic/task-details/task-details.module').then( m => m.TaskDetailsPageModule)
+  },
+  {
+    path: 'chat-options-features',
+    loadChildren: () => import('./modals/chat-options-features/chat-options-features.module').then( m => m.ChatOptionsFeaturesPageModule)
+  },
+  {
+    path: 'document-viewer',
+    loadChildren: () => import('./modals/document-viewer/document-viewer.module').then( m => m.DocumentViewerPageModule)
+  },
+  {
+    path: 'view-document',
+    loadChildren: () => import('./modals/view-document/view-document.module').then( m => m.ViewDocumentPageModule)
+  },
+  {
+    path: 'event-details-documents-options',
+    loadChildren: () => import('./shared/popover/event-details-documents-options/event-details-documents-options.module').then( m => m.EventDetailsDocumentsOptionsPageModule)
+  },
+  {
+    path: 'preview-camera',
+    loadChildren: () => import('./modals/preview-camera/preview-camera.module').then( m => m.PreviewCameraPageModule)
+  },
+  {
+    path: 'group-icons',
+    loadChildren: () => import('./modals/group-icons/group-icons.module').then( m => m.GroupIconsPageModule)
+  },
+  {
+    path: 'video-allowed',
+    loadChildren: () => import('./modals/video-allowed/video-allowed.module').then( m => m.VideoAllowedPageModule)
+  },
+  {
+    path: 'preview-photo',
+    loadChildren: () => import('./modals/preview-photo/preview-photo.module').then( m => m.PreviewPhotoPageModule)
+  },
+  {
+    path: 'custom-image-cache',
+    loadChildren: () => import('./services/file/custom-image-cache/custom-image-cache.module').then( m => m.CustomImageCachePageModule)
+  },
+  {
+    path: 'view-media',
+    loadChildren: () => import('./modals/view-media/view-media.module').then( m => m.ViewMediaPageModule)
+  },
+  {
+    path: 'view-event',
+    loadChildren: () => import('./modals/view-event/view-event.module').then( m => m.ViewEventPageModule)
+  },
+  {
+    path: 'previewer',
+    loadChildren: () => import('./modals/previewer/previewer.module').then( m => m.PreviewerPageModule)
+  },
+  {
+    path: 'set-room-owner',
+    loadChildren: () => import('./modals/set-room-owner/set-room-owner.module').then( m => m.SetRoomOwnerPageModule)
+  },
+  {
+    path: 'diplomas-gerar',
+    loadChildren: () => import('./shared/gabinete-digital/diplomas-gerar/diplomas-gerar.module').then( m => m.DiplomasGerarPageModule)
+  },
+  {
+    path: 'diplomas-gerar-options',
+    loadChildren: () => import('./shared/popover/diplomas-gerar-options/diplomas-gerar-options.module').then( m => m.DiplomasGerarOptionsPageModule)
+  },
+  {
+    path: 'chat-debugging',
+    loadChildren: () => import('./shared/popover/chat-debugging/chat-debugging.module').then( m => m.ChatDebuggingPageModule)
+  },
+  {
+    path: 'chat-message-debugging',
+    loadChildren: () => import('./shared/popover/chat-message-debugging/chat-message-debugging.module').then( m => m.ChatMessageDebuggingPageModule)
+  },
+  {
+    path: 'add-user',
+    loadChildren: () => import('./shared/chat/add-user/add-user.module').then( m => m.AddUserPageModule)
+  },
+  {
+    path: 'information',
+    loadChildren: () => import('./modals/information/information.module').then( m => m.InformationPageModule)
+  }, 
+  {
+    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: '',
-    loadChildren: () => import('./home/home.module').then( m => m.HomePageModule)
-  },
-  {
-    path: 'empty-chat',
-    loadChildren: () => import('./shared/chat/empty-chat/empty-chat.module').then( m => m.EmptyChatPageModule)
-  },
-  {
-    path: 'empty-container',
-    loadChildren: () => import('./shared/empty-container/empty-container.module').then( m => m.EmptyContainerPageModule)
-  },
-  {
-    path: 'events-to-approve',
-    loadChildren: () => import('./shared/gabinete-digital/events-to-approve/events-to-approve.module').then( m => m.EventsToApprovePageModule)
-  },
-  {
-    path: 'expedients',
-    loadChildren: () => import('./shared/gabinete-digital/expedients/expedients.module').then( m => m.ExpedientsPageModule)
-  },
-  {
-    path: 'document-detail',
-    loadChildren: () => import('./modals/document-detail/document-detail.module').then( m => m.DocumentDetailPageModule)
-  },
-  {
-    path: 'edit-group',
-    loadChildren: () => import('./shared/chat/edit-group/edit-group.module').then( m => m.EditGroupPageModule)
-  },
-  {
-    path: 'pedidos',
-    loadChildren: () => import('./shared/gabinete-digital/pedidos/pedidos.module').then( m => m.PedidosPageModule)
-  },
-  {
-    path: 'event-list',
-    loadChildren: () => import('./pages/gabinete-digital/event-list/event-list.module').then(m =>m.EventListPageModule)
-  },
-  {
-    path: 'despachos',
-    loadChildren: () => import('./shared/gabinete-digital/despachos/despachos.module').then( m => m.DespachosPageModule)
-  },
-  {
-    path: 'create-process',
-    loadChildren: () => import('./modals/create-process/create-process.module').then( m => m.CreateProcessPageModule)
-  },
-  {
-    path: 'pendentes',
-    loadChildren: () => import('./shared/gabinete-digital/pendentes/pendentes.module').then( m => m.PendentesPageModule)
-  },
-  {
-    path: 'delegar',
-    loadChildren: () => import('./modals/delegar/delegar.module').then( m => m.DelegarPageModule)
-  },
-  {
-    path: 'add-note',
-    loadChildren: () => import('./modals/add-note/add-note.module').then( m => m.AddNotePageModule)
-  },
-  {
-    path: 'dar-parecer',
-    loadChildren: () => import('./modals/dar-parecer/dar-parecer.module').then( m => m.DarParecerPageModule)
-  },
-  {
-    path: 'opts-expediente',
-    loadChildren: () => import('./shared/popover/opts-expediente/opts-expediente.module').then( m => m.OptsExpedientePageModule)
-  },
-  {
-    path: 'despachos-pr',
-    loadChildren: () => import('./shared/gabinete-digital/despachos-pr/despachos-pr.module').then( m => m.DespachosPrPageModule)
-  },
-  {
-    path: 'diplomas',
-    loadChildren: () => import('./shared/gabinete-digital/diplomas/diplomas.module').then( m => m.DiplomasPageModule)
-  },
-  {
-    path: 'expedientes-pr',
-    loadChildren: () => import('./shared/gabinete-digital/expedientes-pr/expedientes-pr.module').then( m => m.ExpedientesPrPageModule)
-  },
-  {
-    path: 'diplomas-assinar',
-    loadChildren: () => import('./shared/gabinete-digital/diplomas-assinar/diplomas-assinar.module').then( m => m.DiplomasAssinarPageModule)
-  },
-  {
-    path: 'opts-expediente-pr',
-    loadChildren: () => import('./shared/popover/opts-expediente-pr/opts-expediente-pr.module').then( m => m.OptsExpedientePrPageModule)
-  },
-  {
-    path: 'despachos-options',
-    loadChildren: () => import('./shared/popover/despachos-options/despachos-options.module').then( m => m.DespachosOptionsPageModule)
-  },
-  {
-    path: 'despachos-pr-options',
-    loadChildren: () => import('./shared/popover/despachos-pr-options/despachos-pr-options.module').then( m => m.DespachosPrOptionsPageModule)
-  },
-  {
-    path: 'deploma-options',
-    loadChildren: () => import('./shared/popover/deploma-options/deploma-options.module').then( m => m.DeplomaOptionsPageModule)
-  },
-  {
-    path: 'pin',
-    loadChildren: () => import('./shared/pin/pin.module').then( m => m.PinPageModule)
-  },
-  {
-    path: 'fingerprint',
-    loadChildren: () => import('./shared/fingerprint/fingerprint.module').then( m => m.FingerprintPageModule)
-  },
-  {
-    path: 'new-event',
-    loadChildren: () => import('./shared/agenda/new-event/new-event.module').then( m => m.NewEventPageModule)
-  },
-  {
-    path: 'event-list',
-    loadChildren: () => import('./shared/agenda/event-list/event-list.module').then( m => m.EventListPageModule)
-  },
-  {
-    path: 'approve-event',
-    loadChildren: () => import('./shared/agenda/approve-event/approve-event.module').then( m => m.ApproveEventPageModule)
-  },
-  {
-    path: 'bad-request',
-    loadChildren: () => import('./shared/popover/bad-request/bad-request.module').then( m => m.BadRequestPageModule)
-  },
-  {
-    path: 'success-message',
-    loadChildren: () => import('./shared/popover/success-message/success-message.module').then( m => m.SuccessMessagePageModule)
-  },
-  {
-    path: 'forward',
-    loadChildren: () => import('./modals/forward/forward.module').then( m => m.ForwardPageModule)
-  },
-  {
-    path: 'edit-event-to-approve',
-    loadChildren: () => import('./shared/agenda/edit-event-to-approve/edit-event-to-approve.module').then( m => m.EditEventToApprovePageModule)
-  },
-  {
-    path: 'actions-options',
-    loadChildren: () => import('./shared/popover/actions-options/actions-options.module').then( m => m.ActionsOptionsPageModule)
-  },
-  {
-    path: 'edit-action',
-    loadChildren: () => import('./shared/publication/edit-action/edit-action.module').then( m => m.EditActionPageModule)
-  },
-  {
-    path: 'eliminate-event',
-    loadChildren: () => import('./modals/eliminate-event/eliminate-event.module').then( m => m.EliminateEventPageModule)
-  },
-  {
-    path: 'inactivity',
-    loadChildren: () => import('./pages/inactivity/inactivity.module').then( m => m.InactivityPageModule)
-  },
-  {
-    path: 'document-set-up-meeting',
-    loadChildren: () => import('./modals/document-set-up-meeting/document-set-up-meeting.module').then( m => m.DocumentSetUpMeetingPageModule)
-  },
-  {
-    path: 'profile',
-    loadChildren: () => import('./modals/profile/profile.module').then( m => m.ProfilePageModule)
-  },
-  {
-    path: 'all-processes',
-    loadChildren: () => import('./shared/gabinete-digital/all-processes/all-processes.module').then( m => m.AllProcessesPageModule)
-  },
-  {
-    path: 'searched-document-options',
-    loadChildren: () => import('./shared/popover/searched-document-options/searched-document-options.module').then( m => m.SearchedDocumentOptionsPageModule)
-  },
-  {
-    path: 'task-list',
-    loadChildren: () => import('./shared/gabinete-digital/generic/task-list/task-list.module').then( m => m.TaskListPageModule)
-  },
-  {
-    path: 'task-list',
-    loadChildren: () => import('./shared/gabinete-digital/generic/task-list/task-list.module').then( m => m.TaskListPageModule)
-  },
-  {
-    path: 'task-detailde',
-    loadChildren: () => import('./shared/gabinete-digital/generic/task-detailde/task-detailde.module').then( m => m.TaskDetaildePageModule)
-  },
-  {
-    path: 'task-details',
-    loadChildren: () => import('./shared/gabinete-digital/generic/task-details/task-details.module').then( m => m.TaskDetailsPageModule)
-  },
-  {
-    path: 'chat-options-features',
-    loadChildren: () => import('./modals/chat-options-features/chat-options-features.module').then( m => m.ChatOptionsFeaturesPageModule)
-  },
-  {
-    path: 'document-viewer',
-    loadChildren: () => import('./modals/document-viewer/document-viewer.module').then( m => m.DocumentViewerPageModule)
-  },
-  {
-    path: 'view-document',
-    loadChildren: () => import('./modals/view-document/view-document.module').then( m => m.ViewDocumentPageModule)
-  },
-  {
-    path: 'event-details-documents-options',
-    loadChildren: () => import('./shared/popover/event-details-documents-options/event-details-documents-options.module').then( m => m.EventDetailsDocumentsOptionsPageModule)
-  },
-  {
-    path: 'preview-camera',
-    loadChildren: () => import('./modals/preview-camera/preview-camera.module').then( m => m.PreviewCameraPageModule)
-  },
-  {
-    path: 'group-icons',
-    loadChildren: () => import('./modals/group-icons/group-icons.module').then( m => m.GroupIconsPageModule)
-  },
-  {
-    path: 'video-allowed',
-    loadChildren: () => import('./modals/video-allowed/video-allowed.module').then( m => m.VideoAllowedPageModule)
-  },
-  {
-    path: 'preview-photo',
-    loadChildren: () => import('./modals/preview-photo/preview-photo.module').then( m => m.PreviewPhotoPageModule)
-  },
-  {
-    path: 'custom-image-cache',
-    loadChildren: () => import('./services/file/custom-image-cache/custom-image-cache.module').then( m => m.CustomImageCachePageModule)
-  },
-  {
-    path: 'view-media',
-    loadChildren: () => import('./modals/view-media/view-media.module').then( m => m.ViewMediaPageModule)
-  },
-  {
-    path: 'view-event',
-    loadChildren: () => import('./modals/view-event/view-event.module').then( m => m.ViewEventPageModule)
-  },
-  {
-    path: 'previewer',
-    loadChildren: () => import('./modals/previewer/previewer.module').then( m => m.PreviewerPageModule)
-  },
-  {
-    path: 'set-room-owner',
-    loadChildren: () => import('./modals/set-room-owner/set-room-owner.module').then( m => m.SetRoomOwnerPageModule)
-  },
-  {
-    path: 'diplomas-gerar',
-    loadChildren: () => import('./shared/gabinete-digital/diplomas-gerar/diplomas-gerar.module').then( m => m.DiplomasGerarPageModule)
-  },
-  {
-    path: 'diplomas-gerar-options',
-    loadChildren: () => import('./shared/popover/diplomas-gerar-options/diplomas-gerar-options.module').then( m => m.DiplomasGerarOptionsPageModule)
-  },
-  {
-    path: 'chat-debugging',
-    loadChildren: () => import('./shared/popover/chat-debugging/chat-debugging.module').then( m => m.ChatDebuggingPageModule)
-  },
-  {
-    path: 'chat-message-debugging',
-    loadChildren: () => import('./shared/popover/chat-message-debugging/chat-message-debugging.module').then( m => m.ChatMessageDebuggingPageModule)
-  },
-  {
-    path: 'add-user',
-    loadChildren: () => import('./shared/chat/add-user/add-user.module').then( m => m.AddUserPageModule)
-  },
-  {
-    path: 'information',
-    loadChildren: () => import('./modals/information/information.module').then( m => m.InformationPageModule)
-  }, 
-  {
-    path: 'chat-options-popover',
-    loadChildren:() => import('./shared/popover/chat-options-popover/chat-options-popover.module').then( m => m.ChatOptionsPopoverPageModule)
+  {
+    path: 'task-list-header',
    loadChildren: () => import('./shared/gabinete-digital/generic/task-list-header/task-list-header.module').then( m => m.TaskListHeaderPageModule)
  }
-
- /*
-    path: 'chat',
-    component: ChatPage
-  } */
-
- /*
-    path: 'chat',
-    component: ChatPage
-  } */
-
-];
-@NgModule({
-  imports: [
-    RouterModule.forRoot(routes,
-      { preloadingStrategy: PreloadAllModules })
-  ],
-  exports: [RouterModule]
-})
-export class AppRoutingModule {}
+
+
+
+ /*
+    path: 'chat',
+    component: ChatPage
+  } */
+
+ /*
+    path: 'chat',
+    component: ChatPage
+  } */
+
+];
+@NgModule({
+  imports: [
+    RouterModule.forRoot(routes,
+      { preloadingStrategy: PreloadAllModules })
+  ],
+  exports: [RouterModule]
+})
@@ -25,6 +25,14 @@
                  <!-- Move back one screen of the slides -->


+                  <div class="arrow cursor-pointer resize">
+                    <button (click)="back()" class="btn-no-color resize" >
+                      <ion-icon *ngIf="ThemeService.currentTheme == 'default' "  slot="icon-only"  src="assets/images/icons-calendar-arrow-left.svg"></ion-icon>
+                      <ion-icon *ngIf="ThemeService.currentTheme == 'gov' "  slot="icon-only"  src="assets/images/theme/gov/icons-calendar-arrow-left.svg"></ion-icon>
+                      <ion-icon *ngIf="ThemeService.currentTheme == 'doneIt' "  slot="icon-only"  src="assets/images/theme/{{ThemeService.currentTheme}}/icons-calendar-arrow-left.svg"></ion-icon>
+                    </button>
+
+                  </div>

                  <!-- Move forward one screen of the slides -->
                  <h2 class="capitaliseText d-flex align-center">
@@ -82,15 +90,6 @@

                  </div> -->

-                  <div class="arrow cursor-pointer resize">
-                    <button (click)="back()" class="btn-no-color resize" >
-                      <ion-icon *ngIf="ThemeService.currentTheme == 'default' "  slot="icon-only"  src="assets/images/icons-calendar-arrow-left.svg"></ion-icon>
-                      <ion-icon *ngIf="ThemeService.currentTheme == 'gov' "  slot="icon-only"  src="assets/images/theme/gov/icons-calendar-arrow-left.svg"></ion-icon>
-                      <ion-icon *ngIf="ThemeService.currentTheme == 'doneIt' "  slot="icon-only"  src="assets/images/theme/{{ThemeService.currentTheme}}/icons-calendar-arrow-left.svg"></ion-icon>
-                    </button>
-
-                  </div>
-
                  <div (click)="next()" class="arrow cursor-pointer resize">
                    <ion-icon  *ngIf="ThemeService.currentTheme == 'default' " slot="icon-only" src="assets/images/icons-calendar-arrow-right.svg"></ion-icon>
                    <ion-icon  *ngIf="ThemeService.currentTheme == 'gov' " slot="icon-only" src="assets/images/theme/gov/icons-calendar-arrow-right.svg"></ion-icon>
@@ -31,7 +31,7 @@
    </ion-refresher>
  <div class="main-content">

-    <ion-virtual-scroll [items]="ChatSystemService.users | filter:textSearch: 'name'" approxItemHeight="70px" [headerFn]="separateLetter">
+    <ion-virtual-scroll [items]="userList" approxItemHeight="70px" [headerFn]="separateLetter">

      <div class="item-divider" *virtualHeader="let header">
        <ion-label>{{header}}</ion-label>
@@ -23,7 +23,8 @@ export class ContactsPage implements OnInit {
  room:any;
  dm:any;
  sessionStore = SessionStore
-
+  userList = this.ChatSystemService.users
+  
  constructor(
    private modalController: ModalController,
    private http: HttpClient,
@@ -45,8 +46,16 @@ export class ContactsPage implements OnInit {
    // this.loadUsers();

  }
-  onChange(event){
-    this.textSearch = event.detail.value;
+
+  onChange(event) {
+
+    this.textSearch = event.detail.value.toLowerCase();
+
+    this.userList = this.ChatSystemService.users.filter((e) => {
+      const username = e.name.toLowerCase()
+      return username.includes(this.textSearch)
+    })
+    
  }


@@ -105,9 +105,9 @@
                      <div></div>
                    </div>
                    <div class="schedule-details">
-                      <div class="location">{{event.Location}}</div>
-                      <div class="description">
-                        <p>{{event.Subject}}</p>
+                      <div class="description">{{event.Subject}}</div>
+                      <div class="location">
+                        <p>{{event.Location}}</p>
                      </div>
                    </div>
                  </div>
@@ -227,9 +227,9 @@
                <div></div>
              </div>
              <div class="schedule-details">
-                <div class="location">{{event.Location}}</div>
+                <div class="location">{{event.Subject}}</div>
                <div class="description">
-                  <p>{{event.Subject}}</p>
+                  <p>{{event.Location}}</p>
                </div>
              </div>
            </div>
@@ -448,7 +448,8 @@ ion-toolbar{
          width: 78%;
          .location{
            font-family: Roboto;
-            font-size: 13px;
+            font-size: 15px;
+            font-weight: bold;
            color: black;
            width: 100%;

@@ -456,8 +457,7 @@ ion-toolbar{
          .description{
            width: 100%;
            font-family: Roboto;
-            font-size: 15px;
-            font-weight: bold;
+            font-size: 13px;
            //color: #0d89d1;
            color: var(--title-text-color)
          }
@@ -107,6 +107,7 @@ export class EventsPage implements OnInit {

    this.router.events.forEach((event) => {
      if (event instanceof NavigationEnd && event.url == '/home/events') {
+        this.getEventsFromLocalDb()
        this.RefreshEvents();
        setTimeout(() => {
          this.LoadList();
@@ -122,6 +123,9 @@ export class EventsPage implements OnInit {
      this.hideSearch();
    });

+
+    // this.getEventsFromLocalDb();
+
  }

  hideSearch() {
@@ -169,71 +173,15 @@ export class EventsPage implements OnInit {
        this.totalEvent = onwEvent.length;
      }

+      this.storage.set('events', this.listToPresent)
+
    }

    this.showLoader = false;
    this.showAgendaLoader = false;
  }

-  addEventToDb(list) {

-    if (this.platform.is('desktop') || this.platform.is('mobileweb')) {
-      this.storage.set('events', list).then(() => {
-        // 
-      })
-    } else {
-      if (list.length > 0) {
-        list.forEach(element => {
-          this.sqliteservice.addEvent(element)
-
-          this.sqliteservice.getAllEvents().then((event: any[] = []) => {
-            let todayEvents = new Array()
-            event.forEach((element) => {
-              let eventObject = {
-                AppointmentState: element.AppointmentState,
-                Attachments: element.Attachments,
-                Attendees: element.Attendees,
-                CalendarId: element.CalendarId,
-                CalendarName: element.CalendarName,
-                Category: element.Category,
-                EndDate: element.EndDate,
-                EventId: element.EventId,
-                EventRecurrence: element.EventRecurrence,
-                EventType: element.EventType,
-                HasAttachments: element.HasAttachments,
-                HumanDate: element.HumanDate,
-                IsAllDayEvent: element.IsAllDayEvent,
-                IsMeeting: element.IsMeeting,
-                IsRecurring: element.IsRecurring,
-                Location: element.Location,
-                Organizer: element.Organizer,
-                Profile: element.Profile,
-                StartDate: element.StartDate,
-                Subject: element.Subject
-              }
-                todayEvents.push(eventObject);
-            })
-            
-          })
-        });
-      }
-    }
-  }
-
-  addProcessToDb(list) {
-
-    if (this.platform.is('desktop') || this.platform.is('mobileweb')) {
-      this.storage.set('process', list).then(() => {
-        // 
-      })
-    } else {
-      if (list.length > 0) {
-        list.forEach(element => {
-          this.sqliteservice.addProcess(element)
-        });
-      }
-    }
-  }

  getEventsFromLocalDb() {

@@ -241,105 +189,35 @@ export class EventsPage implements OnInit {
    let month = date.getMonth() + 1;
    //date.setMonth(date.getMonth() + 1);
    let dateToday = date.getFullYear() + "-" + month + "-" + date.getDate();
-    // ('dateeeeee', dateToday)
-    if (this.platform.is('desktop') || this.platform.is('mobileweb')) {
-      this.storage.get('events').then((events: any[] = []) => {
-        // 

-        if(Array.isArray(events)) {
-          this.listToPresent = events
-          this.totalEvent = this.listToPresent.length
+    this.storage.get('events').then((events: any[] = []) => {
+      // 
+
+      if(Array.isArray(events)) {
+        this.listToPresent = events
+        this.totalEvent = this.listToPresent.length
+
+        try {
          this.currentEvent = this.listToPresent[0].Subject
+        } catch (error) {}
+
+        try {
          this.currentHoursMinutes = this.listToPresent[0].StartDate
+        } catch (error) {}
+
+      }
+      // 
+    })
+
+    this.storage.get('process').then((process: any[] = []) => {
+      // 
+        if(Array.isArray(process)) {
+          this.listToPresentexpediente = process;
        }
-        // 
-      })
+    })

-      this.storage.get('process').then((process: any[] = []) => {
-        // 
-          if(Array.isArray(process)) {
-            const ExpedienteTask = process.map(e => this.expedienteTaskPipe.transform(e))
-            this.listToPresentexpediente = ExpedienteTask;
-          }
-      })
+    this.showLoader = false;

-      this.showLoader = false;
-
-    } else {
-      this.sqliteservice.getAllEvents().then((event: any[] = []) => {
-        let todayEvents = new Array()
-        event.forEach((element) => {
-          let eventObject = {
-            AppointmentState: element.AppointmentState,
-            Attachments: element.Attachments,
-            Attendees: element.Attendees,
-            CalendarId: element.CalendarId,
-            CalendarName: element.CalendarName,
-            Category: element.Category,
-            EndDate: element.EndDate,
-            EventId: element.EventId,
-            EventRecurrence: element.EventRecurrence,
-            EventType: element.EventType,
-            HasAttachments: element.HasAttachments,
-            HumanDate: element.HumanDate,
-            IsAllDayEvent: element.IsAllDayEvent,
-            IsMeeting: element.IsMeeting,
-            IsRecurring: element.IsRecurring,
-            Location: element.Location,
-            Organizer: element.Organizer,
-            Profile: element.Profile,
-            StartDate: element.StartDate,
-            Subject: element.Subject
-          }
-          let starteDate = momentG(new Date(element.StartDate), 'yyyy-MM-dd');
-          // 
-          if (dateToday == starteDate) {
-            todayEvents.push(eventObject);
-          }
-        })
-        this.listToPresent = todayEvents
-        if(this.listToPresent?.length) {
-          this.totalEvent = this.listToPresent.length
-          this.currentEvent = this.listToPresent[0].Subject
-          this.currentHoursMinutes = this.listToPresent[0].StartDate
-        }
-        // 
-      })
-
-      this.sqliteservice.getprocessByworkflow("Expediente").then((process: any[] = []) => {
-
-        // 
-
-        if (process.length > 0 || process != undefined) {
-
-          var expedientlist: any = new Array();
-          process.forEach((element) => {
-            if(JSON.parse(element.workflowInstanceDataFields).TaskMessage || JSON.parse(element.workflowInstanceDataFields).Note) {
-
-              let task = {
-                activityInstanceName: element.activityInstanceName,
-                deadline: null,
-                serialNumber: element.serialNumber,
-                taskStartDate: element.taskStartDate,
-                totalDocuments: element.totalDocuments,
-                workflowDisplayName: element.workflowDisplayName,
-                workflowInstanceDataFields: JSON.parse(element.workflowInstanceDataFields)
-              }
-              expedientlist.push(task);
-
-            }
-          })
-
-          // 
-          const ExpedienteTask = expedientlist.map(e => this.expedienteTaskPipe.transform(e))
-          this.listToPresentexpediente = ExpedienteTask;
-
-        }
-
-        this.showLoader = false;
-      })
-    }
-    // });
  }


@@ -408,12 +286,13 @@ export class EventsPage implements OnInit {
  LoadList() {
    this.showCorrespondenciasLoader = true
    this.processes.GetTaskListExpediente(false).subscribe(result => {
-      this.addProcessToDb(result);

      let ExpedienteTask = result.map(e => this.expedienteTaskPipe.transform(e))

      this.listToPresentexpediente = ExpedienteTask;

+      this.storage.set('process', ExpedienteTask)
+
      this.showCorrespondenciasLoader = false
    }, ((error) => {

@@ -21,9 +21,14 @@
      <div class="upper-content" >
        <div class="content-details">
          <ion-label>
-            <p><span class="date">{{customDate}}</span><span class="label">{{ task.activityInstanceName }}</span></p>
+            <p><span class="date">{{customDate}}</span></p>
+          </ion-label>
+          <ion-label>
            <p><span class="color-red">{{ task.DeadlineType }}</span></p>
          </ion-label>
+          <ion-label>
+            <p class="d-flex mt-10"><span class="label">{{ task.activityInstanceName }}</span></p>
+          </ion-label>
        </div>
      </div>
      <div class="line"></div>
@@ -96,7 +96,7 @@ ion-button{

 .upper-content{
  font-family: Roboto;
-  margin-left: 41px;
+  margin-left: 36px;
  font-size: 18px;

  .label{
@@ -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,
@@ -1,53 +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-btn-modal-dismiss (click)="goBack()" ></app-btn-modal-dismiss>
-    <div class="thetitle">
-      <ion-label  >{{environment.dispatchPR }}</ion-label>
-    </div>
-    <div class="theicon btn-refresh">
-      <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> -->
+  <app-task-list-header
+    [goBackButton] = true
+    [headerName] = environment.dispatchPR
+    [ordinance] = ordinance
+    [loading] = skeletonLoader
+    [loaderTop] = true
+    (reorderList) = reorderList($event)
+    (changeFilterName) = changeFilterName($event)
+    (goBack) = goBack()
+  ></app-task-list-header>
 </ion-header>
 <ion-content>
  <ion-refresher name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
@@ -59,81 +20,13 @@
      </ion-refresher-content>
  </ion-refresher>

-    <div  class="main-content width-100 overflow-y-auto height-100">
-      <ion-progress-bar type="indeterminate" *ngIf="skeletonLoader"></ion-progress-bar>
-      <div >
-        <ion-list>
-          <div
-            class="ion-no-padding ion-no-margin cursor-pointer"  
-            *ngFor = "let task of despachoprstore.list; let i = index"
-            (click)="goToDespachoPr(task.SerialNumber)"
-          >
-            <!--  [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 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>
+  <app-task-list
+    [taskList] = list
+    [skeletonLoader] = skeletonLoader
+    (viewTaskDetail)="goToDespachoPr($event)"
+    [filterName]="filterName"
+  >
+  </app-task-list>

 </ion-content>

@@ -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{
-  padding: 30px 20px 0 20px !important;
+ion-content, .main-content{
  background-color: white;
+  padding: 30px 20px 0 20px !important;
 }
 .main-content {
  padding-top: 0px !important;
@@ -63,6 +63,8 @@ export class DespachosPrPage implements OnInit {
  searchSubject = ''
  list = []

+  ordinance: string =  'old'
+
  constructor(
    private processes: ProcessesService,
    private modalController: ModalController,
@@ -106,18 +108,32 @@ export class DespachosPrPage implements OnInit {
    this.dynamicSearch()
  }

+  reorderList(orderBy: string) {
+
+    this.ordinance = orderBy;
+
+    this.dynamicSearch();
+  }
+
+  changeFilterName(filterName) {
+    this.filterName = filterName
+  }

  async dynamicSearch() {

    if(this.showSearch && this.searchSubject) {
      
-      this.list = this.TaskService.despachoStore.list.filter((task) => {
+      const searchedList =this.TaskService.despachoprstore.list.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, searchedList)
    } else {
-      this.list = this.TaskService.AllProcess
+      
+      const list = this.TaskService.despachoprstore.list
+      this.list = this.TaskService.reorderList(this.ordinance, list)
    }

  }
@@ -126,8 +142,8 @@ export class DespachosPrPage implements OnInit {
    this.LoadList();
  }

-  goToDespachoPr(serialNumber: any) {
-    this.router.navigate(['/home/gabinete-digital/despachos-pr', serialNumber, 'gabinete-digital']);
+  goToDespachoPr({SerialNumber}) {
+    this.router.navigate(['/home/gabinete-digital/despachos-pr', SerialNumber, 'gabinete-digital']);
  }

  notImplemented() {
@@ -21,9 +21,14 @@
      <div class="upper-content">
        <div class="content-details">
          <ion-label>
-            <p><span class="date">{{customDate}}</span><span class="label">{{ task.activityInstanceName }}</span></p>
+            <p><span class="date">{{customDate}}</span></p>
+          </ion-label>
+          <ion-label>
            <p><span class="color-red">{{ task.DeadlineType }}</span></p>
          </ion-label>
+          <ion-label>
+            <p class="d-flex mt-10"><span class="label">{{ task.activityInstanceName }}</span></p>
+          </ion-label>
        </div>
      </div>
      <div class="line"></div>
@@ -55,7 +55,7 @@ ion-button{
 .upper-content{
  font-family: Roboto;
  margin-top: 15px;
-  margin-left: 41px;
+  margin-left: 36px;
  font-size: 18px;

  .label{
@@ -8,7 +8,17 @@
    <app-btn-modal-dismiss (click)="goBack()" ></app-btn-modal-dismiss>

    <div class="title flex-1"><ion-label >Despachos</ion-label></div>
-    <div class="theicon btn-refresh">
+    <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>

      <div>
        <mat-form-field class="task-filter-input" appearance="none"   color="ion-color-secondary"  placeholder="Selecione agenda">
@@ -60,6 +70,7 @@
      </ion-refresher-content>
    </ion-refresher>

+
    <div >
      <ion-progress-bar type="indeterminate" *ngIf="skeletonLoader"></ion-progress-bar>
      <div class="height-100">
@@ -23,7 +23,8 @@ export class DespachosPage implements OnInit {
  searchSubject = ''
  list = []
  hideSearchBtn: boolean = false;
-  
+  ordinance: string =  'old'
+
  constructor(
    private router: Router,
    private despachoRule: DespachoService,
@@ -63,13 +64,16 @@ export class DespachosPage implements OnInit {

    if(this.showSearch && this.searchSubject) {
      
-      this.list = this.TaskService.despachoStore.list.filter((task) => {
+      const searchedList = this.TaskService.despachoStore.list.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, searchedList)
    } else {
-      this.list = this.TaskService.AllProcess
+      const list = this.despachoStore.list
+      this.list = this.TaskService.reorderList(this.ordinance, list)
    }

  }
@@ -87,7 +91,13 @@ export class DespachosPage implements OnInit {
  }


-  
+  reorderList(orderBy: string) {
+
+    this.ordinance = orderBy;
+
+    this.dynamicSearch();
+  }
+

  async refreshing() {
    setTimeout(() => {
@@ -26,9 +26,14 @@
      <div class="upper-content">
        <div class="content-details">
          <ion-label>
-            <p><span class="date">{{customDate}}</span><span class="label">{{ task.activityInstanceName }}</span></p>
+            <p><span class="date">{{customDate}}</span></p>
+          </ion-label>
+          <ion-label>
            <p><span class="color-red">{{ task.DeadlineType }}</span></p>
          </ion-label>
+          <ion-label>
+            <p class="d-flex mt-10"><span class="label">{{ task.activityInstanceName }}</span></p>
+          </ion-label>
        </div>
      </div>
      <div class="line"></div>
@@ -115,7 +115,7 @@ ion-button{

 .upper-content{
  font-family: Roboto;
-  margin-left: 41px;
+  margin-left: 36px;
  font-size: 18px;

  .label{
@@ -7,7 +7,14 @@
  <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 btn-refresh">
+    <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">

@@ -27,8 +34,6 @@
            Não lidos
          </mat-option>

-
-
          <mat-option value="OverdueTasks">
            Em atraso
          </mat-option>
@@ -60,6 +65,7 @@
    </ion-refresher>
    <ion-progress-bar type="indeterminate" *ngIf="skeletonLoader"></ion-progress-bar>

+
    <div class="width-100" *ngIf="deplomasStore.diplomasParaAssinarList">

      <div *ngIf="deplomasStore.diplomasParaAssinarList">
@@ -32,6 +32,7 @@ export class DiplomasAssinarPage implements OnInit {
 showSearch = false
 searchSubject = ''
 list = []
+ ordinance: string =  'recent'

 constructor(
   private processes:ProcessesService,
@@ -61,18 +62,28 @@ export class DiplomasAssinarPage implements OnInit {
    this.dynamicSearch()
  }

+  reorderList(orderBy: string) {
+
+    this.ordinance = orderBy;
+
+    this.dynamicSearch();
+  }
+

  async dynamicSearch() {

    if(this.showSearch && this.searchSubject) {
      
-      this.list = this.TaskService.despachoStore.list.filter((task) => {
+      const list = this.TaskService.despachoStore.list.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.TaskService.AllProcess
+      const list = this.TaskService.AllProcess
+      this.list = this.TaskService.reorderList(this.ordinance, list)
    }

  }
@@ -31,6 +31,32 @@
    </ion-refresher>
    <ion-progress-bar type="indeterminate" *ngIf="skeletonLoader"></ion-progress-bar>

+    <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" *ngIf="deplomasStore.DiplomaGerarList.length >= 1">

      <div *ngIf="deplomasStore.DiplomaGerarList">
@@ -33,6 +33,7 @@ export class DiplomasGerarPage implements OnInit {
  showSearch = false
  searchSubject = ''
  list = []
+  ordinance: string =  'old'

  constructor(
    private processes:ProcessesService,
@@ -62,18 +63,28 @@ export class DiplomasGerarPage implements OnInit {
    this.dynamicSearch()
  }

+  reorderList(orderBy: string) {
+
+    this.ordinance = orderBy;
+
+    this.dynamicSearch();
+  }
+

  async dynamicSearch() {

    if(this.showSearch && this.searchSubject) {
      
-      this.list = this.TaskService.despachoStore.list.filter((task) => {
+      const list = this.deplomasStore.DiplomaGerarList.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.TaskService.AllProcess
+      const list = this.deplomasStore.DiplomaGerarList
+      this.list = this.TaskService.reorderList(this.ordinance, list)
    }

  }
@@ -25,9 +25,14 @@
      <div class="upper-content">
        <div class="content-details">
          <ion-label>
-            <p><span class="date">{{customDate}}</span><span class="label">{{ task.activityInstanceName }}</span></p>
+            <p><span class="date">{{customDate}}</span></p>
+          </ion-label>
+          <ion-label>
            <p><span class="color-red">{{ task.DeadlineType }}</span></p>
          </ion-label>
+          <ion-label>
+            <p class="d-flex mt-10"><span class="label">{{ task.activityInstanceName }}</span></p>
+          </ion-label>
        </div>
      </div>
      <div class="line"></div>
@@ -115,7 +115,7 @@ ion-button{

 .upper-content{
  font-family: Roboto;
-  margin-left: 41px;
+  margin-left: 36px;
  font-size: 18px;

  .label{
@@ -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="font-30 cursor-pointer" (click)="goBack()" defaultHref="#">
+        <div class="title-content width-100 d-flex align-center justify-space-between">
+          <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>
@@ -24,9 +24,14 @@
      <div class="upper-content">
        <div class="content-details">
          <ion-label>
-            <p><span class="date">{{customDate}}</span><span class="label">{{ task.activityInstanceName }}</span></p>
+            <p><span class="date">{{customDate}}</span></p>
+          </ion-label>
+          <ion-label>
            <p><span class="color-red">{{ task.DeadlineType }}</span></p>
          </ion-label>
+          <ion-label>
+            <p class="d-flex mt-10"><span class="label">{{ task.activityInstanceName }}</span></p>
+          </ion-label>
        </div>
      </div>
      <div class="line"></div>
@@ -97,7 +97,7 @@ ion-button{

 .upper-content{
  font-family: Roboto;
-  margin-left: 41px;
+  margin-left: 36px;
  font-size: 18px;

  .label{
@@ -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,
@@ -2,78 +2,18 @@
  <ion-refresher name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
    <ion-refresher-content></ion-refresher-content>
  </ion-refresher>
-  <div class="title">
-    <div class="thetitle"><ion-label >Diplomas</ion-label></div>
-    <div class="theicon d-flex">
-      <!-- <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>
-              
+  <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>

-              <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>
-        <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])">
@@ -91,6 +31,7 @@

  <div class="main-content width-100 overflow-y-auto height-100">

+
    <div class="width-100" [ngSwitch]="segment">
      <ion-progress-bar type="indeterminate" *ngIf="skeletonLoader"></ion-progress-bar>
      <div *ngIf="p.userPermission([p.permissionList.Gabinete.md_tasks])">
@@ -103,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>
@@ -170,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>
@@ -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;
  }
@@ -21,6 +21,7 @@ export class DiplomasPage implements OnInit, OnDestroy {
  showLoader: boolean;
  totalDocs: any;
  serialNumber: string;
+  headerName = "Diplomas"

  segment: string;

@@ -31,9 +32,10 @@ export class DiplomasPage implements OnInit, OnDestroy {
  
  showSearch = false
  searchSubject = ''
-  listDiplomasPorValidar = []
-  listDiplomasAssinadosPR = []
+  listDiplomasPorValidar = [];
+  listDiplomasAssinadosPR = [];
  hideSearchBtn: boolean = false;
+    ordinance: string =  'old';

  constructor(
    private processes: ProcessesService,
@@ -105,26 +107,46 @@ export class DiplomasPage implements OnInit, OnDestroy {
  }


+  
+  reorderList(orderBy: string) {
+
+    this.ordinance = orderBy;
+
+    this.dynamicSearch();
+  }
+
+  changeFilterName(filterName) {
+    this.filterName = filterName
+  }
+
  async dynamicSearch() {

    if(this.showSearch && this.searchSubject) {

-      this.listDiplomasAssinadosPR = this.deplomasStore.diplomasAssinadoList.filter((task) => {
+      const listDiplomasAssinadosPR = this.deplomasStore.diplomasAssinadoList.filter((task) => {
        let subject = task.Folio || task.Subject || task.workflowInstanceDataFields.Subject
        subject = subject.toLowerCase();
        return subject.includes(this.searchSubject.toLowerCase())
      })

-      this.listDiplomasPorValidar = this.deplomasStore.diplomasReviewList.filter((task) => {
+      this.listDiplomasAssinadosPR = this.TaskService.reorderList(this.ordinance, listDiplomasAssinadosPR)
+
+      const listDiplomasPorValidar = this.deplomasStore.diplomasReviewList.filter((task) => {
        let subject = task.Folio || task.Subject || task.workflowInstanceDataFields.Subject
        subject = subject.toLowerCase();
        return subject.includes(this.searchSubject.toLowerCase())
      })

+      this.listDiplomasPorValidar = this.TaskService.reorderList(this.ordinance, listDiplomasPorValidar)
+
    } else {
      
-      this.listDiplomasAssinadosPR = this.deplomasStore.diplomasAssinadoList
-      this.listDiplomasPorValidar = this.deplomasStore.diplomasReviewList
+      const listDiplomasAssinadosPR = this.deplomasStore.diplomasAssinadoList
+      const listDiplomasPorValidar = this.deplomasStore.diplomasReviewList
+
+
+      this.listDiplomasPorValidar = this.TaskService.reorderList(this.ordinance, listDiplomasPorValidar)
+      this.listDiplomasAssinadosPR = this.TaskService.reorderList(this.ordinance, listDiplomasAssinadosPR)
    }

  }
@@ -149,6 +149,7 @@ export class ApproveEventPage implements OnInit {
      await this.processes.PostTaskAction(body).toPromise()
      this.goBack();
      this.httpErrorHandle.httpsSucessMessagge('Evento aprovação')
+      this.TaskService.loadEventosParaAprovacao();

    } catch (error) {
      this.httpErrorHandle.httpStatusHandle(error)
@@ -195,6 +196,7 @@ export class ApproveEventPage implements OnInit {
                this.offlineManager.storeRequestData('event-listRever', body);
              });
              this.httpErrorHandle.httpsSucessMessagge('Rever')
+              this.TaskService.loadEventosParaAprovacao();
              this.goBack();
            } catch (error) {
              this.httpErrorHandle.httpStatusHandle(error)
@@ -218,6 +220,7 @@ export class ApproveEventPage implements OnInit {
    try {
      await this.processes.PostTaskAction(body).toPromise();
      this.httpErrorHandle.httpsSucessMessagge('Rejeitar')
+      this.TaskService.loadEventosParaAprovacao();
      this.goBack();
    } catch (error) {
      this.httpErrorHandle.httpStatusHandle(error)
@@ -301,6 +304,7 @@ export class ApproveEventPage implements OnInit {
            await this.processes.PostTaskAction(body).toPromise();
            this.goBack();
            this.httpErrorHandle.httpsSucessMessagge('Rever')
+            this.TaskService.loadEventosParaAprovacao();
          } catch (error) {
            this.httpErrorHandle.httpStatusHandle(error)
          } finally {
@@ -342,6 +346,7 @@ export class ApproveEventPage implements OnInit {
    await modal.present();

    modal.onDidDismiss().then(res => {
+      this.TaskService.loadEventosParaAprovacao();
      this.getTask();
    });

@@ -10,7 +10,19 @@
    <div class="header-title">
      <label>Eventos para Aprovação</label>
    </div>
-    <div style="float:right" *ngIf="showFilter">
+    <div style="float:right" *ngIf="showFilter" class="d-flex align-center">
+
+      <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>
+
      <mat-form-field class="task-filter-input" appearance="none"   color="ion-color-secondary"  placeholder="Selecione agenda">
        <mat-select [(value)]="filterName">

@@ -45,9 +45,11 @@ export class EventListPage implements OnInit {
  filterName: 'Para hoje' | 'Novos'| 'Lidos'| 'Não lidos'|  'OverdueTasks' | 'Todos' = 'Todos'
  showFilter = false

-    showSearch = false
+  showSearch = false
  searchSubject = ''
  list = []
+  ordinance: string =  'old'
+
  constructor(
    private processes: ProcessesService,
    private modalController: ModalController,
@@ -105,6 +107,14 @@ export class EventListPage implements OnInit {

  }

+  reorderList(orderBy: string) {
+
+    this.ordinance = orderBy;
+
+    // this.dynamicSearch();
+  }
+
+
  getEventToAproveFromDB() {


@@ -27,8 +27,12 @@
      <div class="upper-content" style="overflow: unset !important;">
        <div class="content-details">
          <ion-label>
-            <p><span class="date">{{customDate}}</span><span class="label">{{ task.WorkflowName }}</span></p>
+            <p><span class="date">{{customDate}}</span></p>
          </ion-label>
+          <ion-label>
+            <p class="d-flex mt-10"><span class="label">{{ task.WorkflowName }}</span></p>
+          </ion-label>
+
        </div>
      </div>
      <div class="line"></div>
@@ -95,7 +95,7 @@ ion-button{

 .upper-content{
  font-family: Roboto;
-  margin-left: 41px;
+  margin-left: 36px;
  font-size: 18px;

  .label{
@@ -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,
@@ -10,8 +10,21 @@
    <div class="header-title">
      <label>Expediente <span class="lowercase" *ngIf="filterName != 'Todos' ">{{ filterName }}</span></label>
    </div>
-    <div class="btn-refresh">
-      <!-- <mat-form-field class="task-filter-input" appearance="none"   color="ion-color-secondary"  placeholder="Selecione agenda">
+    <div class="btn-refresh  d-flex align-center">
+
+      <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>
+
+      <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" >
@@ -41,7 +54,8 @@

          
        </mat-select>
-      </mat-form-field> -->
+        
+      </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>
@@ -62,7 +76,7 @@
      <ion-list>
        <div
          class=" ion-no-padding ion-no-margin cursor-pointer"
-          *ngFor = "let task of expedientegbstore.list"
+          *ngFor = "let task of list"
          (click)="goToExpediente(task.SerialNumber)"
        >
        <div class="item width-100 expediente" *ngIf="TaskService.filter(task, filterName)">
@@ -39,6 +39,7 @@ export class ExpedientePage implements OnInit {
  showSearch = false
  searchSubject = ''
  list = []
+  ordinance: string =  'old'

  filterName: 'Para hoje' | 'Novos'| 'Lidos'| 'Não lidos'|  'OverdueTasks' | 'Todos' = 'Todos'
  constructor(
@@ -88,17 +89,29 @@ export class ExpedientePage implements OnInit {
  }


+  reorderList(orderBy: string) {
+
+    this.ordinance = orderBy;
+
+    this.dynamicSearch();
+  }
+
+
  async dynamicSearch() {

    if(this.showSearch && this.searchSubject) {
      
-      this.list = this.TaskService.despachoStore.list.filter((task) => {
+      const searchedList = this.expedientegbstore.list.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, searchedList)
    } else {
-      this.list = this.TaskService.AllProcess
+      
+      const list = this.expedientegbstore.list
+      this.list = this.TaskService.reorderList(this.ordinance, list)
    }

  }
@@ -122,7 +135,7 @@ export class ExpedientePage implements OnInit {
      this.taskslist = this.taskslist.filter(function(item) {
        return item.activityInstanceName != 'Retificar Expediente'
      })
-      this.listToPresent = this.sortService.sortDate(this.taskslist, 'taskStartDate') 
+      this.listToPresent = this.sortService.sortDate(this.taskslist, 'TaskStartDate').reverse()
      
      this.expedientegbstore.reset(this.listToPresent);
      
@@ -30,7 +30,13 @@
      <div class="upper-content" style="overflow: unset !important;">
        <div class="content-details">
          <ion-label>
-            <p><span class="date">{{customDate}}</span><span class="label">{{ task.activityInstanceName }}</span></p>
+            <p><span class="date">{{customDate}}</span></p>
+          </ion-label>
+          <ion-label>
+            <p><span class="color-red">{{ task.DeadlineType }}</span></p>
+          </ion-label>
+          <ion-label>
+            <p class="d-flex mt-10"><span class="label">{{ task.activityInstanceName }}</span></p>
          </ion-label>
        </div>
      </div>
@@ -95,7 +95,7 @@ ion-button{

 .upper-content{
  font-family: Roboto;
-  margin-left: 41px;
+  margin-left: 36px;
  font-size: 18px;

  .label{
@@ -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,7 +33,9 @@ import { NgxMatMomentModule } from '@angular-material-components/moment-adapter'
    IonicModule,
    ExpedientesPrPageRoutingModule,
    BtnModalDismissPageModule,
-        //
+    TaskListPageModule,
+    TaskListHeaderPageModule,
+    //
    MatInputModule,
    MatNativeDateModule,
    NgxMatDatetimePickerModule,
@@ -1,132 +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">
-      <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>

-    <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" >
-      <ion-progress-bar type="indeterminate" *ngIf="skeletonLoader"></ion-progress-bar>
-      <ion-list>
-        <div
-          class=" ion-no-padding ion-no-margin cursor-pointer"
-          *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
-      *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>
+  <app-task-list
+    [taskList] = list
+    [skeletonLoader] = skeletonLoader
+    (viewTaskDetail)="goToExpediente($event)"
+    [filterName]="filterName"
+  >
+  
+  </app-task-list>

 </ion-content>

@@ -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;
 }
@@ -37,10 +37,12 @@ export class ExpedientesPrPage implements OnInit {
  filterName: 'Para hoje' | 'Novos'| 'Lidos'| 'Não lidos'|  'OverdueTasks' | 'Todos' = 'Todos'
  

-    showSearch = false
+  showSearch = false
  searchSubject = ''
  list = []
-
+  ordinance: string =  'old'
+  headerName = "Expediente"
+  
  constructor(
    private processes:ProcessesService,
    private modalController: ModalController,
@@ -77,17 +79,31 @@ export class ExpedientesPrPage implements OnInit {
  }


+  reorderList(orderBy: string) {
+
+    this.ordinance = orderBy;
+
+    this.dynamicSearch();
+  }
+
+
+  changeFilterName(filterName) {
+    this.filterName = filterName
+  }
+
  async dynamicSearch() {

    if(this.showSearch && this.searchSubject) {
      
-      this.list = this.TaskService.despachoStore.list.filter((task) => {
+      const list = this.expedienteGdStore.list.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.TaskService.AllProcess
+      const list  = this.expedienteGdStore.list
+      this.list = this.TaskService.reorderList(this.ordinance, list)
    }

  }
@@ -126,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) {
@@ -149,13 +165,7 @@ export class ExpedientesPrPage implements OnInit {
  }

  goBack() {
-    // let navigationExtras: NavigationExtras = {
-    //   queryParams: {
-    //     "expedientes-pr": true,
-    //   }
-    // };
-    // this.router.navigate(['/home/gabinete-digital'], navigationExtras);
-
+    
    this.RouteService.goBack();

  }
@@ -1,9 +1,9 @@
 <!-- {{ NotificationsService.active }} -->
 <ion-content class="height-100 container-wrapper">
-  <ion-refresher slot="fixed" (ionRefresh)="doRefresh($event)">
+  <!-- <ion-refresher slot="fixed" (ionRefresh)="doRefresh($event)">
    <ion-refresher-content>
    </ion-refresher-content>
-  </ion-refresher>
+  </ion-refresher> -->

  <div class="main-content d-flex height-100 border-t-radius">

@@ -11,28 +11,79 @@
      <div  class="aside-wrapper d-flex flex-column width-md-40 flex-grow-1">
        <ion-progress-bar type="indeterminate" *ngIf="TaskService.showLoader"></ion-progress-bar>
        <div class="title-container">
-          <div class="title">
-            <ion-label>Gabinete Digital</ion-label>
+          <div class="title d-flex justify-center">
+            <ion-label *ngIf="hideRefreshBtn">Gabinete Digital</ion-label>
+            <div class="d-flex align-center cursor" *ngIf="!hideRefreshBtn && segmentVista == 'listview' ">
+              <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 class="d-flex" (click)="reorderList('old')" *ngIf="ordinance == 'recent' && !hideRefreshBtn ">
+
+                <ion-icon  class="ml-10"  src="assets/images/theme/gov/crescente.svg" ></ion-icon>
+              </div>
+
+              <div class="d-flex" (click)="reorderList('recent')" *ngIf="ordinance != 'recent' && !hideRefreshBtn ">
+                <ion-icon  class="ml-10"  src="assets/images/theme/gov/decrescente.svg" ></ion-icon>
+              </div>
+            
+            </div>
          </div>
          <button  title="Atualizar" *ngIf="hideRefreshBtn && TaskService.loadCount" class="btn-no-color btn-refresh" (click)="doRefresh($event)">
            <ion-icon class="title-icon font-awesome" name="reload-circle"></ion-icon>
          </button>
          <div *ngIf="!hideRefreshBtn" class="title-icons">
-              <ion-segment [(ngModel)]="segmentVista" (ionChange)="onSegmentVistaChange()">
-                <ion-segment-button value="listview" class="ion-segment-button-no-border">
-                  <fa-icon icon="align-justify"></fa-icon>
-                </ion-segment-button>
-                <ion-segment-button value="boxview" class="ion-segment-button-no-border">
-                  <fa-icon icon="th-large"></fa-icon>
-                </ion-segment-button>
-              </ion-segment>
+          
+            <!-- <ion-segment [(ngModel)]="segmentVista" (ionChange)="onSegmentVistaChange()" style="overflow:hidden; margin-right: 45px;">
+              <ion-segment-button value="listview" class="ion-segment-button-no-border pr-30" >
+                <fa-icon icon="align-justify" [class.activeTab]="segmentVista == 'listview' "></fa-icon>
+              </ion-segment-button>
+              <ion-segment-button value="boxview" class="ion-segment-button-no-border">
+                <fa-icon icon="th-large" [class.activeTab]="segmentVista == 'boxview' "></fa-icon>
+              </ion-segment-button>
+            </ion-segment> -->
+
+            <div class="d-flex">
+              <div (click)="segmentVista = 'listview' " class="mr-30">
+                <fa-icon icon="align-justify" [class.activeTab]="segmentVista == 'listview' "></fa-icon>
+              </div>
+              <div (click)="segmentVista = 'boxview' ">
+                <fa-icon icon="th-large" [class.activeTab]="segmentVista == 'boxview' "></fa-icon>
+              </div>
+            </div>


          </div>
        </div>  
-        <div *ngIf="segmentVista == 'listview' " class="d-flex px-30 justify-content-end">
-          <div title="Pesquisa" *ngIf="!hideSearchBtn" class="mr-20 d-flex align-center cursor-pointer">
-            <div  (click)="openSearch();showSearch=true" *ngIf="!showSearch" class="d-flex">
+        <div *ngIf="segmentVista == 'listview' " class="d-flex px-20 justify-content-end width-100">
+          <div title="Pesquisa"  class="d-flex align-center cursor-pointer width-100 justify-end">
+            <!-- <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>
@@ -40,14 +91,14 @@
            <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>
+            </button> -->
  
-            <div *ngIf="showSearch">
-              <div class="d-flex search-input-container ml-10 justify-between" *ngIf="showSearch">
+            <div *ngIf="showSearch" class="width-100">
+              <div class="d-flex search-input-container justify-between" *ngIf="showSearch">
                <!-- <div class="icon" (click)="basicSearch()">
                  <ion-icon class="icon-z" slot="end" name="search"></ion-icon>
                </div> -->
-                <div class="input-text d-flex ion-align-items-center">
+                <div class="input-text d-flex ion-align-items-center flex-1">
                  <ion-input (keyup.enter)="basicSearch()" [(ngModel)]='searchSubject' (ngModelChange)="dynamicSearch()"
                    class="search-input text-black" type="search" placeholder="Pesquisar"></ion-input>
                </div>
@@ -61,7 +112,7 @@
            </div>
          </div>

-          <div>
+          <div *ngIf="hideSearchBtn">
            <mat-form-field class="task-filter-input" appearance="none"   color="ion-color-secondary"  placeholder="Selecione agenda">
              <mat-select [(value)]="filterName">
      
@@ -717,3 +717,17 @@ ion-content{
    width: 20px;
  }
 }
+
+
+.activeTab {
+  color: #cf1521;
+}
+
+
+
+ion-segment-button {
+  width: 27px;
+  height: 11px;
+  min-width: 27px;
+  min-height: 27px;
+}
@@ -97,9 +97,10 @@ export class GabineteDigitalPage implements OnInit {
  filterName: 'Para hoje' | 'Novos'| 'Lidos'| 'Não lidos'|  'OverdueTasks' | 'Todos' = 'Todos'
  
  hideSearchBtn: boolean = false;
-  showSearch = false;
+  showSearch = true;
  searchSubject: string = '';
  AllProcess = []
+  ordinance: string =  'old'

  constructor(
    private processesbackend: ProcessesService,
@@ -120,12 +121,6 @@ export class GabineteDigitalPage implements OnInit {
    public TaskService: TaskService
  ) {

-    // this.workerList = new Worker(new URL('./list.worker.js', import.meta.url));
-
-    // this.workerList.onmessage =  (oEvent) => {
-    //   this.AllProcess = oEvent.data
-    // }
-
    window.onresize = (event) => {
      // if not mobile remove all component
      if (window.innerWidth < 701) {
@@ -139,14 +134,41 @@ export class GabineteDigitalPage implements OnInit {

    this.checkRoutes();

-    this.TaskService.registerCallback({
-      id: import.meta.url,
-      funx:() => {
-        this.dynamicSearch()
-      }
-    })
+
+    // fix with many timeout
+    setTimeout(() => {
+      this.dynamicSearch()
+    }, 2000)
+    setTimeout(() => {
+      this.dynamicSearch()
+    }, 4000)
+    setTimeout(() => {
+      this.dynamicSearch()
+    }, 6000)
+    setTimeout(() => {
+      this.dynamicSearch()
+    }, 10000)
+    setTimeout(() => {
+      this.dynamicSearch()
+    }, 14000)
+    setTimeout(() => {
+      this.dynamicSearch()
+    }, 18000)
+    setTimeout(() => {
+
+      this.dynamicSearch()
+
+      this.TaskService.registerCallback({
+        id: import.meta.url,
+        funx:() => {
+          this.dynamicSearch()
+        }
+      })
+    }, 20000)

  }
+
+
  closeAllDesktopComponent() {
    this.desktopComponent = {
      showEventList: false,
@@ -167,18 +189,40 @@ export class GabineteDigitalPage implements OnInit {
    this.dynamicSearch()
  }

+
+  reorderList(orderBy: string) {
+
+    this.ordinance = orderBy;
+
+    this.dynamicSearch();
+  }
+
+
  async dynamicSearch() {

+    const ordinance = this.ordinance
    if(this.showSearch && this.searchSubject) {
      
-      this.AllProcess = this.TaskService.AllProcess.filter((task) => {
+      const AllProcess = this.TaskService.AllProcess.filter((task) => {
        let subject = task.Folio || task.Subject || task.workflowInstanceDataFields.Subject
        subject = subject.toLowerCase();
        return subject.includes(this.searchSubject.toLowerCase())
      })
+
+      
+      if(ordinance == this.ordinance) {
+        this.AllProcess = this.TaskService.reorderList(this.ordinance, AllProcess)
+      }
    } else {
-      this.AllProcess = this.TaskService.AllProcess
+      const AllProcess = this.TaskService.AllProcess
+      
+      if(ordinance == this.ordinance) {
+        this.AllProcess = this.TaskService.reorderList(this.ordinance, AllProcess)
+      }
    }
+
+    console.log('order', this.ordinance)
+
  }

  ngOnInit() {
@@ -213,97 +257,7 @@ export class GabineteDigitalPage implements OnInit {
      }
    });

-    
    this.hideRefreshButton();
-
-    // this.waitForDomService.selector({
-    //   selector: 'app-gabinete-digital ion-content .aside-wrapper',
-    //   callback: () => {
-    //     // console.log('SECOND CALL')
-    //     this.loadAllProcesses();
-    //   }
-    // })
-
-    setTimeout(() => {
-        
-      this.backgroundservice.registerBackService('Online', () => {
-        // this.loadAllProcesses();
-      });
-
-      // this.NotificationsService.registerCallback({
-      //   type:'despachos',
-      //   funx:() => {
-      //     // this.loadCount();
-      //     console.log('refresh with notification')
-      //   }
-      // }) 
-
-        // this.NotificationsService.registerCallback({
-        //   type:'*',
-        //   funx:() => {
-        //     // this.LoadCounts();
-        //     console.log('refresh with notification *')
-        //   }
-        // }) 
-
-        // this.NotificationsService.registerCallback({
-        //   type:'despachos-pr',
-        //   funx:() => {
-        //     // this.LoadCounts();
-        //     console.log('refresh with notification')
-        //   }
-        // })
-        // this.NotificationsService.registerCallback({
-        //   type:'expediente',
-        //   funx: () => {
-        //     this.LoadCounts();
-        //     console.log('refresh with notification')
-        //   }
-        // }) 
-        // this.NotificationsService.registerCallback({
-        //   type:'gabinete-digital',
-        //   funx:() => {
-        //     this.LoadCounts();
-        //     console.log('refresh with notification')
-        //   }
-        // })
-        // this.NotificationsService.registerCallback({
-        //   type:'parecer',
-        //   funx: () => {
-        //     this.LoadCounts();
-        //     console.log('refresh with notification')
-        //   }
-        // }) 
-        // this.NotificationsService.registerCallback({
-        //   type: 'deferimento',
-        //   funx: () =>  {
-        //     this.LoadCounts();
-        //     console.log('refresh with notification')
-        //   }
-        // }) 
-        // this.NotificationsService.registerCallback({
-        //   type: 'diplomas-assinar',
-        //   funx: () => {
-        //     this.LoadCounts();
-        //     console.log('refresh with notification')
-        //   }
-        // }) 
-        // this.NotificationsService.registerCallback({
-        //   type: 'diplomas',
-        //   funx: () => {
-        //     this.LoadCounts();
-        //     console.log('refresh with notification')
-        //   }
-        // }) 
-        // this.NotificationsService.registerCallback({
-        //   type: 'expedientes-pr',
-        //   funx: () => {
-        //     this.LoadCounts();
-        //     console.log('refresh with notification')
-        //   }
-        // }) 
-
-    }, 100);
    
  }

@@ -23,9 +23,14 @@
      <div class="upper-content">
        <div class="content-details">
          <ion-label>
-            <p><span class="date">{{customDate}}</span><span class="label">{{ task.activityInstanceName }}</span></p>
+            <p><span class="date">{{customDate}}</span></p>
+          </ion-label>
+          <ion-label>
            <p><span class="color-red">{{ task.DeadlineType }}</span></p>
          </ion-label>
+          <ion-label>
+            <p class="d-flex mt-10"><span class="label">{{ task.activityInstanceName }}</span></p>
+          </ion-label>
        </div>
      </div>
      <div class="line"></div>
@@ -61,7 +61,7 @@ ion-button{

 .upper-content{
  font-family: Roboto;
-  margin-left: 41px;
+  margin-left: 36px;
  font-size: 18px;

  .label{
@@ -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: [
@@ -3,10 +3,29 @@
 </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="thetitle"><ion-label >Pedidos</ion-label></div>
-    <div class="theicon btn-refresh">
+  
+  <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>
+
+    <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>
+        </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>
+
      <mat-form-field class="task-filter-input" appearance="none"   color="ion-color-secondary"  placeholder="Selecione agenda">
        <mat-select [(value)]="filterName">

@@ -43,6 +62,7 @@
      </button>
    </div>
  </div>
+
  <ion-toolbar>
    <ion-segment [(ngModel)]="segment" (ionChange)="segmentChanged($event)" >
      <ion-segment-button value="parecer">
@@ -46,6 +46,10 @@ export class PedidosPage implements OnInit {
  showSearch = false
  searchSubject = ''
  list = []
+  ordinance: string =  'old'
+  listPedidosParecer = []
+  listPedidosDeferimento = []
+  

  constructor(
    private router: Router,
@@ -98,17 +102,37 @@ export class PedidosPage implements OnInit {
  }


+  reorderList(orderBy: string) {
+
+    this.ordinance = orderBy;
+
+    this.dynamicSearch();
+  }
+
  async dynamicSearch() {

    if(this.showSearch && this.searchSubject) {
      
-      this.list = this.TaskService.despachoStore.list.filter((task) => {
+      const listPedidosParecer = this.pedidosstorage.listparecer.filter((task) => {
        let subject = task.Folio || task.Subject || task.workflowInstanceDataFields.Subject
        subject = subject.toLowerCase();
        return subject.includes(this.searchSubject.toLowerCase())
      })
+
+      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();
+        return subject.includes(this.searchSubject.toLowerCase())
+      })
+
+      this.listPedidosDeferimento = this.TaskService.reorderList(this.ordinance, listPedidosDeferimento)
+
    } else {
-      this.list = this.TaskService.AllProcess
+
+      this.listPedidosParecer = this.TaskService.reorderList(this.ordinance, this.pedidosstorage.listparecer)
+      this.listPedidosDeferimento = this.TaskService.reorderList(this.ordinance, this.pedidosstorage.listdeferimento)      
    }

  }
@@ -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,
@@ -1,49 +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>
-  <div class="title">
-    <div class="thetitle"><ion-label >Pendentes</ion-label></div>
-    <div class="theicon btn-refresh">
-      <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>
+  <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>
 </ion-header>

 <ion-content style="background-color: white;">
@@ -57,9 +22,11 @@
    </ion-refresher-content>
  </ion-refresher>

+
  <app-task-list class="height-100"
-    [taskList] = pendentesstore.list
+    [taskList] = list
    [skeletonLoader] = skeletonLoader
+    [filterName] = "filterName"
    (viewTaskDetail)="viewTaskDetails($event)"
  > </app-task-list>

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

 .main-content {
@@ -18,6 +18,7 @@ import { Storage } from '@ionic/storage';
 import { SessionStore } from 'src/app/store/session.service';
 import { HttpErrorHandle } from 'src/app/services/http-error-handle.service';
 import { TaskService } from 'src/app/services/task.service'
+import { ThemeService } from 'src/app/services/theme.service'

@Component({
  selector: 'app-pendentes',
@@ -44,6 +45,8 @@ export class PendentesPage implements OnInit {
  showSearch = false
  searchSubject = ''
  list = []
+  ordinance: string =  'old'
+  headerName = "Pendentes"

  constructor(
    private processes: ProcessesService,
@@ -57,7 +60,8 @@ export class PendentesPage implements OnInit {
    private sortService: SortService,
    private storage: Storage,
    private httpErroHandle: HttpErrorHandle,
-    public TaskService: TaskService
+    public TaskService: TaskService,
+    public ThemeService: ThemeService,
  ) {
    this.loggeduser = SessionStore.user;
    this.profile = 'mdgpr';
@@ -89,17 +93,32 @@ export class PendentesPage implements OnInit {
  }


+  reorderList(orderBy: string) {
+
+    this.ordinance = orderBy;
+
+    this.dynamicSearch();
+  }
+
+  changeFilterName(filterName) {
+    this.filterName = filterName
+  }
+
+
  async dynamicSearch() {

    if(this.showSearch && this.searchSubject) {
      
-      this.list = this.TaskService.despachoStore.list.filter((task) => {
+      const list = this.pendentesstore.list.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.TaskService.AllProcess
+      const list = this.pendentesstore.list
+      this.list = this.TaskService.reorderList(this.ordinance, list)
    }

  }
@@ -14,6 +14,7 @@ ion-content{
    width: 100vw;
    height: 100vh;
    overflow: auto;
+    position: absolute;

 }
 .wrapper{
@@ -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);
@@ -31,6 +31,7 @@ export class EventoApprovePipe implements PipeTransform {
        "Status": fullTask.workflowInstanceDataFields.Status,
        "Deadline": fullTask.deadline,
        "TaskStatus": fullTask.taskStatus,
+        "TaskReceiveDate": fullTask.taskReceiveDate
      },
      obj
    )
@@ -117,8 +117,8 @@ export class ChatSystemService {

  private async ReLoadChat() {

-    await this.chatService.refreshtoken();
    await this.restoreUsers();
+    await this.chatService.refreshtoken();
    await this.getUser();
    await this.restoreRooms();
    await this.getAllRooms();
@@ -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;
@@ -131,13 +131,22 @@ export class TaskService {
  updateAllProcess = () => {
    this.AllProcess = this.sortArrayISODate(this.despachoprstore.list.concat(this.deplomasStore.diplomasAssinadoList as any).concat(this.deplomasStore.diplomasParaAssinarList as any).concat(this.deplomasStore.DiplomaGerarList as any).concat(this.deplomasStore.diplomasReviewList)
    .concat(this.eventoaprovacaostore.contactList as any).concat(this.expedientegbstore.list as any).concat(this.despachoStore.list as any).concat(this.pedidosstore.listparecer as any).concat(this.pedidosstore.listdeferimento as any)
-    .concat(this.pendentesstore.list as any)).reverse()
+    .concat(this.pendentesstore.list as any))

  }

  sortArrayISODate(myArray: any): any[] {

-    return myArray.sort((a,b) => Date.parse(b.CreateDate || b.taskStartDate || b.TaskStartDate) - Date.parse(a.CreateDate || 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) {
+
+    if(orderBy == 'recent') {
+      return this.sortArrayISODate(list).reverse();
+    } else {
+      return this.sortArrayISODate(list)
+    }
  }


@@ -200,6 +209,8 @@ export class TaskService {
      });
  
      expedientes = expedientes.map((element) => this.expedienteTaskPipe.transform(element));
+
+      expedientes = this.sortArrayISODate(expedientes).reverse()
      
      this.expedientegbstore.reset(expedientes);
    } catch (error) {
@@ -254,34 +265,37 @@ export class TaskService {

  async loadEventosParaAprovacao() {

-    try { 
-      for(let calendar of this.eventService.calendarNamesAry) {
-        if(calendar == 'Meu calendario') {
-          // color
-          let genericEvents = await this.processesbackend.GetTasksList('Agendar Evento', false).toPromise();
-          let eventsList
-          try {
-            eventsList = this.sortService.sortArrayByDate(genericEvents).reverse();
-          } catch (error) {
-            eventsList = [];
+    // PR dont have event to approve
+    if(this.SessionStore.user.Profile != 'PR') {
+      try { 
+        for(let calendar of this.eventService.calendarNamesAry) {
+          if(calendar == 'Meu calendario') {
+            // color
+            let genericEvents = await this.processesbackend.GetTasksList('Agendar Evento', false).toPromise();
+            let eventsList
+            try {
+              eventsList = this.sortService.sortArrayByDate(genericEvents).reverse();
+            } catch (error) {
+              eventsList = [];
+            }
+      
+            this.eventoaprovacaostore.save(calendar, eventsList)
+            
+          } else {
+            let allEvents = await this.processesbackend.eventsToApprove(calendar.OwnerUserId, 'againete page').toPromise()
+            let eventsList
+            try {
+              eventsList = this.sortService.sortArrayByDate(allEvents).reverse();
+            } catch(error) {
+              eventsList = []
+            }
+            
+            this.eventoaprovacaostore.save(calendar.OwnerUserId, eventsList)
          }
-    
-          this.eventoaprovacaostore.save(calendar, eventsList)
-          
-        } else {
-          let allEvents = await this.processesbackend.eventsToApprove(calendar.OwnerUserId, 'againete page').toPromise()
-          let eventsList
-          try {
-            eventsList = this.sortService.sortArrayByDate(allEvents).reverse();
-          } catch(error) {
-            eventsList = []
-          }
-          
-          this.eventoaprovacaostore.save(calendar.OwnerUserId, eventsList)
        }
+      } catch (error) {
+  
      }
-    } catch (error) {
-
    }

  }
@@ -321,7 +335,7 @@ export class TaskService {
        diplomasList.push(task);
      });

-      diplomasList = this.sortService.sortDate(diplomasList, 'CreateDate')
+      diplomasList = this.sortService.sortDate(diplomasList, 'CreateDate').reverse()
      this.deplomasStore.resetDiplomaGerar(diplomasList);
      

@@ -343,10 +357,12 @@ export class TaskService {
      let diplomasAssinar: any = depachoAPI.filter(data => data.activityInstanceName == "Assinar Diploma");
      diplomasAssinar = diplomasAssinar.map((element) => this.expedienteTaskPipe.transform(element))
      this.sortService.sortDate(diplomasAssinar, 'CreateDate')
+      diplomasAssinar = this.sortService.sortArrayISODate(diplomasAssinar)
      this.deplomasStore.resetDiplomasParaAssinar(diplomasAssinar)

      let diplomasAssinados: any = depachoAPI.filter(data => data.activityInstanceName == "Diploma Assinado");
      diplomasAssinados = diplomasAssinados.map((element) => this.expedienteTaskPipe.transform(element))
+      diplomasAssinados = this.sortService.sortArrayISODate(diplomasAssinados)
      this.deplomasStore.resetDiplomasAssinadoList(diplomasAssinados)
    } catch (error) {

@@ -93,6 +93,7 @@ export class ApproveEventPage implements OnInit {
      await this.processes.PostTaskAction(body).toPromise()
      this.modalController.dismiss(serialNumber);
      this.httpErroHandle.httpsSucessMessagge('Aprovar')
+      this.TaskService.loadEventosParaAprovacao();
    } catch (error) {
      this.httpErroHandle.httpStatusHandle(error)
    } finally {
@@ -112,6 +113,7 @@ export class ApproveEventPage implements OnInit {
    try {
      await this.processes.PostTaskAction(body).toPromise()
      this.httpErroHandle.httpsSucessMessagge('Rejeitar');
+      this.TaskService.loadEventosParaAprovacao();
    } catch (error) {
      this.httpErroHandle.httpStatusHandle(error)
      
@@ -201,6 +203,7 @@ export class ApproveEventPage implements OnInit {
          try {
            await this.processes.PostTaskAction(body).toPromise();
            this.httpErroHandle.httpsSucessMessagge('Rever')
+            this.TaskService.loadEventosParaAprovacao();
            this.close();
          } catch (error) {
            this.httpErroHandle.httpStatusHandle(error)
@@ -213,6 +216,8 @@ export class ApproveEventPage implements OnInit {
            this.toastService._badRequest('É necessário adicionar uma nota');
          }
        }
+
+        
      } else {
        
      } 
@@ -81,17 +81,19 @@ export class EventListPage implements OnInit {
  }

  async LoadToApproveEvents() {
+
+
+    if(SessionStore.user.Profile == 'PR') {
+      return false
+    }
+    
    this.showLoader = true;

    const segment: any = this.segment

    if(this.segment == 'Meu calendario') {
      // color
-      if(SessionStore.user.Profile == 'PR') {
-        this.color = 'pr'
-      } else {
-        this.color = 'mdgpr'
-      }
+      this.color = 'mdgpr'

      let genericEvents = await this.processes.eventsToApprove(SessionStore.user.UserId,'mobile agenda').toPromise()
      try {
@@ -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>
@@ -31,7 +31,7 @@

  <div class="main-content">

-    <ion-virtual-scroll [items]="ChatSystemService.users | filter:textSearch: 'name'" approxItemHeight="70px" [headerFn]="separateLetter">
+    <ion-virtual-scroll [items]="userList" approxItemHeight="70px" [headerFn]="separateLetter">

      <div class="item-divider" *virtualHeader="let header">
        <ion-label>{{header}}</ion-label>
@@ -28,6 +28,9 @@ export class ContactsPage implements OnInit {
  @Output() backToChat:EventEmitter<any> = new EventEmitter<any>();
  @Output() closeAllDesktopComponents:EventEmitter<any> = new EventEmitter<any>();  

+
+  userList = this.ChatSystemService.users
+
  constructor(
    private modalController: ModalController,
    private chatService: ChatService,
@@ -46,7 +49,14 @@ export class ContactsPage implements OnInit {
  }

  onChange(event) {
-    this.textSearch = event.detail.value;
+
+    this.textSearch = event.detail.value.toLowerCase();
+
+    this.userList = this.ChatSystemService.users.filter((e) => {
+      const username = e.name.toLowerCase()
+      return username.includes(this.textSearch)
+    })
+    
  }

  openMessagesPage(username:string) {
@@ -3,7 +3,7 @@
  <div class="title">
    <div class="thetitle"><ion-label >Todas as tarefas</ion-label></div>

-    <div class="theicon d-flex">
+    <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">
@@ -40,6 +40,18 @@
          </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">
@@ -27,6 +27,7 @@ export class AllProcessesPage implements OnInit {
  }) */

  AllProcess = []
+  ordinance: string =  'old'
  
  constructor(
    private router: Router,
@@ -71,30 +72,40 @@ export class AllProcessesPage implements OnInit {
  }

  openSearch() {
-    this.dynamicSearch()
+    // this.dynamicSearch()
  }
  async closeSearch() {
    this.searchSubject = ''
-    this.dynamicSearch()
+    // this.dynamicSearch()
  }

  async basicSearch() {
-    this.dynamicSearch()
+    // this.dynamicSearch()
  }

+
+  reorderList(orderBy: string) {
+
+    this.ordinance = orderBy;
+
+    this.dynamicSearch();
+  }
+  
  async dynamicSearch() {

    if(this.showSearch && this.searchSubject) {
      
-      this.AllProcess = this.TaskService.AllProcess.filter((task) => {
+      const AllProcess = this.TaskService.AllProcess.filter((task) => {
        let subject = task.Folio || task.Subject || task.workflowInstanceDataFields.Subject
        subject = subject.toLowerCase();
        return subject.includes(this.searchSubject.toLowerCase())
      })
-    } else {
-      this.AllProcess = this.TaskService.AllProcess
-    }

+      this.AllProcess = this.TaskService.reorderList(this.ordinance, AllProcess)
+    } else {
+      const AllProcess = this.TaskService.AllProcess
+      this.AllProcess = this.TaskService.reorderList(this.ordinance, AllProcess)
+    }
  }

  checkFilter() {
@@ -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,
    //
@@ -1,77 +1,14 @@
 <ion-header class="ion-no-border">
-  <ion-progress-bar type="indeterminate" *ngIf="skeletonLoader"></ion-progress-bar>
-  <div class="main-header">
-    <div class="thetitle">
-      <ion-label  >{{ environment.dispatchPR}}</ion-label>
-    </div>
-    <div class="theicon d-flex">
-
-      <!-- <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>
-        <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>
+  <app-task-list-header
+    class="width-100 height-100"
+    [goBackButton] = false
+    [headerName] = environment.dispatchPR
+    [ordinance] = ordinance
+    [loading] = skeletonLoader
+    [loaderTop] = true
+    (reorderList) = reorderList($event)
+    (changeFilterName) = changeFilterName($event)
+  ></app-task-list-header>

 </ion-header>
 <ion-content>
@@ -32,6 +32,7 @@ export class DespachosPrPage implements OnInit {
  searchSubject = ''
  list = []
  hideSearchBtn: boolean = false;
+  ordinance: string =  'old'
  
 constructor (
  private processes:ProcessesService,
@@ -64,6 +65,10 @@ constructor (

  }

+  changeFilterName(filterName) {
+    this.filterName = filterName
+  }
+
  async LoadList() {

    this.skeletonLoader = true;
@@ -74,18 +79,27 @@ constructor (
  }


+  reorderList(orderBy: string) {
+
+    this.ordinance = orderBy;
+
+    this.dynamicSearch();
+  }

  async dynamicSearch() {

    if(this.showSearch && this.searchSubject) {
      
-      this.list = this.despachosprstore.list.filter((task) => {
+      const list = this.despachosprstore.list.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.despachosprstore.list
+      const list = this.despachosprstore.list
+      this.list = this.TaskService.reorderList(this.ordinance, list)
    }

  }
@@ -2,7 +2,7 @@
  <ion-progress-bar type="indeterminate" *ngIf="skeletonLoader"></ion-progress-bar>
  <div class="title">
    <div class="thetitle"><ion-label >Despachos</ion-label></div>
-    <div class="theicon d-flex">
+    <div class="theicon d-flex align-center">
      <!-- <button title="Atualizar" class="btn-no-color" (click)="refreshing()">
        <ion-icon slot="end" class="title-icon font-awesome" name="reload-circle"></ion-icon>
      </button> -->
@@ -37,6 +37,18 @@
        </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">
@@ -18,6 +18,7 @@ export class DespachosPage implements OnInit {
  searchSubject = ''
  list = []
  hideSearchBtn: boolean = false;
+  ordinance: string =  'old'

  constructor (
   private router: Router,
@@ -54,18 +55,28 @@ export class DespachosPage implements OnInit {

  }

-  
+  reorderList(orderBy: string) {
+
+    this.ordinance = orderBy;
+
+    this.dynamicSearch();
+  }
+
  async dynamicSearch() {

    if(this.showSearch && this.searchSubject) {
      
-      this.list = this.TaskService.despachoStore.list.filter((task) => {
+      const list = this.TaskService.despachoStore.list.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.TaskService.AllProcess
+      const list = this.TaskService.despachoStore.list
+      this.list =  this.TaskService.reorderList(this.ordinance, list)
    }

  }
@@ -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,
@@ -2,7 +2,7 @@
  <ion-progress-bar type="indeterminate" *ngIf="skeletonLoader"></ion-progress-bar>
  <div class="title">
    <div class="thetitle"><ion-label >Diplomas para assinar</ion-label></div>
-    <div class="theicon d-flex">
+    <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">
@@ -34,6 +34,17 @@
        </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">
@@ -83,88 +94,13 @@
      </ion-refresher-content>
  </ion-refresher>

-
-  <div class="main-container width-100 overflow-y-auto height-100">
-
-    <div  *ngIf="list.length >= 1">
-
-
-      <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)" -->
-          <!--  [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>
-
+  <app-task-list
+    [taskList] = list
+    [skeletonLoader] = skeletonLoader
+    (viewTaskDetail)="goToDiploma($event)"
+    [filterName]="filterName"
+  >
+  </app-task-list>

 </ion-content>

@@ -26,7 +26,8 @@ export class DiplomasAssinarPage implements OnInit {
  searchSubject = ''
  list = []
  hideSearchBtn: boolean = false;
-    
+  ordinance: string =  'old'
+

  constructor(
    private processes:ProcessesService,
@@ -54,18 +55,28 @@ export class DiplomasAssinarPage implements OnInit {
  }


-  
+  reorderList(orderBy: string) {
+
+    this.ordinance = orderBy;
+
+    this.dynamicSearch();
+  }
+
  async dynamicSearch() {

    if(this.showSearch && this.searchSubject) {
      
-      this.list = this.deplomasStore.diplomasParaAssinarList.filter((task) => {
+      const list = this.deplomasStore.diplomasParaAssinarList.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.deplomasStore.diplomasParaAssinarList
+
+      const list = this.deplomasStore.diplomasParaAssinarList
+      this.list = this.TaskService.reorderList(this.ordinance, list)
    }

  }
@@ -84,8 +95,8 @@ export class DiplomasAssinarPage implements OnInit {
  }


-  goToDiploma(serialNumber:any){
-    this.router.navigate(['/home/gabinete-digital/diplomas-assinar',serialNumber,'gabinete-digital']);
+  goToDiploma({SerialNumber}){
+    this.router.navigate(['/home/gabinete-digital/diplomas-assinar',SerialNumber,'gabinete-digital']);
  }

  doRefresh(event) {
@@ -2,7 +2,19 @@
  <ion-progress-bar type="indeterminate" *ngIf="skeletonLoader"></ion-progress-bar>
  <div class="title">
    <div class="thetitle"><ion-label >Diplomas por gerar</ion-label></div>
-    <div class="theicon">
+    <div class="theicon d-flex align-center">
+
+      <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>
+
      <mat-form-field class="task-filter-input" appearance="none"   color="ion-color-secondary"  placeholder="Selecione agenda">
        <mat-select [(value)]="filterName">

@@ -59,7 +71,7 @@
      <ion-list >
        <div
          class=" item-hover ion-no-padding ion-no-margin cursor-pointer"
-          *ngFor = "let task of deplomasStore.DiplomaGerarList"
+          *ngFor = "let task of list"
          (click)="goToDiploma(task.SerialNumber)"
        >
          <div class="item width-100 expediente" *ngIf="TaskService.filter(task, filterName)">
@@ -22,7 +22,12 @@ export class DiplomasGerarPage implements OnInit {
  deplomasStore = DeplomasStore
  customTaskPipe = new CustomTaskPipe()
  filterName: 'Para hoje' | 'Novos'| 'Lidos'| 'Não lidos'|  'OverdueTasks' | 'Todos' = 'Todos'
-  
+  // 
+  showSearch = false
+  searchSubject = ''
+  list = []
+  hideSearchBtn: boolean = false;
+  ordinance: string =  'old'

  constructor(
    private processes:ProcessesService,
@@ -35,6 +40,7 @@ export class DiplomasGerarPage implements OnInit {
  ngOnInit() {

    this.LoadList()
+    this.dynamicSearch()

  }

@@ -65,4 +71,34 @@ export class DiplomasGerarPage implements OnInit {
    this.skeletonLoader = false;
  }

+
+  
+  reorderList(orderBy: string) {
+
+    this.ordinance = orderBy;
+
+    this.dynamicSearch();
+  }
+
+  async dynamicSearch() {
+
+    if(this.showSearch && this.searchSubject) {
+      
+      const list = this.deplomasStore.DiplomaGerarList.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 {
+
+      const list = this.deplomasStore.DiplomaGerarList
+      this.list = this.TaskService.reorderList(this.ordinance, list)
+    }
+
+  }
+
+
+
 }
@@ -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>
-
@@ -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;
-}
@@ -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']);
-    }
-
-  }
@@ -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,
@@ -2,7 +2,7 @@
  <ion-progress-bar type="indeterminate" *ngIf="skeletonLoader"></ion-progress-bar>
  <div class="title">
    <div class="thetitle"><ion-label >Diplomas</ion-label></div>
-    <div class="theicon d-flex">
+    <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">
@@ -32,7 +32,17 @@
          </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">
@@ -35,7 +35,7 @@ export class DiplomasPage implements OnInit {
  listDiplomasPorValidar = []
  listDiplomasAssinadosPR = []
  hideSearchBtn: boolean = false;
-
+  ordinance: string =  'old'

  constructor(
    private processes:ProcessesService,
@@ -65,27 +65,42 @@ export class DiplomasPage implements OnInit {
  }


+  reorderList(orderBy: string) {
+
+    this.ordinance = orderBy;
+
+    this.dynamicSearch();
+  }
+
  async dynamicSearch() {

    if(this.showSearch && this.searchSubject) {

-      this.listDiplomasAssinadosPR = this.deplomasStore.diplomasAssinadoList.filter((task) => {
+      const listDiplomasAssinadosPR = this.deplomasStore.diplomasAssinadoList.filter((task) => {
        let subject = task.Folio || task.Subject || task.workflowInstanceDataFields.Subject
        subject = subject.toLowerCase();
        return subject.includes(this.searchSubject.toLowerCase())
      })

+
+      this.listDiplomasAssinadosPR = this.TaskService.reorderList(this.ordinance, listDiplomasAssinadosPR)
+
      
-      this.listDiplomasPorValidar = this.deplomasStore.diplomasReviewList.filter((task) => {
+      const listDiplomasPorValidar = this.deplomasStore.diplomasReviewList.filter((task) => {
        let subject = task.Folio || task.Subject || task.workflowInstanceDataFields.Subject
        subject = subject.toLowerCase();
        return subject.includes(this.searchSubject.toLowerCase())
      })

+      this.listDiplomasPorValidar = this.TaskService.reorderList(this.ordinance, listDiplomasPorValidar)
+
    } else {
      
-      this.listDiplomasAssinadosPR = this.deplomasStore.diplomasAssinadoList
-      this.listDiplomasPorValidar = this.deplomasStore.diplomasReviewList
+      const listDiplomasAssinadosPR = this.deplomasStore.diplomasAssinadoList
+      const listDiplomasPorValidar = this.deplomasStore.diplomasReviewList
+
+      this.listDiplomasPorValidar = this.TaskService.reorderList(this.ordinance, listDiplomasPorValidar)
+      this.listDiplomasAssinadosPR = this.TaskService.reorderList(this.ordinance, listDiplomasAssinadosPR)
    }

  }
@@ -3,7 +3,7 @@
  <div class="title width-100">
    <div class="title-container d-flex justify-space-between">
      <span class="text-center mt-0 aside-title px-20"><label>Eventos para Aprovação</label></span>
-      <div class="d-flex">
+      <div class="d-flex align-center">


        <!-- <div>
@@ -36,6 +36,17 @@
            </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">
@@ -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';
@@ -44,7 +43,7 @@ export class EventsToApprovePage implements OnInit {
  searchSubject = ''
  list = []
  hideSearchBtn: boolean = false;
-    
+  ordinance: string =  'old'
  
  constructor(
    private processes:ProcessesService,
@@ -86,18 +85,30 @@ export class EventsToApprovePage implements OnInit {
  }


-  
+  reorderList(orderBy: string) {
+
+    this.ordinance = orderBy;
+
+    // this.dynamicSearch();
+  }
+
+
+
  async dynamicSearch() {

    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)
    }

  }
@@ -125,13 +136,14 @@ export class EventsToApprovePage implements OnInit {
    this.showLoader = true;
    const segment = this.segment

+    if(SessionStore.user.Profile == 'PR') {
+      return false
+    }
+    
+
    if(this.segment == 'Meu calendario') {
      // color
-      if(SessionStore.user.Profile == 'PR') {
-        this.color = 'pr'
-      } else {
-        this.color = 'mdgpr'
-      }
+      this.color = 'mdgpr'

      let genericEvents = await this.processes.eventsToApprove(SessionStore.user.UserId,'mobile agenda').toPromise()
      try {
@@ -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,
@@ -2,7 +2,7 @@
  <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 d-flex" (click)="refreshing()">
+    <div class="theicon d-flex align-center" (click)="refreshing()">

      
      <!-- <div>
@@ -35,6 +35,17 @@
        </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">
@@ -77,78 +88,13 @@
 </ion-header>
 <ion-content>

-  <div class="content width-100 overflow-y-auto height-100">
-
-    <ion-list *ngIf="list.length >= 1">
-      <div
-        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)">
-          <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>
+  <app-task-list
+    [taskList] = list
+    [skeletonLoader] = skeletonLoader
+    (viewTaskDetail)="goToExpediente($event)"
+    [filterName]="filterName"
+  >
+  </app-task-list>

 </ion-content>

@@ -32,6 +32,7 @@ export class ExpedientesPrPage implements OnInit {
  searchSubject = ''
  list = []
  hideSearchBtn: boolean = false;
+  ordinance: string =  'old'

  @Output() openExpedientDetail:EventEmitter<any> = new EventEmitter<any>();

@@ -67,17 +68,28 @@ export class ExpedientesPrPage implements OnInit {
  }


+  
+  reorderList(orderBy: string) {
+
+    this.ordinance = orderBy;
+
+    this.dynamicSearch();
+  }
+
  async dynamicSearch() {

    if(this.showSearch && this.searchSubject) {
      
-      this.list = this.expedienteGdStore.list.filter((task) => {
+      const list = this.expedienteGdStore.list.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.expedienteGdStore.list
+      const list = this.expedienteGdStore.list
+      this.list = this.TaskService.reorderList(this.ordinance, list)
    }

  }
@@ -138,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']);
  }

 }
@@ -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,
@@ -2,7 +2,7 @@
  <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 d-flex">
+    <div class="theicon d-flex align-center">
 <!-- 
      <div>
        <div title="Pesquisa" *ngIf="!hideSearchBtn" class="mr-20 d-flex align-center cursor-pointer">
@@ -35,6 +35,18 @@
        </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">
@@ -55,7 +67,6 @@
              Não lidos
            </mat-option>
  
-  
            <mat-option value="OverdueTasks">
              Em atraso
            </mat-option>
@@ -84,78 +95,13 @@
      </ion-refresher-content>
  </ion-refresher>

-  <div class="content width-100 overflow-y-auto height-100" >
-    <div >
-
-      <ion-list *ngIf="list.length >=0">
-        <div
-          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)">
-            <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>
+  <app-task-list
+    [taskList] = list
+    [skeletonLoader] = skeletonLoader
+    (viewTaskDetail)="goToExpediente($event)"
+    [filterName]="filterName"
+  >
+  </app-task-list>

 </ion-content>

@@ -29,6 +29,7 @@ export class ExpedientsPage implements OnInit {
  searchSubject = ''
  list = []
  hideSearchBtn: boolean = false;
+  ordinance: string =  'old'

  constructor(
    private processes: ProcessesService,
@@ -71,17 +72,30 @@ export class ExpedientsPage implements OnInit {


    
+  reorderList(orderBy: string) {
+
+    this.ordinance = orderBy;
+
+    this.dynamicSearch();
+  }
+
+
  async dynamicSearch() {

    if(this.showSearch && this.searchSubject) {
      
-      this.list = this.expedientegbstore.list.filter((task) => {
+      const list = this.expedientegbstore.list.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.expedientegbstore.list
+      const list = this.expedientegbstore.list
+
+      this.list = this.TaskService.reorderList(this.ordinance, list)
    }

  }
@@ -133,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) {
@@ -160,8 +163,8 @@ export class ExpedientsPage implements OnInit {

  }

-  goToExpediente(serialNumber: any) {
-    this.router.navigate(['/home/gabinete-digital/expediente', serialNumber, 'gabinete-digital']);
+  goToExpediente({SerialNumber}) {
+    this.router.navigate(['/home/gabinete-digital/expediente', SerialNumber, 'gabinete-digital']);
  }

  }
@@ -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 {}
@@ -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 {}
@@ -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>
@@ -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;
+    }
+}
@@ -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', () => {
-  let component: ExpedientsPage;
-  let fixture: ComponentFixture<ExpedientsPage>;
+describe('TaskListHeaderPage', () => {
+  let component: TaskListHeaderPage;
+  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();
  }));
@@ -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() {}
+}
--- a/Show More
+++ b/Show More