ActiveReports 17 新特性-新Web设计器组件-Blazor
本帖最后由 Bella.Yuan 于 2023-6-19 14:33 编辑ActiveReports 现在提供了一个新的网页设计器组件——Blazor Designer，一个集成在 Blazor 框架中的 JavaScript 控件。并且提供
使用 .NET 代码处理服务器端的用户交互
为开发人员提供用于打开报告、处理事件和自定义 UI 的 C# API
页面加载方法:
@page "/"
@inject IJSRuntime JSRuntime
<PageTitle>Index</PageTitle>
<link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" />
<div id="designerContainer">
<ReportDesigner @ref="_designer" RpxSettings="@_rpx" AppBarSettings="@_appBar" DataSettings="@_data" PreviewSettings="@_preview" />
</div>
@code {
private ReportDesigner _designer;
private ReportViewer _viewer;
private RpxSettings _rpx;
private AppBarSettings _appBar;
private DataSettings _data;
private PreviewSettings _preview;
public Index()
{
_rpx = new RpxSettings
{
Enabled = true
};
_appBar = new AppBarSettings
{
OpenButton = new OpenButton { Visible = true }
};
_data = new DataSettings
{
DataSets = new DataSets { CanModify = true },
DataSources = new DataSources { CanModify = true }
};
_preview = new PreviewSettings
{
OpenViewer = OpenViewer
};
}
private async void OpenViewer(ViewerSettings settings)
{
if(_viewer != null)
{
await _viewer.OpenReport(settings.DocumentInfo.Id);
return;
}
_viewer = new ReportViewer();
var initOptions = new InitializationOptions();
initOptions.ReportID = settings.DocumentInfo.Id;
initOptions.PanelsLocation = PanelsLocation.toolbar;
initOptions.ReportLoaded = (reportInfo) =>
{
};
await _viewer.Render(JSRuntime, settings.Element, initOptions);
}
}
而且针对这个，我们也有专门的API去控制页面
具体可以参考如下链接:
https://www.grapecity.com/active ... ner-api-blazor.html
参考的Demo可以参考git代码示例:
https://github.com/activereports ... ples/BlazorDesigner
页:
[1]