diff options
author | 2018-07-20 15:56:31 +0530 | |
---|---|---|
committer | 2018-07-31 20:07:29 +0000 | |
commit | 77ebde8e73fa4f1cdeeeff2c5d3f044b900bf329 (patch) | |
tree | 7c8f5f5c9adfe9ae4234827ab076ea0d0a251ccb /src/app | |
parent | 2066d644125287c4b9f2128376e59ce15ab8a194 (diff) |
added progress spinner for spreadsheet upload
added progress spinner for spreadsheet upload in test.component,ts
Issue-ID: APPC-1102
Change-Id: I9d030da990eae2e8efe5ae82cd1afd3c675aa286
Signed-off-by: Sandeep J <sandeejh@in.ibm.com>
Diffstat (limited to 'src/app')
-rw-r--r-- | src/app/app.module.ts | 6 | ||||
-rw-r--r-- | src/app/test/test.component.html | 5 | ||||
-rw-r--r-- | src/app/test/test.component.ts | 28 |
3 files changed, 31 insertions, 8 deletions
diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 2be6544..fcff1d5 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -5,7 +5,8 @@ Copyright (C) 2018 AT&T Intellectual Property. All rights reserved. Copyright (C) 2018 IBM 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); you may not use this software except in compliance with the License. @@ -39,11 +40,12 @@ import { AboutUsComponent } from './about-us/aboutus.component'; import { NgProgressModule } from 'ngx-progressbar'; import { LoginGuardService } from './vnfs/LoginGuardService/Login-guard-service'; import { ConfirmComponent } from './shared/confirmModal/confirm.component'; +import { NgxSpinnerModule } from 'ngx-spinner'; @NgModule({ declarations: [AppComponent, TestComponent, AboutUsComponent, ConfirmComponent], imports: [BrowserModule, FormsModule, HomeModule, SharedModule.forRoot(), - NgbModule.forRoot(), NoopAnimationsModule, AppRoutingModule, SimpleNotificationsModule, NgProgressModule, BootstrapModalModule], + NgbModule.forRoot(), NoopAnimationsModule, AppRoutingModule, SimpleNotificationsModule, NgProgressModule, BootstrapModalModule, NgxSpinnerModule], exports: [RouterModule], providers: [{ provide: LocationStrategy, useClass: HashLocationStrategy }, LoginGuardService], entryComponents: [ConfirmComponent], diff --git a/src/app/test/test.component.html b/src/app/test/test.component.html index 5e65435..8147f05 100644 --- a/src/app/test/test.component.html +++ b/src/app/test/test.component.html @@ -20,6 +20,11 @@ limitations under the License. ============LICENSE_END============================================ --> <simple-notifications [options]="options"></simple-notifications> +<ngx-spinner bdColor="rgba(51,51,51,0.8)" + size="large" + color="orange" + loadingText="Uploading test spreadsheet..." + 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> diff --git a/src/app/test/test.component.ts b/src/app/test/test.component.ts index 7560e7b..52b5d8a 100644 --- a/src/app/test/test.component.ts +++ b/src/app/test/test.component.ts @@ -3,7 +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); you may not use this software except in compliance with the License. @@ -20,7 +21,7 @@ limitations under the License. */ import { Component, OnInit } from '@angular/core'; - +import { NgxSpinnerService } from 'ngx-spinner'; import { saveAs } from 'file-saver'; import { Location } from '@angular/common'; import { ActivatedRoute, Router } from '@angular/router'; @@ -90,7 +91,7 @@ export class TestComponent implements OnInit { public outputTimeStamp; public status; public statusReason; - public errorResponse; + public errorResponse; public timer; public subscribe; public enableTestButton: boolean = false; @@ -101,8 +102,19 @@ export class TestComponent implements OnInit { public enableCounterDiv: boolean = false; public enableDownload: boolean = false; private userId = localStorage['userId']; - constructor (private location: Location, private activeRoutes: ActivatedRoute, private notificationService: NotificationService, private nService: NotificationsService, private router: Router, private paramShareService: ParamShareService, private mappingEditorService: MappingEditorService, private httpUtil: HttpUtilService, - private utiltiy: UtilityService, private ngProgress: NgProgress) { + constructor ( + private location: Location, + private activeRoutes: ActivatedRoute, + private notificationService: NotificationService, + private nService: NotificationsService, + private router: Router, + private paramShareService: ParamShareService, + private mappingEditorService: MappingEditorService, + private httpUtil: HttpUtilService, + private utiltiy: UtilityService, + private ngProgress: NgProgress, + private spinner: NgxSpinnerService + ) { } @@ -168,6 +180,7 @@ export class TestComponent implements OnInit { throw new Error('Cannot upload multiple files on the entry'); } if (fileExtension.toUpperCase() === 'XLS' || fileExtension.toUpperCase() === 'XLSX') { + this.spinner.show(); const reader = new FileReader(); reader.onload = (e: any) => { /* read workbook */ @@ -210,7 +223,10 @@ export class TestComponent implements OnInit { }; reader.readAsBinaryString(target.files[0]); - + setTimeout(() => { + /** spinner ends after 2.5 seconds */ + this.spinner.hide(); + }, 2500); } else { |