diff options
author | Sandeep J <sandeejh@in.ibm.com> | 2018-07-13 13:53:46 +0530 |
---|---|---|
committer | Patrick Brady <pb071s@att.com> | 2018-07-19 22:07:54 +0000 |
commit | c49095d4aacd4f0df4cd3f2d24eeba4a3f384dec (patch) | |
tree | 6a1001d70353f673e53a165a35f3ea2366fdaf11 /src | |
parent | d2917a8d2ed21a7ae27c8d235fb02e3e615b6d56 (diff) |
added progress spinner for uploading param file
added progress spinner while uplaoding param file for the user to have a visual representation of the upload
Issue-ID: APPC-1066
Change-Id: I411cca1677e924ee43050843401fd957a2aba3f9
Signed-off-by: Sandeep J <sandeejh@in.ibm.com>
Diffstat (limited to 'src')
2 files changed, 28 insertions, 1 deletions
diff --git a/src/app/vnfs/build-artifacts/template-holder/param-name-value/param-name-value.component.html b/src/app/vnfs/build-artifacts/template-holder/param-name-value/param-name-value.component.html index 3b1199b..e505b59 100644 --- a/src/app/vnfs/build-artifacts/template-holder/param-name-value/param-name-value.component.html +++ b/src/app/vnfs/build-artifacts/template-holder/param-name-value/param-name-value.component.html @@ -3,6 +3,8 @@ =================================================================== Copyright (C) 2018 AT&T Intellectual Property. All rights reserved. =================================================================== +Copyright (C) 2018 IBM. +=================================================================== Unless otherwise specified, all software contained herein is licensed under the Apache License, Version 2.0 (the License); @@ -22,6 +24,11 @@ ECOMP is a trademark and service mark of AT&T Intellectual Property. --> <simple-notifications [options]="options"></simple-notifications> +<ngx-spinner bdColor="rgba(51,51,51,0.8)" + size="large" + color="orange" + loadingText="Uploading param file..." + type="ball-scale-multiple"></ngx-spinner> <ng-progress [positionUsing]="'marginLeft'" [minimum]="0.15" [maximum]="1" [speed]="200" [showSpinner]="false" [direction]="'leftToRightIncreased'" [color]="'#6ab344'" [trickleSpeed]="250" [thick]="true" [ease]="'linear'"></ng-progress> <tabs> diff --git a/src/app/vnfs/build-artifacts/template-holder/param-name-value/param-name-value.component.ts b/src/app/vnfs/build-artifacts/template-holder/param-name-value/param-name-value.component.ts index b098ab7..e49140d 100644 --- a/src/app/vnfs/build-artifacts/template-holder/param-name-value/param-name-value.component.ts +++ b/src/app/vnfs/build-artifacts/template-holder/param-name-value/param-name-value.component.ts @@ -3,6 +3,8 @@ =================================================================== Copyright (C) 2018 AT&T Intellectual Property. All rights reserved. =================================================================== +Copyright (C) 2018 IBM. +=================================================================== Unless otherwise specified, all software contained herein is licensed under the Apache License, Version 2.0 (the License); @@ -39,6 +41,7 @@ import { Tab } from './tab'; import { environment } from '../../../../../environments/environment'; import { NgProgress } from 'ngx-progressbar'; import * as XLSX from 'xlsx'; +import { NgxSpinnerService } from 'ngx-spinner'; declare var $: any; @@ -104,7 +107,19 @@ export class GoldenConfigurationMappingComponent implements OnInit { refObj: any; public paramsContent = localStorage['paramsContent']; - constructor(private buildDesignComponent: BuildDesignComponent, private paramShareService: ParamShareService, private router: Router, private httpUtil: HttpUtilService, private dialogService: DialogService, private activeRoutes: ActivatedRoute, private mappingEditorService: MappingEditorService, private notificationService: NotificationService, private nService: NotificationsService, private ngProgress: NgProgress) { + constructor( + private buildDesignComponent: BuildDesignComponent, + private paramShareService: ParamShareService, + private router: Router, + private httpUtil: HttpUtilService, + private dialogService: DialogService, + private activeRoutes: ActivatedRoute, + private mappingEditorService: MappingEditorService, + private notificationService: NotificationService, + private nService: NotificationsService, + private ngProgress: NgProgress, + private spinner: NgxSpinnerService + ) { this.artifactRequest.action = ''; this.artifactRequest.version = ''; this.artifactRequest.paramKeysContent = ''; @@ -205,6 +220,7 @@ export class GoldenConfigurationMappingComponent implements OnInit { public fileParamChange(input) { if (input.files && input.files[0]) { + this.spinner.show(); this.enableMappingSave = true; this.myfileName = input.files[0].name; var fileExtension = this.myfileName.substr(this.myfileName.lastIndexOf('.') + 1); @@ -221,6 +237,10 @@ export class GoldenConfigurationMappingComponent implements OnInit { } this.enableMerge = true; this.initialData = result; + setTimeout(() => { + /** spinner ends after 3.5 seconds */ + this.spinner.hide(); + }, 3500); }); } else { |