diff options
Diffstat (limited to 'cds-ui')
12 files changed, 181 insertions, 95 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 0cd56732d..bb7647449 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 @@ -1,4 +1,3 @@ - <app-header></app-header> <div class="new-wrapper"> @@ -7,12 +6,13 @@ <div class="row"> <h2 class="col m-0"> <ul class="breadcrumb-header"> - <li>CBA Packages</li> + <li><a routerLink="/packages">CBA Packages</a></li> <li>Package Name</li> </ul> </h2> <div class="col d-flex justify-content-end header-button-save"> - <button class="float btn btn-sm btn-outline-secondary" (click)="goBacktoDashboard()" >Discard Changes</button> + <button class="float btn btn-sm btn-outline-secondary" (click)="goBacktoDashboard()">Discard + Changes</button> <button class="float btn btn-sm btn-primary" (click)="editBluePrint()">Apply Changes</button> </div> </div> @@ -23,7 +23,7 @@ <div class="container-fluid body-container"> <div class="container"> - <!-- <div class="creat-action-container"> + <!-- <div class="creat-action-container"> <a href="#" class="action-button"> <i class="icon-clone" aria-hidden="true"></i> <span>Clone</span> @@ -54,7 +54,8 @@ <i class="icon-deploy"></i> </div> <div class="col-12 package-description"> - Last modified {{ viewedPackage.createdDate | date:'short' }} By {{viewedPackage.updatedBy}} + Last modified {{ viewedPackage.createdDate | date:'short' }} By + {{viewedPackage.updatedBy}} </div> </div> @@ -63,8 +64,11 @@ </div> </div> <div class="col-4 package-view-button"> - <button class="btn btn-sm btn-outline-secondary" (click)="deployCurrentPackage()"><i class="fa fa-play-circle"></i> Deploy</button> - <button class="btn btn-sm btn-outline-secondary" (click)="downloadPackage(viewedPackage.artifactName,viewedPackage.artifactVersion)"><i class="fa"></i> Download</button> + <button class="btn btn-sm btn-outline-secondary" (click)="deployCurrentPackage()"><i + class="fa fa-play-circle"></i> Deploy</button> + <button class="btn btn-sm btn-outline-secondary" + (click)="downloadPackage(viewedPackage.artifactName,viewedPackage.artifactVersion)"><i + class="fa"></i> Download</button> <button class="btn btn-sm btn-primary">Designer Mode</button> </div> @@ -77,22 +81,17 @@ <div class="col"> <div class="nav nav-tabs " id="nav-tab" role="tablist"> <a class="nav-item nav-link active" 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">IMPORTS</a> + role="tab" aria-controls="nav-imports" aria-selected="false">IMPORTS</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> </div> @@ -101,24 +100,24 @@ <div class="col"> <div class="tab-content" id="nav-tabContent"> <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"> <div class="card creat-card"> <div class="editor-container"> <app-dsl-definitions-tab></app-dsl-definitions-tab> @@ -131,5 +130,4 @@ </div> </div> </div> -</div> - +</div>
\ No newline at end of file diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.html index 63d392e35..d80ed16b2 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.html +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.html @@ -5,7 +5,7 @@ <a class="enter-link" href="#"><i class="icon-enter"></i></a> </div> <span class="import-container-span">Or you can also <a href="#" data-toggle="modal" - data-target="#exampleModal">Import File</a></span> + data-target="#importModal">Import File</a></span> </div> @@ -82,12 +82,12 @@ </div> -<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" +<div class="modal fade" id="importModal" tabindex="-1" role="dialog" aria-labelledby="importModalLabel" aria-hidden="true"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> - <h5 class="modal-title" id="exampleModalLabel">Import File</h5> + <h5 class="modal-title" id="importModalLabel">Import File</h5> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">×</span> </button> diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.component.html index af5ed4f21..67beca2a1 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.component.html +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.component.html @@ -6,12 +6,13 @@ <div class="row"> <h2 class="col m-0"> <ul class="breadcrumb-header"> - <li>CBA Packages</li> + <li><a routerLink="/packages">CBA Packages</a></li> <li>Package Name</li> </ul> </h2> <div class="col d-flex justify-content-end header-button-save"> - <button class="float btn btn-sm btn-outline-secondary" (click)="goBackToDashBorad()" >Discard Changes</button> + <button class="float btn btn-sm btn-outline-secondary" (click)="goBackToDashBorad()">Discard + Changes</button> <button class="float btn btn-sm btn-primary" (click)="saveBluePrint()">Save</button> </div> </div> @@ -44,22 +45,17 @@ <div class="col"> <div class="nav nav-tabs " id="nav-tab" role="tablist"> <a class="nav-item nav-link active" id="nav-metadata-tab" data-toggle="tab" - href="#nav-metadata" - role="tab" aria-controls="nav-metadata" - aria-selected="false" autofocus #nameit (focusout)="test()">METADATA</a> + href="#nav-metadata" role="tab" aria-controls="nav-metadata" aria-selected="false" + autofocus #nameit (focusout)="test()">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">IMPORTS</a> + role="tab" aria-controls="nav-imports" aria-selected="false">IMPORTS</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> </div> @@ -68,24 +64,24 @@ <div class="col"> <div class="tab-content" id="nav-tabContent"> <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"> <div class="card creat-card"> <div class="editor-container"> <app-dsl-definitions-tab></app-dsl-definitions-tab> @@ -98,4 +94,4 @@ </div> </div> </div> -</div> +</div>
\ No newline at end of file diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.store.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.store.ts index b2268f060..0808223cd 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.store.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.store.ts @@ -19,15 +19,15 @@ limitations under the License. ============LICENSE_END============================================ */ -import {Injectable} from '@angular/core'; +import { Injectable } from '@angular/core'; -import {Store} from '../../../../common/core/stores/Store'; +import { Store } from '../../../../common/core/stores/Store'; -import {CBAPackage, DslDefinition} from './mapping-models/CBAPacakge.model'; -import {PackageCreationService} from './package-creation.service'; -import {MetaDataTabModel} from './mapping-models/metadata/MetaDataTab.model'; -import {Observable} from 'rxjs'; -import {ResourceDictionary} from './mapping-models/ResourceDictionary.model'; +import { CBAPackage, DslDefinition } from './mapping-models/CBAPacakge.model'; +import { PackageCreationService } from './package-creation.service'; +import { MetaDataTabModel } from './mapping-models/metadata/MetaDataTab.model'; +import { Observable } from 'rxjs'; +import { ResourceDictionary } from './mapping-models/ResourceDictionary.model'; @Injectable({ @@ -73,7 +73,6 @@ export class PackageCreationStore extends Store<CBAPackage> { } addScripts(name: string, content: string) { - this.setState({ ...this.state, scripts: this.state.scripts.setScripts(name, content) @@ -110,4 +109,8 @@ export class PackageCreationStore extends Store<CBAPackage> { getTemplateAndMapping(variables: string[]): Observable<ResourceDictionary[]> { return this.packageCreationService.getTemplateAndMapping(variables); } + + clear() { + this.setState(new CBAPackage()); + } } diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/scripts-tab/scripts-tab.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/scripts-tab/scripts-tab.component.html index 54491488e..8d1894c57 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/scripts-tab/scripts-tab.component.html +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/scripts-tab/scripts-tab.component.html @@ -30,9 +30,9 @@ <div [attr.aria-labelledby]="'head-script-'+mapIndex" [id]="'id-script-'+mapIndex" class="collapse" data-parent="#accordion-script"> <div class="card-body"> - <ace-editor [(text)]="file.value" (textChange)="textChanges($event,file.key)" [mode]="'kotlin'" [autoUpdateContent]="true" - [durationBeforeCallback]="1000" [theme]="'tomorrow_night_bright'" #editor - style="height:300px;"> + <ace-editor [(text)]="file.value" (textChange)="textChanges($event,file.key)" [mode]="'kotlin'" + [autoUpdateContent]="true" [durationBeforeCallback]="1000" [theme]="'tomorrow_night_bright'" + #editor style="height:300px;"> </ace-editor> </div> </div> @@ -54,7 +54,7 @@ </button> </div> <div class="modal-body"> - <ngx-file-drop accept=".kt" (onFileDrop)="dropped($event)" (onFileLeave)="fileLeave($event)" + <ngx-file-drop accept=".kt,.py" (onFileDrop)="dropped($event)" (onFileLeave)="fileLeave($event)" (onFileOver)="fileOver($event)" dropZoneLabel="Drop files here"> <ng-template let-openFileSelector="openFileSelector" ngx-file-drop-content-tmp> <div class="folder-upload"> @@ -68,7 +68,7 @@ Files </button> </div> - <div class="folder-upload-type">Allowed file type: Kotlin(Kt)</div> + <div class="folder-upload-type">Allowed file type: Kotlin(kt), Python(py)</div> </ng-template> </ngx-file-drop> <div *ngFor="let item of uploadedFiles; let i=index" class="upload-table"> @@ -91,4 +91,4 @@ </div> </div> </div> -</div> +</div>
\ No newline at end of file diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.html index d211e943e..8a43b010b 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.html +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.html @@ -53,10 +53,10 @@ </span> </label> </div> - </div> + </div> <div class="create-template-import">Use the editor to add parameters or you can also <a href="#" data-toggle="modal" (click)="allowedExt=[getFileExtension()]" - data-target="#exampleModal">Import + data-target="#templateModal">Import File</a></div> <div class="editor-container"> <app-source-editor (textChange)="textChanges($event,templateInfo.fileName)" @@ -83,7 +83,7 @@ <br /> <span>Use Current Template Instance</span> </a> - <a href="#" (click)="allowedExt=['.csv']" data-toggle="modal" data-target="#exampleModal" + <a href="#" (click)="allowedExt=['.csv']" data-toggle="modal" data-target="#templateModal" class="mapping-source-load"> <i class="icon-Upload-attribute"></i> <br /> @@ -125,7 +125,7 @@ <td>{{ dict.name }}</td> <td>{{ dict.name }}</td> <td> - <select class="custom-select" (click)="testOption(dict,$event)"> + <select class="custom-select" (click)="selectSource(dict,$event)"> <option *ngFor="let val of dict.definition.sources | keyvalue"> {{initMap(dict.name,val)}} </option> @@ -149,6 +149,45 @@ </table> </div> + <div id="mapping-table" [hidden]="mappingRes?.length == 0" class="mx-4 my-2"> + <table datatable [dtOptions]="dtOptions" [dtTrigger]="resTableDtTrigger" class="row-border hover"> + <thead> + <tr> + <th>Required</th> + <th>Parameter Name</th> + <th>Dictionary Name</th> + <th>Dictionary Source</th> + <th>Dependancies</th> + <th>Default</th> + <th>Data Type</th> + <th>Entry Schema</th> + </tr> + </thead> + <tbody> + <tr *ngFor="let dict of mappingRes"> + <td> + <i *ngIf="dict.definition?.property?.required" class="fa fa-check-square mx-2"></i> + <i *ngIf="!dict.definition?.property?.required" class="fa fa-square mx-2"></i> + </td> + <td>{{ dict['name'] }}</td> + <td>{{ dict['name'] }}</td> + <td> + <input type="text" class="form-control" [value]="dict['dictionary-source']" + disabled> + + </td> + <td> + <input type="text" class="form-control" [value]="dict['dependencies']" disabled> + <!-- {{ dict.definition.sources }} --> + </td> + <td>{{ dict['property']['default'] }}</td> + <td>{{ dict['property']['type'] }}</td> + <td>{{ dict['property']['entry_schema'] }}</td> + </tr> + </tbody> + </table> + </div> + </div> @@ -162,12 +201,12 @@ </div> -<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" +<div class="modal fade" id="templateModal" tabindex="-1" role="dialog" aria-labelledby="templateModalLabel" aria-hidden="true"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> - <h5 class="modal-title" id="exampleModalLabel">Import File</h5> + <h5 class="modal-title" id="templateModalLabel">Import File</h5> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">×</span> </button> diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.ts index f4797fc9c..628d963ce 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.ts @@ -28,6 +28,7 @@ export class TemplMappCreationComponent implements OnInit, OnDestroy { // We use this trigger because fetching the list of persons can be quite long, // thus we ensure the data is fetched before rendering dtTrigger = new Subject(); + resTableDtTrigger = new Subject(); resourceDictionaryRes: ResourceDictionary[] = []; allowedExt = ['.vtl']; @ViewChild(DataTableDirective, { static: false }) @@ -38,6 +39,7 @@ export class TemplMappCreationComponent implements OnInit, OnDestroy { templateExt = 'Velcoity'; dependancies = new Map<string, Array<string>>(); dependanciesSource = new Map<string, string>(); + mappingRes = []; @@ -50,17 +52,25 @@ export class TemplMappCreationComponent implements OnInit, OnDestroy { ngOnInit() { this.templateStore.state$.subscribe(templateInfo => { + console.log('----------'); console.log(templateInfo); this.templateInfo = templateInfo; this.fileName = templateInfo.fileName.split('/')[1]; - this.templateFileContent = templateInfo.fileContent; + if (templateInfo.type === 'mapping') { + this.mappingRes = templateInfo.mapping; + this.resourceDictionaryRes = []; + this.resTableDtTrigger.next(); + } else { + + this.templateFileContent = templateInfo.fileContent; + } }); this.dtOptions = { pagingType: 'full_numbers', pageLength: 10, destroy: true, - // retrieve: true, + retrieve: true, }; } @@ -122,6 +132,8 @@ export class TemplMappCreationComponent implements OnInit, OnDestroy { } uploadFile() { + this.dependancies.clear(); + this.dependanciesSource.clear(); if (this.allowedExt.includes('.csv')) { this.fetchCSVkeys(); } else { @@ -181,7 +193,7 @@ export class TemplMappCreationComponent implements OnInit, OnDestroy { public fileLeave(event) { console.log(event); } - + // resetTheUploadedFiles() { this.uploadedFiles = []; } @@ -191,12 +203,14 @@ export class TemplMappCreationComponent implements OnInit, OnDestroy { } getMappingTableFromTemplate(e) { + this.resourceDictionaryRes = []; if (e) { e.preventDefault(); } if (this.variables && this.variables.length > 0) { console.log('base'); this.packageCreationStore.getTemplateAndMapping(this.variables).subscribe(res => { + this.mappingRes = []; this.resourceDictionaryRes = res; console.log(this.resourceDictionaryRes); this.rerender(); @@ -232,7 +246,7 @@ export class TemplMappCreationComponent implements OnInit, OnDestroy { } } - testOption(dict, e) { + selectSource(dict, e) { const source = e.target.value; let keyDepend = null; try { @@ -242,12 +256,13 @@ export class TemplMappCreationComponent implements OnInit, OnDestroy { console.log(source); if (keyDepend) { this.dependancies.set(dict.name, keyDepend); - this.dependanciesSource.set(dict.name, source); } else { // this.dependancies.delete(dict.name); // this.dependanciesSource.delete(dict.name); } + this.dependanciesSource.set(dict.name, source); console.log(this.dependancies); + console.log(this.dependanciesSource); } getKeys(map: Map<string, any>) { diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component.css b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component.css index e69de29bb..054b5686e 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component.css +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component.css @@ -0,0 +1,3 @@ +.template-mapping-list { + cursor: pointer; +}
\ No newline at end of file diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component.html index 3ed055c5a..ab97159b6 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component.html +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component.html @@ -1,4 +1,4 @@ -<a (click)="openCreationView()" class="create-template-mapping-button"> +<a *ngIf="isCreate" (click)="openCreationView()" class="create-template-mapping-button"> <i class="fa fa-plus"></i> <span>Create</span> </a> @@ -21,8 +21,7 @@ <div class="row"> <!-- <div class="col-4" style="color:white" *ngFor="let file of templates.files | keyvalue; let mapIndex = index">--> <div class="col-4" style="color:white" *ngFor="let file of getKeys(templateAndMappingMap)"> - <a (click)="setSourceCodeEditor(file)" - class="template-mapping-list active">{{file}} + <a (click)="setSourceCodeEditor(file)" class="template-mapping-list active">{{file}} <span *ngIf="getValue(file).isMapping">Mapping</span> <span *ngIf="getValue(file).isTemplate">Template</span> </a> @@ -33,4 +32,4 @@ </div> </div> -</div> +</div>
\ No newline at end of file diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component.ts index d459dac67..372fbca03 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component.ts @@ -1,8 +1,10 @@ -import {Component, EventEmitter, OnInit, Output} from '@angular/core'; -import {PackageCreationStore} from '../../package-creation.store'; -import {Mapping, Template} from '../../mapping-models/CBAPacakge.model'; -import {TemplateInfo, TemplateStore} from '../../template.store'; -import {TemplateAndMapping} from '../TemplateAndMapping'; +import { Component, EventEmitter, OnInit, Output } from '@angular/core'; +import { PackageCreationStore } from '../../package-creation.store'; +import { Mapping, Template } from '../../mapping-models/CBAPacakge.model'; +import { TemplateInfo, TemplateStore } from '../../template.store'; +import { TemplateAndMapping } from '../TemplateAndMapping'; +import { ActivatedRoute } from '@angular/router'; + @Component({ selector: 'app-templ-mapp-listing', @@ -14,11 +16,19 @@ export class TemplMappListingComponent implements OnInit { private templateAndMappingMap = new Map<string, TemplateAndMapping>(); private templates: Template; private mapping: Mapping; + isCreate = true; - constructor(private packageCreationStore: PackageCreationStore, private templateStore: TemplateStore) { + constructor( + private packageCreationStore: PackageCreationStore, + private templateStore: TemplateStore, + private route: ActivatedRoute + ) { } ngOnInit() { + if (this.route.snapshot.paramMap.has('id')) { + this.isCreate = false; + } this.packageCreationStore.state$.subscribe(cba => { if (cba.templates) { this.templates = cba.templates; @@ -62,16 +72,27 @@ export class TemplMappListingComponent implements OnInit { } setSourceCodeEditor(key: string) { - key = 'Templates/' + key + '-template.vtl'; + const templateKey = 'Templates/' + key + '-template.vtl'; this.packageCreationStore.state$.subscribe(cba => { - if (cba.templates) { - console.log(cba.templates); - console.log(key); - const fileContent = cba.templates.getValue(key.trim()); + console.log('cba ------'); + console.log(cba); + console.log(key); + console.log(this.templateAndMappingMap); + if (cba.templates && cba.templates.files.has(templateKey)) { + const fileContent = cba.templates.getValue(templateKey.trim()); console.log(fileContent); const templateInfo = new TemplateInfo(); templateInfo.fileContent = fileContent; - templateInfo.fileName = key; + templateInfo.fileName = templateKey; + this.templateStore.changeTemplateInfo(templateInfo); + } + const mappingKey = 'Templates/' + key + '-mapping.json'; + if (cba.mapping && cba.mapping.files.has(mappingKey)) { + const obj = JSON.parse(cba.mapping.getValue(mappingKey)); + const templateInfo = new TemplateInfo(); + templateInfo.mapping = obj; + templateInfo.fileName = mappingKey; + templateInfo.type = 'mapping'; this.templateStore.changeTemplateInfo(templateInfo); } }); diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/template-mapping.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/template-mapping.component.ts index 7079f8404..106765834 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/template-mapping.component.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/template-mapping.component.ts @@ -1,4 +1,6 @@ -import {Component, OnInit} from '@angular/core'; +import { Component, OnInit } from '@angular/core'; +import { ActivatedRoute } from '@angular/router'; +import { PackageCreationStore } from '../package-creation.store'; @Component({ selector: 'app-template-mapping', @@ -9,12 +11,19 @@ export class TemplateMappingComponent implements OnInit { creationView = true; listView = false; - constructor() { + constructor(private route: ActivatedRoute, private pakcageStore: PackageCreationStore) { } ngOnInit() { + if (this.route.snapshot.paramMap.has('id')) { + console.log('Edit mode'); + this.creationView = false; + this.listView = false; + } else { + console.log('Create mode'); + this.pakcageStore.clear(); + } } - openCreationView() { this.creationView = false; this.listView = true; diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template.store.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template.store.ts index b3a487bdc..9c8775514 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template.store.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template.store.ts @@ -19,19 +19,22 @@ limitations under the License. ============LICENSE_END============================================ */ -import {Injectable} from '@angular/core'; +import { Injectable } from '@angular/core'; -import {Store} from '../../../../common/core/stores/Store'; +import { Store } from '../../../../common/core/stores/Store'; export class TemplateInfo { fileName: string; fileContent: string; + type: string; + mapping = []; constructor() { this.fileName = ''; this.fileContent = ''; + this.type = ''; } |