Began building formula manager

This commit is contained in:
2018-06-25 00:50:47 -04:00
parent 0c3499fd24
commit 798035aa6a
8 changed files with 130 additions and 38 deletions

View File

@ -1,20 +1,29 @@
<!--The content below is only a placeholder and can be replaced.-->
<div style="text-align:center">
<h1>
Welcome to {{ title }}!
</h1>
<img width="300" alt="Angular Logo" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNTAgMjUwIj4KICAgIDxwYXRoIGZpbGw9IiNERDAwMzEiIGQ9Ik0xMjUgMzBMMzEuOSA2My4ybDE0LjIgMTIzLjFMMTI1IDIzMGw3OC45LTQzLjcgMTQuMi0xMjMuMXoiIC8+CiAgICA8cGF0aCBmaWxsPSIjQzMwMDJGIiBkPSJNMTI1IDMwdjIyLjItLjFWMjMwbDc4LjktNDMuNyAxNC4yLTEyMy4xTDEyNSAzMHoiIC8+CiAgICA8cGF0aCAgZmlsbD0iI0ZGRkZGRiIgZD0iTTEyNSA1Mi4xTDY2LjggMTgyLjZoMjEuN2wxMS43LTI5LjJoNDkuNGwxMS43IDI5LjJIMTgzTDEyNSA1Mi4xem0xNyA4My4zaC0zNGwxNy00MC45IDE3IDQwLjl6IiAvPgogIDwvc3ZnPg==">
</div>
<h2>Here are some links to help you start: </h2>
<ul>
<li>
<h2><a target="_blank" rel="noopener" href="https://angular.io/tutorial">Tour of Heroes</a></h2>
</li>
<li>
<h2><a target="_blank" rel="noopener" href="https://github.com/angular/angular-cli/wiki">CLI Documentation</a></h2>
</li>
<li>
<h2><a target="_blank" rel="noopener" href="https://blog.angular.io/">Angular blog</a></h2>
</li>
</ul>
<div>
<div *ngFor="let f of formulas | async">
<button (click)="displayFormula(f)">{{f.name}}</button>
</div>
<div *ngIf="formula">
<table class="table">
<thead>
<tr>
<td>Name</td>
<td>Quantity</td>
<td>Cost</td>
</tr>
</thead>
<tbody>
<tr *ngFor="let c of formula.components">
<td>{{(c.component | async)?.name}}</td>
<td>{{c.quantity | scale: formula.total : newTotal | convertFromG: unit}}</td>
<td>{{(c.component | async)?.cost | currency}}</td>
</tbody>
</table>
<input type="number" [(ngModel)]="newTotal">
<select [(ngModel)]="unit">
<option>g</option>
<option>oz</option>
<option>kg</option>
<option>lb</option>
</select>
</div>
</div>