63 lines
1.9 KiB
HTML
63 lines
1.9 KiB
HTML
<div class="ucap-organization-tree-container" fxFlexFill>
|
|
<cdk-virtual-scroll-viewport #cvsvList perfectScrollbar fxFlexFill>
|
|
<ng-container
|
|
*cdkVirtualFor="let node of dataSource.expandedData$"
|
|
></ng-container>
|
|
|
|
<mat-tree #treeList [dataSource]="dataSource" [treeControl]="treeControl">
|
|
<mat-tree-node
|
|
*matTreeNodeDef="let node"
|
|
matTreeNodePadding
|
|
matTreeNodePaddingIndent="20"
|
|
class="tree-no-child"
|
|
>
|
|
<li
|
|
(click)="onClickNode(node)"
|
|
matRipple
|
|
[ngClass]="
|
|
currentDeptSeq === node?.data?.deptInfo?.seq ? 'current' : ''
|
|
"
|
|
>
|
|
<div class="tree-node-body">
|
|
{{ node?.data?.deptInfo | ucapOrganizationTranslate: 'name' }}
|
|
</div>
|
|
</li>
|
|
</mat-tree-node>
|
|
|
|
<mat-tree-node
|
|
*matTreeNodeDef="let node; when: hasChild"
|
|
matTreeNodePadding
|
|
matTreeNodePaddingIndent="20"
|
|
class="tree-has-child"
|
|
>
|
|
<li (click)="onClickNode(node)" matRipple>
|
|
<div
|
|
class="tree-node-body"
|
|
[ngClass]="
|
|
currentDeptSeq === node?.data?.deptInfo.seq ? 'current' : ''
|
|
"
|
|
>
|
|
<span class="horizontal-line"></span>
|
|
<button
|
|
mat-icon-button
|
|
color="accent"
|
|
matTreeNodeToggle
|
|
[attr.aria-label]="'toggle ' + node?.data?.filename"
|
|
>
|
|
<mat-icon
|
|
class="tree-node-expand-btn"
|
|
[@removeAdd]="treeControl.isExpanded(node) ? 'remove' : 'add'"
|
|
>
|
|
{{ treeControl.isExpanded(node) ? 'remove' : 'add' }}
|
|
</mat-icon>
|
|
</button>
|
|
<span class="dept-name">{{
|
|
node?.data?.deptInfo | ucapOrganizationTranslate: 'name'
|
|
}}</span>
|
|
</div>
|
|
</li>
|
|
</mat-tree-node>
|
|
</mat-tree>
|
|
</cdk-virtual-scroll-viewport>
|
|
</div>
|