找回密码
 立即注册

QQ登录

只需一步,快速开始

Felix.Li Wyn认证

超级版主

101

主题

2856

帖子

5393

积分

超级版主

Rank: 8Rank: 8

积分
5393

Wyn高级认证Wyn认证

Felix.Li Wyn认证
超级版主   /  发表于:2023-12-7 11:35  /   查看:1396  /  回复:0
本帖最后由 Bella.Yuan 于 2023-12-11 10:25 编辑

17.2.0将共享数据源也添加到web设计器里面。以前只能在桌面设计器使用共享数据源。现在web端也可以了。

那什么是共享数据源和为什么要用他呢?
首先共享数据源简单的说就是可以共享使用,每个人都可以直接通过选择就是用这个数据源,而不在需要输入连接信息 。
那么使用场景当然也就可想而知了,就是不希望设计报表的人员看到数据库连接信息。他们只需要关注设计报表即可。而且也不用担心数据库连接信息被知道。
那么接下来就给大家说一下,web端如何使用共享数据源。(WebDesigner)
首先,共享数据源需要使用桌面设计器设计出来,具体操作如下:

只需要将桌面设计器设计好的数据源,右键点击共享数据员,即可保存为.rdsx文件(共享数据源)

WebDesigner:
添加共享数据源整体只需要3步。本文以如下链接示例为例子:
https://github.com/activereports/WebSamples17/tree/main/WebDesignerSamples/WebDesigner_MVC_Core
准备工作,将准备好的rdsx文件放置在resource文件夹下

1.自己新创建一个类,实现:ISharedDataSourceService接口,示例代码:
  1. public class SharedDataSourceService : ISharedDataSourceService
  2. {
  3.         public SharedDataSourceInfo[] GetSharedDataSourceList()
  4.         {
  5.                 return Startup.ResourcesRootDirectory
  6.                         .EnumerateFiles("*.rdsx")
  7.                         .Select(x =>
  8.                         {
  9.                                 var dataSource = GetDataSource(x.Name);
  10.                                 return new SharedDataSourceInfo()
  11.                                 {
  12.                                         Name = x.Name,
  13.                                         Type = dataSource.ConnectionProperties.DataProvider
  14.                                 };
  15.                         }).ToArray();
  16.         }
  17.         public DataSource GetDataSource(string name)
  18.         {
  19.                 return DataSourceTools.LoadSharedDataSource(Path.Combine(Startup.ResourcesRootDirectory.FullName, name));
  20.         }

  21. }
复制代码

如上代码其实就是读取 resource目录。然后把以.rdsx为后缀的文件全部拿到。返回为指定格式的数组。

2.修改startup文件。
在ConfigureServices 方法中,新添加.AddSingleton<ISharedDataSourceService, SharedDataSourceService>() 将我们刚实现的类注册进来。
完整代码:
  1. public void ConfigureServices(IServiceCollection services)
  2. {
  3.         Encoding.RegisterProvider(CodePagesEncodingProvider.Instance);

  4.         services
  5.                 .AddReporting()
  6.                 .AddDesigner()
  7.                 .AddSingleton<ITemplatesService>(new FileSystemTemplates(TemplatesRootDirectory))
  8.                 .AddSingleton<IDataSetsService>(new CustomDataSetTemplates())
  9.                 .AddSingleton<ISharedDataSourceService, SharedDataSourceService>()
  10.                 .AddMvc(options => options.EnableEndpointRouting = false)
  11.                 .AddJsonOptions(options => options.JsonSerializerOptions.PropertyNamingPolicy = null);
  12. }
复制代码
其次修改Configure方法,新增一个入参,ISharedDataSourceService sharedDataSourceService 依旧是我们刚才注册的。
其次在useDesigner中,添加config.UseSharedDataSources(sharedDataSourceService);将入参传递进来。
完整代码:
  1. public void Configure(IApplicationBuilder app, IWebHostEnvironment env, IDataSetsService dataSetsService, ISharedDataSourceService sharedDataSourceService)
  2. {
  3.         if (env.IsDevelopment())
  4.         {
  5.                 app.UseDeveloperExceptionPage();
  6.         }
  7.         
  8.         app.UseFileServer();

  9.         app.UseReporting(config => config.UseFileStore(ResourcesRootDirectory));
  10.         app.UseDesigner(config =>
  11.         {
  12.                 config.UseSharedDataSources(sharedDataSourceService);
  13.                 config.UseFileStore(ResourcesRootDirectory, false);
  14.                 config.UseDataSetTemplates(dataSetsService);
  15.         });


  16.         app.UseMvc();
  17. }
复制代码
3.修改前段js,将共享数据源开放出来
这个我们只需要在create的时候,修改data的一个对象即可
完整代码:
  1. arWebDesigner.create('#ar-web-designer', {
  2.   rpx: { enabled: true },
  3.   appBar: { openButton: { visible: true } },
  4.   data: {
  5.     dataSets: { canModify: true }, dataSources: {
  6.       canModify: true,
  7.       shared: { enabled: true }
  8.     }
  9.   },
  10.   preview: {
  11.     openViewer: (options) => {
  12.       if (viewer) {
  13.         viewer.openReport(options.documentInfo.id);
  14.         return;
  15.       }
  16.       viewer = createViewer({
  17.         element: '#' + options.element,
  18.         reportService: {
  19.           url: 'api/reporting',
  20.         },
  21.         reportID: options.documentInfo.id,
  22.         settings: {
  23.           zoomType: 'FitPage',
  24.         },
  25.       });
  26.     }
  27.   }
  28. });
复制代码
data -> dataSource -> shared开启即可。
至此,一个webDesigner的共享数据源添加就完成了。

示例Demo:

本帖子中包含更多资源

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

x

0 个回复

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