Export config added

src/app/app.module.ts

@@ -199,6 +199,7 @@ import { ShowNodeActionComponent } from './components/project-map/context-menu/a
 import { InfoDialogComponent } from './components/project-map/info-dialog/info-dialog.component';
 import { InfoService } from './services/info.service';
 import { BringToFrontActionComponent } from './components/project-map/context-menu/actions/bring-to-front-action/bring-to-front-action.component';
+import { ExportConfigActionComponent } from './components/project-map/context-menu/actions/export-config/export-config-action.component';
 
 if (environment.production) {
   Raven.config('https://b2b1cfd9b043491eb6b566fd8acee358@sentry.io/842726', {
@@ -327,7 +328,8 @@ if (environment.production) {
     SaveProjectDialogComponent,
     TopologySummaryComponent,
     InfoDialogComponent,
-    BringToFrontActionComponent
+    BringToFrontActionComponent,
+    ExportConfigActionComponent
   ],
   imports: [
     BrowserModule,

src/app/components/project-map/context-menu/actions/export-config/export-config-action.component.html

@@ -0,0 +1,4 @@
+<button mat-menu-item (click)="exportConfig()">
+    <mat-icon>call_made</mat-icon>
+    <span>Export config</span>
+</button>

src/app/components/project-map/context-menu/actions/export-config/export-config-action.component.ts

@@ -0,0 +1,33 @@
+import { Component, Input } from '@angular/core';
+import { Node } from '../../../../../cartography/models/node';
+import { NodeService } from '../../../../../services/node.service';
+import { Server } from '../../../../../models/server';
+
+@Component({
+    selector: 'app-export-config-action',
+    templateUrl: './export-config-action.component.html'
+})
+export class ExportConfigActionComponent {
+    @Input() server: Server;
+    @Input() node: Node;
+
+    constructor(
+        private nodeService: NodeService
+    ) {}
+
+    exportConfig() {
+        this.nodeService.getConfiguration(this.server, this.node).subscribe((config: any) => {
+            this.downloadByHtmlTag(config);
+        });
+    }
+
+    private downloadByHtmlTag(config: string) {
+        const element = document.createElement('a');
+        const fileType = 'vpc';
+        element.setAttribute('href', `data:${fileType};charset=utf-8,${encodeURIComponent(config)}`);
+        element.setAttribute('download', 'configFile.vpc');
+
+        var event = new MouseEvent("click");
+        element.dispatchEvent(event);
+    }
+}

src/app/components/project-map/context-menu/context-menu.component.html

@@ -36,11 +36,15 @@
       [link]="links[0]"
       [linkNode]="linkNodes[0]"
     ></app-edit-text-action>
-    <app-edit-config-action *ngIf="nodes.length === 1"
+    <app-edit-config-action *ngIf="nodes.length===1"
-        [server]="server"
+      [server]="server"
-        [project]="project"
+      [project]="project"
-        [node]="nodes[0]"
+      [node]="nodes[0]"
     ></app-edit-config-action>
+    <app-export-config-action *ngIf="nodes.length===1"
+      [server]="server"
+      [node]="nodes[0]"
+    ></app-export-config-action>
     <app-move-layer-up-action
       *ngIf="!projectService.isReadOnly(project) && (drawings.length || nodes.length) && labels.length===0"
       [server]="server"