60 lines
2.1 KiB
HTML
Raw Normal View History

2019-11-15 17:32:48 +09:00
<cdk-virtual-scroll-viewport #cvsvGroup itemSize="80" fxFlexFill>
<ng-container
*cdkVirtualFor="let node of dataSource.expandedData$"
></ng-container>
<mat-tree
#groupTree
[dataSource]="dataSource"
[treeControl]="treeControl"
class="group-tree"
>
2019-11-15 17:32:48 +09:00
<!-- This is the tree node template for leaf nodes -->
2019-11-18 15:02:47 +09:00
<mat-tree-node *matTreeNodeDef="let node">
2019-11-15 17:32:48 +09:00
<li>
<div class="mat-tree-node">
<ng-container
[ngTemplateOutlet]="expansionPanelItemTemplateRef"
[ngTemplateOutletContext]="{ $implicit: node?.userInfo }"
>
</ng-container>
2019-11-18 15:02:47 +09:00
<!--{{ node?.userInfo?.name }}-->
2019-11-15 17:32:48 +09:00
</div>
</li>
</mat-tree-node>
<!-- This is the tree node template for expandable nodes -->
<mat-tree-node
*matTreeNodeDef="let node; when: hasChild"
class="tree-node-frame"
>
<li>
2019-11-18 15:02:47 +09:00
<div class="path">
2019-11-15 17:32:48 +09:00
<button
mat-icon-button
matTreeNodeToggle
[attr.aria-label]="'toggle '"
2019-11-18 15:02:47 +09:00
class="btn-toggle"
2019-11-15 17:32:48 +09:00
>
<mat-icon class="mat-icon-rtl-mirror">
2019-11-18 15:02:47 +09:00
{{ treeControl.isExpanded(node) ? 'expand_less' : 'expand_more' }}
2019-11-15 17:32:48 +09:00
</mat-icon>
</button>
<ng-container [ngSwitch]="node.nodeType">
<span *ngSwitchCase="NodeType.Profile">Profile</span>
<span *ngSwitchCase="NodeType.Favorit">Favorit</span>
<span *ngSwitchCase="NodeType.Buddy">Buddy</span>
</ng-container>
2019-11-18 15:02:47 +09:00
<button mat-icon-button aria-label="group menu" *ngIf="!checkable" (click)="onClickMore($event, groupBuddy.group)" class="group-menu">
<mat-icon>more_vert</mat-icon>
</button>
2019-11-15 17:32:48 +09:00
</div>
<ul [class.group-tree-node-invisible]="!treeControl.isExpanded(node)">
<div *ngIf="treeControl.isExpanded(node)" class="boxnone">
<div class="vertical-line"></div>
<ng-container matTreeNodeOutlet></ng-container>
</div>
</ul>
</li>
</mat-tree-node>
</mat-tree>
</cdk-virtual-scroll-viewport>