在上文中我们讲到如何使用ASP .NET MVC Core应用程序创建Web设计器示例，本文我们主要讲如何通过ASP .NET MVC应用程序创建Web设计器示例。
ActiveReports 是一款专注于 .NET 和 .NET Core 平台的报表控件。通过拖拽式报表设计器，可以快速地设计 Excel表格、Word文档、图表、数据过滤、数据钻取、精准套打等类型报表，全面满足 WinForm、ASP.NET、ASP.NET MVC、WPF 平台中各种报表的开发需要。同时，通过丰富的 API 可以灵活的实现报表创建、加载和运行时的个性化自定义需求。点击这里获取更多产品详情>>
ActiveReports最新试用版
点击这里查看上篇文章
11、在出现的“预览更改”对话框中，单击“确定”。
12、在出现的“许可证接受”对话框中，单击“我接受”。
13、在解决方案资源管理器中，右键单击您的项目，然后转到添加>新建项…。
在出现的窗口中，转到“代码”>“类”，输入Startup.cs，然后单击“添加”。
修改新添加的Startup.cs的内容，如下所示：
using System;using System.IO;using System.Linq;using System.Web;using GrapeCity.ActiveReports.Aspnet.Designer;using Owin;using Microsoft.Owin;using Microsoft.Owin.StaticFiles;using Microsoft.Owin.FileSystems;using System.Web.Mvc;using System.Web.Routing;[assembly: OwinStartup(typeof(AspNetDesignerSample.Startup))]namespace AspNetDesignerSample{public class Startup{// resources (reports, themes, images) locationprivate static readonly DirectoryInfo ResourcesRootDirectory =new DirectoryInfo(String.Format("{0}.\resources\", HttpRuntime.AppDomainAppPath));public void Configuration(IAppBuilder app){// web designer middlewareapp.UseDesigner(config => config.UseFileStore(ResourcesRootDirectory));// static files middlewaresvar fileSystem = new PhysicalFileSystem(String.Format("{0}.\wwwroot\", HttpRuntime.AppDomainAppPath));app.UseDefaultFiles(new DefaultFilesOptions { DefaultFileNames = new[] { "index.html" }, FileSystem = fileSystem });app.UseStaticFiles(new StaticFileOptions { FileSystem = fileSystem });}}}
14、在示例项目根目录中创建“ resources”文件夹； 您可以放置现有的报告，主题，
15、在命令行中使用以下命令从NPM下载并安装与WebDesigner相关的文件和文件夹：
npm install @grapecity/ar-designer
设计器文件/文件夹将下载到您当前的目录中：
..node_modules@grapecityar-designerdist
16、在示例项目根目录中创建“ wwwroot”文件夹。 复制以下与WebDesigner相关的基本文件，并将其粘贴到示例项目wwwroot子文件夹中：
- baseServerApi.js
- web-designer.css
- web-designer.js
- vendor folder
如果您想使用我们的示例对话框组件来保存报告，也可以选择复制file-dialog.css和file-dialog.js。
17、在“解决方案资源管理器”顶部栏中，选中“显示所有文件”。
右键单击wwwroot，然后选择“包含在项目中”。
18、右键单击wwwroot，然后选择添加>新建项…：
在出现的窗口中，转到Web> HTML页面，输入index.html，然后单击添加。
在解决方案资源管理器中，找到新添加的index.html并按如下所示修改其内容：
<!DOCTYPE html><html><head><title>Web Designer Sample</title><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><meta http-equiv="x-ua-compatible" content="ie=edge"><!-- designer-related css --><link rel="stylesheet" href="vendor/css/materialdesignicons.min.css" media="all" type="text/css" /><link rel="stylesheet" href="vendor/css/bootstrap.min.css" /><link rel="stylesheet" href="vendor/css/font-awesome.min.css"><link rel="stylesheet" href="vendor/css/ionicons.min.css"><link rel="stylesheet" href="vendor/css/fonts-googleapis.css" type="text/css"><link rel="stylesheet" href="web-designer.css" /></head><body class="theme-blue"><!-- designer-related js --><script src="vendor/js/jquery.min.js"></script><script src="vendor/js/bootstrap.min.js"></script><script src="baseServerApi.js"></script><script src="web-designer.js"></script><!-- designer root div --><div id="designer-id" style="width: 100%; height: 100%;"></div><script>// create designer optionsvar designerOptions = GrapeCity.ActiveReports.WebDesigner.createDesignerOptions(baseServerApi);// render designer applicationGrapeCity.ActiveReports.WebDesigner.renderApplication('designer-id', designerOptions);</script></body></html>
构建您的解决方案并运行它。 在浏览器中打开带有空白RDL报告的WebDesigner。
现在ActiveReports最高优惠19039，团队授权更是低至34748元！点击这里获取更多优惠>>
如果你对我们的产品感兴趣或者有任何疑问，欢迎咨询在线客服>>
标签：
来源：慧都
声明：本站部分文章及图片转载于互联网，内容版权归原作者所有，如本站任何资料有侵权请您尽早请联系jinwei@zod.com.cn进行处理,非常感谢！