Added search bar to formula manager

This commit is contained in:
Zakary Timson 2018-07-12 17:25:24 -04:00
parent 12fa5ade5c
commit f1fa2714db

View File

@ -1,10 +1,14 @@
<div class="container-fluid">
<div class="container">
<div class="row">
<div class="col-2 h-100">
<mat-form-field class="w-100">
<input #search matInput placeholder="Search">
<mat-icon matSuffix>search</mat-icon>
</mat-form-field>
<mat-list>
<ng-container *ngFor="let f of formulas | async; let i = index">
<mat-divider *ngIf="i > 0"></mat-divider>
<mat-list-item (click)="displayFormula(f)">{{f.name}}</mat-list-item>
<mat-divider *ngIf="f.name.toLowerCase().indexOf(search.value.toLowerCase()) != -1 && i > 0"></mat-divider>
<mat-list-item *ngIf="f.name.toLowerCase().indexOf(search.value.toLowerCase()) != -1" (click)="displayFormula(f)">{{f.name}}</mat-list-item>
</ng-container>
</mat-list>
</div>
@ -27,7 +31,7 @@
<table class="w-100 table">
<thead>
<tr>
<td style="width: 10%">Name</td>
<td style="width: 80%">Name</td>
<td style="width: 10%">Quantity</td>
<td style="width: 10%">Cost</td>
</tr>