Merge pull request #2 from DevExpress-Examples/25.1.3-feature-direct

25.1.3 feature simplification

Author: artemkuzmindevexpress

GridMasterDetailExport/Components/Pages/Index.razor

@@ -1,32 +1,23 @@
 @page "/"
 @rendermode InteractiveServer
 @inject IJSRuntime JS
-
+@using DevExpress.XtraReports.UI
 @using GridMasterDetailExport.Data
+@using GridMasterDetailExport.Reports
 
 <DxGrid @ref="MasterGrid"
     AllowColumnReorder="false"
     AllowSort="false"
     Data="DataProvider.GetUsers()"
     KeyFieldName="UserID">
     <ToolbarTemplate Context="ctx">
-        <form id="@exportFormId" class="w-100" target="_blank" method="post"
-              action="api/home/@(exportFormat)">
-            <AntiforgeryToken />
-            <input type="hidden" name="masterColumns" value="@masterColumns" />
-            <input type="hidden" name="detailColumns" value="@detailColumns" />
-            <input type="hidden" name="expandedStates" value="@expandedStates" />
-            <DxToolbar>
-                <Items>
-                    <DxToolbarItem Text="Export as PDF"
-                                   Click='async() => await ExportTo("pdf")' />
-                    <DxToolbarItem Text="Export as XLSX"
-                                   Click='async() => await ExportTo("xlsx")' />
-                    <DxToolbarItem Text="Export as CSV"
-                                   Click='async() => await ExportTo("csv")' />
-                </Items>
-            </DxToolbar>
-        </form>
+        <DxToolbar>
+            <Items>
+                <DxToolbarItem Text="Export as PDF" Click="ExportToPdf" />
+                <DxToolbarItem Text="Export as XLSX" Click="ExportToXlsx" />
+                <DxToolbarItem Text="Export as CSV" Click="ExportToCsv" />
+            </Items>
+        </DxToolbar>
     </ToolbarTemplate>
     <Columns>
         <DxGridDataColumn FieldName="UserID" />
@@ -52,60 +43,75 @@
         </DxGrid>
     </DetailRowTemplate>
 </DxGrid>
-
+<script>
+  window.downloadFileFromStream = async (fileName, contentStreamReference) => {
+    const arrayBuffer = await contentStreamReference.arrayBuffer();
+    const blob = new Blob([arrayBuffer]);
+    const url = URL.createObjectURL(blob);
+    const anchorElement = document.createElement('a');
+    anchorElement.href = url;
+    anchorElement.download = fileName ?? '';
+    anchorElement.click();
+    anchorElement.remove();
+    URL.revokeObjectURL(url);
+  }
+</script>
 @code {
-    private readonly string exportFormId = "export-form";
-    private string? masterColumns;
-    private string? detailColumns;
-    private string? expandedStates;
-    private string exportFormat = "pdf";
-    private DxGrid? masterGrid;
-    private DxGrid? detailGrid;
+    public DxGrid? MasterGrid { get; set; }
 
-    public DxGrid? MasterGrid {
-        get => masterGrid;
-        private set {
-            if(masterGrid is null) {
-                masterGrid = value;
-                masterColumns = string.Join(";",
-                    GetVisibleColumnNames(masterGrid));
-            }
-        }
+    public DxGrid? DetailGrid { get; set; }
+
+    private async Task ExportToPdf() {
+        using var report = GetReport();
+        using var stream = new MemoryStream();
+        await report.ExportToPdfAsync(stream);
+        await DownloadStreamAsync(stream, "exportResult.pdf");
     }
 
-    public DxGrid? DetailGrid {
-        get => detailGrid;
-        private set {
-            if(detailGrid is null) {
-                detailGrid = value;
-                detailColumns = string.Join(";",
-                    GetVisibleColumnNames(detailGrid));
-            }
-        }
+    private async Task ExportToXlsx() {
+        using var report = GetReport();
+        using var stream = new MemoryStream();
+        await report.ExportToXlsxAsync(stream);
+        await DownloadStreamAsync(stream, "exportResult.xlsx");
     }
 
-    private async Task ExportTo(string format) {
-        await Task.Run(() => {
-            exportFormat = format;
-            expandedStates = string.Join(";", GetRowsExpandedStates());
-        });
-        await JS.InvokeVoidAsync("submitForm", exportFormId);
+    private async Task ExportToCsv() {
+        using var report = GetReport();
+        using var stream = new MemoryStream();
+        await report.ExportToCsvAsync(stream);
+        await DownloadStreamAsync(stream, "exportResult.csv");
     }
 
-    private IEnumerable<string> GetVisibleColumnNames(IGrid? grid) {
+    private XtraReport GetReport() {
+        return ReportGenerationHelpers.GetReportFromDxGrid(
+            GetVisibleColumnNames(MasterGrid),
+            GetVisibleColumnNames(DetailGrid),
+            GetRowsExpandedStates()
+        );
+    }
+
+    private static string[] GetVisibleColumnNames(IGrid? grid) {
         return grid?.GetVisibleColumns()
                     .OfType<DxGridDataColumn>()
-                    .Select(c => c.FieldName ?? c.Name) ?? [];
+                    .Select(c => c.FieldName ?? c.Name).ToArray() ?? [];
     }
 
     private Dictionary<string, bool> GetRowsExpandedStates() {
         Dictionary<string, bool> masterRowExpandedStates = new();
-        for(int i = 0; i < masterGrid?.GetVisibleRowCount(); i++) {
-            if(masterGrid.GetDataItem(i) is User user) {
+        for(int i = 0; i < MasterGrid?.GetVisibleRowCount(); i++) {
+            if(MasterGrid.GetDataItem(i) is User user) {
                 masterRowExpandedStates[user.UserID.ToString()]
-                    = masterGrid.IsDetailRowExpanded(i);
+                    = MasterGrid.IsDetailRowExpanded(i);
             }
         }
         return masterRowExpandedStates;
     }
+
+    async Task DownloadStreamAsync(Stream stream, string fileName) {
+
+        stream.Seek(0, SeekOrigin.Begin);
+
+        using var streamRef = new DotNetStreamReference(stream);
+        await JS.InvokeVoidAsync("downloadFileFromStream", fileName, streamRef);
+    }
 }

GridMasterDetailExport/Controllers/HomeController.cs

@@ -6,6 +6,7 @@
   </PropertyGroup>
   <ItemGroup>
     <PackageReference Include="DevExpress.Blazor" Version="25.1.*" />
+    <PackageReference Include="DevExpress.Drawing.Skia" Version="25.1.*" />
     <PackageReference Include="DevExpress.Reporting.Core" Version="25.1.*" />
   </ItemGroup>
 </Project>

GridMasterDetailExport/Data/GridState.cs

@@ -12,7 +12,7 @@
 
 namespace GridMasterDetailExport.Reports {
     public static class ReportGenerationHelpers {
-        public static XtraReport GetReportFromDxGrid(GridState gridState) {
+        public static XtraReport GetReportFromDxGrid(string[] masterColumnNames, string[] detailColumnNames, Dictionary<string, bool> rowExpandedStates) {
             XtraReport report = new XtraReport() {
                 ReportUnit = ReportUnit.HundredthsOfAnInch,
                 PaperKind = DXPaperKind.Letter,
@@ -50,19 +50,19 @@ public static XtraReport GetReportFromDxGrid(GridState gridState) {
             };
             detailDataSource.RebuildResultSchema();
 
-            var fds = ReportGenerationHelpers.CreateFederationDataSource(masterDataSource, detailDataSource, nameof(User.UserID), nameof(Order.UserID), gridState.RowExpandedStates);
+            var fds = ReportGenerationHelpers.CreateFederationDataSource(masterDataSource, detailDataSource, nameof(User.UserID), nameof(Order.UserID), rowExpandedStates);
             #endregion
 
             float contentWidth = report.PageWidthF - report.Margins.Left - report.Margins.Right;
 
             report.DataSource = fds;
             report.DataMember = masterDataSource.Name;
 
-            report.AddTableHeaderBand(new RectangleF(0f, 0f, contentWidth, 25f), tableHeaderStyle.Name, gridState.MasterColumnNames);
-            report.AddTableRowBand(new RectangleF(0f, 0f, contentWidth, 25f), tableRowStyle.Name, gridState.MasterColumnNames, true);
+            report.AddTableHeaderBand(new RectangleF(0f, 0f, contentWidth, 25f), tableHeaderStyle.Name, masterColumnNames);
+            report.AddTableRowBand(new RectangleF(0f, 0f, contentWidth, 25f), tableRowStyle.Name, masterColumnNames, true);
             report.AddDetailReport(
                 $"{masterDataSource.Name}.{masterDataSource.Name}{detailDataSource.Name}",
-                gridState.DetailColumnNames,
+                detailColumnNames,
                 new RectangleF(20f, 20f, contentWidth - 20f, 25f),
                 tableHeaderStyle.Name,
                 tableRowStyle.Name);