如何在Web应用程序.Mono中使用在线设计器

那些在FastReport.Net中初次邂逅在线设计器的人肯定非常欣赏它的所有优点,并且能够在FastReport.Mono中使用,希望在他们的Web应用程序中也可以使用它。事实上,这并没什么难的。今天,我们将研究在MonoDevelop中创建Web应用程序并在其中使用在线设计器的方法。

那些在FastReport.Net中初次邂逅在线设计器的人肯定非常欣赏它的所有优点,并且能够在FastReport.Mono中使用,希望在他们的Web应用程序中也可以使用它。事实上,这并没什么难的。今天,我们将研究在MonoDevelop中创建Web应用程序并在其中使用在线设计器的方法。

让我们创建一个ASP .Net MVC项目:

如何在Web应用程序.Mono中使用在线设计器

我们需要在References中为项目添加库:

FastReport.MonoFastReport.WebSystem.Net.Http

使用在fast-report.com上在线设计器中汇编的在线设计器下载zip存档。解压缩归档文件并将WebReportDesigner文件夹添加到项目根目录。

我们还需要一个文件夹,我们将在其中保存 表,存储包含数据的文件。将App_Data文件夹添加到项目根目录。我们将使用FastReport.Mono交付的演示 表,因此我们需要nwind.xml数据库。将其添加到App_Data文件夹。

现在你可以开始编程了。在Controller文件夹中是HomeController.cs文件,修复它。在使用部分,我们需要库:

using System;using System.Collections.Generic;using System.Linq;using System.Web;using System.Web.Mvc;using System.Web.UI;using System.Text;using System.IO;using FastReport;using FastReport.Web;using FastReport.Utils;using System.Web.UI.WebControls;using FastReport.Export.Html;using FastReport.Data;using System.Net.Http.Headers;using FastReport.Export.Image;using System.Net.Http;

修复main,到目前为止唯一的Web方法索引:

private WebReport webReport = new WebReport(); // Web report objectpublic ActionResult Index() { webReport.Width = Unit.Percentage(100); webReport.Height = Unit.Percentage(100); System.Data.DataSet dataSet = new System.Data.DataSet(); dataSet.ReadXml("App_Data/nwind.xml"); // Read database webReport.Report.RegisterData(dataSet, "NorthWind"); // Register data in the reportif (System.IO.File.Exists("App_Data/report.frx")) { webReport.Report.Load("App_Data/report.frx"); } webReport.DesignReport = true; webReport.DesignerPath = "WebReportDesigner/index.html"; webReport.DesignerSaveCallBack = "Home/SaveDesignedReport"; webReport.ID = "DesignReport"; ViewBag.WebReport = webReport; // Pass the report to View return View(); }

让我们更详细地看一下。以前,我们创建了一个可在类中访问的Web 表对象。在Index ()方法中,我们在开始时设置WebReport对象的大小——高度和宽度为100%。之后我们创建一个数据集。然后我们加载到xml数据库中。我们在 表中注册数据源。我们检查 表模板文件是否存在,如果成功,则将其加载到 表对象中。

使用ViewBag,我们将 表对象传递给视图。

为这些按钮编写Web方法。首先将 表上传到服务器:

[HttpPost] // The attribute indicates that the method processes the Post request. public ActionResult Upload(HttpPostedFileBase upload) { if (upload != null) { // Save the file on the server upload.SaveAs("App_Data/report.frx"); } return RedirectToAction("Index"); // Call web index method }

现在 表下载方法到本地计算机:

public FileResult GetFile() { return File("App_Data/tmp.frx", "application/octet-stream", "tmp.frx"); }

好方法!只需一行。如果他们都像那样……

如何在Web应用程序.Mono中使用在线设计器
[HttpPost] // call-back for save the designed report public ActionResult SaveDesignedReport(string reportID, string reportUUID) { ViewBag.Message = String.Format("Confirmed {0} {1}", reportID, reportUUID);  if (reportID == "DesignReport") { Stream reportForSave = Request.InputStream; string pathToSave = "App_Data/tmp.frx";  using (FileStream file = new FileStream(pathToSave, FileMode.Create)) { reportForSave.CopyTo(file); } }  return View(); }

在第一行中,我们会显示一条消息,确认保存 表。然后,我们检查 表标识符,如果它等于“DesignReport”,那么我们将结果发送到stream。并基于此stream创建新的 表模板文件。

对于此方法,我们需要创建一个视图。右键单击方法签名并创建一个新视图(create view):

如何在Web应用程序.Mono中使用在线设计器

在“view”代码中,只需显示消息:

<h2>@ViewBag.Message</h2>

因此,第二个文件将出现在主文件夹SaveDesignedReport.cshtml中。 

您还记得,在Index ()方法中,我们指定了web 表的属性吗webReport.DesignerSaveCallBack = “Home/SaveDesignedReport”如果您不知道将调用哪个视图来显示回调以保存 表,则可以设置此属性的值。

现在让我们转到一个同样有趣的部分——编写Index.cshtml视图:

@{ ViewBag.Title = "Home Page";}<h3>Select file</h3>@using (Html.BeginForm("Upload", "Home", FormMethod.Post, new { enctype = "multipart/form-data" })){ <input type="file" name="upload" /> <input type="submit" value="Upload" />}@using (Html.BeginForm("GetFile", "Home", FormMethod.Get)) { <input id="dwn" type="submit" value="Download designed report" /> }@ViewBag.WebReport.GetHtml()

在这里,我们显示标题。并使用BeginForm帮助程序创建一个带有文件上传字段和按钮的表单。作为参数,此帮助程序接受来自控制器的Web方法的名称、控制器的名称、请求的类型、数据的编码方式。

您还记得,我们在HomeController中创建了两个方法:将 表下载到设计器并将 表下载到本地计算机。帮助程序创建的表单中的Web方法的名称必须与控制器中的名称匹配。

如您所见,我们还创建了一个带有按钮的表单,用于将 表从服务器下载到本地计算机。在最后一行代码中,我们将 表转换为HTML格式并显示它。为此,请使用内置方法GetHtml (),这会导致将构造的 表导出为此格式(在我们的示例中为设计器)。

在_Layout.cshtml页面的主文件中,您需要连接FastReport脚本:

<head>…@WebReportGlobals.Scripts()@WebReportGlobals.Styles()</head>

项目中有两个Web配置。在ASP.Net项目中,web.config仅适用于它所在的目录以及所有子目录。因此,位于Views目录中的Web.config是专门为视图设计的。打开它并在Namspaces部分添加几行:

<system.webServer> <namespaces>… <add namespace="FastReport" /> <add namespace="FastReport.Web" /> </namespaces>

第二个Web.config位于项目的根目录,这意味着它配置整个应用程序。我们将为其添加一个处理程序,以便将Web 表对象导出为Html格式:

<system.webServer> <handlers> … <add name="FastReportHandler" path="FastReport.Export.axd" verb="*" type="FastReport.Web.Handlers.WebExport"/> </handlers> </system.webServer>

如果web.config中没有<system.webServer>和<namespaces>部分,则添加它们。

在此步骤中,我们可以将其视为我们的小型Web应用程序。让我们在xsp调试Web服务器上运行它。只需按Ctrl + F5即可。

如何在Web应用程序.Mono中使用在线设计器

由于<input type = “file” name = “upload” />,出现了Browse …按钮和带有文件名的标签。单击此按钮并选择 表模板文件。

如何在Web应用程序.Mono中使用在线设计器

标签现在显示文件名。单击上传按钮:

如何在Web应用程序.Mono中使用在线设计器

该 表将上传到设计器。现在我们可以对 表模板进行必要的更改。然后转到“Report”选项卡并单击保存“save”图标:

如何在Web应用程序.Mono中使用在线设计器

之后, 表已准备好下载,因此请单击下载设计 表“Download designed report”按钮。将出现一个标准浏览器对话框,我们可以在其中下载 表或拒绝操作。下载 表并在下载文件夹中找到它。

就这样。如您所见,Linux上的ASP .Net Web项目非常真实,也没有比在Windows下困难多少。

产品介绍 | 下载试用 | 优惠活动 | 在线客服

标签:

声明:本站部分文章及图片源自用户投稿,如本站任何资料有侵权请您尽早请联系jinwei@zod.com.cn进行处理,非常感谢!

上一篇 2019年7月26日
下一篇 2019年7月26日

相关推荐

发表回复

登录后才能评论