ccsdk/cds - Controller Design Studio (design-time tool : evolution of appc/cdt)

diff options

+ data-ride="carousel" data-interval="false">

@@ -206,15 +206,15 @@

<a class="d-flex"

- data-target="#carouselExampleIndicators"

- data-slide-to="1">

+ data-target="#carouselExampleIndicators"

+ data-slide-to="1">

<h3>Custom</h3>

<p>Start with your own settings</p>

<button

- data-target="#carouselExampleIndicators"

- data-slide-to="1" class="btn">

+ data-target="#carouselExampleIndicators"

+ data-slide-to="1" class="btn">

Create

</button>

</div>

@@ -224,16 +224,16 @@

<a class="d-flex"

- data-target="#carouselExampleIndicators"

- data-slide-to="2">

+ data-target="#carouselExampleIndicators"

+ data-slide-to="2">

<h3>Default</h3>

<p>Explore preset actions from CDS

Action Catalog</p>

<button

- data-target="#carouselExampleIndicators"

- data-slide-to="2" class="btn">

+ data-target="#carouselExampleIndicators"

+ data-slide-to="2" class="btn">

- data-target="#carouselExampleIndicators"

- data-slide-to="3">

+ data-target="#carouselExampleIndicators"

- data-target="#carouselExampleIndicators"

- data-slide-to="3" class="btn">

+ data-target="#carouselExampleIndicators"

+ data-slide-to="3" class="btn">

Select

</button>

</div>

@@ -263,15 +263,15 @@

<a class="d-flex"

- data-target="#carouselExampleIndicators"

- data-slide-to="4">

+ data-target="#carouselExampleIndicators"

+ data-slide-to="4">

<h3>Import</h3>

<p>Import your own action files</p>

<button

- data-target="#carouselExampleIndicators"

- data-slide-to="4" class="btn">

+ data-target="#carouselExampleIndicators"

+ data-slide-to="4" class="btn">

<button class="btn skip-btn" data-dismiss="modal"

- (click)="goToDesignerMode(viewedPackage.id)">

+ (click)="goToDesignerMode(viewedPackage.id)">

Skip

to Designer Canvas

</button>

@@ -292,16 +292,16 @@

<button data-target="#carouselExampleIndicators"

- data-slide-to="0" title="Back" class="btn back"><i

+ data-slide-to="0" title="Back" class="btn back"><i

class="icon-action-back"></i></button>

<h1>Create Custom Action</h1>

<input type="text" [(ngModel)]="customActionName"

- class="form-control customAction"

- placeholder="Type Action Name" autofocus>

- <button type="button" data-dismiss="modal"

- (click)="goToDesignerMode(viewedPackage.id)"

- class="btn submit">Start

+ class="form-control customAction"

+ placeholder="Type Action Name" autofocus>

+ <button type="button" data-dismiss="modal"

+ (click)="goToDesignerMode(viewedPackage.id)"

+ class="btn submit">Start

</button>

</div>

@@ -309,7 +309,7 @@

<button data-target="#carouselExampleIndicators"

- data-slide-to="0" title="Back" class="btn back"><i

+ data-slide-to="0" title="Back" class="btn back"><i

class="icon-action-back"></i></button>

<h1>Choose Action(s) from CDS Default Package </h1>

@@ -331,7 +331,7 @@

</div>

<input type="text" class="form-control searchInput"

- placeholder="Search">

+ placeholder="Search">

</div>

@@ -339,10 +339,11 @@

<input type="checkbox"

- class="custom-control-input"

- id="customControlValidation1" required>

+ class="custom-control-input"

+ id="customControlValidation1"

+ required>

<label class="custom-control-label"

- for="customControlValidation1">config-assign</label>

+ for="customControlValidation1">config-assign</label>

</div>

@@ -350,10 +351,11 @@

<input type="checkbox"

- class="custom-control-input"

- id="customControlValidation2" required>

+ class="custom-control-input"

+ id="customControlValidation2"

+ required>

<label class="custom-control-label"

- for="customControlValidation2">config-assign-test</label>

+ for="customControlValidation2">config-assign-test</label>

</div>

@@ -361,10 +363,11 @@

<input type="checkbox"

- class="custom-control-input"

- id="customControlValidation3" required>

+ class="custom-control-input"

+ id="customControlValidation3"

+ required>

<label class="custom-control-label"

- for="customControlValidation3">config-deploy</label>

+ for="customControlValidation3">config-deploy</label>

</div>

@@ -372,10 +375,11 @@

<input type="checkbox"

- class="custom-control-input"

- id="customControlValidation4" required>

+ class="custom-control-input"

+ id="customControlValidation4"

+ required>

<label class="custom-control-label"

- for="customControlValidation4">config-modify</label>

+ for="customControlValidation4">config-modify</label>

</div>

@@ -383,10 +387,11 @@

<input type="checkbox"

- class="custom-control-input"

- id="customControlValidation5" required>

+ class="custom-control-input"

+ id="customControlValidation5"

+ required>

<label class="custom-control-label"

- for="customControlValidation5">config-assign1</label>

+ for="customControlValidation5">config-assign1</label>

</div>

@@ -394,10 +399,11 @@

<input type="checkbox"

- class="custom-control-input"

- id="customControlValidation5" required>

+ class="custom-control-input"

+ id="customControlValidation5"

+ required>

<label class="custom-control-label"

- for="customControlValidation5">config-assign1</label>

+ for="customControlValidation5">config-assign1</label>

</div>

@@ -405,10 +411,11 @@

<input type="checkbox"

- class="custom-control-input"

- id="customControlValidation5" required>

+ class="custom-control-input"

+ id="customControlValidation5"

+ required>

<label class="custom-control-label"

- for="customControlValidation5">config-assign1</label>

+ for="customControlValidation5">config-assign1</label>

</div>

@@ -416,10 +423,11 @@

<input type="checkbox"

- class="custom-control-input"

- id="customControlValidation5" required>

+ class="custom-control-input"

+ id="customControlValidation5"

+ required>

<label class="custom-control-label"

- for="customControlValidation5">config-assign1</label>

+ for="customControlValidation5">config-assign1</label>

</div>

@@ -427,10 +435,11 @@

<input type="checkbox"

- class="custom-control-input"

- id="customControlValidation5" required>

+ class="custom-control-input"

+ id="customControlValidation5"

+ required>

<label class="custom-control-label"

- for="customControlValidation5">config-assign1</label>

+ for="customControlValidation5">config-assign1</label>

</div>

@@ -438,10 +447,11 @@

<input type="checkbox"

- class="custom-control-input"

- id="customControlValidation5" required>

+ class="custom-control-input"

+ id="customControlValidation5"

+ required>

<label class="custom-control-label"

- for="customControlValidation5">config-assign1</label>

+ for="customControlValidation5">config-assign1</label>

</div>

@@ -449,10 +459,11 @@

<input type="checkbox"

- class="custom-control-input"

- id="customControlValidation5" required>

+ class="custom-control-input"

+ id="customControlValidation5"

+ required>

<label class="custom-control-label"

- for="customControlValidation5">config-assign1</label>

+ for="customControlValidation5">config-assign1</label>

</div>

@@ -461,8 +472,8 @@

<p class="selectedActions">0 selected</p>

<button type="button" data-dismiss="modal"

- (click)="goToDesignerMode(viewedPackage.id)"

- class="btn submit">Start

+ (click)="goToDesignerMode(viewedPackage.id)"

+ class="btn submit">Start

</button>

</div>

@@ -471,7 +482,7 @@

<button data-target="#carouselExampleIndicators"

- data-slide-to="0" title="Back" class="btn back"><i

+ data-slide-to="0" title="Back" class="btn back"><i

class="icon-action-back"></i></button>

<h1>Choose Action(s) from Recent Packages</h1>

@@ -501,7 +512,7 @@

</div>

<input type="text" class="form-control searchInput"

- placeholder="Search">

+ placeholder="Search">

</div>

@@ -509,10 +520,11 @@

<input type="checkbox"

- class="custom-control-input"

- id="customControlValidation1" required>

+ class="custom-control-input"

+ id="customControlValidation1"

+ required>

<label class="custom-control-label"

- for="customControlValidation1">config-assign</label>

+ for="customControlValidation1">config-assign</label>

</div>

@@ -520,10 +532,11 @@

<input type="checkbox"

- class="custom-control-input"

- id="customControlValidation2" required>

+ class="custom-control-input"

+ id="customControlValidation2"

+ required>

<label class="custom-control-label"

- for="customControlValidation2">config-assign-test</label>

+ for="customControlValidation2">config-assign-test</label>

</div>

@@ -531,10 +544,11 @@

<input type="checkbox"

- class="custom-control-input"

- id="customControlValidation3" required>

+ class="custom-control-input"

+ id="customControlValidation3"

+ required>

<label class="custom-control-label"

- for="customControlValidation3">config-deploy</label>

+ for="customControlValidation3">config-deploy</label>

</div>

@@ -542,10 +556,11 @@

<input type="checkbox"

- class="custom-control-input"

- id="customControlValidation4" required>

+ class="custom-control-input"

+ id="customControlValidation4"

+ required>

<label class="custom-control-label"

- for="customControlValidation4">config-modify</label>

+ for="customControlValidation4">config-modify</label>

</div>

@@ -553,10 +568,11 @@

<input type="checkbox"

- class="custom-control-input"

- id="customControlValidation5" required>

+ class="custom-control-input"

+ id="customControlValidation5"

+ required>

<label class="custom-control-label"

- for="customControlValidation5">config-assign1</label>

+ for="customControlValidation5">config-assign1</label>

</div>

@@ -564,10 +580,11 @@

<input type="checkbox"

- class="custom-control-input"

- id="customControlValidation5" required>

+ class="custom-control-input"

+ id="customControlValidation5"

+ required>

<label class="custom-control-label"

- for="customControlValidation5">config-assign1</label>

+ for="customControlValidation5">config-assign1</label>

</div>

@@ -575,10 +592,11 @@

<input type="checkbox"

- class="custom-control-input"

- id="customControlValidation5" required>

+ class="custom-control-input"

+ id="customControlValidation5"

+ required>

<label class="custom-control-label"

- for="customControlValidation5">config-assign1</label>

+ for="customControlValidation5">config-assign1</label>

</div>

@@ -586,10 +604,11 @@

<input type="checkbox"

- class="custom-control-input"

- id="customControlValidation5" required>

+ class="custom-control-input"

+ id="customControlValidation5"

+ required>

<label class="custom-control-label"

- for="customControlValidation5">config-assign1</label>

+ for="customControlValidation5">config-assign1</label>

</div>

@@ -597,10 +616,11 @@

<input type="checkbox"

- class="custom-control-input"

- id="customControlValidation5" required>

+ class="custom-control-input"

+ id="customControlValidation5"

+ required>

<label class="custom-control-label"

- for="customControlValidation5">config-assign1</label>

+ for="customControlValidation5">config-assign1</label>

</div>

@@ -608,10 +628,11 @@

<input type="checkbox"

- class="custom-control-input"

- id="customControlValidation5" required>

+ class="custom-control-input"

+ id="customControlValidation5"

+ required>

<label class="custom-control-label"

- for="customControlValidation5">config-assign1</label>

+ for="customControlValidation5">config-assign1</label>

</div>

@@ -619,10 +640,11 @@

<input type="checkbox"

- class="custom-control-input"

- id="customControlValidation5" required>

+ class="custom-control-input"

+ id="customControlValidation5"

+ required>

<label class="custom-control-label"

- for="customControlValidation5">config-assign1</label>

+ for="customControlValidation5">config-assign1</label>

</div>

@@ -639,30 +661,30 @@

<button data-target="#carouselExampleIndicators"

- data-slide-to="0" title="Back" class="btn back"><i

+ data-slide-to="0" title="Back" class="btn back"><i

class="icon-action-back"></i></button>

<h1>Import Action(s)</h1>

<ngx-file-drop accept=".json"

- dropZoneLabel="Drop files here"

- (onFileDrop)="dropped($event)"

- (onFileOver)="fileOver($event)"

- (onFileLeave)="fileLeave($event)">

+ dropZoneLabel="Drop files here"

+ (onFileDrop)="dropped($event)"

+ (onFileOver)="fileOver($event)"

+ (onFileLeave)="fileLeave($event)">

<ng-template ngx-file-drop-content-tmp

- let-openFileSelector="openFileSelector">

+ let-openFileSelector="openFileSelector">

<img

- src="assets/img/folder-upload.svg" />

+ src="assets/img/folder-upload.svg"/>

</div>

Drag & Drop file

</div>

<div class="folder-upload-text">or

<button type="button"

- class="btn btn-sm btn-primary"

- (click)="openFileSelector()">

+ class="btn btn-sm btn-primary"

+ (click)="openFileSelector()">

Browse

Files

</button>

@@ -676,17 +698,17 @@

<thead>

- <tr

+ <tr

*ngFor="let item of uploadedFiles; let i=index">

- <th width="40"><img

- src="assets/img/icon-file-code.svg" />

- </th>

- <th>{{ item.name }}</th>

- <th width="40" class="text-right">

- <img

- src="assets/img/icon-remove-file.svg" />

- </th>

- </tr>

+ <th width="40"><img

+ src="assets/img/icon-file-code.svg"/>

+ </th>

+ <th>{{ item.name }}</th>

+ <th width="40" class="text-right">

+ <img

+ src="assets/img/icon-remove-file.svg"/>

<button type="button" class="btn btn-sm mb-2 btn-enrich" data-toggle="modal"

- data-target="#enrichModal">

+ data-target="#enrichModal">

<i class="icon-enrich" aria-hidden="true"></i> Manual Enrich

</button>

@@ -725,17 +747,17 @@

<a [classList]="metadataClasses" id="nav-metadata-tab" data-toggle="tab"

- href="#nav-metadata" role="tab" aria-controls="nav-metadata" aria-selected="true"

- autofocus #nameit (focusout)="saveMetaData()">METADATA</a>

+ href="#nav-metadata" role="tab" aria-controls="nav-metadata" aria-selected="true"

+ autofocus #nameit (focusout)="saveMetaData()">METADATA</a>

<a class="nav-item nav-link" id="nav-template-tab" data-toggle="tab" href="#nav-template"

- role="tab" aria-controls="nav-template" aria-selected="false">TEMPLATE & MAPPING</a>

+ role="tab" aria-controls="nav-template" aria-selected="false">TEMPLATE & MAPPING</a>

<a class="nav-item nav-link" id="nav-scripts-tab" data-toggle="tab" href="#nav-scripts"

- role="tab" aria-controls="nav-scripts" aria-selected="false">SCRIPTS</a>

+ role="tab" aria-controls="nav-scripts" aria-selected="false">SCRIPTS</a>

<a class="nav-item nav-link" id="nav-imports-tab" data-toggle="tab" href="#nav-imports"

- role="tab" aria-controls="nav-imports" aria-selected="false">DEFINITIONS</a>

+ role="tab" aria-controls="nav-imports" aria-selected="false">DEFINITIONS</a>

<a class="nav-item nav-link" id="nav-authentication-tab" data-toggle="tab"

- href="#nav-authentication" role="tab" aria-controls="nav-authentication"

- aria-selected="false">EXTERNAL SYSTEM AUTHENTICATION PROPERTIES</a>

+ href="#nav-authentication" role="tab" aria-controls="nav-authentication"

+ aria-selected="false">EXTERNAL SYSTEM AUTHENTICATION PROPERTIES</a>

</div>

@@ -744,24 +766,24 @@

<div class="tab-pane fade show active" id="nav-metadata" role="tabpanel"

- aria-labelledby="nav-metadata-tab">

+ aria-labelledby="nav-metadata-tab">

<app-metadata-tab></app-metadata-tab>

</div>

<div class="tab-pane fade" id="nav-template" role="tabpanel"

- aria-labelledby="nav-template-tab">

+ aria-labelledby="nav-template-tab">

<app-template-mapping></app-template-mapping>

</div>

<div class="tab-pane fade" id="nav-scripts" role="tabpanel"

- aria-labelledby="nav-scripts-tab">

+ aria-labelledby="nav-scripts-tab">

<app-scripts-tab></app-scripts-tab>

</div>

<div class="tab-pane fade" id="nav-imports" role="tabpanel"

- aria-labelledby="nav-imports-tab">

+ aria-labelledby="nav-imports-tab">

<app-imports-tab></app-imports-tab>

</div>

<div class="tab-pane fade" id="nav-authentication" role="tabpanel"

- aria-labelledby="nav-authentication-tab">

+ aria-labelledby="nav-authentication-tab">

<app-dsl-definitions-tab></app-dsl-definitions-tab>

@@ -778,13 +800,13 @@

<div class="modal fade enrichModal" id="enrichModal" tabindex="-1" role="dialog" aria-labelledby="enrichModalLabel"

- aria-hidden="true">

+ aria-hidden="true">

<h5 class="modal-title" id="enrichModalLabel">Manual Enrich</h5>

- <img src="assets/img/icon-close.svg" />

+ <img src="assets/img/icon-close.svg"/>

</button>

</div>

@@ -793,15 +815,16 @@

<li>1. Copy and paste "workflows" and "node_templates"</li>

<li>2. Press <b>Enrich</b> button</li>

</ul>

- <ace-editor [(text)]="vlbDefinition.topology_template.content" [mode]="'javascript'"

- [autoUpdateContent]="true" [durationBeforeCallback]="1000" (textChanged)="textChanged($event)"

- [theme]="'eclipse'" #editor style="height:300px;">

+ <ace-editor [(text)]="this.vlbDefinition.topology_template.content" [mode]="'json'"

+ [autoUpdateContent]="true" [durationBeforeCallback]="1000" [theme]="'eclipse'"

+ (textChanged)="textChanged($event)"

+ #editor style="height:300px;">

</ace-editor>

</div>

<button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>

<button type="button" data-dismiss="modal" class="btn btn-primary btn-enrich"

- (click)="enrichBluePrint()">Enrich

+ (click)="enrichBluePrint()">Enrich

<div class="modal fade" id="removePackageModal" tabindex="-1" role="dialog" aria-labelledby="removePackageModalLabel"

- aria-hidden="true">

+ aria-hidden="true">

@@ -831,7 +854,7 @@

</div>

<div class="modal fade" id="discardChangesModal" tabindex="-1" role="dialog" aria-labelledby="discardChangesModalLabel"

- aria-hidden="true">

+ aria-hidden="true">

@@ -851,4 +874,4 @@

</div>

-</div> \ No newline at end of file

+</div>

@@ -1,4 +1,4 @@

-import {Component, ElementRef, OnInit, ViewChild} from '@angular/core';

+import {Component, ElementRef, OnDestroy, OnInit, ViewChild} from '@angular/core';

import {ActivatedRoute, Router} from '@angular/router';

import {BluePrintDetailModel} from '../model/BluePrint.detail.model';

import {PackageCreationStore} from '../package-creation/package-creation.store';

@@ -18,13 +18,15 @@ import {NgxFileDropEntry} from 'ngx-file-drop';

import {PackageCreationService} from '../package-creation/package-creation.service';

import {ComponentCanDeactivate} from '../../../../common/core/canDactivate/ComponentCanDeactivate';

import {PackageCreationExtractionService} from '../package-creation/package-creation-extraction.service';

+import {distinctUntilChanged, takeUntil} from 'rxjs/operators';

+import {Subject} from 'rxjs';

@Component({

selector: 'app-configuration-dashboard',

templateUrl: './configuration-dashboard.component.html',

styleUrls: ['./configuration-dashboard.component.css'],

})

-export class ConfigurationDashboardComponent extends ComponentCanDeactivate implements OnInit {

+export class ConfigurationDashboardComponent extends ComponentCanDeactivate implements OnInit, OnDestroy {

viewedPackage: BluePrintDetailModel = new BluePrintDetailModel();

@ViewChild(MetadataTabComponent, {static: false})

metadataTabComponent: MetadataTabComponent;

@@ -47,6 +49,8 @@ export class ConfigurationDashboardComponent extends ComponentCanDeactivate impl

metadataClasses = 'nav-item nav-link active';

private cbaPackage: CBAPackage = new CBAPackage();

dataTarget: any = '';

+ ngUnsubscribe = new Subject();

+ private designerState: any;

constructor(

private route: ActivatedRoute,

@@ -61,15 +65,25 @@ export class ConfigurationDashboardComponent extends ComponentCanDeactivate impl

) {

super();

- this.packageCreationStore.state$.subscribe(

- cbaPackage => {

- this.cbaPackage = cbaPackage;

- });

}

ngOnInit() {

this.vlbDefinition.topology_template = new TemplateTopology();

+ this.packageCreationStore.state$

+ .pipe(distinctUntilChanged((a: any, b: any) => JSON.stringify(a) === JSON.stringify(b)),

+ takeUntil(this.ngUnsubscribe))

+ .subscribe(

+ cbaPackage => {

+ this.cbaPackage = cbaPackage;

+ });

+ this.designerStore.state$.pipe(

+ distinctUntilChanged((a: any, b: any) => JSON.stringify(a) === JSON.stringify(b)),

+ takeUntil(this.ngUnsubscribe))

+ .subscribe(state => {

+ this.designerState = state;

+ this.vlbDefinition.topology_template.content = this.packageCreationUtils.transformToJson(state.template);

+ });

this.elementRef.nativeElement.focus();

this.refreshCurrentPackage();

const regexp = RegExp(this.versionPattern);

@@ -206,13 +220,17 @@ export class ConfigurationDashboardComponent extends ComponentCanDeactivate impl

}

textChanged($event: {}) {

- this.packageCreationStore.addTopologyTemplate(this.vlbDefinition.topology_template);

+ this.cbaPackage.templateTopology.node_templates = this.designerState.template.node_templates;

+ this.cbaPackage.templateTopology.workflows = this.designerState.template.workflows;

+ this.cbaPackage.templateTopology.content = this.vlbDefinition.topology_template.content;

}

enrichBluePrint() {

+ this.packageCreationStore.addTopologyTemplate(this.cbaPackage.templateTopology);

this.formTreeData();

this.enrichPackage();

+ this.designerStore.clear();

+ this.packageCreationStore.clear();

}

@@ -259,13 +277,18 @@ export class ConfigurationDashboardComponent extends ComponentCanDeactivate impl

return this.isSaveEnabled;

}

+ ngOnDestroy() {

+ this.ngUnsubscribe.next();

+ this.ngUnsubscribe.complete();

+ }

checkSkipTypesOfAction() {

console.log(this.cbaPackage);

if (this.cbaPackage.templateTopology.node_templates && this.cbaPackage.templateTopology.workflows) {

- console.log('eeeeee');

this.goToDesignerMode(this.id);

} else {

this.dataTarget = '#exampleModalLong';

}

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 099d96615..19d000f8f 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,32 +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, 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 {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 { TopologyTemplate } from './model/designer.topologyTemplate.model';

-import { ToastrService } from 'ngx-toastr';

+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',

@@ -74,7 +74,7 @@ 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();

@@ -117,7 +117,7 @@ export class DesignerComponent implements OnInit, OnDestroy {

publishBluePrint() {

this.create();

- this.zipFile.generateAsync({ type: 'blob' })

+ this.zipFile.generateAsync({type: 'blob'})

.then(blob => {

const formData = new FormData();

formData.append('file', blob);

@@ -164,7 +164,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);

});

}

@@ -226,9 +226,10 @@ 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'

});

+ this.actions = [];

for (const workflowsKey in topologtTemplate.workflows) {

if (workflowsKey && !this.actions.includes(workflowsKey)) {

this.actions.push(workflowsKey);

@@ -455,7 +456,7 @@ 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 => {

diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.store.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.store.ts
index 0d20f9662..e07fbb94d 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.store.ts
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.store.ts

@@ -144,4 +144,9 @@ export class DesignerStore extends Store<DesignerDashboardState> {

}

});

}

+ clear() {

+ this.setState(new DesignerDashboardState());

+ }

}


context:
space:
mode: