DevExpress Reporting是.NET Framework下功能完善的報表平臺，它附帶了易于使用的Visual Studio報表設計器和豐富的報表控件集，包括數據透視表、圖表，因此您可以構建無與倫比、信息清晰的報表。

DevExpress Reports — 跨平臺報表組件，允許用戶在針對任何基于.NET平臺的應用程序中生成報表文檔，可部署在任何支持的操作系統上。在過去的幾個月里，官方技術團隊一直專注于增強多個環境中的報表生成進程，同時保持與主機操作系統本身的獨立性。在我們深入研究細節之前，先簡單介紹一下Visual Studio Code，以及為什么選擇它而不是其他可用的替代品。

獲取DevExpress Reporting v23.1正式版下載

DevExpress技術交流群9：909157416      歡迎一起進群討論

在上文中（），我們為大家介紹了DevExpress Visual Studio Code報表設計器擴展、基于VS Code擴展的技術以及一些前期配置等。本文將繼續介紹如何創建一個新的DevExpress報表，歡迎持續關注我們哦~

創建一個新的DevExpress報表

此時我們準備向示例項目中添加一個新報表，擴展增加一個新的DX Reporting: New Report命令到Visual Studio代碼中，只需再次按F1來使用該命令并指定新的報表名稱。

VS Code將自動打開新創建的報表，并以空白報表呈現DevExpress報表設計器：

在此階段，我們可以向該報表添加數據源，并使用內置的報表向導對其進行設計。我們將選擇右側的數據源選項卡，然后點擊"Add Data Source"按鈕調用數據源向導：

出于本示例的目的，我們將使用之前在reporting.config.file中設置的示例 "Dummy 100 Users"JSON數據源，選擇可用的數據源，點擊“Finish”完成操作：

接下來，我們將導航到報表設計器主菜單，并在報表向導中選擇Design in Report Wizard...來啟動報表向導：

我們將按照向導提示完成報表生成過程，如果您遵循這篇文章，請確保使用“Save”快捷鍵保存報表模板文件(在macOS中是Command+ S)。當您這樣做時，可以在屏幕上看到以下內容：

要查看結果，只需要按下"Preview" 按鈕，您可以從內置的打印預覽窗口打印和導出報表文檔：

運行示例應用程序

在這個階段，我們必須修改一些項目代碼文件，以便在運行時將這個報表布局加載到XtraReport類中。首先我們必須移動 "newReport. repx" 文件到PredefinedReports目錄中，完成后我們需要進行以下更改：

HomeController.cs -> Viewer method

將在文檔查看器中打開的報表名稱更改為newReport：

public IActionResult Viewer([FromServices] IWebDocumentViewerClientSideModelGenerator clientSideModelGenerator,
[FromQuery] string reportName) {

var reportToOpen = string.IsNullOrEmpty(reportName) ? "newReport" : reportName;
var model = new Models.ViewerModel {
ViewerModelToBind = clientSideModelGenerator.GetModel(reportToOpen, WebDocumentViewerController.DefaultUri)
};
return View(model);
}

ReportsFactory.cs

替換如下代碼，從PredefinedReports目錄加載報表模板：

public static class ReportsFactory
{
public static string ReportsPath { get; set; }
public static Dictionary<string, Func<XtraReport>> Reports = new Dictionary<string, Func<XtraReport>>()
{
["TestReport"] = () => new TestReport(),
["newReport"] = () => XtraReport.FromFile(Path.Combine(ReportsPath + "/PredefinedReports/newReport.repx"))
};

}

Startup.cs

修改類構造函數來將IWebEnvironment.ContnetRootPath變量傳遞到ReportsFactory類：

public Startup(IConfiguration configuration, IWebHostEnvironment environment) {
Configuration = configuration;
ReportsFactory.ReportsPath = environment.ContentRootPath;
AppDomain.CurrentDomain.SetData("DataDirectory", environment.ContentRootPath);
}

ReportDbContext.cs -> InitializeDatabase method

將JSON數據源添加到應用程序注冊的數據源集合中：

...
var Dummy100UsersConnectionName = "Dummy 100 Users";
if(!JsonDataConnections.Any(x => x.Name == Dummy100UsersConnectionName)) {
var newData = new JsonDataConnectionDescription {
Name = Dummy100UsersConnectionName,
DisplayName = "Dummy 100 Users",
ConnectionString = "Uri=//dummyjson.com/users/"
};
JsonDataConnections.Add(newData);
}
...

最后，我們需要確保在每次構建應用程序時將報表模板文件復制到應用程序輸出目錄中。要實現這一點，我們需要再"*. csproj"文件中添加以下內容：

<ItemGroup>
<None Remove="PredefinedReports\*.repx" />
</ItemGroup>
<ItemGroup>
<Content Include="PredefinedReports\newReport.repx">
<CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
</Content>
</ItemGroup>

通過這些修改，我們可以切換到VS Code中的終端窗口并運行Docker容器：

export DX_NUGET=//nuget.devexpress.com/Your_API_Token/api
DOCKER_BUILDKIT=1 docker build -t reporting-app --secret id=dxnuget,env=DX_NUGET .
docker run -p 8080:80 reporting-app:latest

應用程序頁面可通過以下URL訪問：//localhost:8080/，點擊頂部的 "Document Viewer"鏈接顯示剛剛在Visual Studio Code中創建的報表打印預覽。