Use promise.all in table component to sync the table loading
This commit is contained in:
parent
abfc5424a3
commit
493cdd9ea7
@ -26,8 +26,8 @@ export class TableComponent implements OnInit {
|
||||
bikePoint: IDashboardCommonBikePoint;
|
||||
maxStartDate: Date;
|
||||
maxEndDate: Date;
|
||||
isLoadingToSource: boolean;
|
||||
isLoadingFromSource: boolean;
|
||||
isLoadingToSource = true;
|
||||
isLoadingFromSource = true;
|
||||
|
||||
constructor(
|
||||
private route: ActivatedRoute,
|
||||
@ -54,45 +54,49 @@ export class TableComponent implements OnInit {
|
||||
this.selectionModel.clear();
|
||||
this.map.removeOverlayOnMiniMap();
|
||||
const initDate = this.maxEndDate.toISOString().substring(0, 10);
|
||||
await this.service.fetchDashboardStationTo(this.bikePoint.id, initDate, initDate).then(source => {
|
||||
this.isLoadingToSource = false;
|
||||
this.stationToSource = this.setBikePointColorToSource(source);
|
||||
this.iterableToSource = source;
|
||||
this.iterableToSource.forEach(bikePoint => {
|
||||
bikePoint.polyLineColor = 'green';
|
||||
});
|
||||
});
|
||||
this.service.fetchDashboardStationFrom(this.bikePoint.id, initDate, initDate).then(source => {
|
||||
this.isLoadingFromSource = false;
|
||||
this.stationFromSource = this.setBikePointColorFromSource(source);
|
||||
this.iterableFromSource = source;
|
||||
this.iterableFromSource.forEach(bikePoint => {
|
||||
bikePoint.polyLineColor = 'red';
|
||||
});
|
||||
});
|
||||
|
||||
const [stationTo, stationFrom] = await Promise.all([
|
||||
this.service.fetchDashboardStationTo(this.bikePoint.id, initDate, initDate),
|
||||
this.service.fetchDashboardStationFrom(this.bikePoint.id, initDate, initDate)
|
||||
]);
|
||||
|
||||
this.isLoadingToSource = false;
|
||||
this.isLoadingFromSource = false;
|
||||
|
||||
this.stationToSource = this.setBikePointColorToSource(stationTo);
|
||||
this.iterableToSource = stationTo;
|
||||
this.iterableToSource.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> {
|
||||
this.resetTableSourcesToDisplaySpinner();
|
||||
this.selectionModel.clear();
|
||||
this.map.removeOverlayOnMiniMap();
|
||||
await this.service.fetchDashboardStationTo(this.bikePoint.id, actualStartDate, actualEndDate).then((source) => {
|
||||
this.colors = ['black', 'gray', 'green', 'orange', 'purple', 'red'];
|
||||
this.isLoadingToSource = false;
|
||||
this.stationToSource = this.setBikePointColorFromSource(source);
|
||||
this.iterableToSource = source;
|
||||
this.iterableToSource.forEach(bikePoint => {
|
||||
bikePoint.polyLineColor = 'green';
|
||||
});
|
||||
});
|
||||
this.service.fetchDashboardStationFrom(this.bikePoint.id, actualStartDate, actualEndDate).then((source) => {
|
||||
this.isLoadingFromSource = false;
|
||||
this.stationFromSource = this.setBikePointColorFromSource(source);
|
||||
this.iterableFromSource = source;
|
||||
this.iterableFromSource.forEach(bikePoint => {
|
||||
bikePoint.polyLineColor = 'red';
|
||||
});
|
||||
});
|
||||
|
||||
this.isLoadingToSource = true;
|
||||
this.isLoadingFromSource = true;
|
||||
|
||||
const [stationTo, stationFrom] = await Promise.all([
|
||||
this.service.fetchDashboardStationTo(this.bikePoint.id, actualStartDate, actualEndDate),
|
||||
this.service.fetchDashboardStationFrom(this.bikePoint.id, actualStartDate, actualEndDate)
|
||||
]);
|
||||
|
||||
this.isLoadingToSource = false;
|
||||
this.isLoadingFromSource = false;
|
||||
|
||||
this.colors = ['black', 'gray', 'green', 'orange', 'purple', 'red'];
|
||||
this.stationToSource = this.setBikePointColorToSource(stationTo);
|
||||
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 {
|
||||
|
Loading…
Reference in New Issue
Block a user