arti-angular-app/src/app/asset-calculator/asset-calculator.component....

86 lines
3.8 KiB
HTML

<div class="container mt-5">
<h1 class="heading">Kalkulator amortyzacyjny</h1>
<div class="form-group">
<form [formGroup]="assetsDepreciationForm">
<table>
<tr>
<td>
<label for="initialValueSet" >Wartość początkowa środka trwałego: </label>
</td>
<td>
<input type="text" id="initialValueSet" formControlName="initialValueSet" required
[ngModel]="asset.initialValueAsset | number:'0.2-2'"
(ngModelChange)="asset.initialValueAsset=$event;calculate()" />
</td>
</tr>
<tr>
<td>Stawka amortyzacyjna</td>
<td><input type="text" formControlName="depreciationRate"
[ngModel]="asset.depreciationRate | number:'1.2-2'"
(ngModelChange)="asset.depreciationRate=$event;calculate()"
/> %</td>
</tr>
<tr>
<td >Rok i miesiąc rozpoczęcia amortyzacjii</td>
<td colspan="2">
<input type="number" formControlName="year" [ngModel]="asset.year "
(ngModelChange)="asset.year=$event;calculate()"
/>
<input type="number" formControlName="month"
[ngModel]="asset.month"
(ngModelChange)="asset.month=$event;calculate()" />
</td>
</tr>
<tr>
<td>Metoda amortyzacji</td>
<td><select [ngModel]=asset.type
(ngModelChange)="asset.type=$event;calculate()" formControlName="typeDepreciation" >
<option [ngValue]="TypeDepreciation.linear" selected="selected">Liniowa</option>
<option [ngValue]="TypeDepreciation.digressive" >Dygresywna</option>
</select>
</td>
@if( TypeDepreciation.digressive === asset.type ){
<td style="display: block">
<input type="text" class="form-control" formControlName="factorValue"
[ngModel]="asset.factorValue | number:'1.2-2' "
(ngModelChange)="asset.factorValue=$event;calculate()"/>
</td>
}
</tr>
<input class="btn btn-primary" name="calculate" (click)=calculate() type="button" value="Wylicz ">
</table>
</form>
<div class="container">
<table class="table table-striped">
<thead>
<tr>
<th scope="col">Lp</th>
<th scope="col">Rok</th>
<th scope="col">Miesiąc</th>
<th scope="col">Kwota odpisu</th>
<th scope="col">Lączny odpis</th>
</tr>
</thead>
<tbody>
@for (position of positions.positions; track $index) {
<tr [class]="clazz(position)" >
<th scope="row">{{$index+1}}</th>
<td>{{ position.when.year }}</td>
<td>{{ position.when.month }}</td>
<td>{{ position.calculatedDepreciation | number:'1.2-2' }}</td>
<td>{{ position.sum | number:'1.2-2' }}</td>
</tr>
}
</tbody>
</table>
</div>
</div>
</div>