Skip to content

Commit c154806

Browse files
Angular2GuyAngular2Guy
committed
refactor: forms update
1 parent dd61dfc commit c154806

2 files changed

Lines changed: 27 additions & 20 deletions

File tree

‎carrental-web/src/angular/carrental/src/app/crvalues/crvalues.component.html‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -13,29 +13,29 @@
1313

1414
<td><div
1515
[ngClass]="{'form-group': true, 'has-error': !form.valid}">
16-
<input type="text" class="form-control" formControlName="anzahlPkw" />
16+
<input type="text" class="form-control" formControlName="{{FormFields.AnzahlPkw}}" />
1717
</div></td>
1818
<td><div class="divboxmodel">{{crvalues.mieteGeplantPkw |
1919
numberSeparator:3 }}</div></td>
2020
<td><div
2121
[ngClass]="{'form-group': true, 'has-error': !form.valid}">
2222
<input myNumberseparator type="text" class="form-control"
23-
formControlName="mieteAbgerechnetPkw" />
23+
formControlName="{{FormFields.MieteAbgerechnetPkw}}" />
2424
</div></td>
2525
</tr>
2626
<tr>
2727
<td i18n>Lkw</td>
2828

2929
<td><div
3030
[ngClass]="{'form-group': true, 'has-error': !form.valid}">
31-
<input type="text" class="form-control" formControlName="anzahlLkw" />
31+
<input type="text" class="form-control" formControlName="{{FormFields.AnzahlLkw}}" />
3232
</div></td>
3333
<td><div class="divboxmodel">{{crvalues.mieteGeplantLkw |
3434
numberSeparator:3 }}</div></td>
3535
<td><div
3636
[ngClass]="{'form-group': true, 'has-error': !form.valid}">
3737
<input myNumberseparator type="text" class="form-control"
38-
formControlName="mieteAbgerechnetLkw" />
38+
formControlName="{{FormFields.MieteAbgerechnetLkw}}" />
3939
</div></td>
4040
</tr>
4141
<tr>

‎carrental-web/src/angular/carrental/src/app/crvalues/crvalues.component.ts‎

Lines changed: 23 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -14,49 +14,56 @@
1414
limitations under the License.
1515
*/
1616
import { Component, OnInit, Input , OnDestroy, EventEmitter, Output} from '@angular/core';
17-
import { UntypedFormGroup, UntypedFormControl, UntypedFormBuilder, Validators, AbstractControl } from '@angular/forms';
17+
import { FormGroup, FormControl, FormBuilder, Validators, AbstractControl } from '@angular/forms';
1818
import { CrPortfolio } from '../dtos/crTypes';
1919
import { CrValuesValidators } from '../shared/crvalues.validators';
2020
import { Subscription } from 'rxjs';
2121
import { Utils } from '../shared/utils';
2222

23+
enum FormFields {
24+
AnzahlPkw = 'anzahlPkw',
25+
AnzahlLkw = 'anzahlLkw',
26+
MieteAbgerechnetPkw = 'mieteAbgerechnetPkw',
27+
MieteAbgerechnetLkw = 'mieteAbgerechnetLkw'
28+
}
29+
2330
@Component({
2431
selector: 'app-crvalues',
2532
templateUrl: './crvalues.component.html',
2633
styleUrls: ['./crvalues.component.scss']
2734
})
2835
export class CrValuesComponent implements OnInit, OnDestroy {
29-
form: UntypedFormGroup;
30-
fcNames = ['anzahlPkw', 'anzahlLkw', 'mieteAbgerechnetPkw', 'mieteAbgerechnetLkw'];
36+
form: FormGroup;
3137
@Input() crvalues: CrPortfolio;
3238
updateTotalsSub: any[] = [];
3339
@Output() valuesValid = new EventEmitter<boolean>();
40+
FormFields = FormFields;
3441

35-
constructor(fb: UntypedFormBuilder) {
42+
constructor(fb: FormBuilder) {
3643
this.form = fb.group({
37-
anzahlPkw: ['', CrValuesValidators.positiveIntValidator],
38-
mieteAbgerechnetPkw: ['', CrValuesValidators.positiveIntValidator],
39-
anzahlLkw: ['', CrValuesValidators.positiveIntValidator],
40-
mieteAbgerechnetLkw: ['', CrValuesValidators.positiveIntValidator]
44+
[FormFields.AnzahlPkw]: ['', CrValuesValidators.positiveIntValidator],
45+
[FormFields.MieteAbgerechnetPkw]: ['', CrValuesValidators.positiveIntValidator],
46+
[FormFields.AnzahlLkw]: ['', CrValuesValidators.positiveIntValidator],
47+
[FormFields.MieteAbgerechnetLkw]: ['', CrValuesValidators.positiveIntValidator]
4148
});
4249
}
4350

4451
ngOnInit() {
45-
let fc = <UntypedFormControl>this.form.controls[this.fcNames[0]];
52+
let fc = <FormControl>this.form.controls[FormFields.AnzahlPkw];
4653
fc.setValue(this.crvalues.anzahlPkw);
4754
this.updateTotalsSub.push(fc.valueChanges.subscribe(value => {this.crvalues.anzahlPkw = value; this.updateTotals(value);}));
48-
fc = <UntypedFormControl>this.form.controls[this.fcNames[1]];
55+
fc = <FormControl>this.form.controls[FormFields.AnzahlLkw];
4956
fc.setValue(this.crvalues.anzahlLkw);
5057
this.updateTotalsSub.push(fc.valueChanges.subscribe(value => {this.crvalues.anzahlLkw = value; this.updateTotals(value);}));
51-
fc = <UntypedFormControl>this.form.controls[this.fcNames[2]];
58+
fc = <FormControl>this.form.controls[FormFields.MieteAbgerechnetPkw];
5259
fc.setValue(this.crvalues.mieteAbgerechnetPkw);
5360
this.updateTotalsSub.push(fc.valueChanges.subscribe(value => {
5461
const myValue = Utils.removeSeparators(value);
5562
this.crvalues.mieteAbgerechnetPkw = value;
5663
this.updateTotals(value);
5764

5865
}));
59-
fc = <UntypedFormControl>this.form.controls[this.fcNames[3]];
66+
fc = <FormControl>this.form.controls[FormFields.MieteAbgerechnetLkw];
6067
fc.setValue(this.crvalues.mieteAbgerechnetLkw);
6168
this.updateTotalsSub.push(fc.valueChanges.subscribe(value => {
6269
const myValue = Utils.removeSeparators(value);
@@ -73,10 +80,10 @@ export class CrValuesComponent implements OnInit, OnDestroy {
7380
}
7481

7582
updateTotals(value: any): void {
76-
this.crvalues.anzahlTotal = (isNaN(parseInt(this.form.controls[this.fcNames[0]].value)) ? 0 : parseInt(this.form.controls[this.fcNames[0]].value))
77-
+ (isNaN(parseInt(this.form.controls[this.fcNames[1]].value)) ? 0 : parseInt(this.form.controls[this.fcNames[1]].value));
78-
this.crvalues.mieteAbgerechnetTotal = (isNaN(parseInt(Utils.removeSeparators(String(this.form.controls[this.fcNames[2]].value)).toString(10))) ? 0 : parseInt(Utils.removeSeparators(String(this.form.controls[this.fcNames[2]].value)).toString(10)))
79-
+ (isNaN(parseInt(Utils.removeSeparators(String(this.form.controls[this.fcNames[3]].value)).toString(10))) ? 0 : parseInt(Utils.removeSeparators(String(this.form.controls[this.fcNames[3]].value)).toString(10)));
83+
this.crvalues.anzahlTotal = (isNaN(parseInt(this.form.controls[FormFields.AnzahlPkw].value)) ? 0 : parseInt(this.form.controls[FormFields.AnzahlPkw].value))
84+
+ (isNaN(parseInt(this.form.controls[FormFields.AnzahlLkw].value)) ? 0 : parseInt(this.form.controls[FormFields.AnzahlLkw].value));
85+
this.crvalues.mieteAbgerechnetTotal = (isNaN(parseInt(Utils.removeSeparators(String(this.form.controls[FormFields.MieteAbgerechnetPkw].value)).toString(10))) ? 0 : parseInt(Utils.removeSeparators(String(this.form.controls[FormFields.MieteAbgerechnetPkw].value)).toString(10)))
86+
+ (isNaN(parseInt(Utils.removeSeparators(String(this.form.controls[FormFields.MieteAbgerechnetLkw].value)).toString(10))) ? 0 : parseInt(Utils.removeSeparators(String(this.form.controls[FormFields.MieteAbgerechnetLkw].value)).toString(10)));
8087
//console.log("updateTotals("+value+") called.");
8188
this.valuesValid.emit(this.form.valid);
8289
}

0 commit comments

Comments
 (0)