@competer/primeng-table 19.1.8 → 19.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +89 -0
- package/fesm2022/competer-primeng-table.mjs +525 -22
- package/fesm2022/competer-primeng-table.mjs.map +1 -1
- package/lib/components/ecs-primeng-table/ecs-primeng-table.d.ts +36 -0
- package/lib/components/ecs-primeng-table/ecs-primeng-table.service.d.ts +1 -0
- package/lib/interfaces/columns-metadata.interface.d.ts +1 -0
- package/lib/interfaces/table-options.interface.d.ts +13 -0
- package/lib/interfaces/table-view-data.interface.d.ts +2 -0
- package/lib/services/table-state.service.d.ts +3 -0
- package/lib/utils/tree-table-state.d.ts +66 -0
- package/package.json +1 -1
- package/public-api.d.ts +1 -0
package/README.md
CHANGED
|
@@ -1,3 +1,92 @@
|
|
|
1
|
+
# Optional Tree Grid
|
|
2
|
+
|
|
3
|
+
Omit `tree` to keep the flat grid unchanged. Opt in with ordinary flat records:
|
|
4
|
+
|
|
5
|
+
```ts
|
|
6
|
+
import { createTableOptions } from '@competer/primeng-table';
|
|
7
|
+
|
|
8
|
+
readonly tableOptions = createTableOptions({
|
|
9
|
+
tree: {
|
|
10
|
+
keyExpr: 'id', parentIdExpr: 'parentId', rootValue: 0,
|
|
11
|
+
hasItemsExpr: 'hasChildren', column: 'text', loadMode: 'onDemand'
|
|
12
|
+
},
|
|
13
|
+
urlTableConfiguration: 'TreeDemo/GetTableConfiguration',
|
|
14
|
+
urlTableData: 'TreeDemo/GetTableData',
|
|
15
|
+
excelReport: { url: 'TreeDemo/GenerateExcel' }
|
|
16
|
+
});
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
Add `ECSPrimengTable` from the same package to your standalone component's
|
|
20
|
+
`imports`, then bind the options in its template:
|
|
21
|
+
|
|
22
|
+
```html
|
|
23
|
+
<ecs-primeng-table [tableOptions]="tableOptions" />
|
|
24
|
+
```
|
|
25
|
+
|
|
26
|
+
The API returns ordinary records, not nested `children` arrays. For example,
|
|
27
|
+
the following records describe a root, a child and a grandchild:
|
|
28
|
+
|
|
29
|
+
```json
|
|
30
|
+
[
|
|
31
|
+
{ "id": 1, "parentId": 0, "hasChildren": true, "text": "Project", "rowID": 1 },
|
|
32
|
+
{ "id": 2, "parentId": 1, "hasChildren": true, "text": "Task", "rowID": 2 },
|
|
33
|
+
{ "id": 3, "parentId": 2, "hasChildren": false, "text": "Subtask", "rowID": 3 }
|
|
34
|
+
]
|
|
35
|
+
```
|
|
36
|
+
|
|
37
|
+
`keyExpr` and `parentIdExpr` identify the relationship, `rootValue` marks root
|
|
38
|
+
parents, `hasItemsExpr` indicates whether a node can expand in remote modes,
|
|
39
|
+
and `column` selects the field containing the indentation and expand control.
|
|
40
|
+
These records are the response's `data`, not the complete response envelope;
|
|
41
|
+
remote modes return only the requested siblings. Keep the existing table
|
|
42
|
+
configuration endpoint for column metadata, filtering and display options.
|
|
43
|
+
|
|
44
|
+
`loadMode` accepts `all`, `onDemand` (default) or `pagedChildren`.
|
|
45
|
+
`rootValue` defaults to `0`; use `null` explicitly for nullable root parents.
|
|
46
|
+
Remote modes require a boolean `hasItemsExpr`. Keys are unique finite numbers
|
|
47
|
+
or nonempty strings. Preserve structural fields and the independent selection
|
|
48
|
+
alias `rowID`, even when hidden. Use a distinct state-persistence key per mode,
|
|
49
|
+
provide `ECSPrimengTableStateService` on the parent route component, and remount
|
|
50
|
+
the table when changing mode. The `/tree` demo illustrates this pattern.
|
|
51
|
+
|
|
52
|
+
Root queries send `roots`, `parentId`, `loadMode`, `page` and `pageSize` alongside
|
|
53
|
+
the existing filters/sorts. Responses remain flat and add `ancestorKeys` to open
|
|
54
|
+
matching paths. Page counts describe roots; expanded children are not a second
|
|
55
|
+
root page. Paged children expose a load-more row. Expansion caches are invalidated
|
|
56
|
+
by a fresh query. Views/navigation persist `treeExpandedKeys` and `treeChildPages`;
|
|
57
|
+
selection is independent and does not cascade. Saved views restore into the
|
|
58
|
+
currently configured mode; the demo's mode choice lives in its parent settings.
|
|
59
|
+
|
|
60
|
+
Tree Excel endpoints must export the complete retained hierarchy, independent
|
|
61
|
+
of expansion/loading. The demo backend uses in-memory validation/querying rather
|
|
62
|
+
than a SQL recursive query. See the repository's `Backend/ECS.PrimengTable/TREE.md`
|
|
63
|
+
for the full API contract, authorization constraints and memory limits.
|
|
64
|
+
|
|
65
|
+
Translate `Expand node`, `Collapse node`, `Load more children` and
|
|
66
|
+
`Showing {{count}} root nodes of {{total}} available root nodes` in the consuming
|
|
67
|
+
application's dictionaries. Without ngx-translate providers they remain English.
|
|
68
|
+
|
|
69
|
+
For a step-by-step walkthrough and a screenshot of the running example, see
|
|
70
|
+
[Try the tree demo](https://github.com/competergiga/ECSPrimengTable/blob/Angular19-publish/README.md#try-the-tree-demo).
|
|
71
|
+
The example shows the three load modes, deep filtering, saved views and returning
|
|
72
|
+
from a detail route without losing the expanded branches.
|
|
73
|
+
|
|
74
|
+
# Group Headers
|
|
75
|
+
|
|
76
|
+
Set `HeaderGroup` on backend column attributes:
|
|
77
|
+
|
|
78
|
+
```csharp
|
|
79
|
+
[ColumnAttributes("Name", HeaderGroup = "Group1")]
|
|
80
|
+
public string Name { get; set; } = "";
|
|
81
|
+
|
|
82
|
+
[ColumnAttributes("Age", dataType: DataType.Numeric, HeaderGroup = "Group1")]
|
|
83
|
+
public int Age { get; set; }
|
|
84
|
+
```
|
|
85
|
+
|
|
86
|
+
Consecutive visible columns sharing `headerGroup` receive a centered spanning header. Reordering or hiding columns recalculates the runs, repeating the label when a group is split. Ungrouped columns leave a blank space; no extra row is rendered when no visible column has a group. Frozen alignment boundaries split runs to preserve scrolling alignment. Labels support translation keys just like `header`.
|
|
87
|
+
|
|
88
|
+
Use `ColumnMetadataOverrideModel.HeaderGroup` for dynamic overrides; an empty string removes a group. The `/progress` example groups the first three columns under `Grupo1` and the last two under `Grupo2`.
|
|
89
|
+
|
|
1
90
|
# ECS PrimeNG table
|
|
2
91
|
|
|
3
92
|
This NPM package contains ECS PrimeNG table.
|