added search modal and its CSS
parent
2e6dd95004
commit
86e96c11d0
@ -0,0 +1,48 @@
|
||||
<div class="search-header" (click)="dismissModal()">
|
||||
<h2>Advanced Search</h2>
|
||||
<ion-icon slot="icon-only" name="md-close"></ion-icon>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="search-container">
|
||||
<ion-item lines="none">
|
||||
<ion-label>{{ts.trPK('worklist','view')}}</ion-label>
|
||||
<ion-select okText="{{ts.trPK('general','ok')}}" cancelText="{{ts.trPK('general','cancel')}}"
|
||||
[(ngModel)]="notificationType" (ionChange)=onChangeView($event)>
|
||||
<ion-select-option value="1" selected="true">{{ts.trPK('worklist','openNot')}}</ion-select-option>
|
||||
<ion-select-option value="2">{{ts.trPK('worklist','fyi')}}</ion-select-option>
|
||||
<ion-select-option value="3">{{ts.trPK('worklist','toDo')}}</ion-select-option>
|
||||
<ion-select-option value="4">{{ts.trPK('worklist','all')}}</ion-select-option>
|
||||
<ion-select-option value="5">{{ts.trPK('worklist','meNot')}} </ion-select-option>
|
||||
</ion-select>
|
||||
</ion-item>
|
||||
|
||||
<ion-item lines="none">
|
||||
<ion-label>{{ts.trPK('worklist','searchby')}}</ion-label>
|
||||
<ion-select okText="{{ts.trPK('general','ok')}}" cancelText="{{ts.trPK('general','cancel')}}"
|
||||
[(ngModel)]="searchBy" (ionChange)="getValueSelected($event)">
|
||||
<ion-select-option value="1">{{ts.trPK('worklist','from')}}</ion-select-option>
|
||||
<ion-select-option value="2">{{ts.trPK('worklist','subject')}}</ion-select-option>
|
||||
<ion-select-option value="3">{{ts.trPK('worklist','sent')}}</ion-select-option>
|
||||
<ion-select-option value="4">{{ts.trPK('worklist','itemType')}}</ion-select-option>
|
||||
<ion-select-option value="5">{{ts.trPK('worklist','none')}}</ion-select-option>
|
||||
</ion-select>
|
||||
</ion-item>
|
||||
|
||||
<ion-item lines="none">
|
||||
<ion-label>Request Type</ion-label>
|
||||
<ion-select okText="{{ts.trPK('general','ok')}}" cancelText="{{ts.trPK('general','cancel')}}"
|
||||
[(ngModel)]="searchBy" (ionChange)="getValueSelected($event)">
|
||||
<ion-select-option value="1">{{ts.trPK('worklist','from')}}</ion-select-option>
|
||||
<ion-select-option value="2">{{ts.trPK('worklist','subject')}}</ion-select-option>
|
||||
<ion-select-option value="3">{{ts.trPK('worklist','sent')}}</ion-select-option>
|
||||
<ion-select-option value="4">{{ts.trPK('worklist','itemType')}}</ion-select-option>
|
||||
<ion-select-option value="5">{{ts.trPK('worklist','none')}}</ion-select-option>
|
||||
</ion-select>
|
||||
</ion-item>
|
||||
|
||||
<div class="search-button">
|
||||
<span>SEARCH</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -0,0 +1,40 @@
|
||||
.search-header{
|
||||
display: inline-block;
|
||||
h2 {
|
||||
display: inline-block;
|
||||
margin-left: 20px;
|
||||
font-family: WorkSans-Regular;
|
||||
font-size: 18px;
|
||||
margin-top: 12px;
|
||||
}
|
||||
ion-icon {
|
||||
display: inline-block;
|
||||
font-size: 23px;
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 8px;
|
||||
}
|
||||
}
|
||||
.search-container {
|
||||
margin-right: 15px;
|
||||
margin-left: 15px;
|
||||
padding-bottom: 100px;
|
||||
margin-top: 5px;
|
||||
ion-item{
|
||||
border: 2px solid #eaeaea;
|
||||
border-radius: 25px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
.search-button{
|
||||
background: #3dcab3;
|
||||
height: 50px;
|
||||
text-align: center;
|
||||
font-family: WorkSans-Regular;
|
||||
border-radius: 22px;
|
||||
margin-top: 20px;
|
||||
line-height: 50px;
|
||||
span{
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,27 @@
|
||||
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { WorklistAdvancedSearchComponent } from './worklist-advanced-search.component';
|
||||
|
||||
describe('WorklistAdvancedSearchComponent', () => {
|
||||
let component: WorklistAdvancedSearchComponent;
|
||||
let fixture: ComponentFixture<WorklistAdvancedSearchComponent>;
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ WorklistAdvancedSearchComponent ],
|
||||
schemas: [CUSTOM_ELEMENTS_SCHEMA],
|
||||
})
|
||||
.compileComponents();
|
||||
}));
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(WorklistAdvancedSearchComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@ -0,0 +1,30 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { ModalController } from '@ionic/angular';
|
||||
import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
|
||||
|
||||
@Component({
|
||||
selector: 'app-worklist-advanced-search',
|
||||
templateUrl: './worklist-advanced-search.component.html',
|
||||
styleUrls: ['./worklist-advanced-search.component.scss'],
|
||||
})
|
||||
export class WorklistAdvancedSearchComponent implements OnInit {
|
||||
|
||||
constructor(
|
||||
public modalController: ModalController,
|
||||
public ts: TranslatorService
|
||||
) { }
|
||||
|
||||
ngOnInit() {}
|
||||
|
||||
public dismissModal() {
|
||||
console.log('umar 545');
|
||||
this.modalController.dismiss({
|
||||
// dismissed: true,
|
||||
// keySelectedFilters: selectedFilters,
|
||||
// selectedShiftType: this.selectedShiftType,
|
||||
// dateFrom: this.dateFrom,
|
||||
// dateTo: this.dateTo
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
Loading…
Reference in New Issue