This commit is contained in:
Çetin
2025-01-03 15:48:50 +03:00
parent 64b1aea5d9
commit 8b2ff9c1b2
41 changed files with 2900 additions and 1575 deletions

View File

@@ -10,40 +10,35 @@ import { NodeService } from '@/src/service/node.service';
standalone: true,
imports: [CommonModule, FormsModule, TreeModule, TreeTableModule],
template: `
<div class="grid">
<div class="col-12">
<div class="card">
<h5>Tree</h5>
<p-tree [value]="treeValue" selectionMode="checkbox" [(selection)]="selectedTreeValue"></p-tree>
</div>
</div>
<div class="col-12">
<div class="card">
<h5>TreeTable</h5>
<p-treetable [value]="treeTableValue" [columns]="cols" selectionMode="checkbox" [(selection)]="selectedTreeTableValue">
<ng-template #header let-columns>
<tr>
@for(col of columns; track col.header){
<th>
{{ col.header }}
</th>
}
</tr>
</ng-template>
<ng-template #body let-rowNode let-rowData="rowData" let-columns="columns">
<tr>
@for(col of columns; track col.field; let i = $index){
<td>
<p-treetabletoggler [rowNode]="rowNode" *ngIf="i === 0"></p-treetabletoggler>
<p-treeTableCheckbox [value]="rowNode" *ngIf="i === 0"></p-treeTableCheckbox>
{{ rowData[col.field] }}
</td>
}
</tr>
</ng-template>
</p-treetable>
</div>
</div>
<div class="card">
<div class="font-semibold text-xl">Tree</div>
<p-tree [value]="treeValue" selectionMode="checkbox" [(selection)]="selectedTreeValue"></p-tree>
</div>
<div class="card">
<div class="font-semibold text-xl mb-4">TreeTable</div>
<p-treetable [value]="treeTableValue" [columns]="cols" selectionMode="checkbox" [(selection)]="selectedTreeTableValue">
<ng-template #header let-columns>
<tr>
@for(col of columns; track col.header){
<th>
{{ col.header }}
</th>
}
</tr>
</ng-template>
<ng-template #body let-rowNode let-rowData="rowData" let-columns="columns">
<tr>
@for(col of columns; track col.field; let i = $index){
<td>
<p-treetabletoggler [rowNode]="rowNode" *ngIf="i === 0"></p-treetabletoggler>
<p-treeTableCheckbox [value]="rowNode" *ngIf="i === 0"></p-treeTableCheckbox>
{{ rowData[col.field] }}
</td>
}
</tr>
</ng-template>
</p-treetable>
</div>
`,
providers: [NodeService]