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:
Amritanshu Agrawal
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

41
overlord/src/app/product/product-detail/product-detail-dialog.component.ts
View File

@ -1,5 +1,5 @@
import { Component, Inject, OnInit } from '@angular/core';
import { UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';
import { FormControl, FormGroup } from '@angular/forms';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
import { StockKeepingUnit } from '../../core/product';
@ -10,52 +10,57 @@ import { StockKeepingUnit } from '../../core/product';
styleUrls: ['./product-detail-dialog.component.css'],
})
export class ProductDetailDialogComponent implements OnInit {
form: UntypedFormGroup;
form: FormGroup<{
units: FormControl<string>;
fraction: FormControl<number>;
productYield: FormControl<number>;
costPrice: FormControl<number>;
salePrice: FormControl<number>;
}>;
constructor(
public dialogRef: MatDialogRef<ProductDetailDialogComponent>,
@Inject(MAT_DIALOG_DATA)
public data: { item: StockKeepingUnit; isSold: boolean; isPurchased: boolean },
private fb: UntypedFormBuilder,
) {
this.form = this.fb.group({
units: '',
fraction: '',
productYield: '',
costPrice: '',
salePrice: '',
this.form = new FormGroup({
units: new FormControl('', { nonNullable: true }),
fraction: new FormControl(1, { nonNullable: true }),
productYield: new FormControl(1, { nonNullable: true }),
costPrice: new FormControl(0, { nonNullable: true }),
salePrice: new FormControl(0, { nonNullable: true }),
});
}
ngOnInit() {
this.form.setValue({
units: this.data.item.units,
fraction: '' + this.data.item.fraction,
productYield: '' + this.data.item.productYield,
costPrice: '' + this.data.item.costPrice,
salePrice: '' + this.data.item.salePrice,
fraction: this.data.item.fraction,
productYield: this.data.item.productYield,
costPrice: this.data.item.costPrice,
salePrice: this.data.item.salePrice,
});
}
accept(): void {
const formValue = this.form.value;
const fraction = +formValue.fraction;
const fraction = formValue.fraction!;
if (fraction < 1) {
return;
}
const productYield = +formValue.productYield;
const productYield = formValue.productYield!;
if (productYield < 0 || productYield > 1) {
return;
}
const costPrice = +formValue.costPrice;
const costPrice = formValue.costPrice!;
if (costPrice < 0) {
return;
}
const salePrice = +formValue.salePrice;
const salePrice = formValue.salePrice!;
if (salePrice < 0) {
return;
}
this.data.item.units = formValue.units;
this.data.item.units = formValue.units!;
this.data.item.fraction = fraction;
this.data.item.productYield = productYield;
this.data.item.costPrice = costPrice;

85
overlord/src/app/product/product-detail/product-detail.component.ts
View File

@ -1,5 +1,5 @@
import { AfterViewInit, Component, ElementRef, OnInit, ViewChild } from '@angular/core';
import { UntypedFormBuilder, UntypedFormControl, UntypedFormGroup } from '@angular/forms';
import { FormControl, FormGroup } from '@angular/forms';
import { MatDialog } from '@angular/material/dialog';
import { ActivatedRoute, Router } from '@angular/router';
import { BehaviorSubject } from 'rxjs';
@ -20,7 +20,23 @@ import { ProductDetailDialogComponent } from './product-detail-dialog.component'
})
export class ProductDetailComponent implements OnInit, AfterViewInit {
@ViewChild('nameElement', { static: true }) nameElement?: ElementRef;
form: UntypedFormGroup;
form: FormGroup<{
code: FormControl<string | number>;
name: FormControl<string | null>;
fractionUnits: FormControl<string | null>;
addRow: FormGroup<{
units: FormControl<string | null>;
fraction: FormControl<string | null>;
productYield: FormControl<string | null>;
costPrice: FormControl<string | null>;
salePrice: FormControl<string | null>;
}>;
isPurchased: FormControl<boolean>;
isSold: FormControl<boolean>;
isActive: FormControl<boolean>;
productGroup: FormControl<string | null>;
}>;
productGroups: ProductGroup[] = [];
public skus = new BehaviorSubject<StockKeepingUnit[]>([]);
dataSource: ProductDetailDatasource = new ProductDetailDatasource(this.skus);
@ -32,25 +48,24 @@ export class ProductDetailComponent implements OnInit, AfterViewInit {
private route: ActivatedRoute,
private router: Router,
private dialog: MatDialog,
private fb: UntypedFormBuilder,
private toaster: ToasterService,
private ser: ProductService,
) {
this.form = this.fb.group({
code: { value: '', disabled: true },
name: '',
fractionUnits: '',
addRow: this.fb.group({
units: '',
fraction: '',
productYield: '',
costPrice: '',
salePrice: '',
this.form = new FormGroup({
code: new FormControl<string | number>({ value: 0, disabled: true }, { nonNullable: true }),
name: new FormControl<string | null>(null),
fractionUnits: new FormControl<string | null>(null),
addRow: new FormGroup({
units: new FormControl<string | null>(null),
fraction: new FormControl<string | null>(null),
productYield: new FormControl<string | null>(null),
costPrice: new FormControl<string | null>(null),
salePrice: new FormControl<string | null>(null),
}),
isPurchased: '',
isSold: '',
isActive: '',
productGroup: '',
isPurchased: new FormControl<boolean>(true, { nonNullable: true }),
isSold: new FormControl<boolean>(true, { nonNullable: true }),
isActive: new FormControl<boolean>(true, { nonNullable: true }),
productGroup: new FormControl<string | null>(null),
});
}
@ -70,7 +85,7 @@ export class ProductDetailComponent implements OnInit, AfterViewInit {
this.form.setValue({
code: this.item.code || '(Auto)',
name: this.item.name,
fractionUnits: this.item.fractionUnits,
fractionUnits: this.item.fractionUnits!,
addRow: {
units: '',
fraction: '',
@ -81,7 +96,7 @@ export class ProductDetailComponent implements OnInit, AfterViewInit {
isPurchased: this.item.isPurchased,
isSold: this.item.isSold,
isActive: this.item.isActive,
productGroup: this.item.productGroup ? this.item.productGroup.id : '',
productGroup: this.item.productGroup ? this.item.productGroup.id! : '',
});
}
@ -94,30 +109,30 @@ export class ProductDetailComponent implements OnInit, AfterViewInit {
}
addRow() {
const formValue = (this.form.get('addRow') as UntypedFormControl).value;
const fraction = +formValue.fraction;
const formValue = this.form.value.addRow!;
const fraction = +formValue.fraction!;
if (fraction < 1) {
this.toaster.show('Danger', 'Fraction has to be >= 1');
return;
}
const productYield = +formValue.productYield;
const productYield = +formValue.productYield!;
if (productYield < 0 || productYield > 1) {
this.toaster.show('Danger', 'Product Yield has to be > 0 and <= 1');
return;
}
const costPrice = +formValue.costPrice;
const costPrice = +formValue.costPrice!;
if (costPrice < 0) {
this.toaster.show('Danger', 'Price has to be >= 0');
return;
}
const salePrice = +formValue.salePrice;
const salePrice = +formValue.salePrice!;
if (salePrice < 0) {
this.toaster.show('Danger', 'Sale Price has to be >= 0');
return;
}
this.item.skus.push(
new StockKeepingUnit({
units: formValue.units,
units: formValue.units!,
fraction,
productYield,
costPrice,
@ -129,13 +144,7 @@ export class ProductDetailComponent implements OnInit, AfterViewInit {
}
resetAddRow() {
(this.form.get('addRow') as UntypedFormControl).reset({
units: '',
fraction: '',
productYield: '',
costPrice: '',
salePrice: '',
});
this.form.controls.addRow.reset();
}
editRow(row: StockKeepingUnit) {
@ -203,15 +212,15 @@ export class ProductDetailComponent implements OnInit, AfterViewInit {
getItem(): Product {
const formModel = this.form.value;
this.item.name = formModel.name;
this.item.fractionUnits = formModel.fractionUnits;
this.item.isPurchased = formModel.isPurchased;
this.item.isSold = formModel.isSold;
this.item.isActive = formModel.isActive;
this.item.name = formModel.name!;
this.item.fractionUnits = formModel.fractionUnits!;
this.item.isPurchased = formModel.isPurchased!;
this.item.isSold = formModel.isSold!;
this.item.isActive = formModel.isActive!;
if (this.item.productGroup === null || this.item.productGroup === undefined) {
this.item.productGroup = new ProductGroup();
}
this.item.productGroup.id = formModel.productGroup;
this.item.productGroup.id = formModel.productGroup!;
return this.item;
}
}