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

		自动登录	找回密码
密码			立即注册

[ActiveReports] ActiveReports 17 新特性-新Web设计器组件-Blazor

0 个回复

Wyn高级认证

Wyn认证