diff options
Diffstat (limited to 'cds-ui/designer-client/src/app/modules/feature-modules/packages')
10 files changed, 135 insertions, 76 deletions
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 ac02c50e2..d487de3d1 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 @@ -36,38 +36,39 @@ <div class="card"> <div class="card-header" [id]="'head-'+mapIndex"> <h5 class="mb-0 d-flex justify-content-between"> - <button class="btn btn-link " data-toggle="collapse" - aria-expanded="false" - (click)="changeDivShow(mapIndex)" > + <button class="btn btn-link " data-toggle="collapse" aria-expanded="false" + (click)="changeDivShow(mapIndex)"> <i class="icon-file-code"></i> {{file.key}} </button> - - <a data-toggle="modal" data-target="#exampleModal" class="accordion-delete"><i - class="icon-delete-sm"></i></a> - - <!-- <a class="accordion-delete" (click)="removeFile(mapIndex)"><i class="icon-delete-sm"></i></a> --> - <!-- Delete Modal --> - <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" - aria-labelledby="exampleModalLabel" aria-hidden="true"> - <div class="modal-dialog" role="document"> - <div class="modal-content"> - <div class="modal-header"> - <h5 class="modal-title" id="exampleModalLabel">Delete File</h5> - <button type="button" class="close" data-dismiss="modal" aria-label="Close"> - <span aria-hidden="true">×</span> - </button> - </div> - <div class="modal-body"> - <p>Are you sure you want to delete file <span>artifact_types.json</span>?</p> - </div> - <div class="modal-footer"> - <button type="button" class="btn btn-secondary" - data-dismiss="modal">Cancel</button> - <button type="button" class="btn btn-primary">Delete</button> + + <a data-toggle="modal" (click)="initDelete(file)" data-target="#exampleModal" + class="accordion-delete"><i class="icon-delete-sm"></i></a> + + <!-- <a class="accordion-delete" (click)="removeFile(mapIndex)"><i class="icon-delete-sm"></i></a> --> + <!-- Delete Modal --> + <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" + aria-labelledby="exampleModalLabel" aria-hidden="true"> + <div class="modal-dialog" role="document"> + <div class="modal-content"> + <div class="modal-header"> + <h5 class="modal-title" id="exampleModalLabel">Delete File</h5> + <button type="button" class="close" data-dismiss="modal" aria-label="Close"> + <span aria-hidden="true">×</span> + </button> + </div> + <div class="modal-body"> + <p>Are you sure you want to delete file + <span>{{fileToDelete?.key?.split('/')[1]}}</span>?</p> + </div> + <div class="modal-footer"> + <button type="button" class="btn btn-secondary" + data-dismiss="modal">Cancel</button> + <button type="button" data-dismiss="modal" (click)="removeFile()" + class="btn btn-primary">Delete</button> + </div> </div> </div> </div> - </div> </h5> </div> <div [id]="'id-'+mapIndex" class="collapse" [attr.aria-labelledby]="'head-'+mapIndex" @@ -153,7 +154,8 @@ <button type="button" class="btn btn-sm btn-secondary" data-dismiss="modal" (click)="resetTheUploadedFiles()">Cancel </button> - <button type="button" class="btn btn-sm btn-primary" data-dismiss="modal" (click)="setFilesToStore()"> + <button type="button" class="btn btn-sm btn-primary" [disabled]="uploadedFiles?.length<=0" + data-dismiss="modal" (click)="setFilesToStore()"> Import </button> </div> diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.ts index 35c0918de..9858fd580 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.ts @@ -1,7 +1,7 @@ -import {Component, OnInit} from '@angular/core'; -import {FileSystemFileEntry, NgxFileDropEntry} from 'ngx-file-drop'; -import {PackageCreationStore} from '../package-creation.store'; -import {PackageCreationUtils} from '../package-creation.utils'; +import { Component, OnInit } from '@angular/core'; +import { FileSystemFileEntry, NgxFileDropEntry } from 'ngx-file-drop'; +import { PackageCreationStore } from '../package-creation.store'; +import { PackageCreationUtils } from '../package-creation.utils'; @Component({ @@ -14,7 +14,7 @@ export class ImportsTabComponent implements OnInit { public definitionFiles: Map<string, string> = new Map<string, string>(); public uploadedFiles: FileSystemFileEntry[] = []; private fileNames: Set<string> = new Set(); - + fileToDelete: any = {}; public files: NgxFileDropEntry[] = []; constructor(private packageCreationStore: PackageCreationStore, private packageCreationUtils: PackageCreationUtils) { @@ -40,11 +40,21 @@ export class ImportsTabComponent implements OnInit { } } } - - removeFile(fileIndex: number) { - const filename = 'Definitions/' + this.uploadedFiles[fileIndex].name; + initDelete(file) { + console.log(file); + this.fileToDelete = file; + } + removeFile() { + const filename = this.fileToDelete.key; this.packageCreationStore.removeFileFromDefinition(filename); - this.uploadedFiles.splice(fileIndex, 1); + + for (let i = 0; i < this.uploadedFiles.length; i++) { + console.log(this.uploadedFiles[i]); + if (this.uploadedFiles[i].name === filename) { + this.uploadedFiles.splice(i, 1); + break; + } + } } public fileOver(event) { 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 0808223cd..8302697fe 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 @@ -84,6 +84,10 @@ export class PackageCreationStore extends Store<CBAPackage> { this.state.scripts.files.delete(name); } + fileExist(key: string) { + return this.state.templates.files.has(key); + } + removeFileFromDefinition(filename) { this.state.definitions.imports.delete(filename); } 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 79c444061..159f7aec4 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 @@ -20,12 +20,12 @@ <div class="card"> <div [id]="'head-script-'+mapIndex" class="card-header"> <h5 class="mb-0 d-flex justify-content-between"> - <button (click)="changeDivShow(mapIndex)" - aria-expanded="false" class="btn btn-link collapsed" data-toggle="collapse"> + <button (click)="changeDivShow(mapIndex)" aria-expanded="false" class="btn btn-link collapsed" + data-toggle="collapse"> <i class="icon-file-code"></i> {{file.key}} </button> - <a data-toggle="modal" data-target="#exampleModal" class="accordion-delete"><i - class="icon-delete-sm"></i></a> + <a data-toggle="modal" (click)="initDelete(file)" data-target="#exampleModal" + class="accordion-delete"><i class="icon-delete-sm"></i></a> <!-- <a (click)="removeFile(file.key,mapIndex)" data-toggle="modal" data-target="#exampleModal" class="accordion-delete"><i class="icon-delete-sm"></i></a> --> <!-- Delete Modal --> @@ -40,12 +40,14 @@ </button> </div> <div class="modal-body"> - <p>Are you sure you want to delete script file <span>ConfigDeploy.py</span>?</p> + <p>Are you sure you want to delete script file + <span>{{fileToDelete?.key?.split('/')[2]}}</span>?</p> </div> <div class="modal-footer"> <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button> - <button type="button" class="btn btn-primary">Delete</button> + <button type="button" (click)="removeFile(fileToDelete?.key,0)" + data-dismiss="modal" class="btn btn-primary">Delete</button> </div> </div> </div> @@ -114,10 +116,11 @@ <button (click)="resetTheUploadedFiles()" class="btn btn-sm btn-secondary" data-dismiss="modal" type="button">Cancel </button> - <button (click)="setFilesToStore()" class="btn btn-sm btn-primary" data-dismiss="modal" type="button"> + <button (click)="setFilesToStore()" [disabled]="uploadedFiles?.length<=0" class="btn btn-sm btn-primary" + data-dismiss="modal" type="button"> Import </button> </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/scripts-tab/scripts-tab.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/scripts-tab/scripts-tab.component.ts index efe28e9a4..a85ccf146 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/scripts-tab/scripts-tab.component.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/scripts-tab/scripts-tab.component.ts @@ -3,6 +3,7 @@ import { FileSystemFileEntry, NgxFileDropEntry } from 'ngx-file-drop'; import { PackageCreationStore } from '../package-creation.store'; import 'ace-builds/src-noconflict/ace'; import 'ace-builds/webpack-resolver'; +declare var $: any; @Component({ selector: 'app-scripts-tab', @@ -15,6 +16,7 @@ export class ScriptsTabComponent implements OnInit { public uploadedFiles: FileSystemFileEntry[] = []; public files: NgxFileDropEntry[] = []; private fileNames: Set<string> = new Set(); + fileToDelete: any = {}; constructor( private packageCreationStore: PackageCreationStore, @@ -42,7 +44,9 @@ export class ScriptsTabComponent implements OnInit { } } } - + initDelete(file) { + this.fileToDelete = file; + } removeFile(filePath: string, FileIndex: number) { const filename = filePath.split('/')[2] || ''; // const filename = 'Scripts/' + this.getFileType(this.uploadedFiles[fileIndex].name) + '/' + this.uploadedFiles[fileIndex].name; diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.css b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.css index e69de29bb..7273b9c27 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.css +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.css @@ -0,0 +1,4 @@ +.accordian-title { + color: #a09e9e; + font-size: .9em; +}
\ 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 16c3101f2..e6149c883 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 @@ -12,13 +12,13 @@ </div> <div class="template-mapping-accordion"> - <div id="accordion"> + <div class="accordion" id="accordion"> <div class="card"> <div class="card-header" id="headingOne"> <h5 class="mb-0 d-flex justify-content-between"> <button class="btn btn-link" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne"> - 1. Create Template + 1. Template <span class="accordian-title">{{currentTemplate?.fileName?.split('/')[1]}}</span> </button> </h5> @@ -70,7 +70,8 @@ <h5 class="mb-0"> <button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"> - 2. Manage Mapping + 2. Manage Mapping <span + class="accordian-title">{{currentMapping?.fileName?.split('/')[1]}}</span> </button> </h5> </div> @@ -119,8 +120,10 @@ <tbody> <tr *ngFor="let dict of resourceDictionaryRes"> <td> - <img *ngIf="dict.definition?.property?.required" src="/assets/img/icon-required-yes.svg"> - <img *ngIf="!dict.definition?.property?.required" src="/assets/img/icon-required-no.svg"> + <img *ngIf="dict.definition?.property?.required" + src="/assets/img/icon-required-yes.svg"> + <img *ngIf="!dict.definition?.property?.required" + src="/assets/img/icon-required-no.svg"> </td> <td>{{ dict.name }}</td> <td>{{ dict.name }}</td> @@ -166,8 +169,10 @@ <tbody> <tr *ngFor="let dict of mappingRes"> <td> - <img *ngIf="dict.definition?.property?.required" src="/assets/img/icon-required-yes.svg"> - <img *ngIf="!dict.definition?.property?.required" src="/assets/img/icon-required-no.svg"> + <img *ngIf="dict.definition?.property?.required" + src="/assets/img/icon-required-yes.svg"> + <img *ngIf="!dict.definition?.property?.required" + src="/assets/img/icon-required-no.svg"> </td> <td>{{ dict['name'] }}</td> <td>{{ dict['name'] }}</td> @@ -194,7 +199,7 @@ </div> <div class="template-mapping-action"> - <button class="btn btn-outline-secondary">Cancel</button> + <button (click)="cancel()" class="btn btn-outline-secondary">Cancel</button> <button (click)="saveToStore()" class="btn btn-primary">Submit</button> </div> </div> @@ -212,8 +217,8 @@ </button> </div> <div class="modal-body"> - <ngx-file-drop [multiple]="false" [accept]="allowedExt" dropZoneLabel="Drop files here" (onFileDrop)="dropped($event)" - (onFileOver)="fileOver($event)" (onFileLeave)="fileLeave($event)"> + <ngx-file-drop [multiple]="false" [accept]="allowedExt" dropZoneLabel="Drop files here" + (onFileDrop)="dropped($event)" (onFileOver)="fileOver($event)" (onFileLeave)="fileLeave($event)"> <ng-template ngx-file-drop-content-tmp let-openFileSelector="openFileSelector"> <div class="folder-upload"> <img src="assets/img/folder-upload.svg" /> 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 628d963ce..7d4705d69 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 @@ -7,7 +7,8 @@ import { ResourceDictionary } from '../../mapping-models/ResourceDictionary.mode import { DataTableDirective } from 'angular-datatables'; import { Mapping, MappingAdapter } from '../../mapping-models/mappingAdapter.model'; import { PackageCreationUtils } from '../../package-creation.utils'; -import { JsonConvert } from 'json2typescript'; +import { JsonConvert, Any } from 'json2typescript'; +import { ToastrService } from 'ngx-toastr'; @Component({ selector: 'app-templ-mapp-creation', @@ -40,13 +41,16 @@ export class TemplMappCreationComponent implements OnInit, OnDestroy { dependancies = new Map<string, Array<string>>(); dependanciesSource = new Map<string, string>(); mappingRes = []; + currentTemplate: any; + currentMapping: any; constructor( private packageCreationStore: PackageCreationStore, private templateStore: TemplateStore, - private packageCreationUtils: PackageCreationUtils + private packageCreationUtils: PackageCreationUtils, + private toastr: ToastrService ) { } @@ -56,13 +60,18 @@ export class TemplMappCreationComponent implements OnInit, OnDestroy { console.log(templateInfo); this.templateInfo = templateInfo; this.fileName = templateInfo.fileName.split('/')[1]; + if (this.fileName) { + this.fileName = this.fileName.split('-')[0]; + } if (templateInfo.type === 'mapping') { this.mappingRes = templateInfo.mapping; + this.currentMapping = templateInfo; this.resourceDictionaryRes = []; this.resTableDtTrigger.next(); } else { this.templateFileContent = templateInfo.fileContent; + this.currentTemplate = templateInfo; } }); @@ -224,28 +233,44 @@ export class TemplMappCreationComponent implements OnInit, OnDestroy { } return map.key; } + cancel() { + this.fileName = ''; + this.templateFileContent = ''; + this.resourceDictionaryRes = []; + this.mappingRes = []; + this.currentMapping = {}; + this.currentTemplate = {}; + } saveToStore() { - console.log(this.dependancies); - console.log(this.dependanciesSource); if (this.fileName) { - // Save Mapping to Store - if (this.resourceDictionaryRes && this.resourceDictionaryRes.length > 0) { - const mapArray = this.convertDictionaryToMap(this.resourceDictionaryRes); - this.packageCreationStore.addMapping('Templates/' + this.fileName + '-mapping.json', - this.packageCreationUtils.transformToJson(this.jsonConvert.serialize(mapArray))); - this.resourceDictionaryRes = []; - } - // Save Template to store - if (this.templateFileContent) { - this.packageCreationStore.addTemplate('Templates/' + this.fileName + '-template' + this.getFileExtension(), - this.templateFileContent); - this.templateFileContent = ''; + // check file duplication + if (!(this.packageCreationStore.fileExist('Templates/' + this.fileName + '-mapping.json') + || this.packageCreationStore.fileExist('Templates/' + this.fileName + '-template' + this.getFileExtension()))) { + // Save Mapping to Store + if (this.resourceDictionaryRes && this.resourceDictionaryRes.length > 0) { + const mapArray = this.convertDictionaryToMap(this.resourceDictionaryRes); + this.packageCreationStore.addMapping('Templates/' + this.fileName + '-mapping.json', + this.packageCreationUtils.transformToJson(this.jsonConvert.serialize(mapArray))); + this.resourceDictionaryRes = []; + } + // Save Template to store + if (this.templateFileContent) { + this.packageCreationStore.addTemplate('Templates/' + this.fileName + '-template' + this.getFileExtension(), + this.templateFileContent); + this.templateFileContent = ''; + } + this.fileName = ''; + this.toastr.success('File is created', 'success'); + } else { + console.log('this file already exist'); + this.toastr.error('File name already exist', 'Error'); } } else { - + this.toastr.error('Add the file name', 'Error'); } } + selectSource(dict, e) { const source = e.target.value; let keyDepend = null; 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 f5e683f28..a47963a72 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 @@ -4,7 +4,7 @@ <div class="template-mapping-accordion"> - <div id="accordion"> + <div class="accordion" id="listAccordion"> <div class="card"> <div class="card-header" id="headingThree"> <h5 class="mb-0 d-flex justify-content-between"> @@ -16,12 +16,12 @@ </h5> </div> - <div id="collapseThree" class="collapse show" aria-labelledby="headingThree" data-parent="#accordion"> + <div id="collapseThree" class="collapse show" aria-labelledby="headingThree" data-parent="#listAccordion"> <div class="card-body max-height-list"> <div class="row"> <!-- <div class="col-4" style="color:white" *ngFor="let file of templates.files | keyvalue; let mapIndex = index">--> <div class="col-4" *ngFor="let file of getKeys(templateAndMappingMap)"> - <a (click)="setSourceCodeEditor(file)" class="template-mapping-list active">{{file}} + <a (click)="setSourceCodeEditor(file)" class="template-mapping-list" [ngClass]="{'active':currentFile == file}">{{file}} <span *ngIf="getValue(file).isMapping">Mapping</span> <span *ngIf="getValue(file).isTemplate">Template</span> </a> 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 372fbca03..448899019 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 @@ -17,6 +17,7 @@ export class TemplMappListingComponent implements OnInit { private templates: Template; private mapping: Mapping; isCreate = true; + currentFile: string; constructor( private packageCreationStore: PackageCreationStore, @@ -72,6 +73,7 @@ export class TemplMappListingComponent implements OnInit { } setSourceCodeEditor(key: string) { + this.currentFile = key; const templateKey = 'Templates/' + key + '-template.vtl'; this.packageCreationStore.state$.subscribe(cba => { console.log('cba ------'); |