import { Component } from "@angular/core"; import { MatDialog } from "@angular/material"; import { Location } from '@angular/common'; import { ActivatedRoute } from "@angular/router"; import { ReportDataService } from "./services/reportData.service"; import { BaseReportComponent } from "./base-report.component"; import { Report } from "./types"; @Component({ selector: 'ps-report', templateUrl: './report.component.html', styleUrls: ['./report.component.css'] }) export class EditReportComponent extends BaseReportComponent { title = 'Edit expense report'; private report: Report; constructor(location: Location, dialog: MatDialog, reportDataService: ReportDataService, route: ActivatedRoute) { super(location, dialog, reportDataService); route .paramMap .switchMap(params => reportDataService.getReport(+params.get('id')!)) .subscribe(report => { if (report) { this.description = report.description; this.itemsDataBase.addRange(report.items); this.report = report; } else { console.error('No report found for the specified id'); } }); } save(): void { const modifiedReport = { ...this.report, description: this.description, items: this.itemsDataBase.data }; this.reportDataService.save(modifiedReport); this.location.back(); } }