barker/bookie/src/app/sale-category/sale-category-detail/sale-category-detail.compon...

121 lines
3.5 KiB
TypeScript

import { AfterViewInit, Component, ElementRef, OnInit, ViewChild } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';
import { MatDialog } from '@angular/material/dialog';
import { ActivatedRoute, Router } from '@angular/router';
import { round } from 'mathjs';
import { BehaviorSubject } from 'rxjs';
import { Product } from '../../core/product';
import { SaleCategory } from '../../core/sale-category';
import { Tax } from '../../core/tax';
import { ToasterService } from '../../core/toaster.service';
import { ConfirmDialogComponent } from '../../shared/confirm-dialog/confirm-dialog.component';
import { SaleCategoryService } from '../sale-category.service';
import { SaleCategoryDetailDatasource } from './sale-category-detail-datasource';
@Component({
selector: 'app-sale-category-detail',
templateUrl: './sale-category-detail.component.html',
styleUrls: ['./sale-category-detail.component.css'],
})
export class SaleCategoryDetailComponent implements OnInit, AfterViewInit {
@ViewChild('nameElement', { static: true }) nameElement?: ElementRef;
form: FormGroup;
taxes: Tax[] = [];
item: SaleCategory = new SaleCategory();
products: BehaviorSubject<Product[]> = new BehaviorSubject<Product[]>([]);
dataSource: SaleCategoryDetailDatasource = new SaleCategoryDetailDatasource(this.products);
displayedColumns = ['name', 'price', 'menuCategory'];
constructor(
private route: ActivatedRoute,
private router: Router,
private dialog: MatDialog,
private fb: FormBuilder,
private toaster: ToasterService,
private ser: SaleCategoryService,
) {
// Create form
this.form = this.fb.group({
name: '',
discountLimit: '',
tax: '',
});
}
ngOnInit() {
this.route.data.subscribe((value) => {
const data = value as { item: SaleCategory; taxes: Tax[]; products: Product[] };
this.showItem(data.item);
this.taxes = data.taxes;
this.products.next(data.products);
});
}
showItem(item: SaleCategory) {
this.item = item;
this.form.setValue({
name: this.item.name,
discountLimit: this.item.discountLimit * 100,
tax: this.item.tax ? this.item.tax.id : '',
});
}
ngAfterViewInit() {
setTimeout(() => {
if (this.nameElement !== undefined) {
this.nameElement.nativeElement.focus();
}
}, 0);
}
save() {
this.ser.saveOrUpdate(this.getItem()).subscribe(
() => {
this.toaster.show('Success', '');
this.router.navigateByUrl('/sale-categories');
},
(error) => {
this.toaster.show('Error', error);
},
);
}
delete() {
this.ser.delete(this.item.id as string).subscribe(
() => {
this.toaster.show('Success', '');
this.router.navigateByUrl('/sale-categories');
},
(error) => {
this.toaster.show('Error', error);
},
);
}
confirmDelete(): void {
const dialogRef = this.dialog.open(ConfirmDialogComponent, {
width: '250px',
data: { title: 'Delete Sale Category?', content: 'Are you sure? This cannot be undone.' },
});
dialogRef.afterClosed().subscribe((result: boolean) => {
if (result) {
this.delete();
}
});
}
getItem(): SaleCategory {
const formModel = this.form.value;
this.item.name = formModel.name;
this.item.discountLimit = round(+formModel.discountLimit / 100, 5);
if (this.item.tax === null || this.item.tax === undefined) {
this.item.tax = new Tax();
}
this.item.tax.id = formModel.tax;
return this.item;
}
}