diff options
Diffstat (limited to 'cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard')
2 files changed, 104 insertions, 74 deletions
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.html index f79657af8..0ffd9cb5e 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.html +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.html @@ -2,7 +2,7 @@ <div class="new-wrapper"> <div class="container-fluid main-container"> - <header class="page-title" style="padding: 18px 30px 10px;"> + <header class="page-title" style="padding: 16px 30px 12px;"> <div class="row"> <h2 class="col m-0"> <ul class="breadcrumb-header"> @@ -13,53 +13,46 @@ </h2> <div class="col profile-help"> <nav class="navbar navbar-expand-lg navbar-light"> - <ul class="navbar-nav ml-auto"> - <li class="nav-item help-btn"> - <a class="nav-link mr-2" href="https://wiki.onap.org/display/DW/CDS+Designer+Guide" target="_blank" [delay]="300" - tooltip="Help" placement="bottom"><i class="icon-info" aria-hidden="true"></i></a> - </li> - <div class="nav-item dropdown"> - <input class="dropdown-toggle" type="text"> - <div class="dropdown-text"><img src="../assets/img/img-user.jpeg" align="right"></div> - <ul class="dropdown-content"> - <li> - <a href="#">Username</a> - </li> - <li> - <a href="#">Settings</a> - </li> - <li> - <a href="#">Projects</a> - </li> - <li> - <a href="#">Log out</a> - </li> - </ul> - </div> - <!-- <li class="nav-item dropdown"> - <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> - Dropdown - </a> - <div class="dropdown-menu" aria-labelledby="navbarDropdown"> - <a class="dropdown-item" href="#">Action</a> - <a class="dropdown-item" href="#">Another action</a> - <div class="dropdown-divider"></div> - <a class="dropdown-item" href="#">Something else here</a> - </div> + <ul class="navbar-nav ml-auto"> + <!-- <li class="nav-item help-btn"> + <a class="nav-link mr-2" href="https://wiki.onap.org/display/DW/CDS+Designer+Guide" target="_blank" + [delay]="300" tooltip="Help" placement="bottom"><i class="icon-info" aria-hidden="true"></i></a> + </li> --> + <!--Help Menu--> + <div class="nav-item dropdown helpMenu"> + <input class="dropdown-toggle" type="text"> + <div class="dropdown-text"><i class="icon-info" aria-hidden="true"></i></div> + <ul class="dropdown-content"> + <!-- <li> + <i class="icon-get_started" aria-hidden="true"></i> + <p> + <input id="clicker3" [checked]="startTour" type="checkbox" /> + <label for="clicker"> + Getting Started + <span>Quick steps to help you get started</span> + </label> + </p> </li> --> + <li> + <a href="https://wiki.onap.org/display/DW/CDS+Designer+Guide" target="_blank"> + <i class="icon-user_guide" aria-hidden="true"></i> + <p> + Tutorials + <span>CDS Designer's User Guide</span> + </p> + </a> + </li> </ul> - </nav> - <!-- <ul class="menu-dropdown userProfile"> - <li><button type="button" class="btn package-info-btn" data-toggle="modal" - data-target="#exampleModalLong"> - <i class="icon-info" aria-hidden="true"></i> - </button></li> - <li> - <div class="dropdown"> + </div> + <!--User Menu--> + <div class="nav-item dropdown userMenu"> <input class="dropdown-toggle" type="text"> - <div class="dropdown-text">User name</div> + <div class="dropdown-text"><img src="../assets/img/img-user.jpeg" align="right"></div> <ul class="dropdown-content"> <li> + <a href="#">Username</a> + </li> + <li> <a href="#">Settings</a> </li> <li> @@ -70,9 +63,10 @@ </li> </ul> </div> - </li> - </ul> --> - </div> + + </ul> + </nav> + </div> </div> </header> @@ -761,9 +755,9 @@ </nav> <div class="row mt-4"> <div class="col"> - <div class="tab-content" id="nav-tabContent"> + <div class="tab-content" id="nav-tabContent" (change)="clickEvent()"> <div class="tab-pane fade show active" id="nav-metadata" role="tabpanel" - aria-labelledby="nav-metadata-tab" (change)="clickEvent()"> + aria-labelledby="nav-metadata-tab" > <app-metadata-tab></app-metadata-tab> </div> <div class="tab-pane fade" id="nav-template" role="tabpanel" diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.ts index 47e89b39a..029601d67 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.ts @@ -70,6 +70,7 @@ export class ConfigurationDashboardComponent implements OnInit { } } else { this.metadataClasses = this.metadataClasses.replace('complete', ''); + this.isSaveEnabled = false; } }); @@ -92,27 +93,32 @@ export class ConfigurationDashboardComponent implements OnInit { bluePrintDetailModels[0].artifactName + '/' + bluePrintDetailModels[0].artifactVersion).subscribe(response => { const blob = new Blob([response], {type: 'application/octet-stream'}); this.currentBlob = blob; - this.zipFile.loadAsync(blob).then((zip) => { - Object.keys(zip.files).forEach((filename) => { - zip.files[filename].async('string').then((fileData) => { - if (fileData) { - if (filename.includes('Scripts/')) { - this.setScripts(filename, fileData); - } else if (filename.includes('Templates/')) { - if (filename.includes('-mapping.')) { - this.setMapping(filename, fileData); - } else if (filename.includes('-template.')) { - this.setTemplates(filename, fileData); - } - - } else if (filename.includes('Definitions/')) { - this.setImports(filename, fileData, bluePrintDetailModels); - } else if (filename.includes('TOSCA-Metadata/')) { - const metaDataTabInfo: MetaDataTabModel = this.getMetaDataTabInfo(fileData); - this.setMetaData(metaDataTabInfo, bluePrintDetailModels[0]); + this.extractBlobToStore(blob, bluePrintDetailModels); + }); + } + + private extractBlobToStore(blob: Blob, bluePrintDetailModels: BluePrintDetailModel) { + this.zipFile.loadAsync(blob).then((zip) => { + Object.keys(zip.files).forEach((filename) => { + zip.files[filename].async('string').then((fileData) => { + console.log(filename); + if (fileData) { + if (filename.includes('Scripts/')) { + this.setScripts(filename, fileData); + } else if (filename.includes('Templates/')) { + if (filename.includes('-mapping.')) { + this.setMapping(filename, fileData); + } else if (filename.includes('-template.')) { + this.setTemplates(filename, fileData); } + + } else if (filename.includes('Definitions/')) { + this.setImports(filename, fileData, bluePrintDetailModels); + } else if (filename.includes('TOSCA-Metadata/')) { + const metaDataTabInfo: MetaDataTabModel = this.getMetaDataTabInfo(fileData); + this.setMetaData(metaDataTabInfo, bluePrintDetailModels[0]); } - }); + } }); }); }); @@ -239,8 +245,9 @@ export class ConfigurationDashboardComponent implements OnInit { } deployCurrentPackage() { - console.log('happened'); - this.router.navigate(['/packages']); + this.collectZipFileFromStore(); + this.deployPackage(); + } goToDesignerMode(id) { @@ -266,19 +273,21 @@ export class ConfigurationDashboardComponent implements OnInit { enrichBluePrint() { + this.collectZipFileFromStore(); + this.enrichPackage(); + } + + private collectZipFileFromStore() { this.packageCreationStore.state$.subscribe( cbaPackage => { FilesContent.clear(); console.log(cbaPackage); - let packageCreationModes: PackageCreationModes; cbaPackage = PackageCreationModes.mapModeType(cbaPackage); cbaPackage.metaData = PackageCreationModes.setEntryPoint(cbaPackage.metaData); packageCreationModes = PackageCreationBuilder.getCreationMode(cbaPackage); packageCreationModes.execute(cbaPackage, this.packageCreationUtils); this.filesData.push(this.folder.TREE_DATA); - this.enrichPackage(); - }); } @@ -289,8 +298,18 @@ export class ConfigurationDashboardComponent implements OnInit { this.packageCreationStore.enrichBluePrint(blob).subscribe(response => { console.log('success'); const blobInfo = new Blob([response], {type: 'application/octet-stream'}); - saveAs(blobInfo, 'test' + '-' + '1.0.0' + '-CBA.zip'); - this.toastService.info('enriched successfully '); + this.configurationDashboardService.getPagedPackages(this.id).subscribe( + (bluePrintDetailModels) => { + if (bluePrintDetailModels) { + this.packageCreationStore.clear(); + this.extractBlobToStore(blob, bluePrintDetailModels); + this.isSaveEnabled = true; + this.toastService.info('enriched successfully '); + } + }); + + // saveAs(blobInfo, 'test' + '-' + '1.0.0' + '-CBA.zip'); + }); }, error => { this.toastService.error('error happened when editing ' + error.message); @@ -298,6 +317,23 @@ export class ConfigurationDashboardComponent implements OnInit { }); } + private deployPackage() { + this.create(); + this.zipFile.generateAsync({type: 'blob'}) + .then(blob => { + this.packageCreationStore.deployBluePrint(blob).subscribe(response => { + console.log('success'); + console.log(response); + + // saveAs(blobInfo, 'test' + '-' + '1.0.0' + '-CBA.zip'); + + }); + }, error => { + this.toastService.error('error happened when deploying ' + error.message); + console.log('Error -' + error.message); + }); + } + clickEvent() { this.isSaveEnabled = true; } |