TSK-1564: Make scrolling in classification list smoother
This commit is contained in:
parent
ec822c1168
commit
385780d138
|
@ -1,17 +1,16 @@
|
|||
<tree-root #tree [nodes]="treeNodes" [options]="options" (activate)="onActivate($event)" (deactivate)="onDeactivate($event)"
|
||||
(moveNode)="onMoveNode($event)" (treeDrop)="onDrop($event)">
|
||||
<ng-template #treeNodeTemplate let-node let-index="index">
|
||||
<span class="text-top">
|
||||
<svg-icon
|
||||
*ngIf="node.data.category"
|
||||
class="fa-fw pr-1"
|
||||
[src]="(getCategoryIcon(node.data.category) | async)?.left"
|
||||
matTooltip="{{(getCategoryIcon(node.data.category) | async)?.right}}">
|
||||
</svg-icon>
|
||||
</span>
|
||||
<span>
|
||||
<strong>{{ node.data.key }}</strong>
|
||||
</span>
|
||||
<span> - {{ node.data.name }}</span>
|
||||
<span class="tree__svg-icon">
|
||||
<svg-icon
|
||||
*ngIf="node.data.category"
|
||||
[src]="getCategoryIcon(node.data.category).left"
|
||||
matTooltip="{{getCategoryIcon(node.data.category).right}}">
|
||||
</svg-icon>
|
||||
</span>
|
||||
<span>
|
||||
<strong>{{ node.data.key }}</strong>
|
||||
</span>
|
||||
<span> - {{ node.data.name }}</span>
|
||||
</ng-template>
|
||||
</tree-root>
|
||||
|
|
|
@ -1,8 +1,5 @@
|
|||
.text-top {
|
||||
.tree__svg-icon {
|
||||
vertical-align: text-top;
|
||||
}
|
||||
|
||||
svg-icon {
|
||||
padding-right: 4px;
|
||||
fill: #555;
|
||||
top: -5px !important;
|
||||
}
|
||||
|
|
|
@ -40,6 +40,7 @@ import { Pair } from '../../../shared/models/pair';
|
|||
})
|
||||
export class TaskanaTreeComponent implements OnInit, AfterViewChecked, OnDestroy {
|
||||
treeNodes: TreeNodeModel[];
|
||||
categoryIcons: ClassificationCategoryImages;
|
||||
|
||||
@Input() selectNodeId: string;
|
||||
@Input() filterText: string;
|
||||
|
@ -60,6 +61,7 @@ export class TaskanaTreeComponent implements OnInit, AfterViewChecked, OnDestroy
|
|||
}
|
||||
},
|
||||
useVirtualScroll: true,
|
||||
scrollOnActivate: false,
|
||||
levelPadding: 20,
|
||||
allowDrag: true,
|
||||
allowDrop: true
|
||||
|
@ -113,6 +115,10 @@ export class TaskanaTreeComponent implements OnInit, AfterViewChecked, OnDestroy
|
|||
this.deselectActiveNode();
|
||||
}
|
||||
});
|
||||
|
||||
this.categoryIcons$.pipe(takeUntil(this.destroy$)).subscribe((categoryIcons) => {
|
||||
this.categoryIcons = categoryIcons;
|
||||
});
|
||||
}
|
||||
|
||||
ngAfterViewChecked(): void {
|
||||
|
@ -168,14 +174,10 @@ export class TaskanaTreeComponent implements OnInit, AfterViewChecked, OnDestroy
|
|||
}
|
||||
}
|
||||
|
||||
getCategoryIcon(category: string): Observable<Pair<string, string>> {
|
||||
return this.categoryIcons$.pipe(
|
||||
map((iconMap) =>
|
||||
iconMap[category]
|
||||
? { left: iconMap[category], right: category }
|
||||
: { left: iconMap.missing, right: 'Category does not match with the configuration' }
|
||||
)
|
||||
);
|
||||
getCategoryIcon(category: string): Pair<string, string> {
|
||||
return this.categoryIcons[category]
|
||||
? { left: this.categoryIcons[category], right: category }
|
||||
: { left: this.categoryIcons.missing, right: 'Category does not match with the configuration' };
|
||||
}
|
||||
|
||||
switchTaskanaSpinner(active: boolean) {
|
||||
|
|
Loading…
Reference in New Issue