From 1b2d71d30ec8c92c50eabb2b163ec9cc9640d61a Mon Sep 17 00:00:00 2001 From: Ezhilarasi Date: Sat, 6 Apr 2019 00:21:57 +0530 Subject: CBA integration Change-Id: I0505e32fe7680f1e2ee029f36d37e3ec84088789 Issue-ID: CCSDK-1068 Signed-off-by: Ezhilarasi --- .../modify-template/editor/editor.component.html | 24 ++- .../modify-template/editor/editor.component.scss | 58 ++++--- .../modify-template/editor/editor.component.ts | 169 ++++++++++++++++++++- .../modify-template/modify-template.component.html | 32 ++-- .../modify-template/modify-template.component.ts | 19 +++ .../modify-template/modify-template.module.ts | 12 +- .../resource-mapping.component.html | 166 ++++++++++++++++++++ .../resource-mapping.component.scss | 24 +++ .../resource-mapping.component.spec.ts | 46 ++++++ .../resource-mapping/resource-mapping.component.ts | 80 ++++++++++ .../resource-mapping/resource-mapping.service.ts | 85 +++++++++++ 11 files changed, 661 insertions(+), 54 deletions(-) create mode 100644 cds-ui/client/src/app/feature-modules/blueprint/modify-template/resource-mapping/resource-mapping.component.html create mode 100644 cds-ui/client/src/app/feature-modules/blueprint/modify-template/resource-mapping/resource-mapping.component.scss create mode 100644 cds-ui/client/src/app/feature-modules/blueprint/modify-template/resource-mapping/resource-mapping.component.spec.ts create mode 100644 cds-ui/client/src/app/feature-modules/blueprint/modify-template/resource-mapping/resource-mapping.component.ts create mode 100644 cds-ui/client/src/app/feature-modules/blueprint/modify-template/resource-mapping/resource-mapping.service.ts (limited to 'cds-ui/client/src/app/feature-modules/blueprint/modify-template') diff --git a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.html b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.html index 6113e6d75..ea4c298e8 100644 --- a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.html +++ b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.html @@ -18,17 +18,17 @@ See the License for the specific language governing permissions and limitations under the License. ============LICENSE_END============================================ --> -
+
- - - + + +
- +
@@ -47,7 +47,17 @@ limitations under the License.
- - + +
+ + +
+ + +
+ +
+
\ No newline at end of file diff --git a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.scss b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.scss index 8375fff87..ed53807aa 100644 --- a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.scss +++ b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.scss @@ -19,10 +19,10 @@ limitations under the License. ============LICENSE_END============================================ */ -.container { - display: flex; - flex-direction: row; - margin-top: 8px; +.containerDiv { + display: flex !important; + flex-direction: row !important; + margin-top: 8px !important; .fileViewContainer { width: 20%; margin: 2px; @@ -45,15 +45,17 @@ limitations under the License. border: 1px solid #3f51b5; // border-left: 5px solid #3f51b5; } + .savebtn { color: white; background-color: #3f51b5; position: absolute; bottom: 5px; } -.save-icon{ + +.save-icon { position: absolute; - left: 59em; + left: 57em; color: #3f51b5; font-size: 24px; cursor: pointer; @@ -63,27 +65,43 @@ limitations under the License. .background-highlight { background-color: #3f51b5 !important; color: white !important; - } +} - .fa-disabled { +.fa-disabled { opacity: 0.6; pointer-events: none; - } +} - .mat-tree-node { +.mat-tree-node { min-height: 40px !important; - } +} - .delete-add-file { - color:#3f51b5; +.delete-add-file { + color: #3f51b5; font-size: 20px; - margin: 3px; + margin: 3px; cursor: pointer; - } +} - .add-file { - color:#3f51b5; - font-size: 18px; - margin: 3px; +.add-file { + color: #3f51b5; + font-size: 18px; + margin: 3px; cursor: pointer; - } \ No newline at end of file +} + +.resource-mapping-mode { + height: 50% !important; + // overflow: scroll; +} + +.normal-editor-mode { + height: 100%; +} + +.apply-scrol-to-editor-container { + overflow: scroll; + width: 80%; + background-color: gainsboro; + height: 490px !important; +} \ No newline at end of file diff --git a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.ts b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.ts index 57d934b9a..7cbf5b0a5 100644 --- a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.ts +++ b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.ts @@ -35,6 +35,7 @@ import { Store } from '@ngrx/store'; import { Observable } from 'rxjs'; import { IBlueprintState } from 'src/app/common/core/store/models/blueprintState.model'; import { LoadBlueprintSuccess, SetBlueprintState } from '../../../../common/core/store/actions/blueprint.action' +import { ApiService } from 'src/app/common/core/services/api.service'; interface Node { @@ -90,6 +91,18 @@ export class EditorComponent implements OnInit { filetoDelete: string; currentFilePath: string = ''; selectedFileObj = { name: '', type: '' }; + viewTemplateMode: boolean = false; + paramData : any = { + 'capability-data': [], + 'resourceAccumulatorResolvedData' : [] + }; + validfile: boolean = false; + @ViewChild('fileInput') fileInput; + result: string = ''; + private paths = []; + private tree; + private fileObject: any; + private tocsaMetadaData: any; private transformer = (node: Node, level: number) => { return { @@ -107,7 +120,7 @@ export class EditorComponent implements OnInit { dataSource = new MatTreeFlatDataSource(this.treeControl, this.treeFlattener); - constructor(private store: Store) { + constructor(private store: Store, private apiservice: ApiService) { this.dataSource.data = TREE_DATA; this.bpState = this.store.select('blueprint'); // this.dataSource.data = TREE_DATA; @@ -184,6 +197,7 @@ export class EditorComponent implements OnInit { } selectFileToView(file) { + if(file.name.includes('.vtl')) { this.viewTemplateMode = true;} else { this.viewTemplateMode = false;} this.currentFilePath = ''; this.expandParents(file); this.selectedFileObj.name = file.name; @@ -201,15 +215,115 @@ export class EditorComponent implements OnInit { this.setEditorMode(); } - SaveToBackend() { + getEnriched() { + this.create(); this.zipFile.generateAsync({ type: "blob" }) .then(blob => { + const formData = new FormData(); + formData.append("file", blob); + this.apiservice.enrich("/enrich-blueprint/", formData) + .subscribe( + (response) => { + console.log("Inside blob"); + var blob = new Blob([response.data], { type: 'application/zip' }); + const fileName = 'CBA.zip'; + saveAs(blob, fileName); + this.zipFile.files = {}; + this.zipFile.loadAsync(blob) + .then((zip) => { + if (zip) { + this.buildFileViewData(zip); + } + }); + + }); + + }); + + } + async buildFileViewData(zip) { + this.validfile = false; + this.paths = []; + for (var file in zip.files) { + this.fileObject = { + name: zip.files[file].name, + data: '' + }; + const value = await zip.files[file].async('string'); + this.fileObject.data = value; + this.paths.push(this.fileObject); + } + + if(this.paths) { + this.paths.forEach(path =>{ + if(path.name.includes("TOSCA.meta")) { + this.validfile = true + } + }); + } else { + alert('Please update proper file'); + } + + if(this.validfile) { + this.fetchTOSACAMetadata(); + this.tree = this.arrangeTreeData(this.paths); + } else { + alert('Please update proper file with TOSCA metadata'); + } + } + + fetchTOSACAMetadata() { + let toscaData = {}; + this.paths.forEach(file =>{ + if(file.name.includes('TOSCA.meta')) { + let keys = file.data.split("\n"); + keys.forEach((key)=>{ + let propertyData = key.split(':'); + toscaData[propertyData[0]] = propertyData[1]; + }); + } + }); + this.blueprintName = (((toscaData['Entry-Definitions']).split('/'))[1]).toString();; + console.log(toscaData); + } + + + saveToBackend() { + this.create(); + this.zipFile.generateAsync({ type: "blob" }) + .then(blob => { + const formData = new FormData(); + formData.append("file", blob); + this.apiservice.post("/create-blueprint/", formData) + .subscribe(data => console.log(data)); }); } deploy() { // to do + this.create(); + this.zipFile.generateAsync({ type: "blob" }) + .then(blob => { + const formData = new FormData(); + formData.append("file", blob); + this.apiservice.post("/deploy-blueprint/", formData) + .subscribe(data => console.log(data)); + + }); + } + + publish() { + this.create(); + this.zipFile.generateAsync({ type: "blob" }) + .then(blob => { + const formData = new FormData(); + formData.append("file", blob); + this.apiservice.post("/publish/", formData) + .subscribe(data => console.log(data)); + + }); + } create() { @@ -219,12 +333,17 @@ export class EditorComponent implements OnInit { } download() { - this.create(); - var zipFilename = "baseconfiguration.zip"; - this.zipFile.generateAsync({ type: "blob" }) - .then(blob => { - saveAs(blob, zipFilename); - }); + this.apiservice.downloadCBA("/download-blueprint/baseconfiguration/1.0.0") + .subscribe(response => { + console.log(response); + var blob = new Blob([response], { type: 'application/zip' }); + const fileName = 'CBA'; + saveAs(blob, fileName); + }, + error => { + console.log(error); + } + ); } setEditorMode() { switch (this.fileExtension) { @@ -384,4 +503,38 @@ export class EditorComponent implements OnInit { } } } + loadConfigParams() { + console.log(this.currentFilePath); + console.log(this.selectedFile); + console.log(this.selectedFileObj); + console.log(this.selectedFolder); + console.log(this.text); + + let parsedData = JSON.parse(this.text); + this.paramData.resourceAccumulatorResolvedData = parsedData['resource-accumulator-resolved-data']; + let i=0; + + this.paramData.resourceAccumulatorResolvedData.forEach(element => { + element.id = i; + let tempElement = element['param-value']; + let indexLength = tempElement.length; + tempElement = tempElement.slice(2,indexLength); + let index = tempElement.indexOf('}'); + tempElement = this.removeItemByIndex(tempElement, index); + element['param-value'] = tempElement; + i++; + }); + + } + + removeItemByIndex(paramValue, index) { + if(index == 0) { + return paramValue.slice(1) + } else if(index > 0) { + let indexLength = paramValue.length; + return paramValue.slice(0,index) + paramValue.slice(index+1, indexLength); + } else { + return paramValue; + } + } } diff --git a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.html b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.html index 754ba214c..1d9b5266e 100644 --- a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.html +++ b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.html @@ -20,28 +20,28 @@ limitations under the License. -->
- - + +
- +
-
+
-
- - - - - - - - - - +
+ + + + + + + + + +
-
\ No newline at end of file +
\ No newline at end of file diff --git a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.ts b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.ts index e39ce019c..47d779556 100644 --- a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.ts +++ b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.ts @@ -58,6 +58,25 @@ export class ModifyTemplateComponent implements OnInit { } } + getEnriched() { + this.editorComp.getEnriched(); + } + + saveToControllerBlueprint() { + this.editorComp.saveToBackend(); + } + + publishToControllerBlueprint() { + this.editorComp.publish(); + } + + saveToBlueprintProcessor() { + this.editorComp.deploy(); + } + + processBlueprint(){ + + } downloadCBA() { this.editorComp.download(); } diff --git a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.module.ts b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.module.ts index 3aef2a7aa..7d22c569b 100644 --- a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.module.ts +++ b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.module.ts @@ -21,6 +21,7 @@ limitations under the License. import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { CdkTableModule } from '@angular/cdk/table'; +import { FormsModule } from '@angular/forms'; import { ModifyTemplateComponent } from './modify-template.component'; import { ModifyTemplateRoutingModule } from './modify-template-routing.module'; @@ -28,12 +29,15 @@ import { AppMaterialModule } from '../../../common/modules/app-material.module'; import { DesignerComponent } from './designer/designer.component'; import { EditorComponent } from './editor/editor.component'; import { AceEditorModule } from 'ng2-ace-editor'; +import { ResourceMappingComponent } from './resource-mapping/resource-mapping.component'; +import { ResourceMappingService } from './resource-mapping/resource-mapping.service'; @NgModule({ declarations: [ ModifyTemplateComponent, DesignerComponent, - EditorComponent + EditorComponent, + ResourceMappingComponent ], exports: [ ModifyTemplateComponent, @@ -45,7 +49,9 @@ import { AceEditorModule } from 'ng2-ace-editor'; CdkTableModule, AppMaterialModule, ModifyTemplateRoutingModule, - AceEditorModule - ] + AceEditorModule, + FormsModule + ], + providers: [ ResourceMappingService ] }) export class ModifyTemplateModule { } diff --git a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/resource-mapping/resource-mapping.component.html b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/resource-mapping/resource-mapping.component.html new file mode 100644 index 000000000..b369e012d --- /dev/null +++ b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/resource-mapping/resource-mapping.component.html @@ -0,0 +1,166 @@ + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
RequiredTemplate InputParameter NameDictionary NameDictionary SourceDefaultData TypeEntry SchemaDependency Mapping
+ + + + {{param["param-value"]}} + + + + + + + + + + + + +
+ + + + Name + + + + + + + + + + + + +
+ + + + Name + + + + + + + + + + + + +
+ + + + Name + + + + + + + + + + + + +
+
\ No newline at end of file diff --git a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/resource-mapping/resource-mapping.component.scss b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/resource-mapping/resource-mapping.component.scss new file mode 100644 index 000000000..91c611066 --- /dev/null +++ b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/resource-mapping/resource-mapping.component.scss @@ -0,0 +1,24 @@ +/* +============LICENSE_START========================================== +=================================================================== +Copyright (C) 2018-19 IBM Intellectual Property. All rights reserved. +=================================================================== + +Unless otherwise specified, all software contained herein is licensed +under the Apache License, Version 2.0 (the License); +you may not use this software except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +============LICENSE_END============================================ +*/ + +table { + width: 100%; + } \ No newline at end of file diff --git a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/resource-mapping/resource-mapping.component.spec.ts b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/resource-mapping/resource-mapping.component.spec.ts new file mode 100644 index 000000000..7bbd01103 --- /dev/null +++ b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/resource-mapping/resource-mapping.component.spec.ts @@ -0,0 +1,46 @@ +/* +============LICENSE_START========================================== +=================================================================== +Copyright (C) 2018-19 IBM Intellectual Property. All rights reserved. +=================================================================== + +Unless otherwise specified, all software contained herein is licensed +under the Apache License, Version 2.0 (the License); +you may not use this software except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +============LICENSE_END============================================ +*/ + +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { ResourceMappingComponent } from './resource-mapping.component'; + +describe('ResourceMappingComponent', () => { + let component: ResourceMappingComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ ResourceMappingComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(ResourceMappingComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/resource-mapping/resource-mapping.component.ts b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/resource-mapping/resource-mapping.component.ts new file mode 100644 index 000000000..6edd26113 --- /dev/null +++ b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/resource-mapping/resource-mapping.component.ts @@ -0,0 +1,80 @@ +/* +============LICENSE_START========================================== +=================================================================== +Copyright (C) 2018-19 IBM Intellectual Property. All rights reserved. +=================================================================== + +Unless otherwise specified, all software contained herein is licensed +under the Apache License, Version 2.0 (the License); +you may not use this software except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +============LICENSE_END============================================ +*/ + +import { Component, OnInit, ViewChild, Input } from '@angular/core'; +import { MatPaginator, MatTableDataSource, MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material'; +import { SearchDialog } from '../../../../common/shared/components/search-dialog/search-dialog.component'; +import { ResourceMappingService } from './resource-mapping.service'; + + +@Component({ + selector: 'app-resource-mapping', + templateUrl: './resource-mapping.component.html', + styleUrls: ['./resource-mapping.component.scss'] +}) +export class ResourceMappingComponent { + + @Input('paramData') paramData: any; + dialogRef: any; + animal: string; + name: string; + selectedParam: any; + + resorceDictionaryName: string = ''; + + constructor(public dialog: MatDialog, private resourceMappingService: ResourceMappingService) { + } + + openDialog(paramValue): void { + const dialogRef = this.dialog.open(SearchDialog, { + width: '250px', + data: { name: paramValue, animal: this.animal } + }); + + dialogRef.afterClosed().subscribe(result => { + console.log('The dialog was closed'); + this.animal = result; + }); + } + + getResourceDictionaryByName(param) { + let popup; + this.selectedParam = param; + this.resourceMappingService.getResourceDictionaryByName(this.resorceDictionaryName) + .subscribe(dictionaryObj => { + popup = this.dialog.open(SearchDialog, { + width: '250px', + data: { name: dictionaryObj, animal: this.animal } + }) + }, + error => { + console.log(error); + }) + popup.afterClosed().subscribe(result=>{ + this.paramData.resourceAccumulatorResolvedData.forEach(element => { + if(element.id == this.selectedParam) { + // element. + } + }); + }); + } + +} diff --git a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/resource-mapping/resource-mapping.service.ts b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/resource-mapping/resource-mapping.service.ts new file mode 100644 index 000000000..a79b33b04 --- /dev/null +++ b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/resource-mapping/resource-mapping.service.ts @@ -0,0 +1,85 @@ +/* +============LICENSE_START========================================== +=================================================================== +Copyright (C) 2018 IBM Intellectual Property. All rights reserved. +=================================================================== + +Unless otherwise specified, all software contained herein is licensed +under the Apache License, Version 2.0 (the License); +you may not use this software except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +============LICENSE_END============================================ +*/ + + +import { Injectable } from '@angular/core'; +import { HttpClient } from '@angular/common/http'; +import { Observable, observable } from 'rxjs'; +import { ApiService } from '../../../../common/core/services/api.service'; + +@Injectable() +export class ResourceMappingService { + // blueprintUrl = '../../constants/blueprint.json'; + + constructor(private api: ApiService) { + } + + getResourceDictionaryByName(name) { + // return this.api.get(''); + + return new Observable((observer) => { + + // observable execution + observer.next({"name": "sample-input-source", + "dataType": "string", + "entrySchema": null, + "definition": { + "tags": "sample-input-source", + "name": "sample-input-source", + "property": { + "description": "name of the ", + "required": null, + "type": "string", + "status": null, + "constraints": null, + "value": null, + "default": null, + "entry_schema": null + }, + "updated-by": "brindasanth@onap.com", + "sources": { + "input": { + "description": null, + "type": "source-input", + "metadata": null, + "directives": null, + "properties": { + "key": "input-source" + }, + "attributes": null, + "capabilities": null, + "requirements": null, + "interfaces": null, + "artifacts": null, + "copy": null, + "node_filter": null + } + } + }, + "description": "name of the ", + "tags": "sample-input-source", + "creationDate": "2019-04-03T10:36:31.603Z", + "updatedBy": "brindasanth@onap.com"}) + observer.complete() + }); + } + +} \ No newline at end of file -- cgit 1.2.3-korg