ExternalVendorCode/gns3-web-ui
1
0
Fork 0
mirror of https://github.com/GNS3/gns3-web-ui.git synced 2025-02-01 08:48:04 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Page for creating new templates added

Browse Source
This commit is contained in:
Piotr Pekala 2019-01-22 07:20:18 -08:00
parent e60a5bbf07
commit daab31abb5
25 changed files with 269 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/app/app-routing.module.ts
View File

@ -9,7 +9,9 @@ import { SettingsComponent } from './components/settings/settings.component';
import { LocalServerComponent } from './components/local-server/local-server.component';
import { PreferencesComponent } from './components/preferences/preferences.component';
import { QemuPreferencesComponent } from './components/preferences/qemu/qemu-preferences/qemu-preferences.component';
import { QemuVirtualMachinesComponent } from './components/preferences/qemu/qemu-virtual-machines/qemu-virtual-machines.component';
import { QemuVmTemplatesComponent } from './components/preferences/qemu/qemu-vm-templates/qemu-vm-templates.component';
import { QemuVmTemplateDetailsComponent } from './components/preferences/qemu/qemu-vm-template-details/qemu-vm-template-details.component';
import { AddQemuVmTemplateComponent } from './components/preferences/qemu/add-qemu-vm-template/add-qemu-vm-template.component';
const routes: Routes = [
{
@ -23,7 +25,9 @@ const routes: Routes = [
{ path: 'settings', component: SettingsComponent },
{ path: 'server/:server_id/preferences', component: PreferencesComponent },
{ path: 'server/:server_id/preferences/qemu', component: QemuPreferencesComponent },
{ path: 'server/:server_id/preferences/qemu/templates', component: QemuVirtualMachinesComponent }
{ path: 'server/:server_id/preferences/qemu/templates', component: QemuVmTemplatesComponent },
{ path: 'server/:server_id/preferences/qemu/templates/:template_id', component: QemuVmTemplateDetailsComponent },
{ path: 'server/:server_id/preferences/qemu/addtemplate', component: AddQemuVmTemplateComponent }
]
},
{ path: 'server/:server_id/project/:project_id', component: ProjectMapComponent }

12
src/app/app.module.ts
View File

@ -91,7 +91,10 @@ import { TextEditorDialogComponent } from './components/project-map/drawings-edi
import { PreferencesComponent } from './components/preferences/preferences.component';
import { QemuPreferencesComponent } from './components/preferences/qemu/qemu-preferences/qemu-preferences.component';
import { ServerSettingsService } from './services/server-settings.service';
import { QemuVirtualMachinesComponent } from './components/preferences/qemu/qemu-virtual-machines/qemu-virtual-machines.component';
import { QemuVmTemplatesComponent } from './components/preferences/qemu/qemu-vm-templates/qemu-vm-templates.component';
import { AddQemuVmTemplateComponent } from './components/preferences/qemu/add-qemu-vm-template/add-qemu-vm-template.component';
import { QemuVmTemplateDetailsComponent } from './components/preferences/qemu/qemu-vm-template-details/qemu-vm-template-details.component';
import { QemuService } from './services/qemu.service';
if (environment.production) {
Raven.config('https://b2b1cfd9b043491eb6b566fd8acee358@sentry.io/842726', {
@ -146,7 +149,9 @@ if (environment.production) {
StyleEditorDialogComponent,
TextEditorDialogComponent,
QemuPreferencesComponent,
QemuVirtualMachinesComponent
QemuVmTemplatesComponent,
AddQemuVmTemplateComponent,
QemuVmTemplateDetailsComponent
],
imports: [
BrowserModule,
@ -193,7 +198,8 @@ if (environment.production) {
ServerDatabase,
ProjectNameValidator,
ToolsService,
ServerSettingsService
ServerSettingsService,
QemuService
],
entryComponents: [
AddServerDialogComponent,

48
src/app/components/preferences/qemu/add-qemu-vm-template/add-qemu-vm-template.component.html Normal file
View File

@ -0,0 +1,48 @@
<div class="content">
<div class="default-header">
<div class="row">
<h1 class="col">New QEMU template</h1>
</div>
</div>
<div class="default-content">
<div class="example-container mat-elevation-z8">
<mat-vertical-stepper [linear]="true">
<mat-step label="QEMU VM Name">
<mat-form-field class="form-field">
<input matInput type="text" placeholder="Please choose a descriptive name for your new QEMU virtual machine"/>
</mat-form-field><br/>
<mat-checkbox>
This is a legacy ASA VM
</mat-checkbox>
</mat-step>
<mat-step label="QEMU binary and memory">
<mat-form-field class="form-field">
<mat-select placeholder="Qemu binary" [(ngModel)]="selectedBinary">
<mat-option *ngFor="let binary of qemuBinaries" [value]="binary">
{{binary.path}}
</mat-option>
</mat-select>
</mat-form-field><br/>
<mat-form-field class="form-field">
<input matInput type="number" placeholder="RAM" [(ngModel)]="ramMemory"/>
</mat-form-field>
</mat-step>
<mat-step label="Console type">
<mat-form-field class="form-field">
<mat-select placeholder="Console type" [(ngModel)]="selectedConsoleType">
<mat-option *ngFor="let type of consoleTypes" [value]="type">
{{type}}
</mat-option>
</mat-select>
</mat-form-field>
</mat-step>
<mat-step label="Disk image">
<mat-radio-group>
<mat-radio-button value="1" (click)="setradio('Male')">Existing image</mat-radio-button>
<mat-radio-button value="2" (click)="setradio('Male')">New image</mat-radio-button>
</mat-radio-group>
</mat-step>
</mat-vertical-stepper>
</div>
</div>
</div>

3
src/app/components/preferences/qemu/add-qemu-vm-template/add-qemu-vm-template.component.scss Normal file
View File

@ -0,0 +1,3 @@
.form-field {
width: 100%;
}

0
src/app/components/preferences/qemu/qemu-virtual-machines/qemu-virtual-machines.component.html → src/app/components/preferences/qemu/add-qemu-vm-template/add-qemu-vm-template.component.spec.ts
View File

48
src/app/components/preferences/qemu/add-qemu-vm-template/add-qemu-vm-template.component.ts Normal file
View File

@ -0,0 +1,48 @@
import { Component, OnInit } from "@angular/core";
import { Server } from '../../../../models/server';
import { ActivatedRoute, ParamMap } from '@angular/router';
import { ServerService } from '../../../../services/server.service';
import { switchMap } from 'rxjs/operators';
import { QemuService } from '../../../../services/qemu.service';
import { QemuBinary } from '../../../../models/qemu/qemu-binary';
@Component({
selector: 'app-add-qemu-virtual-machine-template',
templateUrl: './add-qemu-vm-template.component.html',
styleUrls: ['./add-qemu-vm-template.component.scss']
})
export class AddQemuVmTemplateComponent implements OnInit {
server: Server;
qemuBinaries: QemuBinary[] = [];
selectedBinary: QemuBinary;
ramMemory: number;
consoleTypes: string[] = ['telnet', 'vnc', 'spice', 'spice+agent', 'none'];
selectedConsoleType: string;
constructor(
private route: ActivatedRoute,
private serverService: ServerService,
private qemuService: QemuService
) {}
ngOnInit() {
this.route.paramMap
.pipe(
switchMap((params: ParamMap) => {
const server_id = params.get('server_id');
return this.serverService.get(parseInt(server_id, 10));
})
)
.subscribe((server: Server) => {
this.server = server;
this.qemuService.getBinaries(server).subscribe((qemuBinaries: QemuBinary[]) => {
this.qemuBinaries = qemuBinaries;
});
});
}
setradio(msg){
console.log(msg);
}
}

2
src/app/components/preferences/qemu/qemu-preferences/qemu-preferences.component.html
View File

@ -2,7 +2,7 @@
<div class="default-header">
<div class="row">
<h1 class="col">QEMU preferences</h1>
<button *ngIf="server" class="top-button" routerLink="/server/{{server.id}}/preferences/qemu/templates" mat-raised-button color="primary">QEMU Virtual Machines</button>
<button *ngIf="server" class="top-button" routerLink="/server/{{server.id}}/preferences/qemu/templates" mat-raised-button color="primary">QEMU VM templates</button>
</div>
</div>
<div class="default-content">

4
src/app/components/preferences/qemu/qemu-preferences/qemu-preferences.component.ts
View File

@ -4,10 +4,8 @@ import { ActivatedRoute, ParamMap } from '@angular/router';
import { Server } from '../../../../models/server';
import { switchMap } from 'rxjs/operators';
import { ServerService } from '../../../../services/server.service';
import { ServerSettings } from '../../../../models/serverSettings';
import { Qemu } from '../../../../models/server-settings-models/qemu';
import { ToasterService } from '../../../../services/toaster.service';
import { QemuSettings } from '../../../../models/settings/qemu';
import { QemuSettings } from '../../../../models/settings/qemu-settings';
@Component({

19
src/app/components/preferences/qemu/qemu-virtual-machines/qemu-virtual-machines.component.ts
View File

@ -1,19 +0,0 @@
import { Component, OnInit } from "@angular/core";
import { Server } from '../../../../models/server';
import { ActivatedRoute } from '@angular/router';
@Component({
selector: 'app-qemu-virtual-machines',
templateUrl: './qemu-virtual-machines.component.html',
styleUrls: ['./qemu-virtual-machines.component.scss']
})
export class QemuVirtualMachinesComponent implements OnInit {
server: Server;
constructor(
private route: ActivatedRoute
) {}
ngOnInit() {}
}

0
src/app/components/preferences/qemu/qemu-virtual-machines/qemu-virtual-machines.component.scss → src/app/components/preferences/qemu/qemu-vm-template-details/qemu-vm-template-details.component.html
View File

0
src/app/components/preferences/qemu/qemu-virtual-machines/qemu-virtual-machines.component.spec.ts → src/app/components/preferences/qemu/qemu-vm-template-details/qemu-vm-template-details.component.scss
View File

0
src/app/components/preferences/qemu/qemu-vm-template-details/qemu-vm-template-details.component.spec.ts Normal file
View File

12
src/app/components/preferences/qemu/qemu-vm-template-details/qemu-vm-template-details.component.ts Normal file
View File

@ -0,0 +1,12 @@
import { Component, OnInit } from "@angular/core";
@Component({
selector: 'app-qemu-virtual-machine-template-details',
templateUrl: './qemu-vm-template-details.component.html',
styleUrls: ['./qemu-vm-template-details.component.scss']
})
export class QemuVmTemplateDetailsComponent implements OnInit {
constructor(){}
ngOnInit(){}
}

17
src/app/components/preferences/qemu/qemu-vm-templates/qemu-vm-templates.component.html Normal file
View File

@ -0,0 +1,17 @@
<div class="content">
<div class="default-header">
<div class="row">
<h1 class="col">QEMU VM templates</h1>
<button *ngIf="server" class="top-button" routerLink="/server/{{server.id}}/preferences/qemu/addtemplate" mat-raised-button color="primary">Add QEMU VM template</button>
</div>
</div>
<div class="default-content">
<div class="example-container mat-elevation-z8">
<mat-nav-list *ngIf="server">
<mat-list-item *ngFor='let template of qemuTemplates' routerLink="{{template.template_id}}">
{{template.name}}
</mat-list-item>
</mat-nav-list>
</div>
</div>
</div>

4
src/app/components/preferences/qemu/qemu-vm-templates/qemu-vm-templates.component.scss Normal file
View File

@ -0,0 +1,4 @@
.top-button {
height: 36px;
margin-top: 22px
}

0
src/app/components/preferences/qemu/qemu-vm-templates/qemu-vm-templates.component.spec.ts Normal file
View File

45
src/app/components/preferences/qemu/qemu-vm-templates/qemu-vm-templates.component.ts Normal file
View File

@ -0,0 +1,45 @@
import { Component, OnInit } from "@angular/core";
import { Server } from '../../../../models/server';
import { ActivatedRoute, ParamMap } from '@angular/router';
import { TemplateService } from '../../../../services/template.service';
import { ServerService } from '../../../../services/server.service';
import { switchMap } from 'rxjs/operators';
import { QemuTemplate } from '../../../../models/templates/qemu-template';
import { QemuService } from '../../../../services/qemu.service';
@Component({
selector: 'app-qemu-virtual-machines-templates',
templateUrl: './qemu-vm-templates.component.html',
styleUrls: ['./qemu-vm-templates.component.scss']
})
export class QemuVmTemplatesComponent implements OnInit {
server: Server;
qemuTemplates: QemuTemplate[] = [];
constructor(
private route: ActivatedRoute,
private serverService: ServerService,
private qemuService: QemuService
) {}
ngOnInit() {
this.route.paramMap
.pipe(
switchMap((params: ParamMap) => {
const server_id = params.get('server_id');
return this.serverService.get(parseInt(server_id, 10));
})
)
.subscribe((server: Server) => {
this.server = server;
this.qemuService.getTemplates(server).subscribe((qemuTemplates: QemuTemplate[]) => {
qemuTemplates.forEach((template) => {
if ((template.template_type = 'qemu') && !template.builtin) {
this.qemuTemplates.push(template);
}
});
});
});
}
}

8
src/app/material.imports.ts
View File

@ -16,7 +16,9 @@ import {
MatExpansionModule,
MatSortModule,
MatSelectModule,
MatTooltipModule
MatTooltipModule,
MatStepperModule,
MatRadioModule
} from '@angular/material';
export const MATERIAL_IMPORTS = [
@ -37,5 +39,7 @@ export const MATERIAL_IMPORTS = [
MatExpansionModule,
MatSortModule,
MatSelectModule,
MatTooltipModule
MatTooltipModule,
MatStepperModule,
MatRadioModule
];

4
src/app/models/qemu/qemu-binary.ts Normal file
View File

@ -0,0 +1,4 @@
export class QemuBinary {
path: string;
version: string;
}

0
src/app/models/settings/qemu.ts → src/app/models/settings/qemu-settings.ts
View File

44
src/app/models/templates/qemu-template.ts Normal file
View File

@ -0,0 +1,44 @@
export class QemuTemplate {
adapter_type: string;
adapters: number;
bios_image: string;
boot_priority: string;
builtin: boolean;
category: string;
cdrom_image: string;
compute_id: string;
console_auto_start: boolean;
console_type: string;
cpu_throttling: number;
cpus: number;
custom_adapters?: (null)[] | null;
default_name_format: string;
first_port_name: string;
hda_disk_image: string;
hda_disk_interface: string;
hdb_disk_image: string;
hdb_disk_interface: string;
hdc_disk_image: string;
hdc_disk_interface: string;
hdd_disk_image: string;
hdd_disk_interface: string;
initrd: string;
kernel_command_line: string;
kernel_image: string;
legacy_networking: boolean;
linked_clone: boolean;
mac_address: string;
name: string;
on_close: string;
options: string;
platform: string;
port_name_format: string;
port_segment_size: number;
process_priority: string;
qemu_path: string;
ram: number;
symbol: string;
template_id: string;
template_type: string;
usage: string;
}

0
src/app/services/qemu.service.spec.ts Normal file
View File

19
src/app/services/qemu.service.ts Normal file
View File

@ -0,0 +1,19 @@
import { Injectable } from "@angular/core";
import { HttpServer } from './http-server.service';
import { Observable } from 'rxjs';
import { QemuTemplate } from '../models/templates/qemu-template';
import { Server } from '../models/server';
import { QemuBinary } from '../models/qemu/qemu-binary';
@Injectable()
export class QemuService {
constructor(private httpServer: HttpServer) {}
getTemplates(server: Server): Observable<QemuTemplate[]> {
return this.httpServer.get<QemuTemplate[]>(server, '/templates') as Observable<QemuTemplate[]>;
}
getBinaries(server: Server): Observable<QemuBinary[]> {
return this.httpServer.get<QemuBinary[]>(server, '/computes/local/qemu/binaries') as Observable<QemuBinary[]>;
}
}

2
src/app/services/server-settings.service.ts
View File

@ -2,7 +2,7 @@ import { Injectable } from "@angular/core";
import { HttpServer } from './http-server.service';
import { Server } from '../models/server';
import { ServerSettings } from '../models/serverSettings';
import { QemuSettings } from '../models/settings/qemu';
import { QemuSettings } from '../models/settings/qemu-settings';
@Injectable()
export class ServerSettingsService {

1
src/app/services/template.service.ts
View File

@ -5,6 +5,7 @@ import { Server } from '../models/server';
import { HttpServer } from './http-server.service';
import { Template } from '../models/template';
import { Observable } from 'rxjs';
import { QemuTemplate } from '../models/templates/qemu-template';
@Injectable()
export class TemplateService {