tanshu/brewman
1
0
Fork 0
Code Issues Pull Requests Releases Activity

Chore: Moved from Untyped to Stongly Typed forms.

Browse Source
This commit is contained in:
tanshu
2022-07-15 13:24:25 +05:30
parent facf2df91e
commit 28f9bf2180
78 changed files with 1091 additions and 1004 deletions
Download Patch File Download Diff File Expand all files Collapse all files
overlord/src/app/rate-contract/rate-contract-detail/rate-contract-detail.component.ts
+34 -27
View File
@@ -1,11 +1,11 @@
import { AfterViewInit, Component, ElementRef, OnInit, ViewChild } from '@angular/core';
import { UntypedFormBuilder, UntypedFormControl, UntypedFormGroup } from '@angular/forms';
import { FormControl, FormGroup } from '@angular/forms';
import { MatAutocompleteSelectedEvent } from '@angular/material/autocomplete';
import { MatDialog } from '@angular/material/dialog';
import { ActivatedRoute, Router } from '@angular/router';
import * as moment from 'moment';
import { BehaviorSubject, Observable, of as observableOf } from 'rxjs';
import { debounceTime, distinctUntilChanged, map, startWith, switchMap } from 'rxjs/operators';
import { debounceTime, distinctUntilChanged, map, switchMap } from 'rxjs/operators';
import { Account } from '../../core/account';
import { AccountService } from '../../core/account.service';
@@ -31,7 +31,18 @@ export class RateContractDetailComponent implements OnInit, AfterViewInit {
@ViewChild('productElement', { static: true }) productElement?: ElementRef;
public itemsObservable = new BehaviorSubject<RateContractItem[]>([]);
dataSource: RateContractDetailDatasource = new RateContractDetailDatasource(this.itemsObservable);
form: UntypedFormGroup;
form: FormGroup<{
date: FormControl<Date>;
account: FormControl<Account | string | null>;
validFrom: FormControl<Date>;
validTill: FormControl<Date>;
addRow: FormGroup<{
product: FormControl<string | null>;
price: FormControl<string>;
}>;
narration: FormControl<string>;
}>;
item: RateContract = new RateContract();
product: Product | null = null;
@@ -44,7 +55,6 @@ export class RateContractDetailComponent implements OnInit, AfterViewInit {
constructor(
private route: ActivatedRoute,
private router: Router,
private fb: UntypedFormBuilder,
private toaster: ToasterService,
private dialog: MatDialog,
private math: MathService,
@@ -52,29 +62,27 @@ export class RateContractDetailComponent implements OnInit, AfterViewInit {
private productSer: ProductService,
private accountSer: AccountService,
) {
this.form = this.fb.group({
date: '',
account: '',
validFrom: '',
validTill: '',
addRow: this.fb.group({
product: '',
price: '',
this.form = new FormGroup({
date: new FormControl(new Date(), { nonNullable: true }),
account: new FormControl<Account | string | null>(null),
validFrom: new FormControl(new Date(), { nonNullable: true }),
validTill: new FormControl(new Date(), { nonNullable: true }),
addRow: new FormGroup({
product: new FormControl(''),
price: new FormControl('', { nonNullable: true }),
}),
narration: '',
narration: new FormControl('', { nonNullable: true }),
});
this.accounts = (this.form.get('account') as UntypedFormControl).valueChanges.pipe(
startWith(null),
this.accounts = this.form.controls.account.valueChanges.pipe(
map((x) => (x instanceof Account ? x.name : x)),
map((x) => (x !== null && x.length >= 1 ? x : null)),
map((x) => (x !== null && x.length >= 1 ? x : null)),
debounceTime(150),
distinctUntilChanged(),
switchMap((x) => (x === null ? observableOf([]) : this.accountSer.autocomplete(x))),
);
// Listen to Product Autocomplete Change
this.products = (
(this.form.get('addRow') as UntypedFormControl).get('product') as UntypedFormControl
).valueChanges.pipe(
startWith(null),
this.products = this.form.controls.addRow.controls.product.valueChanges.pipe(
map((x) => (x !== null && x.length >= 1 ? x : null)),
debounceTime(150),
distinctUntilChanged(),
@@ -115,7 +123,7 @@ export class RateContractDetailComponent implements OnInit, AfterViewInit {
}
addRow() {
const formValue = (this.form.get('addRow') as UntypedFormControl).value;
const formValue = this.form.value.addRow!;
const price = this.math.parseAmount(formValue.price, 2);
if (this.product === null || price <= 0) {
return;
@@ -136,10 +144,7 @@ export class RateContractDetailComponent implements OnInit, AfterViewInit {
}
resetAddRow() {
(this.form.get('addRow') as UntypedFormControl).reset({
product: null,
price: '',
});
this.form.controls.addRow.reset();
this.product = null;
setTimeout(() => {
if (this.productElement) {
@@ -157,7 +162,7 @@ export class RateContractDetailComponent implements OnInit, AfterViewInit {
}
accountSelected(event: MatAutocompleteSelectedEvent): void {
(this.form.get('account') as UntypedFormControl).setValue(event.option.value);
this.form.controls.account.setValue(event.option.value);
}
productSelected(event: MatAutocompleteSelectedEvent): void {
@@ -211,8 +216,10 @@ export class RateContractDetailComponent implements OnInit, AfterViewInit {
this.item.date = moment(formModel.date).format('DD-MMM-YYYY');
this.item.validFrom = moment(formModel.validFrom).format('DD-MMM-YYYY');
this.item.validTill = moment(formModel.validTill).format('DD-MMM-YYYY');
this.item.vendor = formModel.account;
this.item.narration = formModel.narration;
if (formModel.account instanceof Account) {
this.item.vendor = formModel.account;
}
this.item.narration = formModel.narration!;
return this.item;
}
}