add search

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

@@ -2,41 +2,82 @@
   <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">
+    <div class="theicon d-flex">
       <!-- <button title="Atualizar" class="btn-no-color" (click)="refreshing()">
         <ion-icon slot="end" class="title-icon font-awesome" name="reload-circle"></ion-icon>
       </button> -->
-      <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>
+      <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>
 
-          <mat-option value="Novos" >
-            Novos
-          </mat-option>
+          <div *ngIf="showSearch">
+            <div class="d-flex search-input-container ml-10 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">
+                <ion-input (keyup.enter)="basicSearch()" [(ngModel)]='searchSubject' (ngModelChange)="dynamicSearch()"
+                  class="search-input text-black" type="search" placeholder="Pesquisar"></ion-input>
+              </div>
+              
+              <!-- <div class="icon" (click)="clearSearchInput()">
+                <ion-icon title="Limpar" *ngIf="ThemeService.currentTheme == 'default' "name="restaurant-outline" src="assets/images/icons-search-close.svg"></ion-icon>
+                <ion-icon title="Limpar" *ngIf="ThemeService.currentTheme == 'doneIt' "name="restaurant-outline"  src="assets/images/theme/doneIt/icons-search.svg"></ion-icon>
+                <ion-icon title="Limpar" *ngIf="ThemeService.currentTheme == 'gov' " name="restaurant-outline" src="assets/images/theme/gov/icons-search-close.svg"></ion-icon>
+              </div> -->
+              <div (click)="basicSearch()"  class="d-flex align-center icon">
 
-          <mat-option value="Lidos" >
-            Lidos
-          </mat-option>
+                <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>
 
-          <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>
   </div>
 </ion-header>

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

@@ -218,3 +218,27 @@ ion-item{
   float: right;
   margin-right: 10px;
 }
+
+
+
+.search-input-container{
+  background-color: white;
+  border-radius: 27.5px;
+  border: solid 1px #ebebeb;
+  font-size: 14px;
+  .icon{
+    color: #797979;
+    width: 41px;
+    height: 41px;
+    display: flex;
+    justify-content: center;
+    font-size: 25px;
+    align-items: center;
+  }
+  .input-text{
+    width: 100%;
+  }
+  .icon-z{
+    width: 20px;
+  }
+}

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

@@ -3,7 +3,8 @@ import { customTask } from '../../../models/dailyworktask.model';
 import { NavigationStart, Router } from '@angular/router';
 import { DespachoStore } from 'src/app/store/despacho-store.service';
 import { DespachoService } from 'src/app/Rules/despacho.service';
-import { TaskService } from 'src/app/services/task.service'
+import { TaskService } from 'src/app/services/task.service';
+import { ThemeService } from 'src/app/services/theme.service'
 
 @Component({
   selector: 'app-despachos',
@@ -15,12 +16,16 @@ export class DespachosPage implements OnInit {
   despachoStore = DespachoStore;
   skeletonLoader = true;
   filterName: 'Para hoje' | 'Novos'| 'Lidos'| 'Não lidos'|  'OverdueTasks' | 'Todos' = 'Todos'
-  
+  showSearch = false
+  searchSubject = ''
+  list = []
+  hideSearchBtn: boolean = false;
 
   constructor (
    private router: Router,
    private despachoRule: DespachoService,
-   public TaskService: TaskService
+   public TaskService: TaskService,
+   public ThemeService: ThemeService,
   ) {}
 
   ngOnInit() {
@@ -48,6 +53,37 @@ export class DespachosPage implements OnInit {
 
   }
 
+  
+  async dynamicSearch() {
+
+    if(this.showSearch && this.searchSubject) {
+      
+      this.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())
+      })
+    } else {
+      this.list = this.TaskService.AllProcess
+    }
+
+  }
+
+
+  openSearch() {
+    this.dynamicSearch()
+  }
+  async closeSearch() {
+    this.searchSubject = ''
+    this.dynamicSearch()
+  }
+
+  async basicSearch() {
+    this.dynamicSearch()
+  }
+
+
+
   goToDespacho({ SerialNumber } : customTask) {
     this.router.navigate(['/home/gabinete-digital/despachos',SerialNumber,'gabinete-digital']);
   }

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

@@ -3,7 +3,45 @@
   <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>
+      <div class="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="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">
+                  <ion-input (keyup.enter)="basicSearch()" [(ngModel)]='searchSubject' (ngModelChange)="dynamicSearch()"
+                    class="search-input text-black" type="search" placeholder="Pesquisar"></ion-input>
+                </div>
+                
+                <!-- <div class="icon" (click)="clearSearchInput()">
+                  <ion-icon title="Limpar" *ngIf="ThemeService.currentTheme == 'default' "name="restaurant-outline" src="assets/images/icons-search-close.svg"></ion-icon>
+                  <ion-icon title="Limpar" *ngIf="ThemeService.currentTheme == 'doneIt' "name="restaurant-outline"  src="assets/images/theme/doneIt/icons-search.svg"></ion-icon>
+                  <ion-icon title="Limpar" *ngIf="ThemeService.currentTheme == 'gov' " name="restaurant-outline" src="assets/images/theme/gov/icons-search-close.svg"></ion-icon>
+                </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>
+
         <mat-form-field class="task-filter-input" appearance="none"   color="ion-color-secondary"  placeholder="Selecione agenda">
           <mat-select [(value)]="filterName">
   

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

@@ -230,3 +230,29 @@
   left: 50%;
   margin: -35px 0 0 -35px;
 }
+
+
+
+
+
+.search-input-container{
+  background-color: white;
+  border-radius: 27.5px;
+  border: solid 1px #ebebeb;
+  font-size: 14px;
+  .icon{
+    color: #797979;
+    width: 41px;
+    height: 41px;
+    display: flex;
+    justify-content: center;
+    font-size: 25px;
+    align-items: center;
+  }
+  .input-text{
+    width: 100%;
+  }
+  .icon-z{
+    width: 20px;
+  }
+}

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

@@ -13,6 +13,7 @@ import { SessionStore } from 'src/app/store/session.service';
 import { EventsService } from 'src/app/services/events.service';
 import { environment } from 'src/environments/environment';
 import { TaskService } from 'src/app/services/task.service'
+import { ThemeService } from 'src/app/services/theme.service'
 
 @Component({
   selector: 'app-events-to-approve',
@@ -37,6 +38,11 @@ export class EventsToApprovePage implements OnInit {
   environment = environment
   filterName: 'Para hoje' | 'Novos'| 'Lidos'| 'Não lidos'|  'OverdueTasks' | 'Todos' = 'Todos'
   
+
+  showSearch = false
+  searchSubject = ''
+  list = []
+  hideSearchBtn: boolean = false;
   
   constructor(
     private processes:ProcessesService,
@@ -46,7 +52,8 @@ export class EventsToApprovePage implements OnInit {
     private sortService: SortService,
     private storage: Storage,
     public eventService: EventsService,
-    public TaskService: TaskService
+    public TaskService: TaskService,
+    public ThemeService: ThemeService,
     )
     {}
 
@@ -75,6 +82,38 @@ export class EventsToApprovePage implements OnInit {
 
   }
 
+
+  
+  async dynamicSearch() {
+
+    if(this.showSearch && this.searchSubject) {
+      
+      this.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())
+      })
+    } else {
+      this.list = this.TaskService.AllProcess
+    }
+
+  }
+
+
+  openSearch() {
+    this.dynamicSearch()
+  }
+  async closeSearch() {
+    this.searchSubject = ''
+    this.dynamicSearch()
+  }
+
+  async basicSearch() {
+    this.dynamicSearch()
+  }
+
+
+
   segmentChanged(ev: any) {
     this.LoadToApproveEvents();
   }

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

@@ -2,7 +2,45 @@
   <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" (click)="refreshing()">
+    <div class="theicon d-flex" (click)="refreshing()">
+
+      <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="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">
+                <ion-input (keyup.enter)="basicSearch()" [(ngModel)]='searchSubject' (ngModelChange)="dynamicSearch()"
+                  class="search-input text-black" type="search" placeholder="Pesquisar"></ion-input>
+              </div>
+              
+              <!-- <div class="icon" (click)="clearSearchInput()">
+                <ion-icon title="Limpar" *ngIf="ThemeService.currentTheme == 'default' "name="restaurant-outline" src="assets/images/icons-search-close.svg"></ion-icon>
+                <ion-icon title="Limpar" *ngIf="ThemeService.currentTheme == 'doneIt' "name="restaurant-outline"  src="assets/images/theme/doneIt/icons-search.svg"></ion-icon>
+                <ion-icon title="Limpar" *ngIf="ThemeService.currentTheme == 'gov' " name="restaurant-outline" src="assets/images/theme/gov/icons-search-close.svg"></ion-icon>
+              </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>
+      
       <mat-form-field class="task-filter-input" appearance="none"   color="ion-color-secondary"  placeholder="Selecione agenda">
         <mat-select [(value)]="filterName">
 

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

@@ -159,3 +159,29 @@ ion-item{
   float: right;
   margin-right: 10px;
 }
+
+
+
+
+
+.search-input-container{
+  background-color: white;
+  border-radius: 27.5px;
+  border: solid 1px #ebebeb;
+  font-size: 14px;
+  .icon{
+    color: #797979;
+    width: 41px;
+    height: 41px;
+    display: flex;
+    justify-content: center;
+    font-size: 25px;
+    align-items: center;
+  }
+  .input-text{
+    width: 100%;
+  }
+  .icon-z{
+    width: 20px;
+  }
+}

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

@@ -28,6 +28,11 @@ export class ExpedientesPrPage implements OnInit {
   loggeduser: LoginUserRespose;
   filterName: 'Para hoje' | 'Novos'| 'Lidos'| 'Não lidos'|  'OverdueTasks' | 'Todos' = 'Todos'
   
+  showSearch = false
+  searchSubject = ''
+  list = []
+  hideSearchBtn: boolean = false;
+
   @Output() openExpedientDetail:EventEmitter<any> = new EventEmitter<any>();
 
   constructor(
@@ -60,6 +65,37 @@ export class ExpedientesPrPage implements OnInit {
 
   }
 
+
+  async dynamicSearch() {
+
+    if(this.showSearch && this.searchSubject) {
+      
+      this.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())
+      })
+    } else {
+      this.list = this.TaskService.AllProcess
+    }
+
+  }
+
+
+  openSearch() {
+    this.dynamicSearch()
+  }
+  async closeSearch() {
+    this.searchSubject = ''
+    this.dynamicSearch()
+  }
+
+  async basicSearch() {
+    this.dynamicSearch()
+  }
+
+
+
   openExpedientDetailPage(data){
     
     this.openExpedientDetail.emit(data);

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

@@ -2,7 +2,45 @@
   <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">
+    <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="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">
+                <ion-input (keyup.enter)="basicSearch()" [(ngModel)]='searchSubject' (ngModelChange)="dynamicSearch()"
+                  class="search-input text-black" type="search" placeholder="Pesquisar"></ion-input>
+              </div>
+              
+              <!-- <div class="icon" (click)="clearSearchInput()">
+                <ion-icon title="Limpar" *ngIf="ThemeService.currentTheme == 'default' "name="restaurant-outline" src="assets/images/icons-search-close.svg"></ion-icon>
+                <ion-icon title="Limpar" *ngIf="ThemeService.currentTheme == 'doneIt' "name="restaurant-outline"  src="assets/images/theme/doneIt/icons-search.svg"></ion-icon>
+                <ion-icon title="Limpar" *ngIf="ThemeService.currentTheme == 'gov' " name="restaurant-outline" src="assets/images/theme/gov/icons-search-close.svg"></ion-icon>
+              </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>
+      
       <mat-form-field class="task-filter-input" appearance="none"   color="ion-color-secondary"  placeholder="Selecione agenda">
         <mat-select [(value)]="filterName">
 

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

@@ -159,3 +159,33 @@ ion-item{
   float: right;
   margin-right: 10px;
 }
+
+
+
+
+.search-input-container{
+  background-color: white;
+  border-radius: 27.5px;
+  border: solid 1px #ebebeb;
+  font-size: 14px;
+
+  input {
+    padding: 0px !important;
+    padding-left: 8px !important;
+  }
+  .icon{
+    color: #797979;
+    width: 35px;
+    height: 35px;
+    display: flex;
+    justify-content: center;
+    font-size: 25px;
+    align-items: center;
+  }
+  .input-text{
+    width: 100%;
+  }
+  .icon-z{
+    width: 20px;
+  }
+}

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

@@ -25,7 +25,11 @@ export class ExpedientsPage implements OnInit {
 
   expedienteTaskPipe = new ExpedienteTaskPipe()
   filterName: 'Para hoje' | 'Novos'| 'Lidos'| 'Não lidos'|  'OverdueTasks' | 'Todos' = 'Todos'
-  
+  showSearch = false
+  searchSubject = ''
+  list = []
+  hideSearchBtn: boolean = false;
+
   constructor(
     private processes: ProcessesService,
     private router: Router,
@@ -63,6 +67,36 @@ export class ExpedientsPage implements OnInit {
 
   }
 
+
+    async dynamicSearch() {
+
+    if(this.showSearch && this.searchSubject) {
+      
+      this.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())
+      })
+    } else {
+      this.list = this.TaskService.AllProcess
+    }
+
+  }
+
+
+  openSearch() {
+    this.dynamicSearch()
+  }
+  async closeSearch() {
+    this.searchSubject = ''
+    this.dynamicSearch()
+  }
+
+  async basicSearch() {
+    this.dynamicSearch()
+  }
+
+
   segmentChanged() {
     this.LoadList();
   }

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

@@ -2,7 +2,45 @@
   <ion-progress-bar type="indeterminate" *ngIf="skeletonLoader"></ion-progress-bar>
   <div class="title">
     <div class="thetitle"><ion-label >Pedidos</ion-label></div>
-    <div class="theicon btn-refresh">
+    <div class="theicon btn-refresh 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="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">
+                <ion-input (keyup.enter)="basicSearch()" [(ngModel)]='searchSubject' (ngModelChange)="dynamicSearch()"
+                  class="search-input text-black" type="search" placeholder="Pesquisar"></ion-input>
+              </div>
+              
+              <!-- <div class="icon" (click)="clearSearchInput()">
+                <ion-icon title="Limpar" *ngIf="ThemeService.currentTheme == 'default' "name="restaurant-outline" src="assets/images/icons-search-close.svg"></ion-icon>
+                <ion-icon title="Limpar" *ngIf="ThemeService.currentTheme == 'doneIt' "name="restaurant-outline"  src="assets/images/theme/doneIt/icons-search.svg"></ion-icon>
+                <ion-icon title="Limpar" *ngIf="ThemeService.currentTheme == 'gov' " name="restaurant-outline" src="assets/images/theme/gov/icons-search-close.svg"></ion-icon>
+              </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>
+      
       <mat-form-field class="task-filter-input" appearance="none"   color="ion-color-secondary"  placeholder="Selecione agenda">
         <mat-select [(value)]="filterName">
 

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

@@ -234,3 +234,28 @@ ion-item{
   left: 50%;
   margin: -35px 0 0 -35px;
 }
+
+
+
+
+.search-input-container{
+  background-color: white;
+  border-radius: 27.5px;
+  border: solid 1px #ebebeb;
+  font-size: 14px;
+  .icon{
+    color: #797979;
+    width: 41px;
+    height: 41px;
+    display: flex;
+    justify-content: center;
+    font-size: 25px;
+    align-items: center;
+  }
+  .input-text{
+    width: 100%;
+  }
+  .icon-z{
+    width: 20px;
+  }
+}

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

@@ -41,6 +41,11 @@ export class PedidosPage implements OnInit {
   customTaskPipe = new CustomTaskPipe()
   filterName: 'Para hoje' | 'Novos'| 'Lidos'| 'Não lidos'|  'OverdueTasks' | 'Todos' = 'Todos'
   
+  showSearch = false
+  searchSubject = ''
+  list = []
+  hideSearchBtn: boolean = false;
+  
   constructor(
     private router: Router,
     private processes:ProcessesService,
@@ -71,6 +76,37 @@ export class PedidosPage implements OnInit {
 
   }
 
+
+  async dynamicSearch() {
+
+    if(this.showSearch && this.searchSubject) {
+      
+      this.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())
+      })
+    } else {
+      this.list = this.TaskService.AllProcess
+    }
+
+  }
+
+
+  openSearch() {
+    this.dynamicSearch()
+  }
+  async closeSearch() {
+    this.searchSubject = ''
+    this.dynamicSearch()
+  }
+
+  async basicSearch() {
+    this.dynamicSearch()
+  }
+
+
+
   segmentChanged(ev: any) {
     this.LoadList();
   }

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

@@ -2,7 +2,45 @@
   <ion-progress-bar type="indeterminate" *ngIf="skeletonLoader"></ion-progress-bar>
   <div class="title">
     <div class="thetitle"><ion-label >Pendentes</ion-label></div>
-    <div class="theicon">
+    <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="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">
+                <ion-input (keyup.enter)="basicSearch()" [(ngModel)]='searchSubject' (ngModelChange)="dynamicSearch()"
+                  class="search-input text-black" type="search" placeholder="Pesquisar"></ion-input>
+              </div>
+              
+              <!-- <div class="icon" (click)="clearSearchInput()">
+                <ion-icon title="Limpar" *ngIf="ThemeService.currentTheme == 'default' "name="restaurant-outline" src="assets/images/icons-search-close.svg"></ion-icon>
+                <ion-icon title="Limpar" *ngIf="ThemeService.currentTheme == 'doneIt' "name="restaurant-outline"  src="assets/images/theme/doneIt/icons-search.svg"></ion-icon>
+                <ion-icon title="Limpar" *ngIf="ThemeService.currentTheme == 'gov' " name="restaurant-outline" src="assets/images/theme/gov/icons-search-close.svg"></ion-icon>
+              </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>
+      
       <mat-form-field class="task-filter-input" appearance="none"   color="ion-color-secondary"  placeholder="Selecione agenda">
         <mat-select [(value)]="filterName">
 

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

@@ -221,3 +221,28 @@ ion-item{
   float: right;
   margin-right: 10px;
 }
+
+
+
+
+.search-input-container{
+  background-color: white;
+  border-radius: 27.5px;
+  border: solid 1px #ebebeb;
+  font-size: 14px;
+  .icon{
+    color: #797979;
+    width: 41px;
+    height: 41px;
+    display: flex;
+    justify-content: center;
+    font-size: 25px;
+    align-items: center;
+  }
+  .input-text{
+    width: 100%;
+  }
+  .icon-z{
+    width: 20px;
+  }
+}

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

@@ -9,6 +9,8 @@ import { CustomTaskPipe } from 'src/app/pipes/custom-task.pipe';
 import { SortService } from 'src/app/services/functions/sort.service';
 import { Storage } from '@ionic/storage';
 import { SessionStore } from 'src/app/store/session.service';
+import { TaskService } from 'src/app/services/task.service'
+import { ThemeService } from 'src/app/services/theme.service'
 
 @Component({
   selector: 'app-pendentes',
@@ -27,13 +29,18 @@ export class PendentesPage implements OnInit {
   segment:string;
   @Output() openExpedientDetail:EventEmitter<any> = new EventEmitter<any>();
   filterName: 'Para hoje' | 'Novos'| 'Lidos'| 'Não lidos'|  'OverdueTasks' | 'Todos' = 'Todos'
-  
+  showSearch = false
+  searchSubject = ''
+  list = []
+  hideSearchBtn: boolean = false;
 
   constructor(
     private processes:ProcessesService,
     private router: Router,
     private sortService: SortService,
-    private storage: Storage
+    private storage: Storage,
+    public TaskService: TaskService,    
+    public ThemeService: ThemeService
     ) {
       this.loggeduser = SessionStore.user;
   }
@@ -54,6 +61,36 @@ export class PendentesPage implements OnInit {
 
   }
 
+
+  async dynamicSearch() {
+
+    if(this.showSearch && this.searchSubject) {
+      
+      this.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())
+      })
+    } else {
+      this.list = this.TaskService.AllProcess
+    }
+
+  }
+
+
+  openSearch() {
+    this.dynamicSearch()
+  }
+  async closeSearch() {
+    this.searchSubject = ''
+    this.dynamicSearch()
+  }
+
+  async basicSearch() {
+    this.dynamicSearch()
+  }
+
+
   async LoadList(){
     this.skeletonLoader = true;
     this.processes.GetPendingTasks(false).subscribe(async (pendentes) => {