[develop | ADDED]: Add loading in import indicators in order to avoid any actions during this process

This commit is contained in:
Konstantinos Triantafyllou 2024-04-01 18:16:21 +03:00
parent e8ec49a69b
commit b34f42326c
2 changed files with 25 additions and 29 deletions

View File

@ -198,13 +198,16 @@
</div>
</div>
</div>
<div *ngIf="loading" class="uk-position-relative uk-height-large">
<loading class="uk-position-center"></loading>
</div>
<modal-alert #editNumberModal
[large]="true" classTitle="uk-background-primary uk-light"
(alertOutput)="saveIndicator()"
[okDisabled]="numberIndicatorFb && (numberIndicatorFb.invalid || numberIndicatorFb.pristine)">
<div *ngIf="editing" class="uk-position-relative uk-height-large">
<loading class="uk-position-center"></loading>
</div>
<div *ngIf="editing" class="uk-position-relative uk-height-large">
<loading class="uk-position-center"></loading>
</div>
<div [class.uk-hidden]="editing" class="uk-padding-small">
<div *ngIf="numberIndicatorFb" class="uk-grid" [formGroup]="numberIndicatorFb" uk-grid>
<div input class="uk-width-1-1" [formInput]="numberIndicatorFb.get('name')" placeholder="Title"></div>

View File

@ -86,8 +86,7 @@ export class IndicatorsComponent extends IndicatorStakeholderBaseComponent imple
public safeUrls: Map<string, SafeResourceUrl> = new Map<string, SafeResourceUrl>([]);
public numberResponses: Map<string, any> = new Map<string, any>();
public numberResults: Map<string, number> = new Map<string, number>();
/** Import / Export Indicators */
importLoading: boolean = false;
public loading: boolean = false;
@ViewChild('editChartModal', {static: true}) editChartModal: AlertModal;
@ViewChild('editNumberModal', {static: true}) editNumberModal: AlertModal;
@ViewChild('deleteModal', {static: true}) deleteModal: AlertModal;
@ -354,7 +353,7 @@ export class IndicatorsComponent extends IndicatorStakeholderBaseComponent imple
return this.stakeholder &&
this.stakeholder.topics[this.topicIndex] &&
this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex] &&
this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex].subCategories[this.subcategoryIndex];
this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex].subCategories[this.subcategoryIndex] && !this.loading;
}
public get numberIndicatorPaths(): UntypedFormArray {
@ -874,19 +873,22 @@ export class IndicatorsComponent extends IndicatorStakeholderBaseComponent imple
});
}
}
this.editing = false;
this.importLoading = false;
this.finish();
NotificationHandler.rise('Indicators have been <b>imported</b> successfully!');
}, error => {
this.chartIndicatorFb = null;
NotificationHandler.rise('An error has occurred. Please try again later', 'danger');
this.editing = false;
this.importLoading = false;
this.finish();
}));
}
finish() {
this.editing = false;
this.loading = false;
}
reorderIndicators(sectionId: string, type: IndicatorType, reorder: Reorder) {
this.editing = true;
let path = [
@ -1221,8 +1223,7 @@ export class IndicatorsComponent extends IndicatorStakeholderBaseComponent imple
timeout: 6000,
pos: 'bottom-right'
});
this.editing = false;
this.importLoading = false;
this.finish();
return;
}
// name description additionalDescription, height, width, visibility
@ -1255,8 +1256,7 @@ export class IndicatorsComponent extends IndicatorStakeholderBaseComponent imple
timeout: 6000,
pos: 'bottom-right'
});
this.editing = false;
this.importLoading = false;
this.finish();
break;
}
@ -1304,8 +1304,7 @@ export class IndicatorsComponent extends IndicatorStakeholderBaseComponent imple
timeout: 6000,
pos: 'bottom-right'
});
this.editing = false;
this.importLoading = false;
this.finish();
}
}
@ -1367,14 +1366,13 @@ export class IndicatorsComponent extends IndicatorStakeholderBaseComponent imple
a.click();
window.URL.revokeObjectURL(jsonFileUrl);
a.remove(); // remove the element
this.editing = false;
this.finish();
}
fileChangeEvent(fileInput: any, index) {
this.index = index;
this.editing = true;
this.importLoading = true;
this.loading = true;
this.filesToUpload = <Array<File>>fileInput.target.files;
this.upload();
}
@ -1387,8 +1385,7 @@ export class IndicatorsComponent extends IndicatorStakeholderBaseComponent imple
timeout: 6000,
pos: 'bottom-right'
});
this.editing = false;
this.importLoading = false;
this.finish();
return;
} else {
if (this.filesToUpload[0].name.indexOf(".json") == -1 || (this.filesToUpload[0].type != "application/json")) {
@ -1398,8 +1395,7 @@ export class IndicatorsComponent extends IndicatorStakeholderBaseComponent imple
timeout: 6000,
pos: 'bottom-right'
});
this.editing = false;
this.importLoading = false;
this.finish();
return;
}
}
@ -1413,16 +1409,14 @@ export class IndicatorsComponent extends IndicatorStakeholderBaseComponent imple
timeout: 6000,
pos: 'bottom-right'
});
this.editing = false;
this.importLoading = false;
this.finish();
} else if (!json || json?.indicators.length == 0) {
UIkit.notification("Importing file is empty", {
status: 'danger',
timeout: 6000,
pos: 'bottom-right'
});
this.editing = false;
this.importLoading = false;
this.finish();
} else {
this.importIndicatorsAndSave(json.stakeholder, json.indicators);
}
@ -1433,8 +1427,7 @@ export class IndicatorsComponent extends IndicatorStakeholderBaseComponent imple
timeout: 6000,
pos: 'bottom-right'
});
this.editing = false;
this.importLoading = false;
this.finish();
});
}