cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/import-package/import-package.component.html

   1 <div class="modal fade" id="importPackageModal" tabindex="-1" role="dialog" aria-labelledby="importPackageModal"
   2      aria-hidden="true">
   3     <div class="modal-dialog" role="document">
   4         <div class="modal-content">
   5             <div class="modal-header">
   6                 <h5 class="modal-title" id="importModalLabel">Import File</h5>
   7                 <button type="button" class="close" data-dismiss="modal" aria-label="Close">
   8                     <!-- <span aria-hidden="true">&times;</span> -->
   9                     <img src="assets/img/icon-close.svg"/>
  10                 </button>
  11             </div>
  12             <div class="modal-body">
  13                 <ngx-file-drop accept=".zip" dropZoneLabel="Drop files here" (onFileDrop)="dropped($event)"
  14                                (onFileOver)="fileOver($event)" (onFileLeave)="fileLeave($event)">
  15                     <ng-template ngx-file-drop-content-tmp let-openFileSelector="openFileSelector">
  16                         <div class="folder-upload">
  17                             <img src="assets/img/folder-upload.svg"/>
  18                         </div>
  19                         <div class="folder-upload-text">
  20                             Drag & Drop file
  21                         </div>
  22                         <div class="folder-upload-text">or
  23                             <button type="button" class="btn btn-sm btn-primary" (click)="openFileSelector()">Browse
  24                                 Files
  25                             </button>
  26                         </div>
  27                         <div class="folder-upload-type">Allowed file type: zip</div>
  28                     </ng-template>
  29                 </ngx-file-drop>
  30                 <div class="upload-table">
  31                     <table class="table">
  32                         <thead>
  33                         <tr *ngFor="let item of uploadedFiles; let i=index">
  34                             <th width="40"><img src="assets/img/icon-file-code.svg"/></th>
  35                             <th>{{ item.name }}</th>
  36                             <th (click)="removeInitFile(i)" width="40" class="text-right"><img
  37                                     src="assets/img/icon-remove-file.svg"/></th>
  38                         </tr>
  39                         </thead>
  40                     </table>
  41                 </div>
  42             </div>
  43             <div class="modal-footer">
  44                 <button type="button" class="btn btn-sm btn-secondary" data-dismiss="modal"
  45                         (click)="resetTheUploadedFiles()">Cancel
  46                 </button>
  47                 <button type="button" class="btn btn-sm btn-primary" [disabled]="uploadedFiles?.length<=0"
  48                         data-dismiss="modal" (click)="openFilesInCreationPackage();saveFileToStore()">
  49                     Import
  50                 </button>
  51             </div>
  52         </div>
  53     </div>
  54 </div>