[develop | ADDED]: Add loading in import indicators in order to avoid any actions during this process
This commit is contained in:
parent
e8ec49a69b
commit
b34f42326c
|
@ -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>
|
||||
|
|
|
@ -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();
|
||||
});
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue