diff options
author | shaaban Altanany <shaaban.eltanany.ext@orange.com> | 2020-01-05 12:03:05 +0200 |
---|---|---|
committer | shaaban Altanany <shaaban.eltanany.ext@orange.com> | 2020-01-05 14:30:43 +0200 |
commit | 077b1ab152c61695ac4d007035dfb81e9aef2c61 (patch) | |
tree | 62d9d465e0273be7d5c57127ed9afb6389303ca9 /cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab | |
parent | 4f4e2de08d3c6259da2497950a96d549d3e82f8a (diff) |
add importTab component in package creation
Issue-ID: CCSDK-2016
Signed-off-by: shaaban Altanany <shaaban.eltanany.ext@orange.com>
Change-Id: I828f9891863224cd3c70dbcaf1149efdff394c6e
Diffstat (limited to 'cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab')
4 files changed, 94 insertions, 0 deletions
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.css b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.css new file mode 100644 index 000000000..e69de29bb --- /dev/null +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.css 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 new file mode 100644 index 000000000..fc1015ca0 --- /dev/null +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.html @@ -0,0 +1,23 @@ +<div class="center"> + <ngx-file-drop dropZoneLabel="Drop files here" (onFileDrop)="dropped($event)" + (onFileOver)="fileOver($event)" (onFileLeave)="fileLeave($event)"> + gi<ng-template ngx-file-drop-content-tmp let-openFileSelector="openFileSelector"> + Optional custom content that replaces the the entire default content. + <button type="button" (click)="openFileSelector()">Browse Files</button> + </ng-template> + </ngx-file-drop> + <div class="upload-table"> + <table class="table"> + <thead> + <tr> + <th>Name</th> + </tr> + </thead> + <tbody class="upload-name-style"> + <tr *ngFor="let item of files; let i=index"> + <td><strong>{{ item.relativePath }}</strong></td> + </tr> + </tbody> + </table> + </div> +</div> diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.spec.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.spec.ts new file mode 100644 index 000000000..a51a83a13 --- /dev/null +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { ImportsTabComponent } from './imports-tab.component'; + +describe('ImportsTabComponent', () => { + let component: ImportsTabComponent; + let fixture: ComponentFixture<ImportsTabComponent>; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ ImportsTabComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(ImportsTabComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); 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 new file mode 100644 index 000000000..8aa9d5e6d --- /dev/null +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.ts @@ -0,0 +1,46 @@ +import {Component, OnInit} from '@angular/core'; +import {NgxFileDropEntry, FileSystemFileEntry, FileSystemDirectoryEntry} from 'ngx-file-drop'; +import {PackageCreationStore} from '../package-creation.store'; + + +@Component({ + selector: 'app-imports-tab', + templateUrl: './imports-tab.component.html', + styleUrls: ['./imports-tab.component.css'] +}) +export class ImportsTabComponent { + constructor(private packageCreationStore: PackageCreationStore) { + } + + public files: NgxFileDropEntry[] = []; + + public dropped(files: NgxFileDropEntry[]) { + this.files = files; + for (const droppedFile of files) { + + // Is it a file? + if (droppedFile.fileEntry.isFile) { + const fileEntry = droppedFile.fileEntry as FileSystemFileEntry; + fileEntry.file((file: File) => { + console.log(droppedFile.relativePath, file); + this.packageCreationStore.addDefinition(droppedFile.relativePath, ''); + + }); + } else { + // It was a directory (empty directories are added, otherwise only files) + const fileEntry = droppedFile.fileEntry as FileSystemDirectoryEntry; + console.log(droppedFile.relativePath, fileEntry); + this.packageCreationStore.addDefinition(droppedFile.relativePath, ''); + + } + } + } + + public fileOver(event) { + console.log(event); + } + + public fileLeave(event) { + console.log(event); + } +} |