mirror of
https://github.com/GNS3/gns3-web-ui.git
synced 2024-12-30 09:48:53 +00:00
I added a common process bar when IOS and IOU image file uplading
This commit is contained in:
parent
36482c7a96
commit
667c8fc7f0
@ -1,6 +1,9 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';
|
||||
import { MatSnackBar } from '@angular/material/snack-bar';
|
||||
import { ActivatedRoute, Router } from '@angular/router';
|
||||
import { UploadServiceService } from 'app/common/uploading-processbar/upload-service.service';
|
||||
import { UploadingProcessbarComponent } from 'app/common/uploading-processbar/uploading-processbar.component';
|
||||
import { FileItem, FileUploader, ParsedResponseHeaders } from 'ng2-file-upload';
|
||||
import { v4 as uuid } from 'uuid';
|
||||
import { Compute } from '../../../../models/compute';
|
||||
@ -46,6 +49,7 @@ export class AddIosTemplateComponent implements OnInit {
|
||||
ciscoUrl: string = 'https://cfn.cloudapps.cisco.com/ITDIT/CFN/jsp/SearchBySoftware.jsp';
|
||||
uploader: FileUploader;
|
||||
isLocalComputerChosen: boolean = true;
|
||||
uploadProgress:number = 0;
|
||||
|
||||
constructor(
|
||||
private route: ActivatedRoute,
|
||||
@ -56,7 +60,9 @@ export class AddIosTemplateComponent implements OnInit {
|
||||
private router: Router,
|
||||
private templateMocksService: TemplateMocksService,
|
||||
private iosConfigurationService: IosConfigurationService,
|
||||
private computeService: ComputeService
|
||||
private computeService: ComputeService,
|
||||
private uploadServiceService: UploadServiceService,
|
||||
private snackBar : MatSnackBar
|
||||
) {
|
||||
this.iosTemplate = new IosTemplate();
|
||||
|
||||
@ -92,6 +98,16 @@ export class AddIosTemplateComponent implements OnInit {
|
||||
this.getImages();
|
||||
this.toasterService.success('Image uploaded');
|
||||
};
|
||||
this.uploader.onProgressItem = (progress: any) => {
|
||||
this.uploadProgress = progress['progress'];
|
||||
this.uploadServiceService.processBarCount(this.uploadProgress)
|
||||
};
|
||||
this.uploadServiceService.currentCancelItemDetails.subscribe((isCancel) => {
|
||||
if (isCancel) {
|
||||
this.cancelUploading()
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
const server_id = this.route.snapshot.paramMap.get('server_id');
|
||||
this.serverService.get(parseInt(server_id, 10)).then((server: Server) => {
|
||||
@ -137,6 +153,9 @@ export class AddIosTemplateComponent implements OnInit {
|
||||
const itemToUpload = this.uploader.queue[0];
|
||||
if ((itemToUpload as any).options) (itemToUpload as any).options.disableMultipart = true; ((itemToUpload as any).options.headers = [{ name: 'Authorization', value: 'Bearer ' + this.server.authToken }])
|
||||
this.uploader.uploadItem(itemToUpload);
|
||||
this.snackBar.openFromComponent(UploadingProcessbarComponent, {
|
||||
panelClass: 'uplaoding-file-snackabar',
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
@ -250,4 +269,10 @@ export class AddIosTemplateComponent implements OnInit {
|
||||
onChassisChosen() {
|
||||
this.networkAdaptersForTemplate = [];
|
||||
}
|
||||
|
||||
cancelUploading() {
|
||||
this.uploader.clearQueue();
|
||||
this.uploadServiceService.processBarCount(100)
|
||||
this.toasterService.warning('Image imported canceled');
|
||||
}
|
||||
}
|
||||
|
@ -1,6 +1,9 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';
|
||||
import { MatSnackBar } from '@angular/material/snack-bar';
|
||||
import { ActivatedRoute, Router } from '@angular/router';
|
||||
import { UploadServiceService } from 'app/common/uploading-processbar/upload-service.service';
|
||||
import { UploadingProcessbarComponent } from 'app/common/uploading-processbar/uploading-processbar.component';
|
||||
import { FileItem, FileUploader, ParsedResponseHeaders } from 'ng2-file-upload';
|
||||
import { v4 as uuid } from 'uuid';
|
||||
import { Compute } from '../../../../models/compute';
|
||||
@ -31,7 +34,7 @@ export class AddIouTemplateComponent implements OnInit {
|
||||
templateNameForm: FormGroup;
|
||||
imageForm: FormGroup;
|
||||
isLocalComputerChosen: boolean = true;
|
||||
|
||||
uploadProgress:number = 0
|
||||
constructor(
|
||||
private route: ActivatedRoute,
|
||||
private serverService: ServerService,
|
||||
@ -40,7 +43,9 @@ export class AddIouTemplateComponent implements OnInit {
|
||||
private router: Router,
|
||||
private formBuilder: FormBuilder,
|
||||
private templateMocksService: TemplateMocksService,
|
||||
private computeService: ComputeService
|
||||
private computeService: ComputeService,
|
||||
private uploadServiceService : UploadServiceService,
|
||||
private snackBar : MatSnackBar
|
||||
) {
|
||||
this.iouTemplate = new IouTemplate();
|
||||
|
||||
@ -61,6 +66,11 @@ export class AddIouTemplateComponent implements OnInit {
|
||||
this.uploader.onErrorItem = (item: FileItem, response: string, status: number, headers: ParsedResponseHeaders) => {
|
||||
this.toasterService.error('An error occured: ' + response);
|
||||
};
|
||||
this.uploader.onProgressItem = (progress: any) => {
|
||||
this.uploadProgress = progress['progress'];
|
||||
this.uploadServiceService.processBarCount(this.uploadProgress)
|
||||
};
|
||||
|
||||
this.uploader.onSuccessItem = (
|
||||
item: FileItem,
|
||||
response: string,
|
||||
@ -70,7 +80,7 @@ export class AddIouTemplateComponent implements OnInit {
|
||||
this.getImages();
|
||||
this.toasterService.success('Image uploaded');
|
||||
};
|
||||
|
||||
|
||||
const server_id = this.route.snapshot.paramMap.get('server_id');
|
||||
this.serverService.get(parseInt(server_id, 10)).then((server: Server) => {
|
||||
this.server = server;
|
||||
@ -79,6 +89,13 @@ export class AddIouTemplateComponent implements OnInit {
|
||||
this.iouTemplate = iouTemplate;
|
||||
});
|
||||
});
|
||||
this.uploadServiceService.currentCancelItemDetails.subscribe((isCancel) => {
|
||||
if (isCancel) {
|
||||
this.cancelUploading()
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
getImages() {
|
||||
@ -107,9 +124,18 @@ export class AddIouTemplateComponent implements OnInit {
|
||||
const itemToUpload = this.uploader.queue[0];
|
||||
if ((itemToUpload as any).options) (itemToUpload as any).options.disableMultipart = true; ((itemToUpload as any).options.headers = [{ name: 'Authorization', value: 'Bearer ' + this.server.authToken }])
|
||||
this.uploader.uploadItem(itemToUpload);
|
||||
this.snackBar.openFromComponent(UploadingProcessbarComponent, {
|
||||
panelClass: 'uplaoding-file-snackabar',
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
cancelUploading() {
|
||||
this.uploader.clearQueue();
|
||||
this.uploadServiceService.processBarCount(100)
|
||||
this.toasterService.warning('Image imported canceled');
|
||||
}
|
||||
|
||||
|
||||
|
||||
goBack() {
|
||||
|
Loading…
Reference in New Issue
Block a user