hft-informatik/geovisualisierung
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Use promise.all in table component to sync the table loading

Browse Source
This commit is contained in:
Marcel Schwarz 2021-01-08 12:35:09 +01:00
parent abfc5424a3
commit 493cdd9ea7
1 changed files with 39 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

74
projects/project-3/frontend/src/app/dashboard/table/table.component.ts
View File

@ -26,8 +26,8 @@ export class TableComponent implements OnInit {
bikePoint: IDashboardCommonBikePoint; bikePoint: IDashboardCommonBikePoint;
maxStartDate: Date; maxStartDate: Date;
maxEndDate: Date; maxEndDate: Date;
isLoadingToSource: boolean; isLoadingToSource = true;
isLoadingFromSource: boolean; isLoadingFromSource = true;
constructor( constructor(
private route: ActivatedRoute, private route: ActivatedRoute,
@ -54,45 +54,49 @@ export class TableComponent implements OnInit {
this.selectionModel.clear(); this.selectionModel.clear();
this.map.removeOverlayOnMiniMap(); this.map.removeOverlayOnMiniMap();
const initDate = this.maxEndDate.toISOString().substring(0, 10); const initDate = this.maxEndDate.toISOString().substring(0, 10);
await this.service.fetchDashboardStationTo(this.bikePoint.id, initDate, initDate).then(source => {
this.isLoadingToSource = false; const [stationTo, stationFrom] = await Promise.all([
this.stationToSource = this.setBikePointColorToSource(source); this.service.fetchDashboardStationTo(this.bikePoint.id, initDate, initDate),
this.iterableToSource = source; this.service.fetchDashboardStationFrom(this.bikePoint.id, initDate, initDate)
this.iterableToSource.forEach(bikePoint => { ]);
bikePoint.polyLineColor = 'green';
}); this.isLoadingToSource = false;
}); this.isLoadingFromSource = false;
this.service.fetchDashboardStationFrom(this.bikePoint.id, initDate, initDate).then(source => {
this.isLoadingFromSource = false; this.stationToSource = this.setBikePointColorToSource(stationTo);
this.stationFromSource = this.setBikePointColorFromSource(source); this.iterableToSource = stationTo;
this.iterableFromSource = source; this.iterableToSource.forEach(bikePoint => bikePoint.polyLineColor = 'red');
this.iterableFromSource.forEach(bikePoint => {
bikePoint.polyLineColor = 'red'; this.stationFromSource = this.setBikePointColorFromSource(stationFrom);
}); this.iterableFromSource = stationFrom;
}); this.iterableFromSource.forEach(bikePoint => bikePoint.polyLineColor = 'green');
} }
async onSubmit(actualStartDate: string, actualEndDate: string): Promise<void> { async onSubmit(actualStartDate: string, actualEndDate: string): Promise<void> {
this.resetTableSourcesToDisplaySpinner(); this.resetTableSourcesToDisplaySpinner();
this.selectionModel.clear(); this.selectionModel.clear();
this.map.removeOverlayOnMiniMap(); this.map.removeOverlayOnMiniMap();
await this.service.fetchDashboardStationTo(this.bikePoint.id, actualStartDate, actualEndDate).then((source) => {
this.colors = ['black', 'gray', 'green', 'orange', 'purple', 'red']; this.isLoadingToSource = true;
this.isLoadingToSource = false; this.isLoadingFromSource = true;
this.stationToSource = this.setBikePointColorFromSource(source);
this.iterableToSource = source; const [stationTo, stationFrom] = await Promise.all([
this.iterableToSource.forEach(bikePoint => { this.service.fetchDashboardStationTo(this.bikePoint.id, actualStartDate, actualEndDate),
bikePoint.polyLineColor = 'green'; this.service.fetchDashboardStationFrom(this.bikePoint.id, actualStartDate, actualEndDate)
}); ]);
});
this.service.fetchDashboardStationFrom(this.bikePoint.id, actualStartDate, actualEndDate).then((source) => { this.isLoadingToSource = false;
this.isLoadingFromSource = false; this.isLoadingFromSource = false;
this.stationFromSource = this.setBikePointColorFromSource(source);
this.iterableFromSource = source; this.colors = ['black', 'gray', 'green', 'orange', 'purple', 'red'];
this.iterableFromSource.forEach(bikePoint => { this.stationToSource = this.setBikePointColorToSource(stationTo);
bikePoint.polyLineColor = 'red'; this.iterableToSource = stationTo;
}); this.iterableToSource.forEach(bikePoint => bikePoint.polyLineColor = 'green');
});
this.stationFromSource = this.setBikePointColorFromSource(stationFrom);
this.iterableFromSource = stationFrom;
this.iterableFromSource.forEach(bikePoint => bikePoint.polyLineColor = 'red');
} }
resetTableSourcesToDisplaySpinner(): void { resetTableSourcesToDisplaySpinner(): void {