Merge "Add Reuired and Optional checkbox to mapping table"
authorKAPIL SINGAL <ks220y@att.com>
Wed, 30 Sep 2020 13:53:07 +0000 (13:53 +0000)
committerGerrit Code Review <gerrit@onap.org>
Wed, 30 Sep 2020 13:53:07 +0000 (13:53 +0000)
cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.ts
cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/creationModes/DesignerCreationMode.ts
cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/mapping-models/mappingAdapter.model.ts
cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.html
cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.ts
cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/import-package/import-package.component.html
cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/import-package/import-package.component.ts

index fbdfd00..dc5697f 100644 (file)
@@ -284,7 +284,8 @@ export class ConfigurationDashboardComponent extends ComponentCanDeactivate impl
 
     checkSkipTypesOfAction() {
         console.log(this.cbaPackage);
-        if (this.cbaPackage.templateTopology.node_templates && this.cbaPackage.templateTopology.workflows) {
+        if (this.cbaPackage.templateTopology && this.cbaPackage.templateTopology.node_templates
+            && this.cbaPackage.templateTopology.workflows) {
             this.goToDesignerMode(this.id);
         } else {
             this.dataTarget = '#exampleModalLong';
index a9deb67..e2790d5 100644 (file)
@@ -80,24 +80,25 @@ export class DesignerCreationMode extends PackageCreationModes {
                 if (!key.includes(cbaPackage.metaData.name)) {
                     files.push({file: key});
                 } else {
-                    // it means this is entry definition
                     insideVlbDefinition = JSON.parse(valueOfFile);
                 }
             });
         }
         console.log(vlbDefinition);
-        vlbDefinition.imports = files;
-        if (insideVlbDefinition && insideVlbDefinition.topology_template) {
-            vlbDefinition.topology_template = insideVlbDefinition.topology_template;
-        }
         console.log(cbaPackage.definitions.dslDefinition.content);
-        if (cbaPackage.definitions.dslDefinition.content) {
+        if (cbaPackage.definitions && cbaPackage.definitions.dslDefinition &&
+            cbaPackage.definitions.dslDefinition.content) {
             vlbDefinition.dsl_definitions = JSON.parse(cbaPackage.definitions.dslDefinition.content);
         }
 
-        if (cbaPackage.templateTopology.content) {
+        vlbDefinition.imports = files;
+        if (insideVlbDefinition && insideVlbDefinition.topology_template) {
+            vlbDefinition.topology_template = insideVlbDefinition.topology_template;
+        } else if (cbaPackage.templateTopology && cbaPackage.templateTopology.content) {
             vlbDefinition.topology_template = JSON.parse(cbaPackage.templateTopology.content);
         }
+
+
         console.log(vlbDefinition);
 
         const value = packageCreationUtils.transformToJson(vlbDefinition);
index b4de578..6d98019 100644 (file)
@@ -10,10 +10,11 @@ export class MappingAdapter {
         private dependanciesSource: Map<string, string>) { }
 
     ToMapping(): Mapping {
+       // console.log(this.resourceDictionary.definition.property);
         const mapping = new Mapping();
         mapping.name = this.resourceDictionary.name;
         mapping.dictionaryName = this.resourceDictionary.name;
-        mapping.property = this.resourceDictionary.definition.property;
+        mapping.property = Object.assign({}, this.resourceDictionary.definition.property);
         mapping.inputParam = false;
         mapping.dictionarySource = this.dependanciesSource.get(mapping.name);
         if (this.dependancies.get(mapping.name)) {
index 3cac1ed..d93d49d 100644 (file)
@@ -71,7 +71,8 @@
                         </div>
                     </div>
                     <div class="create-template-import">Use the editor to add parameters or you can also
-                        <a href="#" data-toggle="modal" data-target="#templateModal"><b>Import
+                        <a href="#" data-toggle="modal" (click)="allowedExt=['.'+templateExt]"
+                            data-target="#templateModal"><b>Import
                                 File</b></a>. <br /> <span class="templateNote"><i class="icon-info"
                                 aria-hidden="true"></i> When you import new file, the new attributes will replace
                             current attributes.</span></div>
@@ -98,8 +99,8 @@
                 <div class="card-body">
                     <p class="text-center"><b>Select a source to load config parameters</b></p>
                     <div class="text-center">
-                        <button [disabled]="!(variables?.length>0 && templateFileContent?.trim()?.length > 0)"
-                            (click)="getMappingTableFromTemplate($event)" class="mapping-source-load" [ngClass]="variables?.length>0 && templateFileContent?.trim()?.length > 0
+                        <button [disabled]="!(templateFileContent?.trim()?.length > 0)"
+                            (click)="getMappingTableFromTemplate($event)" class="mapping-source-load" [ngClass]="templateFileContent?.trim()?.length > 0
                             ?'hover-enable':'hover-disable'">
                             <i class="icon-use-attributes"></i>
                             <br />
                                 <th>Dictionary Source</th>
                                 <th>Dependancies</th>
                                 <th>Default</th>
+                                <th>Velocity</th>
                                 <th>Data Type</th>
                                 <th>Entry Schema</th>
                             </tr>
                         </thead>
                         <tbody>
-                            <tr *ngFor="let dict of resourceDictionaryRes">
+                            <tr *ngFor="let dict of resourceDictionaryRes;let i=index;trackBy: identify">
                                 <td>
                                     <div class="custom-control custom-checkbox" tooltip="Select" placement="bottom">
                                         <input type="checkbox" class="custom-control-input"
                                     <!-- <select class="custom-select">
                                         <option *ngFor="let val of getKeys(dependancies)">
                                             {{ getValue(dict.name)}}</option>
-
                                     </select> -->
                                     <input type="text" class="form-control" [ngModel]="getValue(dict.name)">
                                     <!-- {{ dict.definition.sources }} -->
                                 </td>
                                 <td>{{ dict.definition?.property?.default }}</td>
+                                <td><input type="text" class="form-control" #velocity
+                                        (input)="setVelocity(i,velocity.value)"></td>
                                 <td>{{ dict.definition?.property?.type }}</td>
                                 <td>{{ dict.definition?.property['entry_schema'] }}</td>
                             </tr>
                                 <th>Dictionary Source</th>
                                 <th>Dependancies</th>
                                 <th>Default</th>
+                                <th>Velocity</th>
                                 <th>Data Type</th>
                                 <th>Entry Schema</th>
                             </tr>
                                     <!-- {{ dict.definition.sources }} -->
                                 </td>
                                 <td>{{ dict['property']['default'] }}</td>
+                                <td *ngIf="dict?.property?.metadata">
+                                    {{dict?.property?.metadata['transform-template']}}
+                                </td>
+                                <td *ngIf="!dict?.property?.metadata"></td>
                                 <td>{{ dict['property']['type'] }}</td>
                                 <td>{{ dict['property']['entry_schema'] }}</td>
                             </tr>
index 9d94b6b..a99f65b 100644 (file)
@@ -301,8 +301,8 @@ export class TemplMappCreationComponent implements OnInit, OnDestroy {
                 const fileReader = new FileReader();
                 fileReader.onload = (e) => {
                     this.templateFileContent = fileReader.result.toString();
-                    this.variables = this.getTemplateVariable(this.templateFileContent);
-                    console.log(this.variables);
+                    // this.variables = this.getTemplateVariable(this.templateFileContent);
+                    // console.log(this.variables);
 
                 };
                 fileReader.readAsText(file);
@@ -338,12 +338,27 @@ export class TemplMappCreationComponent implements OnInit, OnDestroy {
         this.showCreationView.emit('close create form and open list');
     }
 
+    identify(index, item) {
+        return item.name;
+    }
+    setVelocity(index, value) {
+        // console.log('velocity value = ' + value);
+        // console.log(this.resourceDictionaryRes[index]);
+        // tslint:disable-next-line: no-string-literal
+        this.resourceDictionaryRes[index].definition.property['metadata'] = {
+            'transform-template': value
+        };
+        console.log(this.resourceDictionaryRes[index]);
+    }
+
     getMappingTableFromTemplate(e) {
         console.log('-' + this.templateFileContent + '-');
         this.resourceDictionaryRes = [];
         if (e) {
             e.preventDefault();
         }
+        this.variables = this.getTemplateVariable(this.templateFileContent);
+        console.log(this.variables);
         if (this.variables && this.variables.length > 0) {
             console.log('base');
             this.packageCreationService.getTemplateAndMapping(this.variables).subscribe(res => {
index 274435c..d578582 100644 (file)
                         (click)="resetTheUploadedFiles()">Cancel
                 </button>
                 <button type="button" class="btn btn-sm btn-primary" [disabled]="uploadedFiles?.length<=0"
-                        data-dismiss="modal" (click)="openFilesInCreationPackage();saveFileToStore()">
+                        data-dismiss="modal" (click)="importAndSave()">
+                    Import&Save
+                </button>
+                <button type="button" class="btn btn-sm btn-primary" [disabled]="uploadedFiles?.length<=0"
+                        data-dismiss="modal" (click)="importPackageAndViewIt()">
                     Import
                 </button>
+
             </div>
         </div>
     </div>
index dae58a4..7496338 100644 (file)
@@ -3,6 +3,10 @@ import {FileSystemFileEntry, NgxFileDropEntry} from 'ngx-file-drop';
 import {PackageCreationExtractionService} from '../../package-creation/package-creation-extraction.service';
 import {Router} from '@angular/router';
 import {PackageCreationStore} from '../../package-creation/package-creation.store';
+import * as JSZip from 'jszip';
+import {PackageCreationService} from '../../package-creation/package-creation.service';
+import {ToastrService} from 'ngx-toastr';
+import {PackagesStore} from '../../packages.store';
 
 @Component({
     selector: 'app-import-package',
@@ -14,10 +18,14 @@ export class ImportPackageComponent implements OnInit {
     public uploadedFiles: FileSystemFileEntry[] = [];
     private fileNames: Set<string> = new Set();
     fileToDelete: any = {};
+    zipFile: JSZip = new JSZip();
     public files: NgxFileDropEntry[] = [];
 
     constructor(private packageCreationExtractionService: PackageCreationExtractionService,
                 private packageCreationStore: PackageCreationStore,
+                private packageCreationService: PackageCreationService,
+                private toastService: ToastrService,
+                private packagesStore: PackagesStore,
                 private router: Router) {
 
     }
@@ -72,7 +80,12 @@ export class ImportPackageComponent implements OnInit {
     public fileLeave(event) {
         console.log(event);
     }
-// TODO mix two function in ond bigger one
+
+    importPackageAndViewIt() {
+        this.openFilesInCreationPackage();
+        this.saveFileToStore();
+    }
+
     saveFileToStore() {
         console.log(this.uploadedFiles.length);
         const file = this.getFile(this.uploadedFiles[this.uploadedFiles.length - 1]);
@@ -91,4 +104,23 @@ export class ImportPackageComponent implements OnInit {
             console.log(err);
         }
     }
+
+    importAndSave() {
+        const file = this.getFile(this.uploadedFiles[this.uploadedFiles.length - 1]);
+        this.zipFile = new JSZip();
+        this.zipFile.loadAsync(file).then(zip => {
+            this.zipFile = zip;
+            console.log(this.zipFile);
+            this.resetTheUploadedFiles();
+            this.zipFile.generateAsync({type: 'blob'}).then(blob => {
+                this.packageCreationService.savePackage(blob).subscribe(
+                    bluePrintDetailModels => {
+                        this.toastService.info('package is imported and saved successfully ');
+                        this.router.navigate(['/packages']);
+                        this.packagesStore.getAll();
+                    }, error =>
+                        this.toastService.error('there is an error happened ' + error));
+            });
+        });
+    }
 }