Improve search page

src/app/pages/events/events.page.html

@@ -2,90 +2,96 @@
   <app-header></app-header>
 </ion-header>
 
+<!-- Default Refresher -->
+
 <ion-content class="main bg-blue" ng-controller="AppController">
-  <ion-progress-bar type="indeterminate" *ngIf="showLoader"></ion-progress-bar>
+  <ion-refresher slot="fixed" (ionRefresh)="doRefresh($event)">
+    <ion-refresher-content>
+    </ion-refresher-content>
+  </ion-refresher>
   
-  <ion-label>
-    <p class="time ion-text-center">{{customDate}}</p>
-  </ion-label>
-  <ion-label>
-    <p class="event-number p-small ion-text-center"> <strong>{{totalEvent}}</strong> eventos agendados para hoje</p>
-  </ion-label>
+    <ion-progress-bar type="indeterminate" *ngIf="showLoader"></ion-progress-bar>
+    
+    <ion-label>
+      <p class="time ion-text-center">{{customDate}}</p>
+    </ion-label>
+    <ion-label>
+      <p class="event-number p-small ion-text-center"> <strong>{{totalEvent}}</strong> eventos agendados para hoje</p>
+    </ion-label>
 
-  <div class="next-meeting">
-    <div class="meeting-time">{{hoursMinutes}}</div>
-    <div class="meeting-description"> "{{currentEvent}}"</div>
-  </div>
+    <div class="next-meeting">
+      <div class="meeting-time">{{hoursMinutes}}</div>
+      <div class="meeting-description"> "{{currentEvent}}"</div>
+    </div>
 
-  <div class="conteiner-box" ng-swipe-up="swipe($event)">
-    <div class="schedule">
-      <div class="schedule-header">
-        <div class="title">
-          <ion-icon class="icon" slot="end" src="assets/images/icons-default-agenda.svg" ></ion-icon>
-          <div class="text">A sua Agenda</div>
-        </div>
-        <ion-icon class="icon-next" slot="end" src="assets/images/icons-arrow-circle-arrow-right.svg" ></ion-icon>
-        
-      </div>
-      <div class="content">
-        <ul>
-          <li *ngFor="let event of eventsList"
-          [routerLink]="['/home/events', event.EventId, 'events']">
-          <div class="d-flex  content-{{profile}}-{{event.CalendarName}}">
-            <div class="schedule-time">
-              <div class="time-start">{{event.StartDate | date: 'hh:mm'}}</div>
-              <div class="time-end">{{event.EndDate | date: 'hh:mm'}}</div>
-            </div>
-            <div class="schedule-details">
-              <div class="location">{{event.Location}}</div>
-              <div class="description">{{event.Subject}}</div>
-            </div>
-          </div>
-          </li>
-
-        </ul>
-        <!-- 
-        <div class="resume">
+    <div class="conteiner-box" ng-swipe-up="swipe($event)">
+      <div class="schedule">
+        <div class="schedule-header">
           <div class="title">
-            Resumo para Amnahã
+            <ion-icon class="icon" slot="end" src="assets/images/icons-default-agenda.svg" ></ion-icon>
+            <div class="text">A sua Agenda</div>
           </div>
-          <div class="event-num">4 eventos ageandados para amanhã</div>
-          <div class="first-event-time">08:30 "Reunião Staff" no Palácio Presidencial</div>
+          <ion-icon class="icon-next" slot="end" src="assets/images/icons-arrow-circle-arrow-right.svg" ></ion-icon>
+          
+        </div>
+        <div class="content">
+          <ul>
+            <li *ngFor="let event of eventsList"
+            [routerLink]="['/home/events', event.EventId, 'events']">
+            <div class="d-flex  content-{{profile}}-{{event.CalendarName}}">
+              <div class="schedule-time">
+                <div class="time-start">{{event.StartDate | date: 'hh:mm'}}</div>
+                <div class="time-end">{{event.EndDate | date: 'hh:mm'}}</div>
+              </div>
+              <div class="schedule-details">
+                <div class="location">{{event.Location}}</div>
+                <div class="description">{{event.Subject}}</div>
+              </div>
+            </div>
+            </li>
+
+          </ul>
+          <!-- 
+          <div class="resume">
+            <div class="title">
+              Resumo para Amnahã
+            </div>
+            <div class="event-num">4 eventos ageandados para amanhã</div>
+            <div class="first-event-time">08:30 "Reunião Staff" no Palácio Presidencial</div>
+          </div>
+          -->
+        </div>
+      </div>
+    
+      <div class="schedule">
+        <div class="schedule-header">
+          <div class="title">
+            <ion-icon class="icon" slot="end" src="assets/images/icons-correspondencias.svg"></ion-icon>
+            <div class="text">Correspondência por ler</div>
+          </div>
+          <ion-icon class="icon-next" slot="end" src="assets/images/icons-arrow-circle-arrow-right.svg" ></ion-icon>
+          
+        </div>
+        <div class="content">
+          <ul>
+            <li *ngFor = "let task of taskslist"
+            [routerLink]="['/home/gabinete-digital/expediente',task.SerialNumber]">
+            <div class="d-flex">
+              <div class="schedule-date">
+                <div class="time-end">{{task.CreateDate | date: 'd/M/yy'}}</div>
+                <div class="time-start">{{task.CreateDate | date: 'hh:mm'}}</div>
+              </div>
+              <div class="schedule-details pointer">
+                <div class="description">{{ task.Remetente }}</div>
+                <div class="location">{{ task.Folio }}</div>
+              </div>
+            </div>
+            </li>
+
+          </ul>
         </div>
-        -->
       </div>
     </div>
-  
-    <div class="schedule">
-      <div class="schedule-header">
-        <div class="title">
-          <ion-icon class="icon" slot="end" src="assets/images/icons-correspondencias.svg"></ion-icon>
-          <div class="text">Correspondência por ler</div>
-        </div>
-        <ion-icon class="icon-next" slot="end" src="assets/images/icons-arrow-circle-arrow-right.svg" ></ion-icon>
-        
-      </div>
-      <div class="content">
-        <ul>
-          <li *ngFor = "let task of taskslist"
-          [routerLink]="['/home/gabinete-digital/expediente',task.SerialNumber]">
-          <div class="d-flex">
-            <div class="schedule-date">
-              <div class="time-end">{{task.CreateDate | date: 'd/M/yy'}}</div>
-              <div class="time-start">{{task.CreateDate | date: 'hh:mm'}}</div>
-            </div>
-            <div class="schedule-details pointer">
-              <div class="description">{{ task.Remetente }}</div>
-              <div class="location">{{ task.Folio }}</div>
-            </div>
-          </div>
-          </li>
-
-        </ul>
-      </div>
-    </div>
-  </div>
-
 
 
 </ion-content>

src/app/pages/events/events.page.scss

@@ -394,6 +394,7 @@ ion-toolbar{
           }
         }
         .schedule-date{
+          margin-right: 10px;
           width: 22%;
           color: #797979 !important;
           font-size: 13px;

src/app/pages/events/events.page.ts

@@ -292,6 +292,7 @@ export class EventsPage implements OnInit {
       return (a.CreateDate < b.CreateDate) ? -1 : ((a.CreateDate > b.CreateDate) ? 1 : 0);
     });
   }
+
   
   
   

src/app/pages/search/organic-entity/organic-entity-routing.module.ts

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

src/app/pages/search/organic-entity/organic-entity.module.ts

@@ -0,0 +1,20 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+
+import { IonicModule } from '@ionic/angular';
+
+import { OrganicEntityPageRoutingModule } from './organic-entity-routing.module';
+
+import { OrganicEntityPage } from './organic-entity.page';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    FormsModule,
+    IonicModule,
+    OrganicEntityPageRoutingModule
+  ],
+  declarations: [OrganicEntityPage]
+})
+export class OrganicEntityPageModule {}

src/app/pages/search/organic-entity/organic-entity.page.html

@@ -0,0 +1,23 @@
+<ion-header class="main-header">
+
+  <div class="icon" (click)="close()">
+    <ion-icon name="chevron-back" slot="start"></ion-icon>
+  </div>
+
+  <ion-toolbar>
+    <ion-title>Remetentes</ion-title>
+  </ion-toolbar>
+</ion-header>
+
+<ion-content>
+  <div class="main-container">
+    <div class="input-text d-flex ion-align-items-center">
+      <ion-input [(ngModel)]='findEntity' class="search-input" type="search" placeholder="Pesquisar" (ngModelChange)="filterContact($event)" ></ion-input>
+    </div>
+    <ul>
+      <li *ngFor="let organicEntity of showOrganicEntities" (click)="selectOrganicEntidy(organicEntity.Description)">
+        {{ organicEntity.Description }}
+      </li>
+    </ul>
+  </div>
+</ion-content>

src/app/pages/search/organic-entity/organic-entity.page.scss

@@ -0,0 +1,39 @@
+.main-header{
+  display: flex;
+  align-items: center;
+}
+.icon{
+  color: #797979;
+  width: 45px;
+  height: 45px;
+  display: flex;
+  justify-content: center;
+  font-size: 25px;
+  align-items: center;
+}
+
+.main-container{
+    padding: 0px 20px;
+    .input-text {
+      margin-top: 20px;
+      width: 100%;
+      height: 45px;
+      border-radius: 5px;
+      border: 1px solid #ebebeb;
+    }
+    ul{
+      padding: 0px;
+      margin: 0px;
+      padding-top: 10px;
+      li{    
+        padding-top: 5px;
+        padding-bottom: 10px;
+        margin: 0px;
+        padding-bottom: 10px;
+        border-bottom: 1px solid #ebebeb;
+        list-style:  none;
+        font-family: Roboto;
+        font-size: 15px;
+      }
+    }
+  }

src/app/pages/search/organic-entity/organic-entity.page.spec.ts

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

src/app/pages/search/organic-entity/organic-entity.page.ts

@@ -0,0 +1,58 @@
+import { Component, OnInit } from '@angular/core';
+import { ModalController } from '@ionic/angular';
+import { from } from 'rxjs';
+import { OrganicEntityService } from 'src/app/services/organic-entity.service';
+import { OrganicEntity } from 'src/app/models/organic-entity.model';
+
+@Component({
+  selector: 'app-organic-entity',
+  templateUrl: './organic-entity.page.html',
+  styleUrls: ['./organic-entity.page.scss'],
+})
+export class OrganicEntityPage implements OnInit {
+
+  organicEntities: OrganicEntity[];
+  showOrganicEntities: OrganicEntity[];
+  findEntity: string;
+
+  
+  constructor(private modalController:ModalController,
+    private OrganicEntityService: OrganicEntityService) {
+
+    }
+
+  ngOnInit() {
+    this.getOrganicEntity();
+  }
+
+
+  getOrganicEntity(){
+    this.OrganicEntityService.getOrganicEntity().subscribe(res=>{
+      console.log(res)
+      this.organicEntities = res;
+    });
+  }
+
+  filterContact(){
+
+    const findEntity = this.findEntity.toLowerCase();
+    
+    const entities = this.organicEntities.filter((Entity) => {
+
+      if (Entity.Description.toLowerCase().indexOf(findEntity) == 0){
+       return true;
+      }
+
+    });
+
+    this.showOrganicEntities = entities;
+  }
+
+  selectOrganicEntidy(selectedOraganicEntit: string){
+    this.close(selectedOraganicEntit)
+  }
+
+  close(username: string){
+    this.modalController.dismiss(username);
+  }
+}

src/app/pages/search/search-routing.module.ts

@@ -15,6 +15,10 @@ const routes: Routes = [
   {
     path: 'filter',
     loadChildren: () => import('./filter/filter.module').then( m => m.FilterPageModule)
+  },
+  {
+    path: 'organic-entity',
+    loadChildren: () => import('./organic-entity/organic-entity.module').then( m => m.OrganicEntityPageModule)
   }
 ];
 

src/app/pages/search/search.page.html

@@ -61,7 +61,7 @@
           <ion-icon name="restaurant-outline" src="assets/images/icons-arrow-arrow-down-25-copy.svg"></ion-icon>
         </div>
         <div class="input-container d-flex ion-align-items-center">
-          <ion-input [(ngModel)]='searchOrganicEntiry'  class="search-input" type="search" placeholder="Entidade Orgânica"></ion-input>
+          <ion-input [(ngModel)]='searchOrganicEntiry'  class="search-input" type="search" placeholder="Entidade Orgânica" (click)="openOrganicEntitySelection()"></ion-input>
           <div class="icon" (click)="clearInputOrganicEntity()" >
             <ion-icon name="restaurant-outline" src="assets/images/icons-search-close.svg"></ion-icon>
           </div>
@@ -106,7 +106,8 @@
               <p><span class="order">Order por:</span><span class="order-labal">Mais Recente</span></p>
             </div>
             <div>
-              <ion-icon src="assets/images/icons-arrow-arrow-down-25.svg"></ion-icon>
+              <ion-icon *ngIf="ordinance == 'recent'" (click)="changeOrder('old')" src="assets/images/icons-arrow-arrow-up.svg"></ion-icon>
+              <ion-icon *ngIf="ordinance == 'old'" (click)="changeOrder('recent')" src="assets/images/icons-arrow-arrow-down-25.svg"></ion-icon>
             </div>
           </div>
         </div>

src/app/pages/search/search.page.ts

@@ -7,6 +7,9 @@ import { SearchDocument } from "src/app/models/search-document";
 import { formatDate } from '@angular/common';
 import { CloudData, CloudOptions } from 'angular-tag-cloud-module';
 import { SenderPage } from 'src/app/pages/search/sender/sender.page';
+import { OrganicEntityPage } from 'src/app/pages/search/organic-entity/organic-entity.page';
+
+import { NgModel } from '@angular/forms';
 @Component({
   selector: 'app-search',
   templateUrl: './search.page.html',
@@ -20,6 +23,7 @@ export class SearchPage implements OnInit {
   private searchSender: string;
   private searchOrganicEntiry: string;
   private searchDocTypeId: string;
+  private ordinance: string;
 
   searchCategories: SearchCategory[];
   showSearchDocuments: SearchDocument[];
@@ -52,7 +56,7 @@ export class SearchPage implements OnInit {
 
   constructor(private modalController: ModalController,
     private search: SearchService) {
-
+      this.ordinance = "recent";
     }
 
   ngOnInit() {
@@ -62,6 +66,10 @@ export class SearchPage implements OnInit {
   }
 
 
+  changeOrder(order: string){
+    this.ordinance = order;
+  }
+
   sortArrayISODate(myArray: any){
     return myArray.sort(function(a, b) {
       return (a.Data < b.Data) ? -1 : ((a.Data > b.Data) ? 1 : 0);
@@ -129,12 +137,6 @@ export class SearchPage implements OnInit {
    */
   showHideAdvanceSearch(show:boolean) {
     this.showAdvanceSearch = show;
-    /* Clear inputs */
-    this.searchDocumentDate = "";
-    this.searchSender = "";
-    this.searchOrganicEntiry = "";
-    this.searchDocTypeId = "";
-    this.searchSubject = "";
   }
 
   async openAdvanceSearchSelection() {
@@ -146,7 +148,30 @@ export class SearchPage implements OnInit {
       }
     });
 
-    return await modal.present();
+    await modal.present();
+
+
+    modal.onDidDismiss().then((data) => {
+      this.searchSender = data.data;
+    });
+
+  }
+
+
+  async openOrganicEntitySelection(){
+
+    const modal = await this.modalController.create({
+      component: OrganicEntityPage,
+      cssClass: 'organicEnity',
+      componentProps: {
+      }
+    });
+
+    await modal.present();
+
+    modal.onDidDismiss().then((data) => {
+      this.searchOrganicEntiry = data.data;
+    });
 
   }
 

src/app/pages/search/sender/sender.page.html

@@ -1,16 +1,21 @@
-<ion-header>
+<ion-header class="main-header">
+
+  <div class="icon" (click)="close()">
+    <ion-icon name="chevron-back" slot="start"></ion-icon>
+  </div>
+
   <ion-toolbar>
-    <ion-title (click)="close()">Remetentes</ion-title>
+    <ion-title>Remetentes</ion-title>
   </ion-toolbar>
 </ion-header>
 
 <ion-content>
   <div class="main-container">
     <div class="input-text d-flex ion-align-items-center">
-      <ion-input class="search-input" type="search" placeholder="Pesquisar" (change)="filterContact($event)"></ion-input>
+      <ion-input [(ngModel)]='sender' class="search-input" type="search" placeholder="Pesquisar" (ngModelChange)="filterContact($event)" ></ion-input>
     </div>
     <ul>
-      <li *ngFor="let contact of showContacts">
+      <li *ngFor="let contact of showContacts" (click)="selectUser(contact.Name)">
         {{ contact.Name }}
       </li>
     </ul>

src/app/pages/search/sender/sender.page.scss

@@ -1,3 +1,18 @@
+.main-header{
+  display: flex;
+  align-items: center;
+}
+
+.icon{
+  color: #797979;
+  width: 45px;
+  height: 45px;
+  display: flex;
+  justify-content: center;
+  font-size: 25px;
+  align-items: center;
+}
+
 .main-container{
   padding: 0px 20px;
   .input-text {

src/app/pages/search/sender/sender.page.ts

@@ -2,6 +2,7 @@ import { Component, OnInit } from '@angular/core';
 import { ModalController } from '@ionic/angular';
 import { ContactsService } from 'src/app/services/contacts.service';
 import { EventPerson } from  'src/app/models/eventperson.model';
+
 @Component({
   selector: 'app-sender',
   templateUrl: './sender.page.html',
@@ -12,7 +13,8 @@ export class SenderPage implements OnInit {
 
   contacts: EventPerson[];
   showContacts: EventPerson[];
-
+  sender: string;
+  selectedUser: string;
 
   constructor(private modalController:ModalController,
     private ContactsService: ContactsService) { 
@@ -28,23 +30,29 @@ export class SenderPage implements OnInit {
       this.contacts = res;
     });
   }
+  
+  filterContact(){
 
-  filterContact(findName){
-    console.log(findName)
-    // const persons = this.contacts.filter((person) => {
+    const findPerson = this.sender.toLowerCase();
+    const persons = this.contacts.filter((person) => {
 
-      // if (person.Name.indexOf(findName) == 0){
-        // return true;
-      // }
+      if (person.Name.toLowerCase().indexOf(findPerson) == 0){
+       return true;
+      }
 
-    // });
-
-    // this.showContacts = persons;
+    });
 
+    this.showContacts = persons;
   }
 
-  close(){
-    this.modalController.dismiss();
+  selectUser(username:string){
+    console.log(username);
+    this.selectedUser = username;
+    this.close(this.selectedUser);
+  }
+
+  close(username: string){
+    this.modalController.dismiss(username);
   }
 
 }