diff options
author | KAPIL SINGAL <ks220y@att.com> | 2020-03-02 15:30:09 +0000 |
---|---|---|
committer | Gerrit Code Review <gerrit@onap.org> | 2020-03-02 15:30:09 +0000 |
commit | dd60dcc5cc258f306a8ae2041f72a3139eb7973b (patch) | |
tree | 597681ad9f4e8b6672064ea3f962aaf3eff5317c /cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation | |
parent | 3b46e9facf5f06a0170fbad120e2402e4bbd1279 (diff) | |
parent | 6edf1f95883e230bcddb7dfbcbafc6d7527a5ce7 (diff) |
Merge "Display Mapping result in view table."
Diffstat (limited to 'cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation')
2 files changed, 65 insertions, 11 deletions
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>) { |