Homec4science
Diffusion svg-test-app (master) Browse

svg-test-app/src/app/navigation-list-component/navigation-list-component.component.html
706c5c09069dmaster

Last Change
Raw File

navigation-list-component.component.html
View Options

<mat-card class="fixed-nav-header"><mat-toolbar>Navigation</mat-toolbar>
<div *ngIf="newNavigationDef.newNavigationTreeIndex && newNavigationDef.newNavigationTreeIndex[queryParams.navTreeIndex].subTrees" class="man-selection">
<mat-form-field appearance="fill">
<mat-label>{{newNavigationDef.newNavigationTreeIndex[queryParams.navTreeIndex].subTreeLabel}}</mat-label>
<mat-select [(ngModel)] = "selectedManuscriptGroupId" (selectionChange)="changeManuscriptNavTree(selectedManuscriptGroupId)">
<mat-option *ngFor="let manSel of newNavigationDef.newNavigationTreeIndex[queryParams.navTreeIndex].subTrees" [value] ="manSel.idx" matTooltip= {{manSel.description}}>{{manSel.label}}</mat-option>
</mat-select>
</mat-form-field>
</div>
<mat-card *ngIf="newNavigationDef.newNavigationTreeIndex">
<nav mat-tab-nav-bar>
<a mat-tab-link
*ngFor="let tree of newNavigationDef.newNavigationTreeIndex"
[active]="tree.idx === queryParams.navTreeIndex"
#tabFocus
(click)="changeMainNavTree(tree.idx)">
<h4 [ngStyle]="{'color': tree.idx === queryParams.navTreeIndex ? 'accent' : 'primary' }">{{tree.label}}</h4>
</a>
</nav>
<div *ngIf="queryParams.man"><h3>Manuskript {{queryParams.man}}</h3></div>
</mat-card>
</mat-card>
<div class="navlist-container">
<mat-nav-list *ngIf="navTreeData">
<mat-list-item *ngFor="let item of navTreeData"
(click)="onSelectNavItem(item)"
[id] = "item.tlnEntity.id"
[class.active-item]="isItemSelected(item.tlnEntity.id)">
<div>
<div>
<h4 matLine>{{item.tlnEntity.label}}</h4>
</div>
<img class="thumbnail" *ngIf="item.thumb" [src]="item.thumb"/>
<mat-icon *ngIf="!item.thumb" matListIcon >description</mat-icon>
<mat-divider></mat-divider>
</div>
</mat-list-item>
</mat-nav-list>
</div>
c4science · Help