@ticatec/uniface-element 0.3.17 → 0.3.19

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.
@@ -9,7 +9,7 @@
9
9
  ## TreeNode 类
10
10
 
11
11
  ```typescript
12
- class TreeNode<T> {
12
+ class TreeNode<T> implements ITreeNode<T> {
13
13
  /** 节点的数据对象(只读) */
14
14
  public readonly item: T;
15
15
 
@@ -20,26 +20,26 @@ class TreeNode<T> {
20
20
  public loading: boolean;
21
21
 
22
22
  /** 父节点(根节点为 null) */
23
- public parent: TreeNode<T> | null;
23
+ public readonly parent: TreeNode<T> | null;
24
24
 
25
- /** 子节点(只读,使用方法修改) */
26
- get children(): ReadonlyArray<TreeNode<T>>;
25
+ /** 节点层级(根节点为 0) */
26
+ get level(): number;
27
+
28
+ /** 子节点(浅拷贝,使用方法修改) */
29
+ get children(): Array<TreeNode<T>> | null;
27
30
 
28
31
  /** 添加子节点到当前节点 */
29
- append(childItem: T): void;
32
+ append(childItem: T | Array<T>): ITreeNode<T> | Array<ITreeNode<T>>;
30
33
 
31
34
  /** 从父节点中分离(删除当前节点) */
32
35
  detach(): void;
33
36
 
34
- /** 将当前节点移动到另一个父节点下 */
35
- moveTo(newParent: TreeNode<T>): void;
37
+ /** 将当前节点移动到另一个父节点下(返回新节点) */
38
+ moveTo(newParent: TreeNode<T>): TreeNode<T>;
36
39
 
37
40
  /** 替换当前节点的数据 */
38
41
  replace(newItem: T): void;
39
42
 
40
- /** 根据 ID 删除指定的子节点 */
41
- removeChild(childId: any): void;
42
-
43
43
  /** 删除所有子节点 */
44
44
  removeChildren(): void;
45
45
  }
@@ -87,25 +87,33 @@ class NodeViewOptions<T> {
87
87
 
88
88
  ### 1. append(childItem)
89
89
 
90
- 添加一个子节点到当前节点。
90
+ 添加子节点到当前节点。
91
91
 
92
92
  **参数**:
93
- - `childItem: T` - 子节点的数据对象
93
+ - `childItem: T | Array<T>` - 子节点的数据对象或子对象数组
94
94
 
95
95
  **示例**:
96
96
  ```typescript
97
- // 直接传入数据对象
97
+ // 添加单个子节点
98
98
  parentNode.append({
99
99
  id: 123,
100
100
  name: "新子节点",
101
101
  parentId: parentNode.item.id // 会自动设置
102
102
  });
103
+
104
+ // 添加多个子节点
105
+ parentNode.append([
106
+ { id: 124, name: "子节点1", parentId: parentNode.item.id },
107
+ { id: 125, name: "子节点2", parentId: parentNode.item.id }
108
+ ]);
103
109
  ```
104
110
 
111
+ **返回值**:
112
+ - `ITreeNode<T> | Array<ITreeNode<T>>` - 添加的子节点
113
+
105
114
  **注意事项**:
106
115
  - 自动初始化 children 数组(如果需要)
107
116
  - 如果配置了排序函数,会自动排序
108
- - 父节点的 `expand` 会自动设置为 `true`
109
117
  - 触发版本更新以实现响应式更新
110
118
 
111
119
  ---
@@ -195,32 +203,7 @@ node.replace({
195
203
 
196
204
  ---
197
205
 
198
- ### 5. removeChild(childId)
199
-
200
- 删除指定的子节点。
201
-
202
- **参数**:
203
- - `childId: any` - 要删除的子节点的 ID
204
-
205
- **示例**:
206
- ```typescript
207
- // 删除指定 ID 的子节点
208
- parentNode.removeChild(123);
209
-
210
- // 使用变量
211
- const childId = childNode.item.id;
212
- parentNode.removeChild(childId);
213
- ```
214
-
215
- **注意事项**:
216
- - 只删除直接子节点,不会递归删除孙子节点
217
- - 如果子节点不存在,会静默忽略
218
- - 子节点的所有后代也会被删除
219
- - 触发版本更新以实现响应式更新
220
-
221
- ---
222
-
223
- ### 6. removeChildren()
206
+ ### 5. removeChildren()
224
207
 
225
208
  删除所有子节点。
226
209
 
@@ -387,7 +370,6 @@ node.append(childItem); // 添加子节点到该节点
387
370
  node.detach(); // 从父节点中分离该节点
388
371
  node.replace(newItem); // 替换该节点的数据
389
372
  node.moveTo(newParentNode); // 将该节点移动到另一个父节点
390
- node.removeChild(childId); // 删除该节点的指定子节点
391
373
  node.removeChildren(); // 删除该节点的所有子节点
392
374
  ```
393
375
 
@@ -409,10 +391,10 @@ treeNodes.extractDirectories(item); // 提取目录结构(仅 TreeNodes)
409
391
  节点中存储的数据对象。不能直接修改。使用 `replace()` 来更新数据。
410
392
 
411
393
  ### children(只读)
412
- 返回子节点的只读数组。要修改子节点,使用以下方法:
394
+ 返回子节点数组的浅拷贝。要修改子节点,使用以下方法:
413
395
  - `append()` - 添加子节点
414
- - `removeChild()` - 删除特定子节点
415
396
  - `removeChildren()` - 删除所有子节点
397
+ - 要删除特定子节点,请遍历子节点并对子节点调用 `detach()` 方法
416
398
 
417
399
  ### expand
418
400
  控制节点是否展开(显示其子节点)。可以直接设置:
@@ -8,12 +8,6 @@ export declare function compareNumber(a: number, b: number): 0 | 1 | -1;
8
8
  /**
9
9
  * 节点视图配置类 - 定义节点的显示方式
10
10
  * @template T 节点数据的类型
11
- *
12
- * @example
13
- * const options = new NodeViewOptions<MyData>({
14
- * keyField: 'id',
15
- * textField: 'name'
16
- * });
17
11
  */
18
12
  export declare class NodeViewOptions<T> {
19
13
  /**
@@ -70,37 +64,20 @@ export interface ITreeNode<T> {
70
64
  * @returns 子节点数组,如果没有子节点返回 null
71
65
  */
72
66
  get children(): Array<ITreeNode<T>> | null;
73
- /**
74
- * 添加子节点
75
- * @param childItem 子节点数据
76
- * @returns 新创建的子节点
77
- *
78
- * @example
79
- * const childNode = parentNode.append({ id: 1, name: "子节点" });
80
- */
81
- append(childItem: T): ITreeNode<T>;
67
+ append(childItem: T | Array<T>): ITreeNode<T> | Array<ITreeNode<T>>;
82
68
  /**
83
69
  * 从父节点中分离(删除当前节点)
84
- *
85
- * @example
86
- * node.detach();
87
70
  */
88
71
  detach(): void;
89
72
  /**
90
73
  * 移动到另一个父节点下
91
74
  * @param newParent 新的父节点
92
75
  * @returns 当前节点(支持链式调用)
93
- *
94
- * @example
95
- * node.moveTo(newParentNode);
96
76
  */
97
77
  moveTo(newParent: ITreeNode<T>): ITreeNode<T>;
98
78
  /**
99
79
  * 替换当前节点的数据
100
80
  * @param newItem 新的数据对象
101
- *
102
- * @example
103
- * node.replace({ id: 1, name: "新名称", ...otherFields });
104
81
  */
105
82
  replace(newItem: T): void;
106
83
  /**
@@ -109,15 +86,17 @@ export interface ITreeNode<T> {
109
86
  get item(): T;
110
87
  /**
111
88
  * 删除所有子节点
112
- *
113
- * @example
114
- * node.removeChildren();
115
89
  */
116
90
  removeChildren(): void;
91
+ /**
92
+ * 获取父节点
93
+ */
94
+ parent: TreeNode<T> | null;
117
95
  }
118
96
  /**
119
- * TreeNode 类 - 树节点,包含数据和方法
97
+ * TreeNode 类 - 树节点,包含数据和方法(内部类)
120
98
  * @template T 节点数据的类型
99
+ * @internal
121
100
  *
122
101
  * @description
123
102
  * TreeNode 是树结构的基本单元,每个节点包含:
@@ -128,8 +107,10 @@ export interface ITreeNode<T> {
128
107
  * - 加载状态(loading)
129
108
  *
130
109
  * 节点提供了丰富的操作方法,可以直接在节点上进行增删改查操作。
110
+ *
111
+ * 注意:此类为内部实现,外部应使用 ITreeNode 接口
131
112
  */
132
- export declare class TreeNode<T> implements ITreeNode<T> {
113
+ declare class TreeNode<T> implements ITreeNode<T> {
133
114
  /**
134
115
  * 节点数据(私有,只读)
135
116
  * @private
@@ -157,20 +138,15 @@ export declare class TreeNode<T> implements ITreeNode<T> {
157
138
  * @private
158
139
  */
159
140
  private _children;
141
+ private readonly nodes;
160
142
  /**
161
143
  * 创建树节点
162
144
  * @param item 节点数据
145
+ * @param nodes
163
146
  * @param parent 父节点(可选)
164
147
  * @param children 子节点列表(可选)
165
- *
166
- * @example
167
- * // 创建根节点
168
- * const rootNode = new TreeNode({ id: 1, name: "根节点" });
169
- *
170
- * // 创建子节点
171
- * const childNode = new TreeNode({ id: 2, name: "子节点" }, rootNode);
172
148
  */
173
- constructor(item: T, parent?: TreeNode<T> | null, children?: Array<TreeNode<T>> | null);
149
+ constructor(item: T, nodes: TreeNodes<T>, parent?: TreeNode<T> | null, children?: Array<TreeNode<T>> | null);
174
150
  /**
175
151
  * 获取节点层级
176
152
  * @returns 层级值(根节点为 0)
@@ -179,28 +155,17 @@ export declare class TreeNode<T> implements ITreeNode<T> {
179
155
  /**
180
156
  * 获取子节点列表(只读)
181
157
  * @returns 子节点数组的浅拷贝,如果没有子节点返回 null
182
- *
183
- * @example
184
- * const children = node.children;
185
- * if (children) {
186
- * children.forEach(child => console.log(child.item));
187
- * }
188
158
  */
189
159
  get children(): Array<TreeNode<T>> | null;
160
+ set children(value: Array<TreeNode<T>>);
190
161
  /**
191
162
  * 添加子节点
192
163
  * @param childItem 子节点数据
193
164
  * @returns 新创建的子节点
194
- *
195
- * @example
196
- * const childNode = parentNode.append({ id: 1, name: "子节点" });
197
165
  */
198
- append(childItem: T): TreeNode<T>;
166
+ append(childItem: T | Array<T>): ITreeNode<T> | Array<ITreeNode<T>>;
199
167
  /**
200
168
  * 从父节点中分离(删除当前节点)
201
- *
202
- * @example
203
- * node.detach();
204
169
  */
205
170
  detach(): void;
206
171
  /**
@@ -213,17 +178,11 @@ export declare class TreeNode<T> implements ITreeNode<T> {
213
178
  * 移动到另一个父节点下
214
179
  * @param newParent 新的父节点
215
180
  * @returns 新创建的节点(注意:返回的是新节点,不是原节点)
216
- *
217
- * @example
218
- * node.moveTo(newParentNode);
219
181
  */
220
- moveTo(newParent: TreeNode<T>): TreeNode<T>;
182
+ moveTo(newParent: TreeNode<T>): ITreeNode<T>;
221
183
  /**
222
184
  * 替换当前节点的数据
223
185
  * @param newItem 新的数据对象
224
- *
225
- * @example
226
- * node.replace({ id: 1, name: "新名称", ...otherFields });
227
186
  */
228
187
  replace(newItem: T): void;
229
188
  /**
@@ -233,9 +192,6 @@ export declare class TreeNode<T> implements ITreeNode<T> {
233
192
  get item(): T;
234
193
  /**
235
194
  * 删除所有子节点
236
- *
237
- * @example
238
- * node.removeChildren();
239
195
  */
240
196
  removeChildren(): void;
241
197
  /**
@@ -273,6 +229,9 @@ export type GetText<T> = (data: T) => string;
273
229
  * @template T 数据类型
274
230
  */
275
231
  export type CheckIsDirectory<T> = (node: ITreeNode<T>) => boolean;
232
+ type StringKeys<T> = {
233
+ [K in keyof T]: T[K] extends string ? K : never;
234
+ }[keyof T];
276
235
  /**
277
236
  * TreeNodes 配置选项
278
237
  * @template T 节点数据的类型
@@ -281,7 +240,7 @@ export interface TreeNodeOptions<T> {
281
240
  /**
282
241
  * 唯一标识字段名(默认:'id')
283
242
  */
284
- keyField?: keyof T;
243
+ keyField?: StringKeys<T>;
285
244
  /**
286
245
  * 显示文字的字段名或获取函数(默认:'text')
287
246
  */
@@ -289,7 +248,7 @@ export interface TreeNodeOptions<T> {
289
248
  /**
290
249
  * 父节点引用字段名(默认:'parentId')
291
250
  */
292
- parentKeyField?: keyof T;
251
+ parentKeyField?: StringKeys<T>;
293
252
  /**
294
253
  * 判断数据是否为根节点的函数(必需)
295
254
  */
@@ -317,33 +276,11 @@ export interface TreeNodeOptions<T> {
317
276
  * - 节点的映射和查找
318
277
  * - 版本管理(用于响应式更新)
319
278
  * - 层级展开控制
320
- *
321
- * @example
322
- * interface MyData {
323
- * id: number;
324
- * name: string;
325
- * parentId: number | null;
326
- * }
327
- *
328
- * const treeNodes = new TreeNodes<MyData>({
329
- * keyField: 'id',
330
- * textField: 'name',
331
- * parentKeyField: 'parentId',
332
- * checkIsRoot: (item) => item.parentId === null,
333
- * checkIsDirectory: (node) => node.children !== null,
334
- * expendDepth: 2
335
- * });
336
- *
337
- * treeNodes.setData([
338
- * { id: 1, name: "根节点", parentId: null },
339
- * { id: 2, name: "子节点1", parentId: 1 },
340
- * { id: 3, name: "子节点2", parentId: 1 }
341
- * ]);
342
279
  */
343
280
  export default class TreeNodes<T> {
344
281
  protected readonly checkIsRoot: CheckIsRoot<T>;
345
- protected readonly keyField: keyof T;
346
- protected readonly parentKeyField: keyof T;
282
+ protected readonly keyField: StringKeys<T>;
283
+ protected readonly parentKeyField: StringKeys<T>;
347
284
  protected readonly textField: keyof T | GetText<T>;
348
285
  protected readonly checkIsDirectory: CheckIsDirectory<T> | undefined;
349
286
  protected nodeMap: Map<any, TreeNode<T>>;
@@ -367,19 +304,12 @@ export default class TreeNodes<T> {
367
304
  * 3. 根据 parentKeyField 建立父子关系
368
305
  * 4. 应用展开深度设置
369
306
  * 5. 触发版本更新
370
- *
371
- * @example
372
- * treeNodes.setData([
373
- * { id: 1, name: "根节点", parentId: null },
374
- * { id: 2, name: "子节点1", parentId: 1 },
375
- * { id: 3, name: "子节点2", parentId: 1 }
376
- * ]);
377
307
  */
378
308
  setData(list: Array<T>): void;
379
309
  /**
380
310
  * 获取节点
381
311
  */
382
- get nodes(): Array<TreeNode<T>>;
312
+ get nodes(): Array<ITreeNode<T>>;
383
313
  /**
384
314
  * 获取版本号,用于触发 Svelte 响应式更新
385
315
  */
@@ -393,17 +323,38 @@ export default class TreeNodes<T> {
393
323
  protected setExpandForDepth(nodes: TreeNode<T>[], currentLevel: number): void;
394
324
  /**
395
325
  * 获取展开的展示列表
326
+ * @returns 展开的所有节点(按层级顺序)
396
327
  */
397
328
  getHierarchyList(): Array<ITreeNode<T>>;
398
- private addExpandNodesToList;
399
329
  /**
400
- * 不检测匹配情况,在指定的父节点下添加子节点
330
+ * 将展开的节点添加到列表
331
+ * @param nodes 节点数组
332
+ * @param list 结果列表
333
+ * @private
401
334
  */
402
- batchAttachToParent(parent: TreeNode<T>, list: Array<T>): ITreeNode<T>[];
335
+ private addExpandNodesToList;
403
336
  /**
404
337
  * 增加一个新节点(便捷方法,会自动根据 parentKeyField 找到父节点)
405
338
  * @param item 要添加的节点数据
406
339
  */
407
340
  append(item: T): ITreeNode<T>;
408
- private findParent;
341
+ replace(item: T): ITreeNode<T> | null;
342
+ remove(item: T): ITreeNode<T> | null;
343
+ /**
344
+ * 从节点列表中查找节点
345
+ * @param nodes 节点数组
346
+ * @param item 要查找的数据项
347
+ * @param matchedKey 匹配的字段名
348
+ * @returns 找到的节点或 null
349
+ * @private
350
+ */
351
+ private _findNodeFromList;
352
+ }
353
+ export declare class MenuNodes<T> extends TreeNodes<T> {
354
+ /**
355
+ * 删除所有属于分支但没有子节点的节点
356
+ */
357
+ protected cleanEmptyDirectories(): void;
358
+ private pruneEmptyDirs;
409
359
  }
360
+ export {};