From a4d84ebd1db8f9b881c33f5efefc4aa6c1fbf02f Mon Sep 17 00:00:00 2001 From: ShaabanEltanany Date: Wed, 23 Sep 2020 11:40:09 +0200 Subject: adding save for topology template content Issue-ID: CCSDK-2298 Signed-off-by: ShaabanEltanany Change-Id: I8333f84e1551bb49f016c25f1c98f8b0f15b7ed3 --- .../packages/designer/designer.component.ts | 70 +++++++++++++--------- 1 file changed, 43 insertions(+), 27 deletions(-) (limited to 'cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.ts') diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.ts index 0509b1d0e..d8113633d 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.ts @@ -25,30 +25,32 @@ limitations under the License. import dagre from 'dagre'; import graphlib from 'graphlib'; -import {Component, OnDestroy, OnInit, ViewEncapsulation} from '@angular/core'; +import { Component, OnDestroy, OnInit, ViewEncapsulation } from '@angular/core'; import * as joint from 'jointjs'; import './jointjs/elements/palette.function.element'; import './jointjs/elements/action.element'; import './jointjs/elements/board.function.element'; -import {DesignerStore} from './designer.store'; -import {ActionElementTypeName} from 'src/app/common/constants/app-constants'; -import {GraphUtil} from './graph.util'; -import {GraphGenerator} from './graph.generator.util'; -import {FunctionsStore} from './functions.store'; -import {Subject} from 'rxjs'; -import {distinctUntilChanged, takeUntil} from 'rxjs/operators'; -import {BluePrintDetailModel} from '../model/BluePrint.detail.model'; -import {ActivatedRoute} from '@angular/router'; -import {DesignerService} from './designer.service'; -import {FilesContent, FolderNodeElement} from '../package-creation/mapping-models/metadata/MetaDataTab.model'; -import {PackageCreationModes} from '../package-creation/creationModes/PackageCreationModes'; -import {PackageCreationBuilder} from '../package-creation/creationModes/PackageCreationBuilder'; -import {PackageCreationStore} from '../package-creation/package-creation.store'; -import {PackageCreationService} from '../package-creation/package-creation.service'; -import {PackageCreationUtils} from '../package-creation/package-creation.utils'; +import { DesignerStore } from './designer.store'; +import { ActionElementTypeName } from 'src/app/common/constants/app-constants'; +import { GraphUtil } from './graph.util'; +import { GraphGenerator } from './graph.generator.util'; +import { FunctionsStore } from './functions.store'; +import { Subject } from 'rxjs'; +import { distinctUntilChanged, takeUntil } from 'rxjs/operators'; +import { BluePrintDetailModel } from '../model/BluePrint.detail.model'; +import { ActivatedRoute, Router } from '@angular/router'; +import { DesignerService } from './designer.service'; +import { FilesContent, FolderNodeElement } from '../package-creation/mapping-models/metadata/MetaDataTab.model'; +import { PackageCreationModes } from '../package-creation/creationModes/PackageCreationModes'; +import { PackageCreationBuilder } from '../package-creation/creationModes/PackageCreationBuilder'; +import { PackageCreationStore } from '../package-creation/package-creation.store'; +import { PackageCreationService } from '../package-creation/package-creation.service'; +import { PackageCreationUtils } from '../package-creation/package-creation.utils'; import * as JSZip from 'jszip'; -import {PackageCreationExtractionService} from '../package-creation/package-creation-extraction.service'; -import {CBAPackage} from '../package-creation/mapping-models/CBAPacakge.model'; +import { PackageCreationExtractionService } from '../package-creation/package-creation-extraction.service'; +import { CBAPackage } from '../package-creation/mapping-models/CBAPacakge.model'; +import { TopologyTemplate } from './model/designer.topologyTemplate.model'; +import { ToastrService } from 'ngx-toastr'; @Component({ selector: 'app-designer', @@ -72,11 +74,12 @@ export class DesignerComponent implements OnInit, OnDestroy { paletteGraph: joint.dia.Graph; palettePaper: joint.dia.Paper; ngUnsubscribe = new Subject(); - opt = {tx: 100, ty: 100}; + opt = { tx: 100, ty: 100 }; filesData: any = []; folder: FolderNodeElement = new FolderNodeElement(); zipFile: JSZip = new JSZip(); - private cbaPackage: CBAPackage; + cbaPackage: CBAPackage; + actions: string[] = []; constructor( private designerStore: DesignerStore, @@ -86,9 +89,11 @@ export class DesignerComponent implements OnInit, OnDestroy { private graphUtil: GraphUtil, private graphGenerator: GraphGenerator, private route: ActivatedRoute, + private router: Router, private designerService: DesignerService, private packageCreationService: PackageCreationService, - private packageCreationExtractionService: PackageCreationExtractionService) { + private packageCreationExtractionService: PackageCreationExtractionService, + private toastService: ToastrService) { this.controllerSideBar = true; this.attributesSideBar = false; this.showAction = false; @@ -143,7 +148,7 @@ export class DesignerComponent implements OnInit, OnDestroy { this.packageCreationService.downloadPackage(this.viewedPackage.artifactName + '/' + this.viewedPackage.artifactVersion) .subscribe(response => { - const blob = new Blob([response], {type: 'application/octet-stream'}); + const blob = new Blob([response], { type: 'application/octet-stream' }); this.packageCreationExtractionService.extractBlobToStore(blob); }); } @@ -152,7 +157,9 @@ export class DesignerComponent implements OnInit, OnDestroy { this.cbaPackage = cba; console.log(cba.templateTopology.content); this.designerStore.saveSourceContent(cba.templateTopology.content); + }); + /** * the code to retrieve from server is commented */ @@ -186,9 +193,10 @@ export class DesignerComponent implements OnInit, OnDestroy { if (state.sourceContent) { console.log('inside desinger.component---> ', state); // generate graph from store objects if exist - const topologtTemplate = JSON.parse(state.sourceContent); + const topologtTemplate: TopologyTemplate = JSON.parse(state.sourceContent); console.log(topologtTemplate); delete state.sourceContent; + this.graphGenerator.clear(this.boardGraph); this.graphGenerator.populate(topologtTemplate, this.boardGraph); console.log('all cells', this.boardGraph.getCells()); @@ -202,9 +210,14 @@ export class DesignerComponent implements OnInit, OnDestroy { setLinkVertices: false, marginX: 10, marginY: 10, - clusterPadding: {top: 100, left: 30, right: 10, bottom: 100}, + clusterPadding: { top: 100, left: 30, right: 10, bottom: 100 }, rankDir: 'TB' }); + for (const workflowsKey in topologtTemplate.workflows) { + if (workflowsKey && !this.actions.includes(workflowsKey)) { + this.actions.push(workflowsKey); + } + } } }); @@ -426,13 +439,16 @@ export class DesignerComponent implements OnInit, OnDestroy { saveBluePrintToDataBase() { this.create(); - this.zipFile.generateAsync({type: 'blob'}) + this.zipFile.generateAsync({ type: 'blob' }) .then(blob => { this.packageCreationService.savePackage(blob).subscribe( bluePrintDetailModels => { + this.toastService.info('success updating the package'); + const id = bluePrintDetailModels.toString().split('id')[1].split(':')[1].split('"')[1]; + this.router.navigate(['/packages/designer/' + id]); console.log('success'); }, error => { - // this.toastService.error('error happened when editing ' + error.message); + this.toastService.error('error happened when editing ' + error.message); console.log('Error -' + error.message); }); }); -- cgit 1.2.3-korg