diff options
Diffstat (limited to 'cds-ui')
4 files changed, 90 insertions, 64 deletions
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.html index 18ce515b5..96e4bda16 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.html +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.html @@ -74,7 +74,7 @@ data-tooltip="Preview"> <i class="fa fa-eye"></i> </a> - <a href="#" role="button" aria-pressed="true" class="btn-topology-action float tooltip-bottom" + <a (click)="downloadPackage()" role="button" aria-pressed="true" class="btn-topology-action float tooltip-bottom" data-tooltip="Download"> <i class="fa fa-download"></i> </a> @@ -348,4 +348,4 @@ </ng-sidebar> -</ng-sidebar-container>
\ No newline at end of file +</ng-sidebar-container> 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 f3dc2fc4a..0c70a497b 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,34 +25,35 @@ 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 { DesignerDashboardState } from './model/designer.dashboard.state'; -import { NgxUiLoaderService } from 'ngx-ui-loader'; +import {saveAs} from 'file-saver'; +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 {DesignerDashboardState} from './model/designer.dashboard.state'; +import {NgxUiLoaderService} from 'ngx-ui-loader'; @Component({ selector: 'app-designer', @@ -76,7 +77,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(); @@ -126,7 +127,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); @@ -172,7 +173,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); }); } @@ -235,7 +236,7 @@ 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 = []; @@ -489,14 +490,15 @@ export class DesignerComponent implements OnInit, OnDestroy { packageCreationModes.execute(this.cbaPackage, this.packageCreationUtils); this.filesData.push(this.folder.TREE_DATA); } + private enrichPackage() { this.create(); - this.zipFile.generateAsync({ type: 'blob' }) + this.zipFile.generateAsync({type: 'blob'}) .then(blob => { this.packageCreationService.enrichAndDeployPackage(blob).subscribe(response => { // this.packageCreationService.enrichPackage(blob).subscribe(response => { console.log('success'); - const blobInfo = new Blob([response], { type: 'application/octet-stream' }); + const blobInfo = new Blob([response], {type: 'application/octet-stream'}); this.packageCreationStore.clear(); this.packageCreationExtractionService.extractBlobToStore(blobInfo); this.toastService.success('Enriched & Deployed successfully '); @@ -526,22 +528,25 @@ export class DesignerComponent implements OnInit, OnDestroy { saveBluePrintToDataBase() { this.create(); - this.zipFile.generateAsync({ type: 'blob' }) + this.zipFile.generateAsync({type: 'blob'}) .then(blob => { - this.packageCreationService.savePackage(blob).subscribe( - bluePrintDetailModels => { - this.toastService.info('success updating the package'); - const id = bluePrintDetailModels.toString().split('id')[1].split(':')[1].split('"')[1]; - this.router.navigate(['/packages/designer/' + id]); - console.log('success'); - }, error => { - this.toastService.error('error happened when editing ' + error.message); - console.log('Error -' + error.message); - }, () => { - this.ngxService.stop(); - }); - }, err => { }, - () => { this.ngxService.stop(); }); + this.packageCreationService.savePackage(blob).subscribe( + bluePrintDetailModels => { + this.toastService.info('success updating the package'); + const id = bluePrintDetailModels.toString().split('id')[1].split(':')[1].split('"')[1]; + this.router.navigate(['/packages/designer/' + id]); + console.log('success'); + }, error => { + this.toastService.error('error happened when editing ' + error.message); + console.log('Error -' + error.message); + }, () => { + this.ngxService.stop(); + }); + }, err => { + }, + () => { + this.ngxService.stop(); + }); } openActionAttributes(customActionName: string) { @@ -561,11 +566,29 @@ export class DesignerComponent implements OnInit, OnDestroy { // console.log(this.designerState.template.workflows[this.currentActionName] // ['steps'][customFunctionName]['target']); this.designerStore.setCurrentFunction(this.designerState.template.workflows[this.currentActionName] - ['steps'][customFunctionName]['target']); + ['steps'][customFunctionName]['target']); } getTarget(stepname) { return this.designerState.template.workflows[this.currentActionName] - ['steps'][stepname]['target']; + ['steps'][stepname]['target']; + } + + downloadPackage() { + + this.ngxService.start(); + this.packageCreationService.downloadPackage(this.viewedPackage.artifactName + '/' + + this.viewedPackage.artifactVersion).subscribe(response => { + const blob = new Blob([response], {type: 'application/octet-stream'}); + saveAs(blob, this.viewedPackage.artifactName + '-' + this.viewedPackage.artifactVersion + '-CBA.zip'); + + }, err => { + this.toastService.error('package ' + this.viewedPackage.artifactName + 'has error when downloading' + + err.message); + this.ngxService.stop(); + }, () => { + this.toastService.success('package ' + this.viewedPackage.artifactName + 'downloaded successfully'); + this.ngxService.stop(); + }); } } diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.html index 0b03f4dde..ca88c6571 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.html +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.html @@ -8,11 +8,11 @@ <div class="card-footer row"> <div class="col text-center"> <a tourAnchor="create" routerLink="/packages/createPackage" role="button" aria-pressed="true" - class="btn-create-package float"><i class="icon-create-white" aria-hidden="true"></i>Create + class="btn-create-package float"><i class="icon-create-white" aria-hidden="true"></i>Create Package </a> - <br /> - <a data-target="#importPackageModal" data-toggle="modal" id="clone-btn" role="button" + <br/> + <a data-target="#importPackageModal" data-toggle="modal" id="clone-btn" role="button" aria-pressed="true" class="btn-import-package float"><i class="icon-import-blue" aria-hidden="true"></i>Import Package </a> @@ -28,7 +28,7 @@ <div class="row"> <div class="col-10 pr-0"> <a class="card-title" [routerLink]="['/packages/package', bluePrint.id]" - (click)="testDispatch(bluePrint)"> + (click)="testDispatch(bluePrint)"> <!-- <img class="icon-deployed" src="/assets/img/icon-deploy.svg"> --> <p class="packageName" tooltip="{{bluePrint.artifactName}}" placement="bottom"> {{bluePrint.artifactName}}</p> @@ -79,11 +79,12 @@ </p> <p class="mb-2">By {{bluePrint.updatedBy.split('<')[0]}}</p> <p class="package-desc" [delay]="300" tooltip="{{bluePrint.artifactDescription}}" - placement="bottom left">{{bluePrint.artifactDescription}}</p> + placement="bottom left">{{bluePrint.artifactDescription}}</p> + <p>{{bluePrint.tags}}</p> <ul class="package-contributers"> <li> <button type="button" class="border-fade" data-toggle="tooltip" data-placement="bottom" - title="User name"> + title="User name"> <img src="/assets/img/img-user1.jpeg"> </button> </li> @@ -108,10 +109,12 @@ <div class="col"> <button type="button" (click)="view(bluePrint.id)" class="btn btn-card-config"><i - class="icon-btn-card-config" aria-hidden="true"></i>Configuration</button> + class="icon-btn-card-config" aria-hidden="true"></i>Configuration + </button> </div> <div class="col"> - <button type="button" (click)="viewDesigner(bluePrint.id)" class="btn btn-card-topology"><i class="icon-btn-card-topology" + <button type="button" (click)="viewDesigner(bluePrint.id)" class="btn btn-card-topology"><i + class="icon-btn-card-topology" aria-hidden="true"></i>Designer Mode </button> </div> diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages.store.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages.store.ts index 1377d256a..1e52e31dd 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages.store.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages.store.ts @@ -19,13 +19,13 @@ limitations under the License. ============LICENSE_END============================================ */ -import { Injectable } from '@angular/core'; -import { BluePrintPage } from './model/BluePrint.model'; -import { Store } from '../../../common/core/stores/Store'; -import { PackagesApiService } from './packages-api.service'; -import { PackagesDashboardState } from './model/packages-dashboard.state'; -import { Observable, of } from 'rxjs'; -import { NgxUiLoaderService } from 'ngx-ui-loader'; +import {Injectable} from '@angular/core'; +import {BluePrintPage} from './model/BluePrint.model'; +import {Store} from '../../../common/core/stores/Store'; +import {PackagesApiService} from './packages-api.service'; +import {PackagesDashboardState} from './model/packages-dashboard.state'; +import {Observable, of} from 'rxjs'; +import {NgxUiLoaderService} from 'ngx-ui-loader'; @Injectable({ providedIn: 'root' @@ -154,7 +154,7 @@ export class PackagesStore extends Store<PackagesDashboardState> { tag = tag.replace(',', ''); } bluePrintModel.tags.split(',').forEach(bluePrintModelTag => { - if (bluePrintModelTag === tag) { + if (tag.includes(bluePrintModelTag.trim())) { this.bluePrintContent.content.push(bluePrintModel); } }); |