diff options
author | 2020-01-09 10:15:28 +0200 | |
---|---|---|
committer | 2020-01-12 17:44:43 +0200 | |
commit | c133b83cb2cbf0b3c7a63aad105a56060db2a6df (patch) | |
tree | 6ee9d450ccfd643fa10d133bdfabeacf387186e2 /cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard | |
parent | 4786e0b9ef3b4b82f4ad14bcffafa222628011d6 (diff) |
creating meta data creation component(first tab)
Issue-ID: CCSDK-2014
Signed-off-by: shaaban Altanany <shaaban.eltanany.ext@orange.com>
Change-Id: I35283cbb5b48174606493ecb39c20b9f717a9c06
Diffstat (limited to 'cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard')
6 files changed, 26 insertions, 38 deletions
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/filter-by-tags/filter-by-tags.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/filter-by-tags/filter-by-tags.component.html index 6ce3a53a1..e5ebc315a 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/filter-by-tags/filter-by-tags.component.html +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/filter-by-tags/filter-by-tags.component.html @@ -1,6 +1,6 @@ <div class="dropdown packagesFilter w-100"> <input class="dropdown-toggle" type="text"> - <div class="dropdown-text">ALL PACKAGES TAGS</div> + <div class="dropdown-text">{{checkBoxTages.substr(0,checkBoxTages.length-1)}}</div> <ul class="dropdown-content w-100"> <li> <div class="form-group"> diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/filter-by-tags/filter-by-tags.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/filter-by-tags/filter-by-tags.component.ts index b4007215a..28be5f5c8 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/filter-by-tags/filter-by-tags.component.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/filter-by-tags/filter-by-tags.component.ts @@ -37,7 +37,7 @@ export class TagsFilteringComponent implements OnInit { searchTag = ''; viewedPackages: BlueprintModel[] = []; private checkBoxTages = ''; - + currentPage = 0; constructor(private packagesStore: PackagesStore, ) { @@ -45,13 +45,18 @@ export class TagsFilteringComponent implements OnInit { console.log(state); if (state.page) { this.viewedPackages = state.page.content; + this.tags = []; + if (state.currentPage !== this.currentPage) { + this.checkBoxTages = ''; + this.currentPage = state.currentPage; + } this.viewedPackages.forEach(element => { element.tags.split(',').forEach(tag => { this.tags.push(tag.trim()); }); + this.tags.push('All'); this.tags = this.tags.filter((value, index, self) => self.indexOf(value) === index); this.assignTags(); - }); } }); @@ -80,20 +85,20 @@ export class TagsFilteringComponent implements OnInit { } reloadPackages(event: any) { - if (!event.target.checked) { this.checkBoxTages = this.checkBoxTages.replace(event.target.id + ',', '') .replace(event.target.id, ''); } else { this.checkBoxTages += event.target.id.trim() + ','; } - console.log(this.checkBoxTages); - if (!this.checkBoxTages.includes(',')) { - return; - } - this.viewedPackages = []; - // this.packagesStore.getPagesFilterByTags(this.checkBoxTages); - // this.viewedPackages = this.viewedPackages.filter((value, index, self) => self.indexOf(value) === index); + const tagsSelected = this.checkBoxTages.split(',').filter(item => { + if (item) { + return true; + } + }).map((item) => { + return item.trim(); + }); + this.packagesStore.filterByTags(tagsSelected); } diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.html index 18428d4b4..8bc7adf8c 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.html +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.html @@ -7,7 +7,7 @@ </div> <div class="card-footer row"> <div class="col"> - <a href="#" role="button" aria-pressed="true" class="btn-create-package float">Create Package + <a href="/packages/createPackage" role="button" aria-pressed="true" class="btn-create-package float">Create Package </a> </div> <div class="col"> diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.spec.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.spec.ts index f45f25996..000f9eda1 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.spec.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.spec.ts @@ -4,6 +4,7 @@ import { PackageListComponent } from './package-list.component'; import { PackagesStore } from '../../packages.store'; import { getBluePrintPageMock } from '../../blueprint.page.mock'; import { of } from 'rxjs'; +import {PackagesDashboardState} from '../../model/packages-dashboard.state'; describe('PackageListComponent', () => { let component: PackageListComponent; @@ -12,7 +13,9 @@ describe('PackageListComponent', () => { beforeEach(async(() => { - store = { state$: of(getBluePrintPageMock()) }; + const dashBoard = new PackagesDashboardState(); + dashBoard.page = getBluePrintPageMock(); + store = { state$: of(dashBoard) }; TestBed.configureTestingModule({ declarations: [ PackageListComponent ], diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.ts index c7ec0af20..049801227 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.ts @@ -16,8 +16,8 @@ export class PackageListComponent implements OnInit { console.log('PackageListComponent'); this.packagesStore.state$.subscribe(state => { console.log(state); - if (state.page) { - this.viewedPackages = state.page.content; + if (state.filteredPackages) { + this.viewedPackages = state.filteredPackages.content; } }); } diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/packages-dashboard.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/packages-dashboard.component.html index ac510893b..7928f2d91 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/packages-dashboard.component.html +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/packages-dashboard.component.html @@ -2,7 +2,7 @@ </app-header> <div class="new-wrapper"> <div class="container-fluid main-container"> - + <app-packages-header></app-packages-header> <div class="container-fluid body-container"> <nav class="row"> <!--Nav Tabs--> @@ -31,31 +31,11 @@ <div class="col-5 pl-2"> <app-filter-by-tags class="w-100"></app-filter-by-tags> </div> - + </div> </div> </nav> - <div class="row mt-4"> - <div class="col"> - <div class="tab-content" id="nav-tabContent"> - <div class="tab-pane fade show active" id="nav-home" role="tabpanel" aria-labelledby="nav-home-tab"> - <div class="row"> - <div class="col sort-packages"> - - </div> - <app-package-pagination></app-package-pagination> - - </div> - <app-packages-list></app-packages-list> - - </div> - <div class="tab-pane fade" id="nav-profile" role="tabpanel" aria-labelledby="nav-profile-tab">...</div> - <div class="tab-pane fade" id="nav-contact" role="tabpanel" aria-labelledby="nav-contact-tab">...</div> - <div class="tab-pane fade" id="nav-contact1" role="tabpanel" aria-labelledby="nav-contact1-tab">... - </div> - </div> - </div> - </div> + <app-sort-packages></app-sort-packages> </div> </div> </div> |