Skip to content
Snippets Groups Projects
Commit 3dc09062 authored by Kristof De Langhe's avatar Kristof De Langhe
Browse files

55693: Tabset

parent 315b6a96
Branches
Tags
No related merge requests found
......@@ -18,6 +18,10 @@
"head": "Item Mapper - Map Items from Other Collections",
"collection": "Collection: \"<b>{{name}}</b>\"",
"description": "This is the item mapper tool that allows collection administrators to map items from other collections into this collection. You can search for items from other collections and map them, or browse the list of currently mapped items.",
"tabs": {
"browse": "Browse",
"map": "Map"
},
"return": "Return"
}
},
......
......@@ -14,30 +14,23 @@
</ds-search-form>
</div>
</div>
<ul class="nav nav-tabs mb-2">
<li class="nav-item">
<span class="tab nav-link" id="tab-browse-content" (click)="activeTab = 0" [ngClass]="(activeTab == 0)?'active':''">Browse</span>
</li>
<li class="nav-item">
<span class="tab nav-link" id="tab-map-content" (click)="activeTab = 1" [ngClass]="(activeTab == 1)?'active':''">Map</span>
</li>
</ul>
<div class="tab-content">
<!-- Browse Tab -->
<div *ngIf="activeTab == 0" id="tab-browse">
<ds-viewable-collection
[config]="(searchOptions$ | async)?.pagination"
[sortConfig]="(searchOptions$ | async)?.sort"
[objects]="collectionItemsRD$ | async">
</ds-viewable-collection>
</div>
<!-- Map Tab -->
<div *ngIf="activeTab == 1" id="tab-map">
<ds-item-select [itemsRD$]="mappingItemsRD$" [paginationOptions]="(searchOptions$ | async)?.pagination"></ds-item-select>
</div>
</div>
<ngb-tabset>
<ngb-tab title="{{'collection.item-mapper.tabs.browse' | translate}}">
<ng-template ngbTabContent>
<ds-viewable-collection
[config]="(searchOptions$ | async)?.pagination"
[sortConfig]="(searchOptions$ | async)?.sort"
[objects]="collectionItemsRD$ | async">
</ds-viewable-collection>
</ng-template>
</ngb-tab>
<ngb-tab title="{{'collection.item-mapper.tabs.map' | translate}}">
<ng-template ngbTabContent>
<ds-item-select [itemsRD$]="mappingItemsRD$" [paginationOptions]="(searchOptions$ | async)?.pagination"></ds-item-select>
</ng-template>
</ngb-tab>
</ngb-tabset>
<button [routerLink]="['/collections/', (collectionRD$ | async)?.payload?.id]" class="btn btn-outline-secondary">{{'collection.item-mapper.return' | translate}}</button>
</div>
......
@import '../../../styles/variables.scss';
.tab:hover {
cursor: pointer;
}
......@@ -32,8 +32,6 @@ export class CollectionItemMapperComponent implements OnInit {
collectionItemsRD$: Observable<RemoteData<PaginatedList<DSpaceObject>>>;
mappingItemsRD$: Observable<RemoteData<PaginatedList<DSpaceObject>>>;
activeTab = 0;
constructor(private collectionDataService: CollectionDataService,
private route: ActivatedRoute,
private router: Router,
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment