enable delete button in upload modal.

Disable import button when thre is no file

Issue-ID: CCSDK-2402

Signed-off-by: AhmedEldeeb50 <ahmed.eldeeb.ext@orange.com>
Change-Id: Idb119170646eb7cac1d75bafabc90e7fb452ad60

6 files changed, 26 insertions, 12 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 d487de3d1..593dc1d0e 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
@@ -144,7 +144,8 @@
                             <tr *ngFor="let item of uploadedFiles; let i=index">
                                 <th width="40"><img src="assets/img/icon-file-code.svg" /></th>
                                 <th>{{ item.name }}</th>
-                                <th width="40" class="text-right"><img src="assets/img/icon-remove-file.svg" /></th>
+                                <th (click)="removeInitFile(i)" width="40" class="text-right"><img
+                                        src="assets/img/icon-remove-file.svg" /></th>
                             </tr>
                         </thead>
                     </table>
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 e18923154..35c531aec 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
@@ -26,7 +26,9 @@ export class ImportsTabComponent implements OnInit {
             }
         });
     }
-
+    removeInitFile(index) {
+        this.uploadedFiles.splice(index, 1);
+    }
     public dropped(files: NgxFileDropEntry[]) {
         this.files = files;
         for (const droppedFile of files) {
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 1ecf2985e..6688a9202 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
@@ -106,7 +106,7 @@
                             <tr *ngFor="let item of uploadedFiles; let i=index">
                                 <th width="40"><img src="assets/img/icon-file-code.svg" /></th>
                                 <th>{{ item.name }}</th>
-                                <th width="40" class="text-right"><img src="assets/img/icon-remove-file.svg" /></th>
+                                <th (click)="removeInitFile(i)" width="40" class="text-right"><img src="assets/img/icon-remove-file.svg" /></th>
                             </tr>
                         </thead>
                     </table>
@@ -116,7 +116,7 @@
                 <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()" class="btn btn-sm btn-primary" [disabled]="uploadedFiles?.length<=0" data-dismiss="modal" type="button">
                     Import
                 </button>
             </div>
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 63a734726..c3704365c 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
@@ -44,6 +44,11 @@ export class ScriptsTabComponent implements OnInit {
             }
         }
     }
+
+    removeInitFile(index) {
+        this.uploadedFiles.splice(index, 1);
+    }
+
     initDelete(file) {
         this.fileToDelete = 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 fdf10e0a9..99b085507 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,8 +1,8 @@
-
 <div class="row template-mapping-action">
     <div class="col">
         <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>
+        <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>
@@ -252,7 +252,7 @@
                             <tr *ngFor="let item of uploadedFiles; let i=index">
                                 <th width="40"><img src="assets/img/icon-file-code.svg" /></th>
                                 <th>{{ item.name }}</th>
-                                <th width="40" class="text-right"><img src="assets/img/icon-remove-file.svg" /></th>
+                                <th (click)="removeFile(i)" width="40" class="text-right"><img src="assets/img/icon-remove-file.svg" /></th>
                             </tr>
                         </thead>
                     </table>
@@ -260,12 +260,11 @@
             </div>
 
             <div class="modal-footer">
-                <button type="button" class="btn btn-sm btn-secondary" data-dismiss="modal"
+                <button type="button" class="btn btn-sm btn-secondary btn-cancel" data-dismiss="modal"
                     (click)="resetTheUploadedFiles()">Cancel
                 </button>
 
-                <button (click)="uploadFile();openListView()" class="btn btn-sm btn-primary" data-dismiss="modal"
-                    type="button">
+                <button data-dismiss="modal" (click)="uploadFile()" class="btn btn-sm btn-primary" type="button">
                     Import
                 </button>
             </div>
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 7b777696f..5feb76e06 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
@@ -1,4 +1,4 @@
-import { Component, EventEmitter, OnDestroy, OnInit, Output, ViewChild, AfterViewInit, ElementRef } from '@angular/core';
+import { Component, EventEmitter, OnDestroy, OnInit, Output, ViewChild } from '@angular/core';
 import { FileSystemFileEntry, NgxFileDropEntry } from 'ngx-file-drop';
 import { PackageCreationStore } from '../../package-creation.store';
 import { TemplateInfo, TemplateStore } from '../../template.store';
@@ -9,8 +9,9 @@ import { Mapping, MappingAdapter } from '../../mapping-models/mappingAdapter.mod
 import { PackageCreationUtils } from '../../package-creation.utils';
 import { JsonConvert, Any } from 'json2typescript';
 import { ToastrService } from 'ngx-toastr';
-import { Router, ActivatedRoute } from '@angular/router';
+import { ActivatedRoute } from '@angular/router';
 import { SharedService } from '../shared-service';
+declare var $: any;
 
 @Component({
     selector: 'app-templ-mapp-creation',
@@ -178,6 +179,9 @@ export class TemplMappCreationComponent implements OnInit, OnDestroy {
             }
         }
     }
+    removeFile(index) {
+        this.uploadedFiles.splice(index, 1);
+    }
 
     uploadFile() {
         this.dependancies.clear();
@@ -187,6 +191,9 @@ export class TemplMappCreationComponent implements OnInit, OnDestroy {
         } else {
             this.setTemplateFilesToStore();
         }
+        $('.btn-cancel').click();
+
+
     }
 
     fetchCSVkeys() {