基于MVC4+EasyUI的Web开发框架经验总结（15）--在MVC项目中使用RDLC报表

RDLC是一个不错的报表，有着比较不错的设计模式和展示效果，在个人Winform开发里面，使用RDLC也是一个比较方便操做，如能够参考文章《DevExpress的XtraReport和微软RDLC报表的使用和对比》或者《会员管理系统的设计和开发（2）-- RDLC报表的设计及动态加载》进行了解。可是基于MVC方式，如何构建和展示RDLC报表呢？本文主要介绍如何在基于MVC4+EasyUI的Web开发框架上进行RDLC的集成和使用。

一、RDLC绑定数据源

RDLC的报表设计，是使用VS直接进行编辑的，所以它不论是在Web上，仍是在Winform上，设计的方式都差很少，好像绑定数据源的方式有一点不一样，WInform的能够选择基于，而Web的只能基于数据库链接方式构建数据绑定对象。

它们二者之间在建立数据源的时候，弹出的对话框选择界面以下所示，看起来Winform的方式选择数据源的方式不少样化。

最终，经过Web方式构建了一个数据集，并在设计视图里面设计一个用户的报表界面，并绑定它们对应的字段，具体以下所示。

在RDLC的设计界面上，它们的操做内容好像是同样的，没有什么差别，可使用各类数学函数SUM、COUNT等，也可使用对字段的表达式，格式样式等方式，从而方便构建出一些准确、美观的报表，这部分能够参考文中开始的那两篇引用文章，这里就再也不进行细节上的赘述，由于它们是同样的。

二、在Web界面上建立一些功能按钮和实现

咱们在MVC项目里面，建立并保存好RDLC报表文件到对应的Report目录上，以下所示。

而后建立一个视图，并在视图里面构建一些按钮，方便构建查询不一样的报表格式功能，具体效果以下所示。

HTML代码以下所示

    <div style="padding:10px; border:1px solid black">
        <div>
            <a href="@Url.Action("UserRdlcReport", new { format = "Image" })" class="easyui-linkbutton" data-options="iconCls:'icon-view'">图片输出</a>
            <a href="@Url.Action("UserRdlcReport", new { format = "PDF" })" class="easyui-linkbutton" data-options="iconCls:'icon-view'"> PDF输出</a>
            <a href="@Url.Action("UserRdlcReport", new { format = "Excel" })" class="easyui-linkbutton" data-options="iconCls:'icon-view'">Excel输出</a>
            <a href="@Url.Action("UserRdlcReport", new { format = "Word" })" class="easyui-linkbutton" data-options="iconCls:'icon-view'">Word输出</a>
        </div>
    </div>
    <div id="autoUpdate" style="display: none; overflow-y: auto" class="SlideContainer">
        <table width="100%" height="100%">
            <tr>
                <td>
                    <table>
                        <tr>
                            <td></td>
                            <td></td>
                        </tr>
                    </table>
                </td>
            </tr>
            <tr><td><iframe id="myReport" width="100%" height="800"></iframe></td></tr>
        </table>
    </div>

完成这些布局后，咱们还须要在对应的控制器里面，对RDLC的报表进行数据绑定并呈现出来。

绑定RDLC报表，并赋值对应的数据源操做以下所示。

            LocalReport localReport = new LocalReport();
            localReport.ReportPath = Server.MapPath("~/Report/WHC.UserReport.rdlc");
            var dt = baseBLL.GetAll();

            ReportDataSource reportDataSource = new ReportDataSource("DataSet1", dt);
            localReport.DataSources.Add(reportDataSource);

呈现的操做代码以下所示，默认咱们以图片进行展示。

            Warning[] warnings;
            string[] streams;
            byte[] renderedBytes;

            renderedBytes = localReport.Render(
                reportType,
                deviceInfo,
                out mimeType,
                out encoding,
                out fileNameExtension,
                out streams,
                out warnings);

            return File(renderedBytes, (format.ToLower() == "image") ? "image/jpeg" : mimeType);

最终默承认以看到图片的报表展示效果。

固然，咱们上面还有其余功能的操做，如PDF功能的展示，这个是一个不错的格式展示，每页分的很好，若是在IE里面，会独立打开PDF文件；若是是Chrome浏览器，则会在浏览器里面直接打开，比较好。

固然，Excel和Word就只能下载进行查看了，由于浏览器并不支持直接在上面进行预览查看的了，除非借助其余控件或者作法。

三、图片内容的连续输出

咱们了解RDLC的话，应该知道，通常RDLC报表，它都是经过一个DeviceInfo的信息进行展示的，以下所示是一个标准的DeviceInfo对象。

            string deviceInfo =
            "<DeviceInfo>" +
            "  <OutputFormat>" + deviceType + "</OutputFormat>" +
            "  <PageWidth>8.5in</PageWidth>" +
            "  <PageHeight>11in</PageHeight>" +
            "  <MarginTop>0.5in</MarginTop>" +
            "  <MarginLeft>1in</MarginLeft>" +
            "  <MarginRight>1in</MarginRight>" +
            "  <MarginBottom>0.5in</MarginBottom>";

可是这样的内容，若是展示图片的话，就只会展现一页的内容，通常是800的高度这样子，可是个人报表里面可能有不少记录，如何可以让它所有展示出来呢?

方法是有的，不过不是很完美，就是须要计算大概的尺寸，而后修改PageHeight的数值，让它动态的删除最大的记录，达到所有内容均可以输出看到。

为了达到这个目的，我对图片格式输出的报表，对它的高度进行了一个简单的计算，而后换成它的标准高度，这样代码以下所示。

            if(format.ToLower() == "image")
            {
                double inchValue = (dt.Count / 37.0) * 11; 
                deviceInfo += string.Format("  <PageHeight>{0}in</PageHeight>", inchValue);
            }
            else
            {
                deviceInfo += "  <PageHeight>11in</PageHeight>";
            }

最后界面代码以下所示。