修复node组件事件触发问题，添加更多组件类型

syminomega · syminomega · commit a680f6a7f535 · 2025-05-09T22:06:09.000+08:00
diff --git a/src/components/BootstrapBlazor.NodeGraph/Components/NodeGraphCanvas.razor b/src/components/BootstrapBlazor.NodeGraph/Components/NodeGraphCanvas.razor
@@ -11,6 +11,7 @@
 </div>
 
 @code {
+    public Graph Graph { get; private set; } = null!;
 
     private string? ClassString => CssBuilder.Default("graph-main-container")
         .AddClassFromAttributes(AdditionalAttributes)
@@ -20,16 +21,21 @@
     private ElementReference _graphCanvas;
 
     /// <inheritdoc />
-    protected override async Task InvokeInitAsync()
+    protected override async Task OnAfterRenderAsync(bool firstRender)
     {
-        // 初始化并添加引用
-        await InvokeVoidAsync("init", Id, DotNetObjectReference.Create(NodeGraphService));
-        // 创建图表配置
-        var graphRef = await InvokeAsync<IJSObjectReference>("createLGraph");
-        // var graph = new Graph(graphRef!);
-        // 创建图表画布
-        _graphCanvasRef = await InvokeAsync<IJSObjectReference>("createLGraphCanvas", _graphCanvas, graphRef)
-                          ?? throw new InvalidOperationException("Create GraphCanvas failed!");
+        await base.OnAfterRenderAsync(firstRender);
+        if (firstRender)
+        {
+            // 初始化并添加引用
+            await InvokeVoidAsync("init", Id, DotNetObjectReference.Create(NodeGraphService));
+            // 创建图表配置
+            var graphRef = await InvokeAsync<IJSObjectReference>("createLGraph");
+            Graph = new Graph(graphRef!);
+            // var graph = new Graph(graphRef!);
+            // 创建图表画布
+            _graphCanvasRef = await InvokeAsync<IJSObjectReference>("createLGraphCanvas", _graphCanvas, graphRef)
+                              ?? throw new InvalidOperationException("Create GraphCanvas failed!");
+        }
     }
 
 }
diff --git a/src/components/BootstrapBlazor.NodeGraph/Data/Interop/NodeRegister.cs b/src/components/BootstrapBlazor.NodeGraph/Data/Interop/NodeRegister.cs
@@ -7,7 +7,7 @@ namespace BootstrapBlazor.Components.Data.Interop;
 /// <summary>
 /// 节点插槽
 /// </summary>
-public class NodeSlot
+public class NodeSlotDto
 {
     /// <summary>
     /// 插槽名称
@@ -20,10 +20,46 @@ public class NodeSlot
     public string Type { get; set; } = string.Empty;
 }
 
+/// <summary>
+/// 节点组件
+/// </summary>
+public class WidgetDto
+{
+    /// <summary>
+    /// 组件ID，需要在当前节点下唯一
+    /// </summary>
+    public string WidgetId { get; set; } = string.Empty;
+
+    /// <summary>
+    /// 节点组件类型
+    /// </summary>
+    public string WidgetType { get; set; } = string.Empty;
+
+    /// <summary>
+    /// 节点组件名称
+    /// </summary>
+    public string DisplayName { get; set; } = string.Empty;
+
+    /// <summary>
+    /// 默认值
+    /// </summary>
+    public object? Value { get; set; }
+
+    /// <summary>
+    /// 节点组件配置
+    /// </summary>
+    public WidgetOptions? WidgetOptions { get; set; }
+
+    /// <summary>
+    /// 是否有回调函数
+    /// </summary>
+    public bool HasCallback { get; set; }
+}
+
 /// <summary>
 /// 节点配置
 /// </summary>
-public class GraphNodeConfig
+public class GraphNodeConfigDto
 {
     /// <summary>
     /// 节点唯一类型路径，形如 groupA/groupB/NodeName
@@ -38,17 +74,17 @@ public class GraphNodeConfig
     /// <summary>
     /// 输入插槽
     /// </summary>
-    public List<NodeSlot> Inputs { get; set; } = new();
+    public List<NodeSlotDto> Inputs { get; set; } = new();
 
     /// <summary>
     /// 输出插槽
     /// </summary>
-    public List<NodeSlot> Outputs { get; set; } = new();
+    public List<NodeSlotDto> Outputs { get; set; } = new();
 
     /// <summary>
     /// 节点组件
     /// </summary>
-    public List<NodeWidget> Widgets { get; set; } = new();
+    public List<WidgetDto> Widgets { get; set; } = new();
 
     /// <summary>
     /// 是否有执行方法
diff --git a/src/components/BootstrapBlazor.NodeGraph/Graph.cs b/src/components/BootstrapBlazor.NodeGraph/Graph.cs
@@ -12,4 +12,9 @@ internal Graph(IJSObjectReference lGraphRef)
     {
         GraphRef = lGraphRef;
     }
+
+    public async Task RunStep(int step, bool ignoreErrors = true, int? limits = null)
+    {
+        await GraphRef.InvokeVoidAsync("runStep", step, ignoreErrors, limits);
+    }
 }
diff --git a/src/components/BootstrapBlazor.NodeGraph/GraphNode.cs b/src/components/BootstrapBlazor.NodeGraph/GraphNode.cs
@@ -21,21 +21,16 @@ public ValueTask DisposeAsync()
 
     public ValueTask<T?> GetInputData<T>(int slotIndex)
     {
-        return _graphNodeReference.InvokeAsync<T?>("getInputData", slotIndex);
+        return _graphNodeReference.InvokeAsync<T?>( "getInputData", slotIndex);
     }
 
     public ValueTask<T?> GetOutputData<T>(int slotIndex)
     {
-        return _graphNodeReference.InvokeAsync<T?>("getOutputData", slotIndex);
-    }
-
-    public ValueTask SetInputData<T>(int slotIndex, T inputData)
-    {
-        return _graphNodeReference.InvokeVoidAsync("setInputData", inputData);
+        return _graphNodeReference.InvokeAsync<T?>( "getOutputData", slotIndex);
     }
 
     public ValueTask SetOutputData<T>(int slotIndex, T outputData)
     {
-        return _graphNodeReference.InvokeVoidAsync("setOutputData", outputData);
+        return _graphNodeReference.InvokeVoidAsync( "setOutputData", slotIndex, outputData);
     }
 }
diff --git a/src/components/BootstrapBlazor.NodeGraph/Interfaces/INodeWidget.cs b/src/components/BootstrapBlazor.NodeGraph/Interfaces/INodeWidget.cs
@@ -11,6 +11,10 @@ namespace BootstrapBlazor.Components.Interfaces;
 /// </summary>
 public interface INodeWidget
 {
+    /// <summary>
+    /// 组件ID，需要在当前节点下唯一
+    /// </summary>
+    public string WidgetId { get; set; }
     /// <summary>
     /// 节点组件类型
     /// </summary>
@@ -34,7 +38,7 @@ public interface INodeWidget
     /// <summary>
     /// 回调函数
     /// </summary>
-    public Func<object?, NodeWidget, GraphNode, Task>? Callback { get; set; }
+    public Func<object?, GraphNode, Task>? Callback { get; set; }
 }
 
 /// <inheritdoc />
@@ -53,5 +57,5 @@ public interface INodeWidget<TValue, TOption> : INodeWidget where TOption : Widg
     /// <summary>
     /// 回调函数
     /// </summary>
-    public new Func<TValue?, NodeWidget, GraphNode, Task>? Callback { get; set; }
+    public new Func<TValue?, GraphNode, Task>? Callback { get; set; }
 }
diff --git a/src/components/BootstrapBlazor.NodeGraph/NodeWidgets.cs b/src/components/BootstrapBlazor.NodeGraph/NodeWidgets.cs
@@ -38,6 +38,9 @@ public enum NodeWidgetType
 /// </summary>
 public abstract class NodeWidget : INodeWidget
 {
+    /// <inheritdoc />
+    public string WidgetId { get; set; } = string.Empty;
+
     /// <inheritdoc />
     public abstract NodeWidgetType WidgetType { get; }
 
@@ -51,7 +54,7 @@ public abstract class NodeWidget : INodeWidget
     public WidgetOptions? WidgetOptions { get; set; }
 
     /// <inheritdoc />
-    public Func<object?, NodeWidget, GraphNode, Task>? Callback { get; set; }
+    public Func<object?, GraphNode, Task>? Callback { get; set; }
 }
 
 /// <inheritdoc cref="NodeWidget" />
@@ -69,7 +72,7 @@ public abstract class NodeWidget<TValue, TOption> : NodeWidget, INodeWidget<TVal
     }
 
     /// <inheritdoc />
-    public new Func<TValue?, NodeWidget, GraphNode, Task>? Callback
+    public new Func<TValue?, GraphNode, Task>? Callback
     {
         get
         {
@@ -78,7 +81,7 @@ public abstract class NodeWidget<TValue, TOption> : NodeWidget, INodeWidget<TVal
                 return null;
             }
 
-            return (v, widget, node) => base.Callback.Invoke(v, widget, node);
+            return (v, node) => base.Callback.Invoke(v, node);
         }
         set
         {
@@ -88,7 +91,7 @@ public abstract class NodeWidget<TValue, TOption> : NodeWidget, INodeWidget<TVal
             }
             else
             {
-                base.Callback = (v, widget, node) => value((TValue?)v, widget, node);
+                base.Callback = (v, node) => value((TValue?)v, node);
             }
         }
     }
diff --git a/src/components/BootstrapBlazor.NodeGraph/Services/NodeGraphService.cs b/src/components/BootstrapBlazor.NodeGraph/Services/NodeGraphService.cs
diff --git a/src/components/BootstrapBlazor.NodeGraph/wwwroot/js/graph.js b/src/components/BootstrapBlazor.NodeGraph/wwwroot/js/graph.js

Original file line number	Diff line number	Diff line change
`@@ -12,4 +12,9 @@ internal Graph(IJSObjectReference lGraphRef)`
`12`	`12`	`{`
`13`	`13`	`GraphRef = lGraphRef;`
`14`	`14`	`}`
	`15`	`+`
	`16`	`+ public async Task RunStep(int step, bool ignoreErrors = true, int? limits = null)`
	`17`	`+ {`
	`18`	`+ await GraphRef.InvokeVoidAsync("runStep", step, ignoreErrors, limits);`
	`19`	`+ }`
`15`	`20`	`}`
Original file line number	Diff line number	Diff line change
`@@ -21,21 +21,16 @@ public ValueTask DisposeAsync()`
`21`	`21`
`22`	`22`	`public ValueTask<T?> GetInputData<T>(int slotIndex)`
`23`	`23`	`{`
`24`		`- return _graphNodeReference.InvokeAsync<T?>("getInputData", slotIndex);`
	`24`	`+ return _graphNodeReference.InvokeAsync<T?>( "getInputData", slotIndex);`
`25`	`25`	`}`
`26`	`26`
`27`	`27`	`public ValueTask<T?> GetOutputData<T>(int slotIndex)`
`28`	`28`	`{`
`29`		`- return _graphNodeReference.InvokeAsync<T?>("getOutputData", slotIndex);`
`30`		`- }`
`31`		`-`
`32`		`- public ValueTask SetInputData<T>(int slotIndex, T inputData)`
`33`		`- {`
`34`		`- return _graphNodeReference.InvokeVoidAsync("setInputData", inputData);`
	`29`	`+ return _graphNodeReference.InvokeAsync<T?>( "getOutputData", slotIndex);`
`35`	`30`	`}`
`36`	`31`
`37`	`32`	`public ValueTask SetOutputData<T>(int slotIndex, T outputData)`
`38`	`33`	`{`
`39`		`- return _graphNodeReference.InvokeVoidAsync("setOutputData", outputData);`
	`34`	`+ return _graphNodeReference.InvokeVoidAsync( "setOutputData", slotIndex, outputData);`
`40`	`35`	`}`
`41`	`36`	`}`
Original file line number	Diff line number	Diff line change
`@@ -38,6 +38,9 @@ public enum NodeWidgetType`
`38`	`38`	`/// </summary>`
`39`	`39`	`public abstract class NodeWidget : INodeWidget`
`40`	`40`	`{`
	`41`	`+ /// <inheritdoc />`
	`42`	`+ public string WidgetId { get; set; } = string.Empty;`
	`43`	`+`
`41`	`44`	`/// <inheritdoc />`
`42`	`45`	`public abstract NodeWidgetType WidgetType { get; }`
`43`	`46`
`@@ -51,7 +54,7 @@ public abstract class NodeWidget : INodeWidget`
`51`	`54`	`public WidgetOptions? WidgetOptions { get; set; }`
`52`	`55`
`53`	`56`	`/// <inheritdoc />`
`54`		`- public Func<object?, NodeWidget, GraphNode, Task>? Callback { get; set; }`
	`57`	`+ public Func<object?, GraphNode, Task>? Callback { get; set; }`
`55`	`58`	`}`
`56`	`59`
`57`	`60`	`/// <inheritdoc cref="NodeWidget" />`
`@@ -69,7 +72,7 @@ public abstract class NodeWidget<TValue, TOption> : NodeWidget, INodeWidget<TVal`
`69`	`72`	`}`
`70`	`73`
`71`	`74`	`/// <inheritdoc />`
`72`		`- public new Func<TValue?, NodeWidget, GraphNode, Task>? Callback`
	`75`	`+ public new Func<TValue?, GraphNode, Task>? Callback`
`73`	`76`	`{`
`74`	`77`	`get`
`75`	`78`	`{`
`@@ -78,7 +81,7 @@ public abstract class NodeWidget<TValue, TOption> : NodeWidget, INodeWidget<TVal`
`78`	`81`	`return null;`
`79`	`82`	`}`
`80`	`83`
`81`		`- return (v, widget, node) => base.Callback.Invoke(v, widget, node);`
	`84`	`+ return (v, node) => base.Callback.Invoke(v, node);`
`82`	`85`	`}`
`83`	`86`	`set`
`84`	`87`	`{`
`@@ -88,7 +91,7 @@ public abstract class NodeWidget<TValue, TOption> : NodeWidget, INodeWidget<TVal`
`88`	`91`	`}`
`89`	`92`	`else`
`90`	`93`	`{`
`91`		`- base.Callback = (v, widget, node) => value((TValue?)v, widget, node);`
	`94`	`+ base.Callback = (v, node) => value((TValue?)v, node);`
`92`	`95`	`}`
`93`	`96`	`}`
`94`	`97`	`}`