add search

This commit is contained in:
Peter Maquiran
2023-05-04 09:48:04 +01:00
parent bd8b3c3501
commit 9208b055f2
41 changed files with 957 additions and 98 deletions
@@ -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>
@@ -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;
}
}
@@ -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']);
}