barker/bookie/src/app/section-printers/section-printer.component.ts

129 lines
3.7 KiB
TypeScript

import { Component, ElementRef, OnInit, ViewChild } from '@angular/core';
import { ActivatedRoute, Router} from '@angular/router';
import { MatDialog } from '@angular/material/dialog';
import { FormArray, FormBuilder, FormGroup } from '@angular/forms';
import { BehaviorSubject, Observable } from "rxjs";
import { map } from 'rxjs/operators';
import { SectionPrinter } from '../core/section-printer';
import { ToasterService } from '../core/toaster.service';
import { ConfirmDialogComponent } from '../shared/confirm-dialog/confirm-dialog.component';
import { Section } from "../core/section";
import { Printer } from "../core/printer";
import { SectionPrinterService } from './section-printer.service';
import { SectionPrinterDataSource } from "./section-printer-datasource";
@Component({
selector: 'app-section-printer',
templateUrl: './section-printer.component.html',
styleUrls: ['./section-printer.component.css']
})
export class SectionPrinterComponent implements OnInit {
@ViewChild('section', {static: true}) sectionElement: ElementRef;
form: FormGroup;
dataSource: SectionPrinterDataSource;
public itemObservable = new BehaviorSubject<SectionPrinter>(new SectionPrinter());
item: SectionPrinter;
sections: Section[];
printers: Printer[];
displayedColumns = ['menuCategory', 'printer', 'copies'];
constructor(
private route: ActivatedRoute,
private router: Router,
private fb: FormBuilder,
private toaster: ToasterService,
private dialog: MatDialog,
private ser: SectionPrinterService
) {
this.createForm();
}
createForm() {
this.form = this.fb.group({
section: '',
menuCategories: this.fb.array([])
});
}
ngOnInit() {
this.route.data
.subscribe((data: { item: SectionPrinter, sections: Section[], printers: Printer[] }) => {
this.sections = data.sections;
this.printers = data.printers;
this.showItem(data.item);
this.dataSource = new SectionPrinterDataSource(this.itemObservable.pipe(map(p => p.menuCategories)));
this.itemObservable.next(this.item);
});
}
showItem(item: SectionPrinter) {
this.item = item;
this.form.get('section').setValue(this.item.id);
this.form.setControl('menuCategories', this.fb.array(
this.item.menuCategories.map(
x => this.fb.group({
menuCategory: x.menuCategory.name,
printer: x.printer.id,
copies: "" + x.copies
})
)
));
}
save() {
this.ser.save(this.getItem())
.subscribe(
(result) => {
this.toaster.show('Success', '');
},
(error) => {
this.toaster.show('Danger', error.error);
}
);
}
delete() {
this.ser.delete(this.item.id)
.subscribe(
(result) => {
this.toaster.show('Success', '');
},
(error) => {
this.toaster.show('Danger', error.error);
}
);
}
confirmDelete(): void {
const dialogRef = this.dialog.open(ConfirmDialogComponent, {
width: '250px',
data: {title: 'Delete all printers for this section?', content: 'Are you sure? This cannot be undone.'}
});
dialogRef.afterClosed().subscribe((result: boolean) => {
if (result) {
this.delete();
}
});
}
getItem(): SectionPrinter {
const formModel = this.form.value;
this.item.id = formModel.section;
const array = this.form.get('menuCategories') as FormArray;
this.item.menuCategories.forEach((item, index) => {
const cont = array.controls[index].value;
item.printer.id = cont.printer;
item.copies = +cont.copies;
});
return this.item;
}
show(val: any) {
this.router.navigate(['/section-printers', val.value]);
}
}