arti24
/
arti-angular-app
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Some changes in display of Calculator

This commit is contained in:
Artur 2024-10-27 22:36:09 +01:00
parent 7cab942ce1
commit 3683f50907
3 changed files with 70 additions and 64 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

103
src/app/asset-calculator/asset-calculator.component.html
View File

@ -13,69 +13,78 @@
}
</style>
<div class="container-sm">100% wide until small breakpoint</div>
<div class="container-md">100% wide until medium breakpoint</div>
<div class="container-lg">100% wide until large breakpoint</div>
<div class="container-xl">100% wide until extra large breakpoint</div>
<div class="container-xxl">100% wide until extra extra large breakpoint</div>
<div class="container mt-5">
<div class="row">
<div class="h1 text-center">Kalkulator amortyzacyjny</div>
</div>
<div class="row">
<form [formGroup]=assetsDepreciationFormGroup class="frame">
<div class="form-group row">
<div class="form-label col-3 col-form-label">
<label for="initialValueAsset" >Wartość początkowa środka trwałego:</label>
<div class="form-group row align-items-center mb-1">
<div class="col-5 col-lg-2 text-start">
<label class="form-label" for="initialValueAsset" >Wartość początkowa ŚT:</label>
</div>
<div class="col-2">
<input formControlName="initialValueAsset" [(ngModel)]=initialValueAsset
type="number" class="form-control" id="initialValueAsset"
required >
</div>
@if(assetsDepreciationFormGroup.get('initialValueSet')?.invalid && assetsDepreciationFormGroup.get('initialValueSet')?.touched){
<div class="text-danger col-auto"> Wartość niepoprawna!. Podaj kwotę w zł np 3000.05 (czyli 3000 zł i 5 gr)</div>
}@else{
}
</div>
<div class="form-group row">
<div class="form-label col-3 col-form-label">
<label for="depreciationRate" >Stawka amortyzacyjna w procentach :</label>
<div class="col col-lg-2">
<input class="form-control" formControlName="initialValueAsset" [(ngModel)]=initialValueAsset
type="number" id="initialValueAsset" required >
@if(assetsDepreciationFormGroup.get('initialValueSet')?.invalid && assetsDepreciationFormGroup.get('initialValueSet')?.touched){
<div class="text-danger col-auto"> Wartość niepoprawna!. Podaj kwotę w zł np 3000.05 (czyli 3000 zł i 5 gr)</div>
}@else{
}
</div>
</div>
<div class="form-group row align-items-center">
<div class="col-5 col-lg-2 text-start ">
<label class="form-label" for="depreciationRate" >Stawka amortyzacyjna:</label>
</div>
<div class="col-2">
<input formControlName="depreciationRate" [(ngModel)]=depreciationRate
type="number" class="form-control" id="depreciationRate" />
<div class="col-3 col-lg-2">
<input class="form-control" formControlName="depreciationRate" [(ngModel)]=depreciationRate
type="number" id="depreciationRate" />
</div>
</div>
<div class="form-group row">
<label class="form-label col-3">Rok i miesiąc rozpoczęcia amortyzacji:</label>
<div class="col-1">
<input type="number" class="form-control" formControlName="year"
[(ngModel)]=year
/>
</div>
<div class="col-1">
<input type="number" class="form-control" formControlName="month"
[(ngModel)]=month />
<div class="col-1 text-start">
<label for="depreciationRate">%</label>
</div>
</div>
<div class="form-group row">
<label class="form-label col-3">Metoda amortyzacji:</label>
<div class="col-2" >
<select class="form-control" formControlName="typeDepreciation" [(ngModel)]=typeDepreciation >
<div class="form-group row align-items-center ">
<div class="col-5 col-lg-2 text-start ">
<label class="form-label">Rozpoczęcie amortyzacji:</label>
</div>
<div class="col-7 col-lg-2">
<input type="month" lang="pl" class="form-control" formControlName="year_month" id="year_month" [(ngModel)]=year_month placeholder="2024" />
</div>
</div>
<div class="form-group row align-items-center">
<div class="col-5 col-lg-2 text-start " >
<label class="form-label">Metoda amortyzacji:</label>
</div>
<div class="col col-lg-2" >
<select class="form-select" formControlName="typeDepreciation" [(ngModel)]=typeDepreciation >
<option [ngValue]=TypeDepreciation.linear selected="selected">Liniowa</option>
<option [ngValue]=TypeDepreciation.digressive >Dygresywna</option>
</select>
</div>
</div>
@if( TypeDepreciation.digressive === typeDepreciation() ){
<div class="form-group row">
<label for="factorValue" class="form-label col-3">Wspólczynnki degresji</label>
<div class="col-2" >
<input type="text" class="form-control" formControlName="factorValue"
[(ngModel)]=factorValue
/>
<div class="form-group row align-items-center">
<div class="col-5 col-lg-2 text-start ">
<label for="factorValue" class="form-label">Wspólczynnki degresji</label>
</div>
<div class="col col-lg-2" >
<input type="text" class="form-control" formControlName="factorValue" [(ngModel)]=factorValue />
</div>
</div>
}
@ -99,7 +108,6 @@
<thead>
<tr>
<th scope="col">Lp</th>
<th scope="col">Rok</th>
<th scope="col">Miesiąc</th>
<th scope="col">Zmiana</th>
</tr>
@ -108,9 +116,8 @@
@for( changeGroup of lifeFormArray.controls; track $index ) {
<tr [formGroup] = changeGroup >
<th scope="row">{{$index+1}}</th>
<td><input class="form-control" formControlName="year" ></td>
<td><input class="form-control" formControlName="month"></td>
<td><input class="form-control" formControlName="initialValueAsset" placeholder="Wprowadź wartość {{$index}}"></td>
<td><input class="form-control" type="month" formControlName="year_month" ></td>
<td><input class="form-control" type="number" formControlName="initialValueAsset" placeholder="Wprowadź wartość {{$index}}"></td>
<td><button class="btn btn-secondary" type="button" (click)=removeChange($index)>Usuń</button>
</tr>
}

26
src/app/asset-calculator/asset-calculator.component.ts
View File

@ -18,8 +18,7 @@ export class AssetCalculatorComponent implements OnInit{
initialValueAsset = signal<number>( 3000 );
depreciationRate = signal<number>( 20 );
year = signal<number>( 2024 );
month = signal<number>( 10 );
year_month = signal<string>( "2024-10" );
typeDepreciation = signal< TypeDepreciation>( TypeDepreciation.linear );
factorValue = signal<number>( 2 );
@ -32,8 +31,7 @@ export class AssetCalculatorComponent implements OnInit{
assetsDepreciationFormGroup = new FormGroup( {
initialValueAsset : new FormControl( this.initialValueAsset(), [ Validators.required, this.currencyValidator ]),
depreciationRate : new FormControl( this.depreciationRate() ) ,
year : new FormControl( this.year() ),
month : new FormControl( this.month() ),
year_month : new FormControl( ),
typeDepreciation : new FormControl( this.typeDepreciation ),
factorValue : new FormControl( this.factorValue, [Validators.required,Validators.max(2)] ),
@ -52,15 +50,14 @@ export class AssetCalculatorComponent implements OnInit{
}
calculate(){
const when = new YearMonth( this.year(), this.month() )
const asset = new Asset( this.depreciationRate(), when, this.typeDepreciation(), this.factorValue() )
const when = new YearMonth( this.year_month() )
const asset = new Asset( this.depreciationRate(), when, this.typeDepreciation(), this.factorValue() )
const creationlifeChange = new AssetLifeChange( when, this.initialValueAsset(), 0, 0 );
asset.addChange( creationlifeChange );
for( let changeControlGroup of this.lifeFormArray.controls ){
const initialValueAsset = changeControlGroup.get('initialValueAsset')?.value;
const year = changeControlGroup.get('year')?.value;
const month= changeControlGroup.get('month')?.value
asset.addChange( new AssetLifeChange( new YearMonth( year, month ), initialValueAsset, 0, 0 )) ;
const year_month = changeControlGroup.get('year_month')?.value;
asset.addChange( new AssetLifeChange( new YearMonth( year_month ), initialValueAsset, 0, 0 )) ;
}
this.calculateForAsset( asset );
}
@ -108,13 +105,14 @@ export class AssetCalculatorComponent implements OnInit{
addChangeValue() {
const change = new AssetLifeChange(new YearMonth( this.year(), this.month()), 1000, 0, 0 );
const change = new AssetLifeChange(new YearMonth( this.year_month() ), 1000, 0, 0 );
const newFormGroup = new FormGroup( {
initialValueAsset: new FormControl( change.initial ),
year : new FormControl( change.when.year ),
month : new FormControl( change.when.month )
} )
initialValueAsset: new FormControl( change.initial ),
year_month : new FormControl( this.year_month() )
}
)
this.lifeFormArray.push(newFormGroup);

5
src/app/asset-calculator/assets/asset.ts
View File

@ -6,7 +6,8 @@ export enum TypeDepreciation{
export class YearMonth{
readonly year : number ;
readonly month : number ;
constructor( year: number, month:number ){
constructor( year_month:string ){
const [ year, month ] = year_month.split( '-').map(Number);
this.year = year;
this.month =month;
@ -59,7 +60,7 @@ export class Asset {
export class AssetPlanPosition{
when : YearMonth = new YearMonth(0,0);
when : YearMonth = new YearMonth('0-0');
calculatedDepreciation : number = 0;
sum:number = 0;
sumThisYear:number = 0;