summaryrefslogtreecommitdiffstats
path: root/cds-ui/client
diff options
context:
space:
mode:
authorDan Timoney <dtimoney@att.com>2019-04-06 00:25:09 +0000
committerGerrit Code Review <gerrit@onap.org>2019-04-06 00:25:09 +0000
commit782e55f79b7fca957e0ef393c50f72daab3a7b59 (patch)
treeb856226542e16fb6742e6b72356c362a17b36cfe /cds-ui/client
parent8d11b20693f7eedfff5c2ea47a3fd6017ce5adf7 (diff)
parent1b2d71d30ec8c92c50eabb2b163ec9cc9640d61a (diff)
Merge "CBA integration"
Diffstat (limited to 'cds-ui/client')
-rw-r--r--cds-ui/client/package.json1
-rw-r--r--cds-ui/client/src/app/common/constants/app-constants.ts40
-rw-r--r--cds-ui/client/src/app/common/core/services/api.service.ts42
-rw-r--r--cds-ui/client/src/app/common/shared/components/search-dialog/search-dialog.component.ts51
-rw-r--r--cds-ui/client/src/app/common/shared/components/search-dialog/search-dialog.html29
-rw-r--r--cds-ui/client/src/app/common/shared/shared.module.ts18
-rw-r--r--cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.html24
-rw-r--r--cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.scss58
-rw-r--r--cds-ui/client/src/app/feature-modules/blueprint/modify-template/editor/editor.component.ts169
-rw-r--r--cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.html32
-rw-r--r--cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.ts19
-rw-r--r--cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.module.ts12
-rw-r--r--cds-ui/client/src/app/feature-modules/blueprint/modify-template/resource-mapping/resource-mapping.component.html166
-rw-r--r--cds-ui/client/src/app/feature-modules/blueprint/modify-template/resource-mapping/resource-mapping.component.scss24
-rw-r--r--cds-ui/client/src/app/feature-modules/blueprint/modify-template/resource-mapping/resource-mapping.component.spec.ts46
-rw-r--r--cds-ui/client/src/app/feature-modules/blueprint/modify-template/resource-mapping/resource-mapping.component.ts80
-rw-r--r--cds-ui/client/src/app/feature-modules/blueprint/modify-template/resource-mapping/resource-mapping.service.ts85
17 files changed, 809 insertions, 87 deletions
diff --git a/cds-ui/client/package.json b/cds-ui/client/package.json
index 04dd30861..2e19d29fe 100644
--- a/cds-ui/client/package.json
+++ b/cds-ui/client/package.json
@@ -31,6 +31,7 @@
"ang-jsoneditor": "1.6.1",
"core-js": "^2.5.4",
"d3": "^5.9.1",
+ "bootstrap": "^4.3.1",
"file-saver": "^2.0.1",
"font-awesome": "^4.7.0",
"hammerjs": "^2.0.8",
diff --git a/cds-ui/client/src/app/common/constants/app-constants.ts b/cds-ui/client/src/app/common/constants/app-constants.ts
index 0efabebf5..0bfe5cade 100644
--- a/cds-ui/client/src/app/common/constants/app-constants.ts
+++ b/cds-ui/client/src/app/common/constants/app-constants.ts
@@ -31,7 +31,7 @@ export const GlobalContants = {
// }
// }
cbawizard: {
- stepsRequired:
+ stepsRequired:
{
stepCount: 4,
steps: [{
@@ -69,26 +69,30 @@ export const GlobalContants = {
}
},
datadictionary: {
- stepsRequired:
+ stepsRequired:
{
stepCount: 3,
steps: [{
- name: 'Resource Creation', componentURL: '/dataDictionary/selectTemplate',
- label: 'Resource Creation',
- component: 'ResourceCreationComponent'
+ name: 'Resource Creation', componentURL: '/dataDictionary/selectTemplate',
+ label: 'Resource Creation',
+ component: 'ResourceCreationComponent'
- },
- {
- name: 'Edit/Validate', componentURL: '/dataDictionary/modifyTemplate',
- label: 'Edit/Validate',
- component: 'ResourceEditComponent'
- },
- {
- name: 'Save', componentURL: '/dataDictionary/saveTemplate',
- label: 'Save Resource',
- component: 'SaveResourceComponent'
- }]
- }
+ },
+ {
+ name: 'Edit/Validate', componentURL: '/dataDictionary/modifyTemplate',
+ label: 'Edit/Validate',
+ component: 'ResourceEditComponent'
+ },
+ {
+ name: 'Save', componentURL: '/dataDictionary/saveTemplate',
+ label: 'Save Resource',
+ component: 'SaveResourceComponent'
+ }]
+ }
}
-}; \ No newline at end of file
+};
+export const LoopbackConfig = {
+ url: "http://127.0.0.1:3000",
+ authtoken: "ccsdkapps"
+} \ No newline at end of file
diff --git a/cds-ui/client/src/app/common/core/services/api.service.ts b/cds-ui/client/src/app/common/core/services/api.service.ts
index 0ee3c6a78..20d8a9bce 100644
--- a/cds-ui/client/src/app/common/core/services/api.service.ts
+++ b/cds-ui/client/src/app/common/core/services/api.service.ts
@@ -20,33 +20,55 @@ limitations under the License.
*/
+
import { Injectable } from '@angular/core';
-import { HttpClient } from '@angular/common/http';
+import { HttpClient, HttpHeaders, HttpResponse, HttpHeaderResponse } from '@angular/common/http';
import { Observable } from 'rxjs';
-
-//import { IBlueprintHttp } from '../store/models/blueprint-http.model';
+import { LoopbackConfig } from '../../constants/app-constants';
@Injectable()
export class ApiService {
- // blueprintUrl = '../../constants/blueprint.json';
-
+
constructor(private _http: HttpClient) {
}
+ enrich(uri: string, body: FormData): Observable<any> {
+
+ var HTTPOptions = {
+ headers: new HttpHeaders({ 'Accept': 'application/zip', }),
+ observe: "response" as 'body',// to display the full response & as 'body' for type cast
+ 'responseType': 'blob' as 'json'
+ }
+ return this._http.post(LoopbackConfig.url + uri, body, HTTPOptions);
+
+ }
+ downloadCBA(uri: string, params?: any): Observable<Blob> {
+ // return this._http.get<Blob>(LoopbackConfig.url+uri);
+ var HTTPOptions = {
+ headers: new HttpHeaders({ 'Accept': 'application/zip; charset=UTF-8', }),
+ observe: "response" as 'body',// to display the full response & as 'body' for type cast
+ 'responseType': 'blob' as 'json'
+ }
+ return this._http.get<Blob>(LoopbackConfig.url + uri, HTTPOptions);
- get(url: string, params?: any): Observable<any> {
- return this._http.get(url);
}
- post() {
+ post(uri: string, body: FormData): Observable<any> {
// to do
+ const httpOptions = {
+ headers: new HttpHeaders({
+ 'Authorization': LoopbackConfig.authtoken,
+
+ })
+ };
+ return this._http.post(LoopbackConfig.url + uri, body, httpOptions);
}
put() {
- // to do
+ // to do
}
delete() {
- // to do
+ // to do
}
} \ No newline at end of file
diff --git a/cds-ui/client/src/app/common/shared/components/search-dialog/search-dialog.component.ts b/cds-ui/client/src/app/common/shared/components/search-dialog/search-dialog.component.ts
new file mode 100644
index 000000000..e20b7cbd3
--- /dev/null
+++ b/cds-ui/client/src/app/common/shared/components/search-dialog/search-dialog.component.ts
@@ -0,0 +1,51 @@
+/*
+============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, Inject, Output, EventEmitter} from '@angular/core';
+import {MatDialog, MatDialogRef, MAT_DIALOG_DATA} from '@angular/material';
+
+export interface DialogData {
+ animal: string;
+ name: string;
+ }
+
+@Component({
+ selector: 'search-dialog',
+ templateUrl: 'search-dialog.html',
+ })
+ export class SearchDialog {
+ @Output() searchEvent = new EventEmitter();
+
+ constructor(
+ public dialogRef: MatDialogRef<SearchDialog>,
+ @Inject(MAT_DIALOG_DATA) public data: DialogData) {}
+
+ onNoClick(): void {
+ this.dialogRef.close();
+ this.dialogRef.keydownEvents
+ }
+
+ search() {
+ this.searchEvent.emit();
+ }
+
+
+ } \ No newline at end of file
diff --git a/cds-ui/client/src/app/common/shared/components/search-dialog/search-dialog.html b/cds-ui/client/src/app/common/shared/components/search-dialog/search-dialog.html
new file mode 100644
index 000000000..c6c41bf68
--- /dev/null
+++ b/cds-ui/client/src/app/common/shared/components/search-dialog/search-dialog.html
@@ -0,0 +1,29 @@
+<!--
+============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============================================
+-->
+
+
+<h1 mat-dialog-title>Resouce Dictionary</h1>
+<div mat-dialog-content>
+ <button [mat-dialog-close]="data.name">{{data.name.name}}</button>
+</div>
+<div mat-dialog-actions>
+ <button mat-button (click)="onNoClick()">Cancel</button>
+</div> \ No newline at end of file
diff --git a/cds-ui/client/src/app/common/shared/shared.module.ts b/cds-ui/client/src/app/common/shared/shared.module.ts
index 8db020d52..6ca5b13a5 100644
--- a/cds-ui/client/src/app/common/shared/shared.module.ts
+++ b/cds-ui/client/src/app/common/shared/shared.module.ts
@@ -20,26 +20,33 @@ limitations under the License.
*/
import { NgModule } from '@angular/core';
+import { FormsModule } from '@angular/forms';
import { CommonModule } from '@angular/common';
import { HomeComponent } from './components/home/home.component';
import { CBAWizardComponent } from './components/cbawizard/cbawizard.component';
import { MatToolbarModule,MatIconModule, MatButtonModule, MatSidenavModule, MatListModule, MatGridListModule, MatCardModule, MatMenuModule, MatTableModule, MatPaginatorModule, MatSortModule, MatInputModule, MatSelectModule, MatRadioModule, MatFormFieldModule, MatStepperModule} from '@angular/material';
import { RouterModule } from "@angular/router";
import { SearchPipe } from './pipes/search.pipe';
+import { SearchDialog } from './components/search-dialog/search-dialog.component';
+import { AppMaterialModule } from '../modules/app-material.module';
@NgModule({
declarations: [
HomeComponent,
CBAWizardComponent,
- SearchPipe
-
+ SearchPipe,
+ SearchDialog
+
],
exports: [
HomeComponent,
CBAWizardComponent,
- SearchPipe
+ SearchPipe,
+ SearchDialog
],
imports: [
+ AppMaterialModule,
+ FormsModule,
CommonModule,
MatToolbarModule,
MatButtonModule,
@@ -58,6 +65,7 @@ import { SearchPipe } from './pipes/search.pipe';
MatFormFieldModule,
MatStepperModule,
RouterModule
- ]
+ ],
+ entryComponents: [SearchDialog]
})
-export class SharedModule { }
+export class SharedModule { } \ No newline at end of file
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============================================ -->
-<div class="container">
+<div class="containerDiv">
<div class="fileViewContainer">
<!-- <div style="width:inherit; height: inherit; position: fixed;z-index: 1; background-color: rgb(0,0,0);background-color: rgba(0,0,0,0.4);"></div> -->
<div style="display: flex;">
<div>
- <i class="fa fa-folder delete-add-file" aria-hidden="true" [ngClass] ="{'fa-disabled': selectedFileObj.type == 'file' || selectedFileObj.type == ''}" (click)="enableNameInputEl('createFolder')"></i>
- <i class="fa fa-file add-file" aria-hidden="true" [ngClass] ="{'fa-disabled' : selectedFileObj.type == 'file' ||selectedFileObj.type == ''}" (click)="enableNameInputEl('createFile')"></i>
- <i class="fa fa-trash delete-add-file" aria-hidden="true" [ngClass] ="{'fa-disabled' : selectedFileObj.type == ''}" (click)="deleteFolderOrFile('deleteFile')"></i>
+ <i class="fa fa-folder delete-add-file" aria-hidden="true" [ngClass]="{'fa-disabled': selectedFileObj.type == 'file' || selectedFileObj.type == ''}" (click)="enableNameInputEl('createFolder')"></i>
+ <i class="fa fa-file add-file" aria-hidden="true" [ngClass]="{'fa-disabled' : selectedFileObj.type == 'file' ||selectedFileObj.type == ''}" (click)="enableNameInputEl('createFile')"></i>
+ <i class="fa fa-trash delete-add-file" aria-hidden="true" [ngClass]="{'fa-disabled' : selectedFileObj.type == ''}" (click)="deleteFolderOrFile('deleteFile')"></i>
</div>
<div>
- <input *ngIf="isNameTextboxEnablled" type="text" (focusout)="createFolderOrFile($event)"/>
+ <input *ngIf="isNameTextboxEnablled" type="text" (focusout)="createFolderOrFile($event)" />
</div>
</div>
<mat-tree [dataSource]="dataSource" [treeControl]="treeControl" style="background-color: #ebebeb">
@@ -47,7 +47,17 @@ limitations under the License.
</mat-tree>
</div>
<div class="editorConatiner">
- <i class="fa fa-save save-icon" style="font-size:24px" (click)="updateBlueprint()"></i>
- <ace-editor [(text)]="text" [(mode)]="mode" #editor class="aceEditor"></ace-editor>
+ <!-- <i class="fa fa-save save-icon" style="font-size:24px" (click)="updateBlueprint()"></i>
+ <ace-editor [(text)]="text" [(mode)]="mode" #editor class="aceEditor"></ace-editor> -->
+ <div class="normal-editor-mode" [ngClass]="{ 'resource-mapping-mode': viewTemplateMode}">
+ <i class="fa fa-save save-icon" style="font-size:24px" (click)="updateBlueprint()"></i>
+ <ace-editor [(text)]="text" [(mode)]="mode" #editor class="aceEditor"></ace-editor>
+ </div>
+ <button *ngIf="viewTemplateMode" class="btn-active" (click)="loadConfigParams()">Load Config Parameters</button>
+ <button *ngIf="viewTemplateMode" class="btn-active">Auto Map to Data dictionary</button>
+ <div style="height: 50%;overflow: scroll" *ngIf="viewTemplateMode">
+ <app-resource-mapping [paramData]="paramData"></app-resource-mapping>
+ </div>
</div>
+
</div> \ 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<IAppState>) {
+ constructor(private store: Store<IAppState>, 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 = <any>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.
-->
<div class="modifyTemp">
- <app-designer *ngIf="designerMode" (onNodeSelect)="on = !on; viewNodeDetails($event)"></app-designer>
- <app-editor class="editor-selector" *ngIf="editorMode"></app-editor>
+ <app-designer *ngIf="designerMode" (onNodeSelect)="on = !on; viewNodeDetails($event)"></app-designer>
+ <app-editor class="editor-selector" *ngIf="editorMode"></app-editor>
</div>
<div style="display: flex;flex-direction: row">
<div style="width: 30em;">
- <button class="btn-active" (click) ="changeView()">{{viewText}}</button>
+ <button class="btn-active" (click)="changeView()">{{viewText}}</button>
</div>
- <div style="width: 16em">
+ <div style="width: 16em">
</div>
<div style="width: 100%;height: 3em;">
- <div style="display: flex;flex-direction: row-reverse">
- <button class="btn-active" (click)="downloadCBA()">Download</button>
- <button class="mat-button-active" mat-button [matMenuTriggerFor]="menu">Deploy</button>
- <mat-menu #menu="matMenu">
- <button mat-menu-item>Deploy</button>
- <button mat-menu-item>Test</button>
- </mat-menu>
- <button [disabled]="!isEnriched" class="btn-active">Publish</button>
- <button class="btn-active">Save</button>
- <button class="btn-active">Enrich</button>
-
+ <div style="display: flex;flex-direction: row-reverse">
+ <button class="btn-active" (click)="downloadCBA()">Download</button>
+ <button class="mat-button-active" mat-button [matMenuTriggerFor]="menu">Deploy</button>
+ <mat-menu #menu="matMenu">
+ <button mat-menu-item (click)="saveToBlueprintProcessor()">Deploy</button>
+ <button mat-menu-item (click)="processBlueprint()">Test</button>
+ </mat-menu>
+ <button [disabled]="!isEnriched" class="btn-active" (click)="publishToControllerBlueprint()">Publish</button>
+ <button class="btn-active" (click)="saveToControllerBlueprint()">Save</button>
+ <button class="btn-active" (click)="getEnriched()">Enrich</button>
+
</div>
</div>
- </div> \ No newline at end of file
+</div> \ 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 @@
+<!--
+============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============================================
+-->
+<div>
+ <table class="table table-bordered table-condensed" style="margin: 1em; background: white">
+ <thead style="background-color: #3f51b5; color: white;line-height: 26px;font: 400 13.3333px Arial;">
+ <tr class="success">
+ <th>Required</th>
+ <th>Template Input</th>
+ <th>Parameter Name</th>
+ <th>Dictionary Name</th>
+ <th>Dictionary Source</th>
+ <th>Default</th>
+ <th>Data Type</th>
+ <th>Entry Schema</th>
+ <th>Dependency Mapping</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr *ngFor="let param of paramData.resourceAccumulatorResolvedData">
+ <td>
+ <input type="checkbox" />
+ </td>
+ <td>
+ <input type="text" />
+ </td>
+ <td>{{param["param-value"]}}</td>
+ <td>
+ <input type="text" style="width: 80%" [(ngModel)]="resorceDictionaryName" />
+ <i class="fa fa-search" style="margin-left: 1em" aria-hidden="true"></i>
+ </td>
+ <td>
+ <select>
+ <option value="volvo">Input</option>
+ <option value="saab">Output</option>
+ </select>
+ </td>
+ <td>
+ <input type="text" />
+ </td>
+ <td>
+ <input type="text" />
+ </td>
+ <td>
+ <input type="text" />
+ </td>
+ <td>
+ <input type="text" />
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <input type="checkbox" />
+ </td>
+ <td>
+ <input type="text" />
+ </td>
+ <td>Name</td>
+ <td>
+ <input type="text" />
+ <i class="fa fa-search" aria-hidden="true"></i>
+ </td>
+ <td>
+ <select>
+ <option value="volvo">Input</option>
+ <option value="saab">Output</option>
+ </select>
+ </td>
+ <td>
+ <input type="text" />
+ </td>
+ <td>
+ <input type="text" />
+ </td>
+ <td>
+ <input type="text" />
+ </td>
+ <td>
+ <input type="text" />
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <input type="checkbox" />
+ </td>
+ <td>
+ <input type="text" />
+ </td>
+ <td>Name</td>
+ <td>
+ <input type="text" />
+ <i class="fa fa-search" aria-hidden="true"></i>
+ </td>
+ <td>
+ <select>
+ <option value="volvo">Input</option>
+ <option value="saab">Output</option>
+ </select>
+ </td>
+ <td>
+ <input type="text" />
+ </td>
+ <td>
+ <input type="text" />
+ </td>
+ <td>
+ <input type="text" />
+ </td>
+ <td>
+ <input type="text" />
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <input type="checkbox" />
+ </td>
+ <td>
+ <input type="text" />
+ </td>
+ <td>Name</td>
+ <td>
+ <input type="text" />
+ <i class="fa fa-search" aria-hidden="true"></i>
+ </td>
+ <td>
+ <select>
+ <option value="volvo">Input</option>
+ <option value="saab">Output</option>
+ </select>
+ </td>
+ <td>
+ <input type="text" />
+ </td>
+ <td>
+ <input type="text" />
+ </td>
+ <td>
+ <input type="text" />
+ </td>
+ <td>
+ <input type="text" />
+ </td>
+ </tr>
+ </tbody>
+ </table>
+</div> \ 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<ResourceMappingComponent>;
+
+ 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