TsgcHTMLComponent_ReportViewer toont een rapport in een webpagina, met een parameterpaneel, een PDF-voorbeeld, PDF downloaden, Afdrukken en Exporteren naar Excel. Het rapport is een TsgcHTMLReport, een bandgebaseerde rapportengine die groepen, totalen, grafieken, barcodes en subrapporten met de PDF-engine van sgcHTML naar PDF afdrukt, zonder extern rapportagehulpmiddel, printerdriver of DLL, in Delphi, C++ Builder en .NET.
Definieer het rapport met zijn banden en Parameters, koppel het aan de viewer en render hem. De viewer bouwt uit de parameters een formulier, en het voorbeeld, de download en het afdrukken zijn dezelfde PDF, op de server gegenereerd met de waarden die de gebruiker toepaste, zodat de gebruiker afdrukt wat hij ziet. Tussen verzoeken wordt niets op de server bewaard.
TsgcHTMLComponent_ReportViewer, de viewer, en TsgcHTMLReport, de niet-visuele rapportengine die hij toont
Een parameterpaneel, een voorbeeld getekend met de ingebedde pdf.js van de PDF-viewer, en de links PDF downloaden, Afdrukken en Exporteren naar Excel
Delphi, C++ Builder, .NET
Het rapport declareert een verplichte periode en een regio. De viewer maakt er velden van, en het rapport filtert zijn gegevens in zijn eigen event OnBeforeGenerate met de waarden die de gebruiker toepast.
uses
sgcHTML_Export_PDF, sgcHTML_Report, sgcHTML_Component_ReportViewer;
// het rapport
oReport := TsgcHTMLReport.Create(Self);
oReport.Title := 'Sales';
oReport.FileName := 'sales';
oReport.DataSet := qrySales;
oParam := oReport.Parameters.Add;
oParam.Name := 'Period';
oParam.Caption := 'Period';
oParam.Kind := rpkDateRange;
oParam.DefaultValue := '2026-01-01;2026-12-31';
oParam.Required := True;
oParam := oReport.Parameters.Add;
oParam.Name := 'Region';
oParam.Caption := 'Region';
oParam.Kind := rpkSelect;
oParam.Options.Add('EU=Europe');
oParam.Options.Add('US=United States');
oReport.OnBeforeGenerate := ReportBeforeGenerate;
// een detailband: één regel per rij
oBand := oReport.Bands.Add;
oBand.Kind := rbkDetail;
oItem := oBand.Items.Add;
oItem.Text := '[Product]';
oItem.Width := 100;
oItem := oBand.Items.Add;
oItem.Text := '[Amount:#,##0.00]';
oItem.Left := 100;
oItem.Width := 80;
oItem.Align := paRight;
// de viewer
oViewer := TsgcHTMLComponent_ReportViewer.Create(Self);
oViewer.Name := 'SalesViewer';
oViewer.HTMXEngine := sgcHTMXEngine1;
oViewer.Report := oReport;
oViewer.TokenSecret := LoadSecretFromConfig;
oTemplate.BodyContent := oViewer.HTML;
// het rapport filtert zijn gegevens met de waarden van de viewer
procedure TForm1.ReportBeforeGenerate(Sender: TObject; aParams: TStrings);
var
vPeriod: string;
begin
vPeriod := aParams.Values['Period']; // van;tot
qrySales.Close;
qrySales.ParamByName('FromDate').AsString := Copy(vPeriod, 1, Pos(';', vPeriod) - 1);
qrySales.ParamByName('ToDate').AsString := Copy(vPeriod, Pos(';', vPeriod) + 1, 10);
qrySales.ParamByName('Region').AsString := aParams.Values['Region'];
qrySales.Open;
end;@* Views/Reports/Sales.cshtml: SalesReport is een langlevende TsgcHTMLReport *@
@model ReportsModel
<sgc-report-viewer name="sales" report="@Model.SalesReport"
show-export-xlsx="true" zoom="page-width"
css-height="720px" token-lifetime="300"
on-before-generate="Model.CheckAccess" />using esegece.sgcWebSockets;
// het rapport
var report = new TsgcHTMLReport();
report.Title = "Sales";
report.FileName = "sales";
var param = report.Parameters.Add();
param.Name = "Period";
param.Caption = "Period";
param.Kind = TsgcHTMLReportParameterKind.rpkDateRange;
param.DefaultValue = "2026-01-01;2026-12-31";
param.Required = true;
report.OnBeforeGenerate += (sender, values) => LoadSales(values);
// de viewer
var viewer = new TsgcHTMLComponent_ReportViewer();
viewer.Name = "SalesViewer";
viewer.HTMXEngine = engine;
viewer.Report = report;
viewer.TokenSecret = configuration["Reports:Secret"];
template.BodyContent = viewer.HTML;
// hetzelfde rapport, zonder de viewer: een PDF van het derde kwartaal
var values = new List<string> { "Period=2026-07-01;2026-09-30" };
report.SaveToFile("q3.pdf", values);Kies de waarden, bekijk het rapport, download het dan, druk het af of open de gegevens in Excel.
Elke parameter van het rapport wordt een veld met label: tekst, getal, datum, een datumbereik met Van en Tot, een selectie uit de Options en een selectievakje. Een verplichte parameter toont een sterretje en wordt in de browser gecontroleerd vóór Toepassen en opnieuw op de server. Herstellen zet de standaardwaarde van elk veld terug.
Het voorbeeld gebruikt de ingebedde pdf.js van TsgcHTMLComponent_PDFViewer, met werkbalk, paginanavigatie, zoom en zoeken. Een spinner met de tekst Rapport genereren... bedekt het tot de eerste pagina is getekend. Met AutoGenerate laadt het voorbeeld meteen met de standaardwaarden.
PDF downloaden en Afdrukken zijn dezelfde PDF als het voorbeeld, en de download is genoemd naar FileName. Exporteren naar Excel schrijft de gegevens van het rapport met ExportToXLSX. ShowDownload, ShowPrint en ShowExportXLSX tonen of verbergen elk ervan.
Een ontbrekende verplichte waarde markeert het veld en verplaatst de focus ernaartoe. Als er geen rij wordt afgedrukt, toont het voorbeeld Geen gegevens voor de geselecteerde parameters in plaats van een lege PDF. Een geweigerde of mislukte generatie toont de reden en schakelt de links uit. De teksten komen uit de locale van de bibliotheek.
De viewer is een gelabeld gebied. Elk veld heeft een label, een datumbereik is een fieldset met een legenda, verplichte velden dragen aria-required en een ontbrekende waarde zet aria-invalid. Enter in een veld past de parameters toe, en een beleefd live-gebied kondigt verplichte velden, ontbrekende gegevens, weigeringen en fouten aan.
De engine achter de viewer is een eigen niet-visueel component. Hij schrijft de PDF met TsgcHTMLExportPDF, de PDF-engine van sgcHTML, en hetzelfde rapport kan ook als Excel-blad worden geschreven.
Een rapportkop, paginakoppen, geneste groepen met koppen en voetteksten, detailrijen, paginavoeten en een rapportvoet. Groepskoppen kunnen op elke nieuwe pagina worden herhaald, KeepTogether houdt een groep op één pagina, NewPageBefore en NewPageAfter forceren pagina-einden, en een rapportkop met NewPageAfter is een voorblad.
Banden bevatten tekst, afbeeldingen, lijnen, rechthoeken, grafieken, rich text, barcodes, QR-codes en subrapporten. Tekst wordt bij zijn kader afgekapt, en items met AutoHeight laten de band meegroeien met de afgebroken tekst.
Teksten bevatten expressies tussen [ ]: velden met een masker zoals [Amount:#,##0.00], [Sum(Field)], [Count], [Avg(Field)], [Min(Field)], [Max(Field)], [RunningSum(Field)], [Page] van [Pages], [Param.Name] en [GroupValue]. Banden en items worden alleen afgedrukt wanneer hun PrintIf-voorwaarde waar is, zoals Amount > 1000.
De rijen komen uit een DataSet, een Grid, een JSON-array in RowsJSON of het event OnGetRow. LoadFromGrid bouwt een tabelrapport van de kolommen van een TsgcHTMLComponent_Grid, met de kopteksten op elke pagina, zebrarijen, de totalen van de numerieke kolommen en paginanummers.
Een grafiekitem tekent de rijen van zijn band als vectorafbeelding: staaf, horizontale staaf, gestapelde staaf, lijn, vlak, taart of donut, één grafiek per groep in een groepsband. ChartSource drukt een TsgcHTMLComponent_Chart af zoals de webpagina hem toont. Barcode-items tekenen Code 128 en QR-code-items gebruiken foutcorrectieniveau M.
Een subrapportitem drukt een ander rapport af binnen zijn band, zoals de regels van een order, via LinkFields gekoppeld aan de hoofdrij, tot 5 niveaus diep, en gaat door op de volgende pagina's. Een rich-textitem drukt HTML af en loopt met AutoHeight over pagina's na de paginakoppen.
Items worden standaard afgedrukt met de Base-14-lettertypen, die de tekens van Windows-1252 bevatten. Registreer TrueType-lettertypen in Fonts om Cyrillisch, Grieks, Arabisch, Hebreeuws, Chinees, Japans, Koreaans of symbolen af te drukken. Alleen de afgedrukte glyphs worden ingebed, en FallbackFonts en AutoFallback dekken de tekens die een lettertype mist.
Getallen en datums worden afgedrukt met DecimalSeparator, ThousandSeparator, DateFormat en TimeFormat van het rapport, nooit met de regionale instellingen van de machine, zodat een rapport op elke computer en onder .NET hetzelfde wordt afgedrukt. Met een vaste CreationDate geeft dezelfde invoer dezelfde PDF-bytes.
SaveToJSON schrijft de pagina-instelling, lettertypen, banden, items en parameters, en LoadFromJSON leest ze terug nadat het de hele definitie heeft gevalideerd, met het JSON-pad van elke fout. Gebruikers ontwerpen rapporten in de browser met de Report Designer, en een dubbelklik op het rapport opent dezelfde designer in de Delphi-IDE.
Generate, SaveToFile, SaveToStream, GetPDFBytes, ExportToXLSX en HasData bouwen elk hun eigen kopie van de rijen en de opmaak. Eén rapport bedient meerdere verzoeken van een webserver tegelijk, elk gefilterd met eigen parameters, zonder eigen lock.
De leden van de viewer die je het vaakst gebruikt.
Report is het te tonen TsgcHTMLReport. Eén viewer bedient elke gebruiker: om elke gebruiker een ander rapport te tonen, bijvoorbeeld per tenant of per rol, geef je het terug in OnGetReport(Sender, aParams, aReport), dat wordt geactiveerd op de thread van het verzoek, waar sgcHTMLRequestSession de sessie geeft.
OnBeforeGenerate(Sender, aParams, aAccept, aErrorMessage) accepteert of weigert een generatie, wanneer de viewer rendert, bij elke Toepassen en bij elke GET van een link, zodat ook een gekopieerde link wordt geweigerd. Gebruik het voor rechten en voor regels over parameters heen, zoals een periode van hoogstens een jaar.
Elke bestandslink draagt een HMAC-SHA256-token over het component, het formaat, de parameterwaarden, de sessie en de vervaltijd, en werkt alleen in de sessie die hem rendert. Links verlopen na TokenLifetime seconden (standaard 300), en het script ondertekent nieuwe voor een pagina die open is gebleven. Stel op elke server achter een load balancer dezelfde TokenSecret in.
De waarden reizen in de link, en het rapport wordt gegenereerd bij de GET, nadat OnGetReport en OnBeforeGenerate opnieuw zijn uitgevoerd. Bestanden worden geleverd met Cache-Control: private, no-store, en een ongeldig verzoek, een ongeldig token of een weigering worden beantwoord met 400 of 403.
ShowParameters, ShowToolbar, ShowPageNav, ShowZoomControls en ShowSearch bepalen wat de viewer toont, Zoom neemt auto, page-width, fit of een percentage, en Theme en CSSHeight bepalen het uiterlijk van het voorbeeld.
Met ActionURL en zonder HTMXEngine stuurt je host de Apply-post naar DispatchComponentEvent en de bestandslinks naar DispatchComponentFile. GetReportURL ondertekent dezelfde links voor je eigen code, bijvoorbeeld om de link naar de PDF van een periode in een bericht te sturen.
In een Razor-view rendert de Tag Helper <sgc-report-viewer> de viewer. report neemt een langlevende TsgcHTMLReport, of laat het weg en gebruik on-get-report. Apply post naar het componenteventeindpunt en de PDF- en Excel-links worden geleverd door de componentbestandsroute van UseSgcHtml, dus er hoeft niets te worden gemapt.
Demos\60.HTML\01.RunTime\31.ReportViewer is sgc Sales Reports, een server op poort 8133 met drie rapporten: verkoop per regio met een staafdiagram per regio en een donutdiagram van het aandeel van elke regio, een factuur met een logo, een QR-code om te betalen en een Code 128-barcode, en een afdruk van een grid. De knop Nieuwe order voegt een order toe, en elk open voorbeeld past in elke browser zijn parameters opnieuw toe via de WebSocket van de pagina. De designtime-, Lazarus- en .NET-versies spiegelen het.
| Online proberenBekijk het in de demo Rapportviewer, live draaiend op de eSeGeCe-demoserver. | Openen | |
| Online helpVolledige API-referentie en gebruikshandleiding voor de viewer. | Openen | |
| TsgcHTMLReport-helpBanden, expressies, grafieken, subrapporten, lettertypen en de JSON-definitie van de rapportengine. | Openen | |
| Report Designer-componentOntwerp de banden, items en parameters van een rapport in de browser. | Openen | |
| PDF Viewer-componentDe pdf.js-viewer die het voorbeeld van het rapport tekent. | Openen | |
| Alle sgcHTML-componentenBlader door de volledige functiematrix van 80+ componenten. | Openen | |
| Download gratis proefversieDe proefversie van 30 dagen bevat de 60.HTML-demoprojecten. | Openen | |
| PrijzenSingle-, Team- en Site-licenties met volledige broncode. | Openen |