在线设计器集成教程-新建报表时内置数据源和数据集
本帖最后由 KearneyKang 于 2021-6-7 19:10 编辑应用场景：设计器大都集成到业务系统后，为业务人员提供编辑的功能，因此往往业务人员对业务逻辑非常擅长，但不理解任何的IT 技术背景信息，所以我们的开发人员往往希望再为业务人员打开在线报表编辑器的时候，能够内置好可用的业务数据，供业务人员来直接使用。
ActiveReportsJS 提供了这个方法，setDataSourceTemplates，可在业务人员点击添加数据源或数据集时候实现一键添加。
示例代码：
操作步骤：
调用setDataSourceTemplates 接口，需要将标准的数据源和数据集的声明模板JSON，这样报表和设计器才能识别出来，因此如何获取 ARJS 可识别的数据源和数据集的JSON 声明规范呢， 有两种方式：
1. 创建数据源和数据集时均有导出按钮，使用导出即可生成对应的JSON 格式，复制后，并再代码中生命变量：
<font face="微软雅黑">const dataSource = {Name: "Northwind",ConnectionProperties: { DataProvider: "JSON", ConnectString: "endpoint=https://demodata.grapecity.com/northwind/api/v1",},}</font>
2. 数据集也是同样的操作方式<font face="微软雅黑">const categoriesDataSet = {Name: "Categories",Query: { DataSourceName: "Northwind", CommandText: "uri=/Categories;jpath=$.[*]
",},Fields: [ { Name: "categoryId", DataField: "categoryId" }, { Name: "categoryName", DataField: "categoryName" }, { Name: "description", DataField: "description" },],};
</font>3. 使用 SetDataSourceTemplates 方法设置数据源和数据集。
<font face="微软雅黑">const designer = new ReportDesigner("#designer-host"); designer.setDataSourceTemplates([ { id: "Northwind", title: "Northwind", template: dataSource, canEdit: true, shouldEdit: true, datasets: [ { id: "Categories", title: "Categories", template: categoriesDataSet, canEdit: false } ], }, ]);
</font>注意：canEdit 数据源和数据集模板的属性指示是否允许最终用户修改它们，, shouldEdit 属性指示在用户将相应实体添加到报表后是否应立即打开数据源/数据集对话框。
页:
[1]