Report Designer
TsgcHTMLComponent_ReportDesigner: ブラウザーで動作するレポートデザイナーです。TsgcHTMLReport の定義、つまりバンド、アイテム、パラメーター、フォント、ページ設定を編集し、レポートエンジン自身が描画する PDF プレビューを備えます。開発者はアプリケーションのレポートを作成でき、エンドユーザーはデスクトップツールなしで必要に応じてレポートを調整できます。Delphi、C++ Builder、.NET で利用できます。
TsgcHTMLComponent_ReportDesigner: ブラウザーで動作するレポートデザイナーです。TsgcHTMLReport の定義、つまりバンド、アイテム、パラメーター、フォント、ページ設定を編集し、レポートエンジン自身が描画する PDF プレビューを備えます。開発者はアプリケーションのレポートを作成でき、エンドユーザーはデスクトップツールなしで必要に応じてレポートを調整できます。Delphi、C++ Builder、.NET で利用できます。
TsgcHTMLReport にリンクして、レンダリングします。すべての編集はブラウザーで行われ、ユーザーが設計している間はリクエストを送信しません。保存は定義をサーバーに送信し、サーバーが検証して JSON として OnSave に渡します。AutoApply を使うと、レポートが直ちに変更され、同じレポートの Report Viewer が新しいデザインで印刷します。
TsgcHTMLComponent_ReportDesigner、リンクされた TsgcHTMLReport の定義を編集します
ツールバー、ツールボックス、データフィールド、バンド付きのページ、インスペクター、パラメーター、PDF プレビューを備え、Bootstrap 5.3 CSS と Bootstrap Icons CSS を使用します
Delphi, C++ Builder, .NET
レポートは LoadFromJSON で最後に保存されたデザインを読み込みます。デザイナーがそれを編集し、OnSave が次回のサーバー起動のために定義を保持し、AutoApply を使うと、保存のたびにレポートが直ちに変更されます。
uses
sgcHTML_Report, sgcHTML_Component_ReportDesigner;
// レポート
oReport := TsgcHTMLReport.Create(Self);
oReport.Name := 'OrdersReport';
oReport.Title := 'Orders';
oReport.DataSet := qryOrders;
oReport.LoadFromJSON(LoadDefinition('orders')); // 最後に保存されたデザイン
// デザイナー
oDesigner := TsgcHTMLComponent_ReportDesigner.Create(Self);
oDesigner.Name := 'OrdersDesigner';
oDesigner.HTMXEngine := sgcHTMXEngine1;
oDesigner.Report := oReport;
oDesigner.OnSave := DesignerSave;
oTemplate.BodyContent := oDesigner.HTML;
procedure TForm1.DesignerSave(Sender: TObject; const aJSON: string;
var aAccept: Boolean; var aErrorMessage: string);
begin
// aJSON は定義で、サーバーが既に作業用のレポートに読み込んでいます
StoreDefinition('orders', aJSON); // データベースまたはファイル
end;@* Views/Reports/Design.cshtml: OrdersReport は長期間有効な TsgcHTMLReport です *@
@model ReportsModel
<sgc-report-designer name="orders" report="@Model.OrdersReport"
auto-apply="false" css-height="760px" sub-reports="LinesReport"
on-get-report="Model.GetReport" on-save="Model.SaveReport" />using esegece.sgcWebSockets;
// レポート
var report = new TsgcHTMLReport();
report.Name = "OrdersReport";
report.Title = "Orders";
report.LoadFromJSON(LoadDefinition("orders"));
// ユーザーごとにデザインを持つデザイナー
var designer = new TsgcHTMLComponent_ReportDesigner();
designer.Name = "OrdersDesigner";
designer.HTMXEngine = engine;
designer.Report = report;
designer.AutoApply = false;
designer.OnSave += (object sender, string json, ref bool accept, ref string error) =>
accept = SaveUserReport(CurrentUserID(), json, ref error);
designer.OnGetReport += (object sender, ref TsgcHTMLReport? report) =>
report = GetUserReport(CurrentUserID()) ?? report;
template.BodyContent = designer.HTML;ブラウザーのレポートデザイナーと、レポートを印刷するのと同じエンジンが印刷するプレビュー。
新規、ユーザーのコンピューターから .json 定義を開く「開く」、保存、元に戻すとやり直し、ズーム、グリッドに合わせる、用紙サイズ、向き、余白を設定するページ設定があります。整列 (左揃え、左右中央揃え、右揃え、上揃え、上下中央揃え、下揃え、幅を揃える、高さを揃える、サイズを揃える)、最前面へ移動、最背面へ移動、コピー、貼り付け、複製、削除、そしてデザインとプレビューの切り替えも備えます。
ツールボックスには、テキスト、画像、線、四角形、グラフ、リッチテキスト、バーコード、QR コード、サブレポートがあります。クリックすると選択したバンドにアイテムが追加され、ドラッグすると任意のバンドの位置にドロップされます。データフィールドはデータソースのフィールドを列挙し、クリックまたはドロップすると、そのフィールドにバインドされたテキストアイテムが追加されます。
キャンバスは、選択したズームでバンド付きのページを表示し、各バンドにはキャプションと高さを変更するハンドルがあります。バンドリストは、レポートヘッダー、ページヘッダー、グループヘッダー、明細、グループフッター、ページフッター、レポートフッターを追加し、移動や削除を行い、グループバンドのグループフィールドを設定します。
クリックで選択し、Ctrl+クリックまたは Shift+クリックで選択に追加し、キャンバスの空いた部分で矩形選択します。ドラッグで選択範囲が移動し、別のバンドにも移動でき、8 つのハンドルでサイズを変更し、ドラッグ中のバンドは強調表示されます。すべての変更は 1 回の元に戻す操作になります。
インスペクターは、選択、バンド、レポートに対して、レポートエンジンのすべての公開プロパティを編集し、「フィールドの挿入」「集計」「レポートの値」で式を記述できます。「パラメーター」タブには Report Viewer が求めるものがあり、レポートのフォントは .ttf、.ttc、.otf ファイルを定義に埋め込めます。
プレビューは、保存済みの定義ではなく、編集中の定義を、レポートのデータとイベントを共有する作業用のレポートで印刷するため、PDF はレポートが印刷するものと同じです。埋め込みの PDF ビューア、またはブラウザーの PDF ビューアを使う iframe に表示され、PreviewMode で設定します。
Tab はキャンバスのアイテム間を移動し、矢印キーは選択範囲をグリッド 1 つ分動かし、Shift+矢印でサイズを変更し、Alt+上と Alt+下は前または次のバンドに移動します。Ctrl+C、Ctrl+V、Ctrl+D はコピー、貼り付け、複製、Ctrl+Z と Ctrl+Y は元に戻すとやり直し、Ctrl+S はデザイナー内のどこでも保存します。
デザインに未保存の変更がある間、デザイナーは「未保存の変更があります」と表示し、ブラウザーはページを離れる前に確認します。名前のないパラメーターやフォントは、何かを送信する前に選択されてフォーカスされます。デザイナーはページの data-bs-theme="dark" と dir="rtl" に従い、polite のライブリージョンがメッセージを通知します。
最もよく使うメンバーです。
Report は設計中の TsgcHTMLReport です。AutoApply (既定でオン) を使うと、保存で Lock の中に定義が読み込まれ、プレビューがそれを変更することはありません。ReadOnly はデザインとプレビューを表示し、ユーザーにプロパティの閲覧を許可し、サーバー側でも保存を拒否します。
OnSave(Sender, aJSON, aAccept, aErrorMessage) は、サーバーが LoadFromJSON で作業用のレポートに定義を読み込んだ後にそれを受け取るため、読み込めない定義がコードに届くことはありません。データを保持する場所に保存するか、aAccept を False にして aErrorMessage に独自のテキストを設定してください。
1 つのデザイナーがすべてのユーザーに対応します。AutoApply を False にし、ユーザーの定義を OnSave に保持し、デザイナーと Report Viewer の OnGetReport でそのユーザーのレポートを返します。これはリクエストのスレッドで発生し、そこでは sgcHTMLRequestSession がセッションを返します。
OnGetFieldNames(Sender, aFields) はデータソースのフィールドを受け取り、デザイナーが表示するリストを変更できます。SubReports と Charts は、サブレポートアイテムとグラフのソースとして提供するコンポーネントを指定し、空の場合はレポートの Owner のすべてが対象になります。FontNames はフォントエディターのフォントファミリーです。
MaxSize は送信される定義を制限し (既定は 1 MB)、ブラウザーで、そしてサーバーでも再度チェックされ、PreviewMaxSize はプレビューの PDF (8 MB) を制限します。リクエスト間でサーバーに保存されるものはありません。レポートを設計するユーザーは、データソースのすべてのフィールドを印刷できるため、ユーザーに見せてはいけないフィールドは、データソース自体から削除してください。
フォーム上の TsgcHTMLReport をダブルクリックするか、コンテキストメニューの「Design report...」を選ぶと、フォームのデータフィールド、サブレポート、グラフとともに、同じデザイナーが IDE のウィンドウで開きます。保存のたびに、フォーム上のレポートに書き込まれます。Windows 上の Delphi 10.4 以降と WebView2 ランタイムが必要で、「Open in browser」は同じデザイナーを既定のブラウザーで開きます。
ActionURL を設定して HTMXEngine がない場合、スクリプトは保存、プレビュー、フィールドのリクエストを指定の URL に送信し、ホストがそれらを DispatchComponentEvent に渡します。ページでは、window.sgcReportDesigner が getJSON、setJSON、isDirty、save、preview、undo、redo を提供します。
Razor ビューでは、<sgc-report-designer> Tag Helper がデザイナーをレンダリングし、保存とプレビューは UseSgcHtml のコンポーネントイベントエンドポイントに送信されます。report には長期間有効な TsgcHTMLReport を渡し、Kestrel の MaxRequestBodySize (既定は 30 MB) が引き続きリクエストの上限になります。
Demos\60.HTML\01.RunTime\32.ReportDesigner は sgc Report Studio で、ポート 8134 のサーバーがブラウザーで 4 つのレポートを設計します。ネストしたサブレポート付きの注文、2 ページにまたがるリッチテキストの顧客向けレターと、英語、日本語、中国語、韓国語、アラビア語、ロシア語のいずれかの請求書、グラフ付きの売上レポートです。各ブラウザーが独自のデザインを保持し、プレビュータブが Report Viewer でそれを印刷します。デザイン時、Lazarus、.NET の各バージョンも同様の内容です。
| オンラインで試すeSeGeCe デモサーバーでライブ動作する レポートデザイナー デモをご覧ください。 | 開く | |
| オンラインヘルプこのコンポーネントの完全な API リファレンスと使い方ガイドです。 | 開く | |
| Report Viewer と TsgcHTMLReportデザイナーが編集するレポートエンジンと、それを印刷するビューアです。 | 開く | |
| すべての sgcHTML コンポーネント80 以上のコンポーネントの機能マトリックスをすべてご覧いただけます。 | 開く | |
| 無料体験版のダウンロード30 日間の体験版には 60.HTML のデモプロジェクトが含まれます。 | 開く | |
| 価格完全なソースコード付きの Single、Team、Site ライセンス。 | 開く |