找回密码
 立即注册

QQ登录

只需一步,快速开始

KearneyKang 讲师达人认证 悬赏达人认证

超级版主

199

主题

6505

帖子

1万

积分

超级版主

Rank: 8Rank: 8

积分
10804

圣诞拼拼乐微信认证勋章讲师达人悬赏达人元老葡萄

KearneyKang 讲师达人认证 悬赏达人认证
超级版主   /  发表于:2020-11-17 16:21  /   查看:2876  /  回复:1
本帖最后由 KearneyKang 于 2020-11-17 16:54 编辑

在ActiveReportsJS报表设计器中使用预定义的数据源

ActiveReportsJS报表设计器允许绑定到各种数据源并提供非常灵活的配置。 检查[数据绑定](../../ ReportAuthorGuide / Databinding)页面以获取有关此主题的更多信息。 但是,可能需要为新创建的报告预先设置数据绑定,以简化非技术用户的报告设计体验。 ActiveReportsJS设计器API允许定义默认情况下可供最终用户使用的数据源和数据集。 用户界面如下所示:

使用此功能,请首先使用独立设计器应用程序构建和导出所需的数据源。 这是一个快速操作步骤,显示如何为开发和导出数据源 ["Northwind" REST API end point](https://demodata.grapecity.com/s ... Restful%20NorthWind).

  -运行独立的设计器应用程序
  -在属性表格的数据标签中添加新的数据源


1. 设置数据源名称.
2. 设定终点.
3. 点击 "Export" 按钮.
4. 在"导出模板"对话框中选择内容并复制.

在应用程序的代码中,定义一个变量并将其值设置为复制的内容,例如:
javascript
  1. const dataSource = {
  2.   Name: "Northwind",
  3.   ConnectionProperties: {
  4.     DataProvider: "JSON",
  5.     ConnectString: "endpoint=https://demodata.grapecity.com/northwind/api/v1",
  6.   },
  7. };
复制代码
然后,使用独立设计器应用程序构建和导出所需的数据集。 这是一个快速指南,指导如何开发和导出Northwind数据源的 ```/Categories```API的数据集。

-为上一步添加的数据源添加数据集



1. 设置数据集名称.
2. 设置API路径.
3. JSon路径设置为 ```$.
```, 访问 [JSON Path文档](https://goessner.net/articles/JsonPath/)有关此主题的更多信息。
4. 点击"Validate" 按钮获取字段列表.
5. 点击"Export" 按钮.
6. 选中 "Export template" 对话框中的内容并且复制它.
7. 关闭"Export template" 对话框并且保存它.

在应用程序的代码中,定义一个变量并将其值设置为复制的内容,例如:

javascript
  1. const categoriesDataSet = {
  2.   Name: "Categories",
  3.   Query: {
  4.     DataSourceName: "Northwind",
  5.     CommandText: "uri=/Categories;jpath=$.[*]",
  6.   },
  7.   Fields: [
  8.     { Name: "categoryId", DataField: "categoryId" },
  9.     { Name: "categoryName", DataField: "categoryName" },
  10.     { Name: "description", DataField: "description" },
  11.   ],
  12. };
复制代码

```

最后, 使用设计器实例的 ```setDataSourceTemplates``` 方法来设置可用的数据源最后,使用setDataSourceTemplates方法来设置可用的数据源和数据集,例如:
javascript
  1. const designer = new ReportDesigner("#designer-host");
  2.     designer.setDataSourceTemplates([
  3.       {
  4.         id: "Northwind",
  5.         title: "Northwind",
  6.         template: dataSource,
  7.         canEdit: true,        
  8.         shouldEdit: true,
  9.         datasets: [
  10.           {
  11.             id: "Categories",
  12.             title: "Categories",
  13.             template: categoriesDataSet,
  14.             canEdit: false
  15.           }
  16.         ],
  17.       },
  18.     ]);
复制代码
canEdit 数据源和数据集模板的属性指示是否允许最终用户修改它们,, shouldEdit属性指示在用户将相应实体添加到报表后是否应立即打开数据源/数据集对话框。


本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x

0 个回复

您需要登录后才可以回帖 登录 | 立即注册
返回顶部