DevExpress Reporting Implementation #1012

serdar.genc@talentra.net created 3 years ago

Hi, i want to implementation to my abp application. my guide : https://docs.devexpress.com/XtraReports/401762/web-reporting/asp-net-core-reporting/document-viewer/quick-start/add-the-document-viewer-to-an-aspnet-core-application

How can I do this implementation in my abp application? I would be glad if you help. @cotur

Check the docs before asking a question: https://docs.abp.io/en/commercial/latest/ Check the samples, to see the basic tasks: https://docs.abp.io/en/commercial/latest/samples/index The exact solution to your question may have been answered before, please use the search on the homepage.

ABP Framework version: v4.2.2
UI type: MVC
DB provider: EF Core
Tiered (MVC) or Identity Server Separated (Angular): no

23 Answer(s)

0
cotur created 3 years ago
Hi @serdar.genc

You can implement Devexpress components to your ABP Application in just 3 steps.

Import npm packages correctly

Write Script & Style contributors

Import them to your razor pages

Import npm packages correctly

When you add npm packages to your package.json in **.Web project, you need to write mappings also to copy just required files in your wwwroot folder.

After writing mappings, cast gulp action in command line.

Write Script & Style contributors

We've added packages correctly to wwwroot folder, then we can use them directly with <abp-script & <abp-style tag helpers, but we may use those in different razor pages, so let's make reusable contributors.

Import them to your razor pages

Done!

This step by step article (link) can help you to add any DevExtreme component to your application.

Please follow the article and use same things for Document Viewer.

If you get any trouble while implementing, just let me know.
1
0
serdar.genc@talentra.net created 3 years ago
The DevExtreme article is very excellent. I applied it without any problems. Thank you for that.

But Reporting ...

OK. here are my questions:

To which project should I install 'DevExpress.AspNetCore.Reporting'? ***. Domain or ***. Web or ***.Application.Contracts ?

package.json in **. Web, okay no problem.

How can I define the following code in abp.resourcemapping.js? ...... { "outputFileName": "wwwroot / css / thirdparty.bundle.css", "inputFiles": [ "node_modules / jquery-ui-dist / jquery-ui.min.css", "node_modules / bootstrap / dist / css / bootstrap.min.css", "node_modules / devextreme / dist / css / dx.common.css", "node_modules / devextreme / dist / css / dx.light.css" ], "minify": { "enabled": false, "adjustRelativePaths": false } } .......

and then gulp etc. OK. no problem.

I have no idea how to use libman.json in abp. What should I do for libman.json?
0
cotur created 3 years ago
Hi,

I think the reporting package (DevExpress.AspNetCore.Reporting) will be used in **.Web project. If you need the package classes or methods in other projects, just move the package to shared projects. For example, you need the package in Application & Web project, so install the DevExpress.Asp...Reporting package to Application.Contracts project.

Here is the project graph: https://docs.abp.io/en/abp/latest/Domain-Driven-Design-Implementation-Guide#dependencies-of-the-projects-in-the-solution

About the 3. question:

"node_modules / jquery-ui-dist / jquery-ui.min.css", "node_modules / devextreme / dist / css / dx.common.css", "node_modules / devextreme / dist / css / dx.light.css"

You don't need to create bundle for those, just use them seperately and include required them to your razor page, you can create a reusable script and style contributors.

mappings: { "@node_modules/devextreme/dist/**/*": "@libs/devextreme/", "@node_modules/jquery-ui-dist/jquery-ui.min.css": "@libs/jquery-ui-dist/jquery-ui.min.css", }

Also please check the ABP Bundling-Minification & ABP Client Side Package Management

Libman

We don't use libman, but as you see in the image below, the example is just moves some files from node_modules folder to under wwwroot folder like we did before.

So we can create mapping for this also,

"@node_modules/devextreme/dist/css/icons/**/*": "wwwroot/icons/"

after create mappings, do not forget to cast gulp action for your project.
0

davidc@educlarity.com created 3 years ago

Greetings;

Have you been able to successfully implement DevExpress Reports inside abp.io (commecial). I've followed the directions as best as possible (for implementing DevExtreme controls), but still can't view a report.

Im not sure if it's something with the last part (making changes to the Startup.cs) class...

Do you have any commens, suggestions, or dare say, some documentation?

Any help would be greatly appreicated.

--Dave davidc@educlarity.com
0

davidc@educlarity.com created 3 years ago

It looks as if the app is not looking for the fonts in /wwwroot/icons as cotur noted above

So we can create mapping for this also,

"@node_modules/devextreme/dist/css/icons/**/*": "wwwroot/icons/"

These are the error messages Im receiving below.

So I changed it to

"@node_modules/devextreme/dist/css/icons/**/*": "@libs/devextreme/css/icons/"

--error messages

GEThttps://localhost:44375/libs/devextreme/css/icons/dxicons.woff2 [HTTP/2 404 Not Found 121ms]

downloadable font: download failed (font-family: "DXIcons" style:normal weight:400 stretch:100 src index:2): status=2147746065 source: https://localhost:44375/libs/devextreme/css/icons/dxicons.woff2 GEThttps://localhost:44375/libs/devextreme/css/icons/dxicons.woff [HTTP/2 404 Not Found 33ms]

GEThttps://localhost:44375/libs/devextreme/css/icons/dxicons.ttf [HTTP/2 404 Not Found 26ms]

downloadable font: download failed (font-family: "DXIcons" style:normal weight:400 stretch:100 src index:3): status=2147746065 source: https://localhost:44375/libs/devextreme/css/icons/dxicons.woff downloadable font: download failed (font-family: "DXIcons" style:normal weight:400 stretch:100 src index:4): status=2147746065 source: https://localhost:44375/libs/devextreme/css/icons/dxicons.ttf
0
davidc@educlarity.com created 3 years ago
The error that I am receiving is as follows:

POSThttps://localhost:44375/DXXRDV [HTTP/2 500 Internal Server Error 170ms]

POST https://localhost:44375/DXXRDV Status500 Internal Server Error VersionHTTP/2 Transferred346 B (132 B size) Referrer Policystrict-origin-when-cross-origin

_abperrorformat true content-type application/json; charset=utf-8 date Tue, 20 Apr 2021 00:25:07 GMT server Microsoft-IIS/10.0 X-Firefox-Spdy h2 x-powered-by ASP.NET

Accept / Accept-Encoding gzip, deflate, br Accept-Language en-US,en;q=0.5 Connection keep-alive Content-Length 302 Content-Type application/x-www-form-urlencoded; charset=UTF-8 Cookie .AspNetCore.Antiforgery.XO8D3hq-S8g=CfDJ8K9HF9cs-6FAs_eT0iSMR9cnFcEWleCVC9hZJtTpz7iQW7y-zFByPHMIiHpk6V3evq2-fHQRtOOlL-yzqywhV2nNWTkbIUlenT_eKnBq0V764WKeaIfgNqq-NygWt56pt2aJk2e9QhbFb46dZJkwBwk; XSRF-TOKEN=CfDJ8K9HF9cs-6FAs_eT0iSMR9fo453o4ScMZoVSPWWZ6keNkMcoHnlKmaw4-SJ8yjMwdTiwAyKwp6o_4J0UV3c6i1L0vJBoUcdPZOhhMHLKNhgLLIwWFS2CtO0UWPO66tT_zJhpAH0iE7NO7GCoIR3ewk Host localhost:44375 Origin https://localhost:44375 Referer https://localhost:44375/Reports RequestVerificationToken CfDJ8K9HF9cs-6FAs_eT0iSMR9f7JEIBBnxi0kGDMwV1_YA9_UfhcWLrIqznO-QqWnoYeG2NZDC0NgCZlms1ZCoFiphPt6fMywM5c_db9ZdNNSdVq35Gs8P0bE4NhXgh8XvEPaEV7-OWfzkbFNwFiBLcQwI TE Trailers User-Agent Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:87.0) Gecko/20100101 Firefox/87.0

X-Requested-With XMLHttpRequest

Cannot create a document for the current report: [object Object] dx-analytics-core.min.js:8:149298
0

serdar.genc@talentra.net created 3 years ago

Hello David. I will send you a sample project that DevExpress has been fully implemented.
0

rcalv002 created 3 years ago

Hello David. I will send you a sample project that DevExpress has been fully implemented.

I'd love this project too :)
0

gvnuysal created 3 years ago

Hi support, I added Devexpress Reporting tool to my project.No problem.For example, there is a getall method in ProductAppService. I cannot give this method to Devexpress's object datasource as a data source.

https://docs.devexpress.com/XtraReports/17784/detailed-guide-to-devexpress-reporting/bind-reports-to-data/business-object/bind-a-report-to-an-object-data-source

As a result, I want to show my report in angular ui using the services in the project.

I would be glad if you share the methods you know.

thanks your answers.
0

serdar.genc@talentra.net created 3 years ago

Hello David. I will send you a sample project that DevExpress has been fully implemented.

I'd love this project too :)

Email?

1
0

gvnuysal created 3 years ago

Hi support, We need help with how to export services within the abp framework (for example getAll method in productapp service), Devexpress reporting tool as datasource. I would appreciate if you share an example project.

https://github.com/DevExpress-Examples/Reporting-Entity-Framework-Core-In-AspNet-Core https://github.com/DevExpress-Examples/AspNetCore.Reporting.BestPractices/tree/20.2.3+/AspNetCore.Reporting.Angular

I tried to implement the examples here, but when using abp services, I also get an error on dependency injection.

thank you for your help.
0

gvnuysal created 3 years ago

Anyone with code for a sample?
0

rcalv002 created 3 years ago

Hi There! Can you share the error you're getting? As far as I know any service you create in your application project that ends in AppService is automatically exposed so you can consume it from your web project.
0

gvnuysal created 3 years ago

Hi @rcalv002, thanks your answer.

https://github.com/DevExpress-Examples/AspNetCore.Reporting.BestPractices/tree/20.2.3+/AspNetCore.Reporting.Angular

I don't know how the example in this link is implemented into the abp commercial framework. It would be great if an example is shared on this subject.
0

alper created 3 years ago
Support Team Director

@gvnuysal what's exception trace? can you write in details the reproduce steps.

gvnuysal created 3 years ago

Hi @alper, I create my report file with Datawizard as follows.

I did not transfer data to the report file I prepared using abp services. It will be nice if an article or document is published on your site.


namespace DevexpressReporting.Reporting
{
    public class ReportingService:ITransientDependency
    {
        private IProductRepository _productAppService;

        public ReportingService(IProductRepository productAppService)
        {
            _productAppService = productAppService; // for _productAppService (null variable occurs)
        }

        public  List<Product> GetProducts()
        {
           
            return _productAppService.ToList();
        }
    }

    public class CreateReport
    {
        private ReportingService _reportingService;

        public CreateReport(ReportingService reportingService)
        {
            _reportingService = reportingService;
        }
        public List<Product> GetReport()
        {
            return _reportingService.GetProducts();
        }
    }
    
}

When I export GetProduct () in the ReportingService class as datasource, I get a Null reference error. It will be nice if a document is published for Angular and .Net core

0

alper created 3 years ago
Support Team Director

but ReportingService is not an ApplicationService also CreateReport is not registered to Dependency Injection. This is not related to DevExpress. Even you run this code with Postman you'll get error. Use ABP Suite to create your service and try to consume it.
0

ilitzy created 3 years ago

Hello David. I will send you a sample project that DevExpress has been fully implemented.

Hello serdar.genc@talentra.net, Could you be so kind as to send me a sample of the implementation as well (avram.ilitzy@gmail.com). I am stuck with a 400 error at DXXRDV. Thank you in advance!
0

serdar.genc@talentra.net created 3 years ago

Hello David. I will send you a sample project that DevExpress has been fully implemented.

Hello serdar.genc@talentra.net, Could you be so kind as to send me a sample of the implementation as well (avram.ilitzy@gmail.com). I am stuck with a 400 error at DXXRDV.
Thank you in advance!

Hi Avram, ok i will send but this weekend, is it ok for you ? i am very busy today.sory.
0

ilitzy created 3 years ago

Whenever it will be possible. Sorry for the late answer, but I was out for the weekend. Have a great week and thank you again!
0

ilitzy created 3 years ago

Hi serdar.genc@talentra.net,, Please don't forget about me (avram.ilitzy@gamil.com)! Thank you in advance!
0

serdar.genc@talentra.net created 3 years ago

Hi serdar.genc@talentra.net,, Please don't forget about me (avram.ilitzy@gamil.com)! Thank you in advance!

Hi Avram, your email correct ?

avram.ilitzy@gamil.com

murat.yuceer created 3 years ago

override devex api controllers

using System.Threading.Tasks;
using DevExpress.AspNetCore.Reporting.WebDocumentViewer;
using DevExpress.AspNetCore.Reporting.WebDocumentViewer.Native.Services;
using Kuys.Shared.AspNetCore.DevExp.Reporting.HttpApi.Services;
using Microsoft.AspNetCore.Authorization;
using Microsoft.AspNetCore.Http;
using Microsoft.AspNetCore.Mvc;

namespace Kuys.Shared.AspNetCore.DevExp.Reporting.HttpApi.Controllers
{
    [ApiExplorerSettings(IgnoreApi = true)]
    [Route("DXXRDV")]
    public class CustomWebDocumentViewerController : WebDocumentViewerController
    {
        private readonly IExportResultProvider _exportResultProvider;

        public CustomWebDocumentViewerController(
            IWebDocumentViewerMvcControllerService controllerService, 
            IExportResultProvider exportResultProvider) : 
            base(controllerService)
        {
            _exportResultProvider = exportResultProvider;
        }

        [Authorize]
        [Route("Invoke")]
        public override Task<IActionResult> Invoke()
        {
            return base.Invoke();
        }

        [HttpPost]
        [Route("GetExportResult")]
        public ActionResult GetExportResult(string token)
        {
            ExportResult exportResult;
            if (!_exportResultProvider.TryGetExportResult(token, out exportResult))
            {
                return StatusCode(StatusCodes.Status404NotFound, "Exported document was not found. Try to export the document once again.");
            }
            var fileResult = File(exportResult.GetBytes(), exportResult.ContentType);
            if (exportResult.ContentDisposition != System.Net.Mime.DispositionTypeNames.Inline)
            {
                fileResult.FileDownloadName = exportResult.FileName;
            }

            return fileResult;
        }
    }
}

startup settings

using DevExpress.AspNetCore;
using DevExpress.AspNetCore.Reporting;
using DevExpress.AspNetCore.Reporting.WebDocumentViewer;
using DevExpress.DataAccess;
using DevExpress.XtraReports.Web.Extensions;
using DevExpress.XtraReports.Web.ReportDesigner.Services;
using DevExpress.XtraReports.Web.WebDocumentViewer;
using Kuys.Framework.Reporting;
using Kuys.Shared.AspNetCore.DevExp.Reporting.HttpApi.Services;
using Microsoft.Extensions.Configuration;
using Microsoft.Extensions.DependencyInjection;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using Volo.Abp;
using Volo.Abp.AspNetCore.Mvc.AntiForgery;
using Volo.Abp.Modularity;

namespace Kuys.Shared.AspNetCore.DevExp.Reporting.HttpApi
{
    [DependsOn(typeof(KuysFrameworkReportingModule))]
    public class KuysSharedAspNetCoreDevExpReportingHttpApiModule : AbpModule
    {
        public override void ConfigureServices(ServiceConfigurationContext context)
        {
            Configure<AbpAntiForgeryOptions>(options =>
            {
                options.AutoValidateFilter = type => !type.Namespace.StartsWith("Kuys.Shared.AspNetCore.DevExp.Reporting.HttpApi");
            });

            context.Services.AddDevExpressControls();

            context.Services.AddMvcCore().ConfigureApplicationPartManager(x =>
            {
                var parts = x.ApplicationParts;
                var aspNetCoreReportingAssemblyName = typeof(WebDocumentViewerController).Assembly.GetName().Name;
                var reportingPart = parts.FirstOrDefault(part => part.Name == aspNetCoreReportingAssemblyName);
                if (reportingPart != null)
                {
                    parts.Remove(reportingPart);
                }
            });

            context.Services.ConfigureReportingServices(configurator =>
            {
                configurator.ConfigureWebDocumentViewer(viewerConfigurator =>
                {
                    viewerConfigurator.UseCachedReportSourceBuilder();
                });
            });

            context.Services.AddTransient<ReportStorageWebExtension, CustomReportStorage>();
            context.Services.AddScoped<IWebDocumentViewerReportResolver, CustomWebDocumentViewerReportResolver>();
            context.Services.AddScoped<ObjectDataSourceInjector>();
            context.Services.AddScoped<PreviewReportCustomizationService, CustomPreviewReportCustomizationService>();
            context.Services.AddScoped<IWebDocumentViewerExportResultUriGenerator, CustomWebDocumentViewerExportResultUriGenerator>();
            context.Services.AddScoped<IExportResultProvider, CustomWebDocumentViewerExportResultUriGenerator>();
        }

        public override void OnApplicationInitialization(ApplicationInitializationContext context)
        {
            var app = context.GetApplicationBuilder();

            app.UseDevExpressControls();
        }
    }
}

Have an answer to this question? Log in and write your answer.

23 Answer(s)

Import npm packages correctly

Write Script & Style contributors

Import them to your razor pages

Write `Script` & `Style` contributors