diff options
8 files changed, 104 insertions, 36 deletions
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 9858fd580..e18923154 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 @@ -31,7 +31,7 @@ export class ImportsTabComponent implements OnInit { this.files = files; for (const droppedFile of files) { // Is it a file? & Not added before - if (droppedFile.fileEntry.isFile && !this.fileNames.has(droppedFile.fileEntry.name)) { + if (droppedFile.fileEntry.isFile) { const fileEntry = droppedFile.fileEntry as FileSystemFileEntry; this.uploadedFiles.push(fileEntry); console.log(fileEntry.name); 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 a85ccf146..63a734726 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 @@ -35,7 +35,7 @@ export class ScriptsTabComponent implements OnInit { this.files = files; for (const droppedFile of files) { // Is it a file & Not added before ? - if (droppedFile.fileEntry.isFile && !this.fileNames.has(droppedFile.fileEntry.name)) { + if (droppedFile.fileEntry.isFile) { const fileEntry = droppedFile.fileEntry as FileSystemFileEntry; this.uploadedFiles.push(fileEntry); console.log(fileEntry.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.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 164f0ac73..fdf10e0a9 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 @@ -1,7 +1,8 @@ <div class="row template-mapping-action"> <div class="col"> - <h6 class="create-title">Create Template</h6> + <h6 [hidden]="edit" class="create-title">Create Template</h6> + <button (click)="closeCreationForm()" [hidden]="!edit" class="btn btn-outline-secondary"><i class="fa fa-chevron-left mr-2"></i>Template List</button> </div> <div class="col text-right"> <button (click)="cancel()" [disabled]="fileName?.length <=0" class="btn btn-outline-secondary">Cancel</button> @@ -116,7 +117,7 @@ </div> </div> <div id="mapping-table" [hidden]="resourceDictionaryRes?.length == 0" class="mx-4 my-2"> - <table datatable [dtOptions]="dtOptions" [dtTrigger]="dtTrigger" class="row-border hover"> + <table datatable [dtOptions]="initDtOptions" [dtTrigger]="dtTrigger" class="row-border hover"> <thead> <tr> <th>Required</th> @@ -164,7 +165,7 @@ </table> </div> - <div id="mapping-table" [hidden]="mappingRes?.length == 0" class="mx-4 my-2"> + <div id="mapping-table-res" [hidden]="mappingRes?.length == 0" class="mx-4 my-2"> <table datatable [dtOptions]="dtOptions" [dtTrigger]="resTableDtTrigger" class="row-border hover"> <thead> <tr> 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 5129b38d9..7b777696f 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 { templateInfo = new TemplateInfo(); variables: string[] = []; dtOptions: DataTables.Settings = {}; + initDtOptions: DataTables.Settings = {}; // 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(); @@ -62,7 +63,6 @@ export class TemplMappCreationComponent implements OnInit, OnDestroy { console.log('URL contains Id'); this.sharedService.enableEdit(); } - this.templateStore.state$.subscribe(templateInfo => { // init Template&mapping vars console.log('Oninit'); @@ -108,12 +108,18 @@ export class TemplMappCreationComponent implements OnInit, OnDestroy { } }); - this.dtOptions = { + this.initDtOptions = { pagingType: 'full_numbers', pageLength: 25, destroy: true, retrieve: true, }; + this.dtOptions = { + pagingType: 'full_numbers', + pageLength: 25, + // destroy: true, + // retrieve: true, + }; } getFileExtension() { @@ -164,7 +170,7 @@ export class TemplMappCreationComponent implements OnInit, OnDestroy { this.files = files; for (const droppedFile of files) { // Is it a file? & Not added before - if (droppedFile.fileEntry.isFile && !this.fileNames.has(droppedFile.fileEntry.name)) { + if (droppedFile.fileEntry.isFile) { const fileEntry = droppedFile.fileEntry as FileSystemFileEntry; this.uploadedFiles.push(fileEntry); this.fileNames.add(fileEntry.name); @@ -191,6 +197,7 @@ export class TemplMappCreationComponent implements OnInit, OnDestroy { this.variables = fileReader.result.toString().split(','); console.log(this.variables); this.getMappingTableFromTemplate(null); + }; fileReader.readAsText(file); }); @@ -285,7 +292,7 @@ export class TemplMappCreationComponent implements OnInit, OnDestroy { this.mappingRes = []; this.currentMapping = {}; this.currentTemplate = {}; - this.closeCreationForm(); + // this.closeCreationForm(); } saveToStore() { if (this.fileName) { @@ -304,11 +311,11 @@ export class TemplMappCreationComponent implements OnInit, OnDestroy { this.resourceDictionaryRes = []; } // Save Template to store - if (this.templateFileContent) { - this.packageCreationStore.addTemplate('Templates/' + this.fileName + '-template' + this.getFileExtension(), - this.templateFileContent); - this.templateFileContent = ''; - } + // 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'); this.closeCreationForm(); @@ -350,17 +357,19 @@ export class TemplMappCreationComponent implements OnInit, OnDestroy { } rerender(): void { - if (this.dtElement.dtInstance) { - console.log('rerender'); - this.dtElement.dtInstance.then((dtInstance: DataTables.Api) => { - dtInstance.destroy(); - this.dtElement.dtOptions = this.dtOptions; - this.dtElement.dtTrigger.next(); - dtInstance.draw(); - }); - } else { - this.dtTrigger.next(); - } + this.dtTrigger.next(); + + // if (this.dtElement.dtInstance) { + // console.log('rerender'); + // this.dtElement.dtInstance.then((dtInstance: DataTables.Api) => { + // dtInstance.destroy(); + // this.dtElement.dtOptions = this.dtOptions; + // this.dtElement.dtTrigger.next(); + // dtInstance.draw(); + // }); + // } else { + // this.dtTrigger.next(); + // } } ngOnDestroy(): void { 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 054b5686e..f330b2f83 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 @@ -1,3 +1,23 @@ .template-mapping-list { cursor: pointer; +} + +a.accordion-delete i { + color: red; +} + +a.accordion-delete i:hover { + color: #007bff; + cursor: pointer; + transition-duration: .5s; + /* for Safari & Chrome */ + -webkit-transition-duration: .5s; +} + +a.accordion-delete { + margin-top: 0; +} + +.template-mapping-list p{ + display: contents; }
\ 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 6ae5c1122..3a7b0225e 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,11 +4,11 @@ <div class="template-mapping-accordion" [hidden]="templateAndMappingMap?.size <= 0"> - <div class="accordion" id="listAccordion"> + <div class="" id="listAccordion"> <div class="card"> <div class="card-header" id="headingThree"> <h5 class="mb-0 d-flex justify-content-between"> - <button class="btn btn-link" data-toggle="collapse" data-target="#collapseThree" + <button class="btn" data-toggle="collapse" data-target="#collapseThree" aria-expanded="true" aria-controls="collapseThree"> Template and Mapping List </button> @@ -16,20 +16,21 @@ </h5> </div> - <div id="collapseThree" class="collapse show" aria-labelledby="headingThree" data-parent="#listAccordion"> + <div id="collapseThree" class="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" - [ngClass]="{'active':currentFile == file}">{{file}} + <a class="template-mapping-list" [ngClass]="{'active':currentFile == file}"> + <p (click)="setSourceCodeEditor(file)">{{file}}</p> <span *ngIf="getValue(file).isMapping">Mapping</span> <span *ngIf="getValue(file).isTemplate">Template</span> - <button type="button" class="deleteTemplate" title="Delete Template"> - <i class="icon-delete-sm"></i> - </button> + + <a data-toggle="modal" (click)="initDelete(file)" data-target="#templateDeletionModal" + class="accordion-delete deleteTemplate" title="Delete Template"><i + class="icon-delete-sm"></i></a> </a> - + </div> </div> </div> @@ -37,4 +38,28 @@ </div> </div> +</div> + +<!-- Delete Modal --> +<div class="modal fade" id="templateDeletionModal" tabindex="-1" role="dialog" + aria-labelledby="templateDeletionModalLabel" aria-hidden="true"> + <div class="modal-dialog" role="document"> + <div class="modal-content"> + <div class="modal-header"> + <h5 class="modal-title" id="templateDeletionModalLabel">Delete Script</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 Template file + <span>{{fileToDelete}}</span>?</p> + </div> + <div class="modal-footer"> + <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button> + <button type="button" (click)="condifrmDelete()" data-dismiss="modal" + class="btn btn-primary">Delete</button> + </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 338c8f7cd..2e4d8c6e3 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 @@ -21,6 +21,7 @@ export class TemplMappListingComponent implements OnInit { isCreate = true; currentFile: string; edit = false; + fileToDelete: any = {}; constructor( private packageCreationStore: PackageCreationStore, @@ -122,5 +123,17 @@ export class TemplMappListingComponent implements OnInit { getValue(file: string) { return this.templateAndMappingMap.get(file); } + initDelete(file) { + console.log(file); + this.fileToDelete = file; + } + condifrmDelete() { + console.log(this.templateAndMappingMap); + this.templateAndMappingMap.delete(this.fileToDelete); + if (this.templateAndMappingMap.size <= 0) { + this.openCreationView(); + } + + } } diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/template-mapping.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/template-mapping.component.html index 80df7c637..f4f305ee9 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/template-mapping.component.html +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/template-mapping.component.html @@ -1,5 +1,5 @@ -<div *ngIf="!listView"> - <app-templ-mapp-listing (showCreationViewParentNotification)="openCreationView($event)" +<div [hidden]="listView"> + <app-templ-mapp-listing [hidden]="!creationView" (showCreationViewParentNotification)="openCreationView($event)" (showFullView)="openListView($event)"> </app-templ-mapp-listing> </div> |