diff --git a/components/resources/application-core/src/main/resources/META-INF/dirigible/application-core/shell/js/components/detailPanel.js b/components/resources/application-core/src/main/resources/META-INF/dirigible/application-core/shell/js/components/detailPanel.js
index af64ceac55..09bf4b3923 100644
--- a/components/resources/application-core/src/main/resources/META-INF/dirigible/application-core/shell/js/components/detailPanel.js
+++ b/components/resources/application-core/src/main/resources/META-INF/dirigible/application-core/shell/js/components/detailPanel.js
@@ -129,6 +129,11 @@ function detailPanel(def, masterId) {
       const q = '?returnTo=' + encodeURIComponent(this.def.returnTo);
       window.PineconeRouter.navigate('/' + this.def.entity + '/' + encodeURIComponent(row[this.def.primaryKey]) + '/edit' + q);
     },
+    // Read-only view of the detail record (the routed form page in preview mode).
+    previewRow(row) {
+      const q = '?returnTo=' + encodeURIComponent(this.def.returnTo);
+      window.PineconeRouter.navigate('/' + this.def.entity + '/' + encodeURIComponent(row[this.def.primaryKey]) + '/preview' + q);
+    },
 
     askDelete(row) { this.deleteTarget = row; this.deleteOpen = true; },
     async confirmDelete() {
diff --git a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/document/document-page.js.template b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/document/document-page.js.template
index 05c09b87a1..a125d1b7f5 100644
--- a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/document/document-page.js.template
+++ b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/document/document-page.js.template
@@ -6,9 +6,10 @@
  */
 
 /*
- * Document (header-items) editor for ${name}. One component serves both routes:
- *   /${name}/create        -> create mode (header only; items enable once the header is saved)
+ * Document (header-items) editor for ${name}. One component serves all three routes:
+ *   /${name}/create         -> create mode (header only; items enable once the header is saved)
  *   /${name}/{id}/edit      -> edit mode (loads the document, its items, and the totals)
+ *   /${name}/{id}/preview   -> preview mode (same data as edit, everything read-only; Print stays)
  *
  * Layout (see ${name}-document.html): the master's own fields as a header form (the `aggregate`
  * totals are excluded here and shown in the footer), an inline-editable line-items table for the
@@ -157,9 +158,10 @@ document.addEventListener('alpine:init', () => {
     apiPath: '/${javaPerspectiveName}/${name}Controller',
 
     get isEdit() { return this.mode === 'edit'; },
+    get isPreview() { return this.mode === 'preview'; },
     get errorCount() { return Object.keys(this.errors).filter(k => this.errors[k]).length; },
     // Items can only be added once the document (header) exists, so we have a master id to bind them to.
-    get itemsEnabled() { return this.isEdit && this.id != null; },
+    get itemsEnabled() { return (this.isEdit || this.isPreview) && this.id != null; },
     // Any OTHER composition child of this master (not the line-items entity) renders as a normal panel —
     // like the line items, only once the document (header) exists (nothing to allocate against on Create).
     get secondaryDetails() { return this.itemsEnabled ? App.detailsFor('${name}').filter(d => d.entity !== '${documentItemsEntity}') : []; },
@@ -232,7 +234,9 @@ document.addEventListener('alpine:init', () => {
     async init() {
       const params = (window.PineconeRouter.context && window.PineconeRouter.context.params) || {};
       this.id = params.id ?? null;
-      this.mode = this.id != null ? 'edit' : 'create';
+      // Read the live hash to tell /preview from /edit (Pinecone's context can lag the hash).
+      const routePath = (window.location.hash || '').split('?')[0];
+      this.mode = this.id == null ? 'create' : (routePath.endsWith('/preview') ? 'preview' : 'edit');
 
       // The line-items child registered itself as a detail of this master; pick it by name.
       this.itemsDef = App.detailsFor('${name}').find(d => d.entity === '${documentItemsEntity}') || null;
@@ -250,7 +254,7 @@ document.addEventListener('alpine:init', () => {
 
       await this.loadOptions();
 
-      if (this.isEdit) {
+      if (this.isEdit || this.isPreview) {
         this.state = 'loading';
         try {
           await this.loadHeader();
@@ -383,6 +387,7 @@ document.addEventListener('alpine:init', () => {
     },
 
     async save() {
+      if (this.isPreview) return;
       if (!this.validate()) {
         this.state = 'validation-error';
         this.scrollToSummary();
@@ -601,7 +606,7 @@ document.addEventListener('alpine:init', () => {
 
     // ----- Add / edit line dialog ----------------------------------------------------------------
     openRowDialog(row) {
-      if (!this.itemsEnabled) return;
+      if (!this.itemsEnabled || this.isPreview) return;
       this.draftError = null;
       this.draftMode = row ? 'edit' : 'create';
       // Suppress the Depends-On watchers while the draft is (re)built - filling an existing row's
@@ -681,7 +686,7 @@ document.addEventListener('alpine:init', () => {
       }
     },
 
-    askDeleteRow(row) { this.deleteTarget = row; this.deleteOpen = true; },
+    askDeleteRow(row) { if (this.isPreview) return; this.deleteTarget = row; this.deleteOpen = true; },
 
     async confirmDeleteRow() {
       if (!this.deleteTarget) return;
@@ -720,5 +725,8 @@ document.addEventListener('alpine:init', () => {
     },
 
     backToList() { window.PineconeRouter.navigate('/${name}'); },
+
+    // Preview -> the editable document for the same record.
+    goEdit() { window.PineconeRouter.navigate('/${name}/' + encodeURIComponent(this.id) + '/edit'); },
   }));
 }, { once: true });
diff --git a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/document/document-view.html.template b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/document/document-view.html.template
index 89d7dce996..764da389c3 100644
--- a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/document/document-view.html.template
+++ b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/document/document-view.html.template
@@ -1,10 +1,12 @@
 <!--
   Generated by Eclipse Dirigible based on model and template.
-  Document (header-items) editor for ${name}. Rendered into #app on /${name}/create and
-  /${name}/{id}/edit; its root x-data binds the generated ${name}DocumentPage.
-  Header form (master fields, minus the aggregate totals) on top; once the document is saved the
-  inline-editable line-items table (${documentItemsEntity}, add/edit via dialog) and a right-aligned
-  totals footer appear; the Save / Create action sits at the very bottom.
+  Document (header-items) editor for ${name}. Rendered into #app on /${name}/create,
+  /${name}/{id}/edit and /${name}/{id}/preview; its root x-data binds the generated
+  ${name}DocumentPage. Header form (master fields, minus the aggregate totals) on top; once the
+  document is saved the inline-editable line-items table (${documentItemsEntity}, add/edit via
+  dialog) and a right-aligned totals footer appear; the Save / Create action sits at the very
+  bottom. Preview renders the same document fully read-only (no item/allocation editing, no BPM
+  buttons, footer swapped to Close + Edit) - Print stays available.
 -->
 <div x-data="${name}DocumentPage" class="vbox size-full">
 ## Document roles: the DOCUMENT_NUMBER field shows in the title (e.g. "SALES INVOICE 00001231"); the
@@ -23,15 +25,15 @@
          directive injects font-semibold, which the label must NOT have; only the number is bold. -->
     <div class="hbox items-baseline gap-2 shrink-0">
       <span class="text-2xl font-normal tracking-tight" x-text="T('$projectName:${tprefix}.t.${dataName}', '${documentLabel}').toUpperCase()"></span>
-      <span class="text-2xl font-bold tracking-tight" x-show="isEdit && form.${docNumberProp}" x-text="form.${docNumberProp}"></span>
+      <span class="text-2xl font-bold tracking-tight" x-show="(isEdit || isPreview) && form.${docNumberProp}" x-text="form.${docNumberProp}"></span>
     </div>
 #else
-    <span x-h-toolbar-title class="shrink-0" x-text="isEdit ? T('$projectName:${tprefix}.defaults.formHeadUpdate', 'Edit ${documentLabel}', { name: T('$projectName:${tprefix}.t.${dataName}', '${documentLabel}') }) : T('$projectName:${tprefix}.defaults.formHeadCreate', 'New ${documentLabel}', { name: T('$projectName:${tprefix}.t.${dataName}', '${documentLabel}') })"></span>
+    <span x-h-toolbar-title class="shrink-0" x-text="isPreview ? T('$projectName:${tprefix}.t.${dataName}', '${documentLabel}') : (isEdit ? T('$projectName:${tprefix}.defaults.formHeadUpdate', 'Edit ${documentLabel}', { name: T('$projectName:${tprefix}.t.${dataName}', '${documentLabel}') }) : T('$projectName:${tprefix}.defaults.formHeadCreate', 'New ${documentLabel}', { name: T('$projectName:${tprefix}.t.${dataName}', '${documentLabel}') }))"></span>
 #end
     <div x-h-toolbar-spacer></div>
 #if($docStatusProp != "")
     <!-- Status pill is right-aligned: the spacer above pushes it (and the Back button) to the far end. -->
-    <span x-h-badge class="shrink-0" :data-variant="statusVariant(statusText())" x-show="isEdit && statusText()" x-text="statusText()"></span>
+    <span x-h-badge class="shrink-0" :data-variant="statusVariant(statusText())" x-show="(isEdit || isPreview) && statusText()" x-text="statusText()"></span>
 #end
     <button type="button" x-h-button data-variant="transparent" @click="backToList()" x-text="T('$projectName:${tprefix}.defaults.backToList', 'Back to list')"></button>
   </div>
@@ -63,6 +65,9 @@
         </div>
       </div>
 
+      <!-- The fieldset (display: contents keeps the grid layout intact) disables EVERY header
+           control at once in preview mode - the one switch that guarantees read-only. -->
+      <fieldset :disabled="isPreview" style="display: contents;">
       <div class="grid grid-cols-1 sm:grid-cols-12 gap-4">
 #foreach($property in $properties)
 ## Read-only / system fields (ProcessId, audit, uuid, any field marked read-only) render in the
@@ -89,7 +94,7 @@
         <!-- Non-setting association: combobox + Add new (opens the target's own create page in an iframe
              dialog) + Refresh, all on one full-width row. -->
         <div class="hbox gap-1 items-center">
-          <div x-h-select data-filter="contains" class="grow">
+          <div x-h-select data-filter="contains" class="grow" :data-disabled="isPreview">
             <input x-h-select-input id="f_${property.name}" x-model="form.${property.name}" :aria-invalid="!!errors.${property.name}" :placeholder="T('$projectName:${tprefix}.messages.inputSelect', 'Select ${label}...', { name: T('$projectName:${tprefix}.t.${property.dataName}', '${label}') })" />
             <div x-h-select-content>
               <div x-h-select-search></div>
@@ -98,11 +103,11 @@
               </template>
             </div>
           </div>
-          <button type="button" x-h-button data-variant="outline" class="shrink-0" @click="addRelated('${property.name}', '${property.widgetDropdownControllerUrl}', '${property.relationshipEntityName}')"><i data-lucide="plus" class="size-4"></i> New ${property.relationshipEntityName}</button>
-          <button type="button" x-h-button data-variant="transparent" class="shrink-0" aria-label="Refresh" @click="loadOptions()"><i data-lucide="refresh-cw" class="size-4"></i></button>
+          <button type="button" x-h-button data-variant="outline" class="shrink-0" x-show="!isPreview" @click="addRelated('${property.name}', '${property.widgetDropdownControllerUrl}', '${property.relationshipEntityName}')"><i data-lucide="plus" class="size-4"></i> New ${property.relationshipEntityName}</button>
+          <button type="button" x-h-button data-variant="transparent" class="shrink-0" x-show="!isPreview" aria-label="Refresh" @click="loadOptions()"><i data-lucide="refresh-cw" class="size-4"></i></button>
         </div>
 #else
-        <div x-h-select data-filter="contains"#if($readonly) data-disabled="true"#end>
+        <div x-h-select data-filter="contains"#if($readonly) data-disabled="true"#else :data-disabled="isPreview"#end>
           <input x-h-select-input id="f_${property.name}" x-model="form.${property.name}" :aria-invalid="!!errors.${property.name}" :placeholder="T('$projectName:${tprefix}.messages.inputSelect', 'Select ${label}...', { name: T('$projectName:${tprefix}.t.${property.dataName}', '${label}') })" />
           <div x-h-select-content>
             <div x-h-select-search></div>
@@ -134,6 +139,7 @@
 #end
 #end
       </div>
+      </fieldset>
 
     </form>
 
@@ -142,7 +148,7 @@
       <div x-h-toolbar data-variant="transparent">
         <span x-h-toolbar-title class="shrink-0">${documentItemsLabel}</span>
         <div x-h-toolbar-spacer></div>
-        <button type="button" x-h-button data-variant="primary" data-size="sm" @click="openRowDialog(null)"><i role="img" data-lucide="plus"></i><span x-text="T('$projectName:${tprefix}.defaults.add', 'Add')"></span></button>
+        <button type="button" x-h-button data-variant="primary" data-size="sm" x-show="!isPreview" @click="openRowDialog(null)"><i role="img" data-lucide="plus"></i><span x-text="T('$projectName:${tprefix}.defaults.add', 'Add')"></span></button>
       </div>
       <div x-show="itemsError" x-h-alert data-variant="negative" role="alert"><div x-h-alert-description x-text="itemsError"></div></div>
 
@@ -150,7 +156,7 @@
         <thead x-h-table-header>
           <tr x-h-table-row>
             <template x-for="col in editColumns" :key="col.name"><th x-h-table-head scope="col" :class="col.number ? 'text-right' : ''" x-text="T(col.tkey, col.label)"></th></template>
-            <th x-h-table-head scope="col"></th>
+            <th x-h-table-head scope="col" x-show="!isPreview"></th>
           </tr>
         </thead>
         <tbody x-h-table-body>
@@ -159,7 +165,7 @@
               <template x-for="col in editColumns" :key="col.name">
                 <td x-h-table-cell :class="col.number ? 'text-right' : ''" x-text="cellDisplay(col, row)"></td>
               </template>
-              <td x-h-table-cell data-row-actions @click.stop>
+              <td x-h-table-cell data-row-actions x-show="!isPreview" @click.stop>
                 <button x-h-menu-trigger.dropdown x-h-table-cell-button aria-label="Row actions">
                   <i role="img" data-lucide="ellipsis"></i>
                 </button>
@@ -172,7 +178,7 @@
             </tr>
           </template>
           <tr x-show="items.length === 0">
-            <td x-h-table-cell :colspan="editColumns.length + 1" class="text-center" x-text="T('$projectName:${tprefix}.messages.noData', 'No line items yet.')"></td>
+            <td x-h-table-cell :colspan="editColumns.length + (isPreview ? 0 : 1)" class="text-center" x-text="T('$projectName:${tprefix}.messages.noData', 'No line items yet.')"></td>
           </tr>
         </tbody>
       </table>
@@ -200,10 +206,10 @@
          correction is remove-the-wrong-row + add-the-right-one). Add/create returns to THIS document
          (returnTo override) rather than the detail's default list. Only once the document exists. ===== -->
     <template x-for="d in secondaryDetails" :key="d.entity + ':' + id">
-      <div x-data="detailPanel({...d, returnTo: '/${name}/' + id + '/edit'}, id)" x-h-card class="w-full">
+      <div x-data="detailPanel({...d, returnTo: '/${name}/' + id + (isPreview ? '/preview' : '/edit')}, id)" x-h-card class="w-full">
         <div x-h-card-header>
           <h3 x-h-card-title x-text="T(d.tkey, d.label)"></h3>
-          <div x-h-card-action x-show="masterId">
+          <div x-h-card-action x-show="masterId && !isPreview">
             <button x-h-button data-variant="primary" data-size="sm" @click="addRow()"><i role="img" data-lucide="plus"></i><span x-text="T('$projectName:${tprefix}.defaults.add', 'Add')"></span></button>
           </div>
         </div>
@@ -218,7 +224,7 @@
                   <template x-for="col in def.columns" :key="col.name">
                     <th x-h-table-head scope="col" :class="col.number ? 'text-right' : ''" x-text="T(col.tkey, col.label || col.name)"></th>
                   </template>
-                  <th x-h-table-head scope="col"></th>
+                  <th x-h-table-head scope="col" x-show="!isPreview"></th>
                 </tr>
               </thead>
               <tbody x-h-table-body>
@@ -227,7 +233,7 @@
                     <template x-for="col in def.columns" :key="col.name">
                       <td x-h-table-cell :class="col.number ? 'text-right' : ''" x-text="cellValue(col, row)"></td>
                     </template>
-                    <td x-h-table-cell data-row-actions>
+                    <td x-h-table-cell data-row-actions x-show="!isPreview">
                       <button x-h-button data-variant="transparent" data-size="sm" aria-label="Delete" @click="askDelete(row)"><i role="img" data-lucide="trash-2"></i></button>
                     </td>
                   </tr>
@@ -257,22 +263,28 @@
     <!-- ===== Document footer: BPM user-task buttons on the LEFT; Cancel + Save/Create on the RIGHT ===== -->
     <div x-h-toolbar.footer>
 #if($hasProcess)
-      <!-- Actionable BPM user-task buttons (edit only), left-aligned. -->
+      <!-- Actionable BPM user-task buttons (edit only, hidden in read-only preview), left-aligned. -->
       <template x-for="task in $store.processTasks.getTasks(form)" :key="task.id">
-        <button type="button" x-h-button data-variant="primary" @click="$store.processTasks.openTask(task)">
+        <button type="button" x-h-button data-variant="primary" x-show="!isPreview" @click="$store.processTasks.openTask(task)">
           <i role="img" data-lucide="inbox"></i><span x-text="task.name"></span>
         </button>
       </template>
 #end
       <div x-h-toolbar-spacer></div>
       <span class="text-sm text-secondary-foreground" x-show="printError" x-text="printError"></span>
-      <!-- Print: renders the CMS template (Templates/${name}/Print/<lang>/) to PDF; asks for the language when several exist -->
-      <button type="button" x-h-button data-variant="outline" x-show="isEdit" :disabled="printBusy" @click="openPrint()">
+      <!-- Print: renders the CMS template (Templates/${name}/Print/<lang>/) to PDF; asks for the
+           language when several exist. Stays available in preview (printing is read-only). -->
+      <button type="button" x-h-button data-variant="outline" x-show="isEdit || isPreview" :disabled="printBusy" @click="openPrint()">
         <span x-show="printBusy" x-h-spinner></span>
         <i role="img" data-lucide="printer" x-show="!printBusy"></i><span x-text="T('$projectName:${tprefix}.defaults.print', 'Print')"></span>
       </button>
-      <button type="button" x-h-button data-variant="transparent" @click="backToList()" :disabled="state === 'saving'" x-text="T('$projectName:${tprefix}.defaults.cancel', 'Cancel')"></button>
-      <button type="button" x-h-button data-variant="primary" :disabled="state === 'saving'" @click="save()">
+      <!-- Preview footer: Close + Edit instead of Cancel + Save. -->
+      <button type="button" x-h-button data-variant="transparent" x-show="isPreview" @click="backToList()" x-text="T('$projectName:${tprefix}.defaults.close', 'Close')"></button>
+      <button type="button" x-h-button data-variant="primary" x-show="isPreview" @click="goEdit()">
+        <i role="img" data-lucide="pencil"></i><span x-text="T('$projectName:${tprefix}.defaults.edit', 'Edit')"></span>
+      </button>
+      <button type="button" x-h-button data-variant="transparent" x-show="!isPreview" @click="backToList()" :disabled="state === 'saving'" x-text="T('$projectName:${tprefix}.defaults.cancel', 'Cancel')"></button>
+      <button type="button" x-h-button data-variant="primary" x-show="!isPreview" :disabled="state === 'saving'" @click="save()">
         <span x-show="state === 'saving'" x-h-spinner></span>
         <i role="img" data-lucide="save" x-show="state !== 'saving'"></i><span x-text="isEdit ? T('$projectName:${tprefix}.defaults.update', 'Save') : T('$projectName:${tprefix}.defaults.create', 'Create')"></span>
       </button>
@@ -280,13 +292,13 @@
     </div>
 
     <!-- Right sidebar: read-only / audit fields (audit, ProcessId, uuid, read-only), single column,
-         top-to-bottom (edit only). -->
+         top-to-bottom (edit/preview only). -->
 #set($hasReadOnly = false)
 #foreach($property in $properties)
 #if($property.isReadOnlyProperty == "true" || ($property.auditType && $property.auditType != "NONE"))#set($hasReadOnly = true)#end
 #end
 #if($hasReadOnly)
-    <div class="vbox gap-4 shrink-0" style="width: 18rem;" x-show="isEdit">
+    <div class="vbox gap-4 shrink-0" style="width: 18rem;" x-show="isEdit || isPreview">
       <div x-h-card>
         <div x-h-card-header><h3 x-h-card-title x-text="T('$projectName:${tprefix}.defaults.details', 'Details')"></h3></div>
         <div x-h-card-content>
diff --git a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/manage/form-page.js.template b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/manage/form-page.js.template
index e2b531a4cf..84b78035c8 100644
--- a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/manage/form-page.js.template
+++ b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/manage/form-page.js.template
@@ -6,9 +6,10 @@
  */
 
 /*
- * Create/Edit form page for ${name}. One component serves both routes:
- *   /${name}/create        -> create mode (empty form)
- *   /${name}/{id}/edit     -> edit mode (loads the record by primary key)
+ * Create/Edit/Preview form page for ${name}. One component serves all three routes:
+ *   /${name}/create         -> create mode (empty form)
+ *   /${name}/{id}/edit      -> edit mode (loads the record by primary key)
+ *   /${name}/{id}/preview   -> preview mode (same data as edit, everything read-only)
  * Built on baseFormPage: a 422 ValidationError from the REST controller is mapped
  * onto per-field `errors` (see mapCauses), everything else into a banner.
  */
@@ -18,9 +19,14 @@ document.addEventListener('alpine:init', () => {
 
     // empty-form | loading | ready | saving | validation-error | save-failure | load-failure
     state: 'ready',
-    mode: 'create',          // 'create' | 'edit'
+    mode: 'create',          // 'create' | 'edit' | 'preview'
     id: null,
 
+    // This entity's registered detail collections (masters only; empty otherwise). Rendered as
+    // detail panels below the form on edit/preview - matching the master browse view, which was
+    // previously the ONLY place details showed up.
+    detailDefs: [],
+
     // Form model — one entry per editable property (auto-increment PK excluded).
     form: {
 #foreach($property in $properties)
@@ -44,6 +50,7 @@ document.addEventListener('alpine:init', () => {
 #end
 
     get isEdit() { return this.mode === 'edit'; },
+    get isPreview() { return this.mode === 'preview'; },
     get errorCount() { return Object.keys(this.errors).filter(k => this.errors[k]).length; },
 
     // Controller path for ${name}, relative to App.config.restBase
@@ -51,16 +58,20 @@ document.addEventListener('alpine:init', () => {
     apiPath: '/${javaPerspectiveName}/${name}Controller',
 
     async init() {
-      // The edit route is /${name}/{id}/edit — Pinecone exposes the param as `id`.
+      // The edit/preview routes are /${name}/{id}/edit|preview — Pinecone exposes the param as `id`.
+      // Read the live hash, not PineconeRouter.context.path: for these routes Pinecone can fire
+      // pinecone:end before the context is assigned, but the hash is already updated.
       const params = (window.PineconeRouter.context && window.PineconeRouter.context.params) || {};
       this.id = params.id ?? null;
-      this.mode = this.id != null ? 'edit' : 'create';
+      const routePath = (window.location.hash || '').split('?')[0];
+      this.mode = this.id == null ? 'create' : (routePath.endsWith('/preview') ? 'preview' : 'edit');
+      this.detailDefs = this.id != null ? App.detailsFor('${name}') : [];
 
 #if($hasDropdowns)
       await this.loadOptions();
 #end
 
-      if (this.isEdit) {
+      if (this.isEdit || this.isPreview) {
         this.state = 'loading';
         try {
           const record = await App.services.api.get(this.apiPath + '/' + encodeURIComponent(this.id));
@@ -213,6 +224,7 @@ document.addEventListener('alpine:init', () => {
     },
 
     async save() {
+      if (this.isPreview) return;
       if (!this.validate()) {
         this.state = 'validation-error';
         this.scrollToSummary();
@@ -309,5 +321,11 @@ document.addEventListener('alpine:init', () => {
       }
       this.navigateBack('/${name}');
     },
+
+    // Preview -> the editable form for the same record (returnTo carried over).
+    goEdit() {
+      const ret = this.returnToParam();
+      window.PineconeRouter.navigate('/${name}/' + encodeURIComponent(this.id) + '/edit' + (ret ? '?returnTo=' + encodeURIComponent(ret) : ''));
+    },
   }));
 }, { once: true });
diff --git a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/manage/form-view.html.template b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/manage/form-view.html.template
index b37753ac35..0a30eb6dd7 100644
--- a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/manage/form-view.html.template
+++ b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/manage/form-view.html.template
@@ -1,7 +1,10 @@
 <!--
   Generated by Eclipse Dirigible based on model and template.
-  Create/Edit form fragment for ${name}. Rendered into #app on /${name}/create
-  and /${name}/{id}/edit; its root x-data binds the generated ${name}FormPage.
+  Create/Edit/Preview form fragment for ${name}. Rendered into #app on /${name}/create,
+  /${name}/{id}/edit and /${name}/{id}/preview; its root x-data binds the generated ${name}FormPage.
+  Preview shows the same data as edit with every control disabled (fieldset) and the footer swapped
+  to Close + Edit. On edit/preview the entity's registered detail collections (masters) render as
+  panels below the form - the same panels as the master browse view.
 -->
 <div x-data="${name}FormPage" class="vbox size-full">
 
@@ -54,7 +57,10 @@
     <!-- 12-column responsive field grid (single column on narrow viewports). Each field's width
          comes from the model's widgetSize (number of columns out of 12: Small=3, Medium=4, Large=6,
          XLarge=12); consecutive narrow fields (e.g. two dates) therefore share a row. Wide widgets
-         (textarea/checkbox) always span the full width. Mirrors codbex-athena-app's create forms. -->
+         (textarea/checkbox) always span the full width. Mirrors codbex-athena-app's create forms.
+         The fieldset (display: contents keeps the grid layout intact) disables EVERY control at once
+         in preview mode - the one switch that guarantees the whole form is read-only. -->
+    <fieldset :disabled="isPreview" style="display: contents;">
     <div class="grid grid-cols-1 sm:grid-cols-12 gap-4">
 #foreach($property in $properties)
 ## Read-only / system fields (ProcessId, audit columns, uuid, any field marked read-only) are not
@@ -88,7 +94,7 @@
              dialog) and a Refresh button. -->
 #if($lookup)
         <div class="hbox gap-1 items-center">
-          <div x-h-select data-filter="contains" class="grow">
+          <div x-h-select data-filter="contains" class="grow" :data-disabled="isPreview">
             <input x-h-select-input id="f_${property.name}" x-model="form.${property.name}" :aria-invalid="!!errors.${property.name}" :placeholder="T('$projectName:${tprefix}.messages.inputSelect', 'Select ${label}...', { name: T('$projectName:${tprefix}.t.${property.dataName}', '${label}') })" />
             <div x-h-select-content>
               <div x-h-select-search></div>
@@ -97,11 +103,11 @@
               </template>
             </div>
           </div>
-          <button type="button" x-h-button data-variant="outline" class="shrink-0" @click="addRelated('${property.name}', '${property.widgetDropdownControllerUrl}', '${property.relationshipEntityName}')"><i data-lucide="plus" class="size-4"></i> <span x-text="T('$projectName:${tprefix}.defaults.new', 'New')"></span>&nbsp;<span x-text="T('$projectName:${tprefix}.t.${property.relationshipEntityName}', '${property.relationshipEntityName}')"></span></button>
-          <button type="button" x-h-button data-variant="transparent" class="shrink-0" aria-label="Refresh" @click="loadOptions()"><i data-lucide="refresh-cw" class="size-4"></i></button>
+          <button type="button" x-h-button data-variant="outline" class="shrink-0" x-show="!isPreview" @click="addRelated('${property.name}', '${property.widgetDropdownControllerUrl}', '${property.relationshipEntityName}')"><i data-lucide="plus" class="size-4"></i> <span x-text="T('$projectName:${tprefix}.defaults.new', 'New')"></span>&nbsp;<span x-text="T('$projectName:${tprefix}.t.${property.relationshipEntityName}', '${property.relationshipEntityName}')"></span></button>
+          <button type="button" x-h-button data-variant="transparent" class="shrink-0" x-show="!isPreview" aria-label="Refresh" @click="loadOptions()"><i data-lucide="refresh-cw" class="size-4"></i></button>
         </div>
 #else
-        <div x-h-select data-filter="contains"#if($readonly) data-disabled="true"#end>
+        <div x-h-select data-filter="contains"#if($readonly) data-disabled="true"#else :data-disabled="isPreview"#end>
           <input x-h-select-input id="f_${property.name}" x-model="form.${property.name}"
                  :aria-invalid="!!errors.${property.name}"
                  :placeholder="T('$projectName:${tprefix}.messages.inputSelect', 'Select ${label}...', { name: T('$projectName:${tprefix}.t.${property.dataName}', '${label}') })" />
@@ -162,19 +168,25 @@
 #end
 #end
     </div>
+    </fieldset>
 
     <div x-h-toolbar.footer>
 #if($hasProcess)
-      <!-- Actionable BPM user-task buttons (edit only), left-aligned. -->
+      <!-- Actionable BPM user-task buttons (edit only, hidden in read-only preview), left-aligned. -->
       <template x-for="task in $store.processTasks.getTasks(form)" :key="task.id">
-        <button type="button" x-h-button data-variant="primary" @click="$store.processTasks.openTask(task)">
+        <button type="button" x-h-button data-variant="primary" x-show="!isPreview" @click="$store.processTasks.openTask(task)">
           <i role="img" data-lucide="inbox"></i><span x-text="task.name"></span>
         </button>
       </template>
 #end
       <div x-h-toolbar-spacer></div>
-      <button type="button" x-h-button data-variant="transparent" @click="cancel()" :disabled="state === 'saving'" x-text="T('$projectName:${tprefix}.defaults.cancel', 'Cancel')"></button>
-      <button type="submit" x-h-button data-variant="primary" :disabled="state === 'saving'">
+      <!-- Preview footer: Close + Edit instead of Cancel + Save. -->
+      <button type="button" x-h-button data-variant="transparent" x-show="isPreview" @click="cancel()" x-text="T('$projectName:${tprefix}.defaults.close', 'Close')"></button>
+      <button type="button" x-h-button data-variant="primary" x-show="isPreview" @click="goEdit()">
+        <i role="img" data-lucide="pencil"></i><span x-text="T('$projectName:${tprefix}.defaults.edit', 'Edit')"></span>
+      </button>
+      <button type="button" x-h-button data-variant="transparent" x-show="!isPreview" @click="cancel()" :disabled="state === 'saving'" x-text="T('$projectName:${tprefix}.defaults.cancel', 'Cancel')"></button>
+      <button type="submit" x-h-button data-variant="primary" x-show="!isPreview" :disabled="state === 'saving'">
         <span x-show="state === 'saving'" x-h-spinner></span>
         <i role="img" data-lucide="save" x-show="state !== 'saving'"></i><span x-text="isEdit ? T('$projectName:${tprefix}.defaults.update', 'Save') : T('$projectName:${tprefix}.defaults.create', 'Create')"></span>
       </button>
@@ -182,13 +194,13 @@
     </div>
 
     <!-- Right sidebar: read-only / audit fields (audit, ProcessId, uuid, read-only), single column,
-         top-to-bottom (edit only). -->
+         top-to-bottom (edit/preview only). -->
 #set($hasReadOnly = false)
 #foreach($property in $properties)
 #if($property.isReadOnlyProperty == "true" || ($property.auditType && $property.auditType != "NONE"))#set($hasReadOnly = true)#end
 #end
 #if($hasReadOnly)
-    <div class="vbox gap-4 shrink-0" style="width: 18rem;" x-show="isEdit">
+    <div class="vbox gap-4 shrink-0" style="width: 18rem;" x-show="isEdit || isPreview">
       <div x-h-card>
         <div x-h-card-header><h3 x-h-card-title x-text="T('$projectName:${tprefix}.defaults.details', 'Details')"></h3></div>
         <div x-h-card-content>
@@ -213,4 +225,73 @@
 #end
   </form>
 
+  <!-- Detail collections (masters only; App.detailsFor returns [] otherwise): the same generic
+       detail panels the master browse view renders, so the record's children are visible and
+       manageable while editing - previously they showed ONLY on the browse view's details pane.
+       Outside the <form> on purpose (the panel's buttons must not submit it). Add/Edit/Delete
+       route back to THIS page (returnTo override); in preview the panels are read-only. -->
+  <div class="vbox gap-4 px-8 pb-6 w-full" style="max-width: 42rem;"
+       x-show="(isEdit || isPreview) && detailDefs.length && state !== 'loading' && state !== 'load-failure'">
+    <template x-for="d in detailDefs" :key="d.entity + ':' + id">
+      <div x-data="detailPanel({...d, returnTo: '/${name}/' + id + (isPreview ? '/preview' : '/edit')}, id)" x-h-card>
+        <div x-h-card-header>
+          <h3 x-h-card-title x-text="d.label"></h3>
+          <div x-h-card-action x-show="!isPreview">
+            <button type="button" x-h-button data-variant="primary" data-size="sm" @click="addRow()"><i role="img" data-lucide="plus"></i><span x-text="T('$projectName:${tprefix}.defaults.add', 'Add')"></span></button>
+          </div>
+        </div>
+        <div x-h-card-content>
+          <div x-show="state === 'loading'"><div x-h-spinner></div></div>
+          <div x-show="state === 'error'" x-h-text.muted x-text="error"></div>
+          <div x-show="state === 'empty'" x-h-text.muted x-text="T('$projectName:${tprefix}.messages.noData', 'No records yet.')"></div>
+          <div x-show="state === 'default'" x-h-table-container.scroll style="max-height: 320px">
+            <table x-h-table data-borders="rows">
+              <thead x-h-table-header>
+                <tr x-h-table-row>
+                  <template x-for="col in def.columns" :key="col.name">
+                    <th x-h-table-head scope="col" :class="col.number ? 'text-right' : ''" x-text="T(col.tkey, col.label || col.name)"></th>
+                  </template>
+                  <th x-h-table-head scope="col" x-show="!isPreview"></th>
+                </tr>
+              </thead>
+              <tbody x-h-table-body>
+                <template x-for="row in rows" :key="row[def.primaryKey]">
+                  <tr x-h-table-row data-hoverable="true">
+                    <template x-for="col in def.columns" :key="col.name">
+                      <td x-h-table-cell :class="col.number ? 'text-right' : ''" x-text="cellValue(col, row)"></td>
+                    </template>
+                    <td x-h-table-cell data-row-actions x-show="!isPreview">
+                      <button type="button" x-h-menu-trigger.dropdown x-h-table-cell-button aria-label="Row actions"><i role="img" data-lucide="ellipsis"></i></button>
+                      <ul x-h-menu data-align="bottom-end">
+                        <li x-h-menu-item @click="previewRow(row)" x-text="T('$projectName:${tprefix}.defaults.preview', 'Preview')"></li>
+                        <li x-h-menu-item @click="editRow(row)" x-text="T('$projectName:${tprefix}.defaults.edit', 'Edit')"></li>
+                        <li x-h-menu-separator></li>
+                        <li x-h-menu-item data-variant="negative" @click="askDelete(row)" x-text="T('$projectName:${tprefix}.defaults.delete', 'Delete')"></li>
+                      </ul>
+                    </td>
+                  </tr>
+                </template>
+              </tbody>
+            </table>
+          </div>
+        </div>
+
+        <!-- Detail delete confirmation -->
+        <div x-h-dialog-overlay :data-open="deleteOpen">
+          <div x-h-dialog>
+            <div x-h-dialog-header>
+              <h2 x-h-dialog-title x-text="T('$projectName:${tprefix}.defaults.delete', 'Delete') + ' ' + T(def.tkey, def.label)"></h2>
+              <button type="button" x-h-dialog-close @click="deleteOpen = false" aria-label="Close"></button>
+            </div>
+            <div x-h-dialog-content><p>Are you sure? This cannot be undone.</p></div>
+            <div x-h-dialog-footer>
+              <button type="button" x-h-button data-variant="outline" @click="deleteOpen = false" :disabled="deleteBusy" x-text="T('$projectName:${tprefix}.defaults.cancel', 'Cancel')"></button>
+              <button type="button" x-h-button data-variant="negative" @click="confirmDelete()" :disabled="deleteBusy"><span x-show="deleteBusy" x-h-spinner></span><span x-text="T('$projectName:${tprefix}.defaults.delete', 'Delete')"></span></button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </template>
+  </div>
+
 </div>
diff --git a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/manage/list-page.js.template b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/manage/list-page.js.template
index 124c8cca1e..f1da9b3aeb 100644
--- a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/manage/list-page.js.template
+++ b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/manage/list-page.js.template
@@ -246,6 +246,7 @@ document.addEventListener('alpine:init', () => {
 
     newEntity()  { window.PineconeRouter.navigate('/${name}/create'); },
     editEntity(row) { window.PineconeRouter.navigate('/${name}/' + encodeURIComponent(row.${primaryKeysString}) + '/edit'); },
+    previewEntity(row) { window.PineconeRouter.navigate('/${name}/' + encodeURIComponent(row.${primaryKeysString}) + '/preview'); },
 
     askDelete(row) {
       this.deleteTarget = row;
diff --git a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/manage/list-view.html.template b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/manage/list-view.html.template
index 9dfe89e704..127572878c 100644
--- a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/manage/list-view.html.template
+++ b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/manage/list-view.html.template
@@ -127,6 +127,7 @@
                       <i role="img" data-lucide="ellipsis"></i>
                     </button>
                     <ul x-h-menu data-align="bottom-end">
+                      <li x-h-menu-item @click="previewEntity(row)" x-text="T('$projectName:${tprefix}.defaults.preview', 'Preview')"></li>
                       <li x-h-menu-item @click="editEntity(row)" x-text="T('$projectName:${tprefix}.defaults.edit', 'Edit')"></li>
                       <li x-h-menu-separator></li>
                       <li x-h-menu-item data-variant="negative" @click="askDelete(row)" x-text="T('$projectName:${tprefix}.defaults.delete', 'Delete')"></li>
@@ -161,6 +162,7 @@
         <div x-h-toolbar data-variant="transparent" data-size="sm">
           <span x-h-toolbar-title class="shrink-0" x-text="T('$projectName:${tprefix}.t.${dataName}', '${entityLabel}') + ' #' + selectedId"></span>
           <div x-h-toolbar-spacer></div>
+          <button x-h-button data-variant="outline" data-size="sm" @click="previewEntity(selected)"><i role="img" data-lucide="eye"></i><span x-text="T('$projectName:${tprefix}.defaults.preview', 'Preview')"></span></button>
           <button x-h-button data-variant="outline" data-size="sm" @click="editEntity(selected)"><i role="img" data-lucide="pencil"></i><span x-text="T('$projectName:${tprefix}.defaults.edit', 'Edit')"></span></button>
           <button x-h-button data-variant="transparent" data-size="sm" @click="askDelete(selected)" aria-label="Delete"><i role="img" data-lucide="trash-2"></i></button>
         </div>
diff --git a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/master/master-page.js.template b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/master/master-page.js.template
index 9c9ed1bde8..5a07574cd4 100644
--- a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/master/master-page.js.template
+++ b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/master/master-page.js.template
@@ -129,6 +129,7 @@ document.addEventListener('alpine:init', () => {
 
     newMaster()  { window.PineconeRouter.navigate('/${name}/create'); },
     editMaster(row) { window.PineconeRouter.navigate('/${name}/' + encodeURIComponent(row.${primaryKeysString}) + '/edit'); },
+    previewMaster(row) { window.PineconeRouter.navigate('/${name}/' + encodeURIComponent(row.${primaryKeysString}) + '/preview'); },
 
     askDelete(row) { this.deleteTarget = row; this.deleteOpen = true; },
     async confirmDelete() {
diff --git a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/master/master-view.html.template b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/master/master-view.html.template
index c293d3ef1c..7aa9259fb3 100644
--- a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/master/master-view.html.template
+++ b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/master/master-view.html.template
@@ -59,6 +59,7 @@
                 <td x-h-table-cell data-row-actions @click.stop>
                   <button x-h-menu-trigger.dropdown x-h-table-cell-button aria-label="Row actions"><i role="img" data-lucide="ellipsis"></i></button>
                   <ul x-h-menu data-align="bottom-end">
+                    <li x-h-menu-item @click="previewMaster(row)" x-text="T('$projectName:${tprefix}.defaults.preview', 'Preview')"></li>
                     <li x-h-menu-item @click="editMaster(row)" x-text="T('$projectName:${tprefix}.defaults.edit', 'Edit')"></li>
                     <li x-h-menu-separator></li>
                     <li x-h-menu-item data-variant="negative" @click="askDelete(row)" x-text="T('$projectName:${tprefix}.defaults.delete', 'Delete')"></li>
@@ -85,6 +86,7 @@
         <div x-h-toolbar data-variant="transparent" data-size="sm">
           <span x-h-toolbar-title class="shrink-0" x-text="'${entityLabel} #' + selectedId"></span>
           <div x-h-toolbar-spacer></div>
+          <button x-h-button data-variant="outline" data-size="sm" @click="previewMaster(selected)"><i role="img" data-lucide="eye"></i><span x-text="T('$projectName:${tprefix}.defaults.preview', 'Preview')"></span></button>
           <button x-h-button data-variant="outline" data-size="sm" @click="editMaster(selected)"><i role="img" data-lucide="pencil"></i><span x-text="T('$projectName:${tprefix}.defaults.edit', 'Edit')"></span></button>
           <button x-h-button data-variant="transparent" data-size="sm" @click="askDelete(selected)" aria-label="Delete"><i role="img" data-lucide="trash-2"></i></button>
         </div>
@@ -165,6 +167,7 @@
                           </template>
                           <button x-h-menu-trigger.dropdown x-h-table-cell-button aria-label="Row actions"><i role="img" data-lucide="ellipsis"></i></button>
                           <ul x-h-menu data-align="bottom-end">
+                            <li x-h-menu-item @click="previewRow(row)" x-text="T('$projectName:${tprefix}.defaults.preview', 'Preview')"></li>
                             <li x-h-menu-item @click="editRow(row)" x-text="T('$projectName:${tprefix}.defaults.edit', 'Edit')"></li>
                             <li x-h-menu-separator></li>
                             <li x-h-menu-item data-variant="negative" @click="askDelete(row)" x-text="T('$projectName:${tprefix}.defaults.delete', 'Delete')"></li>
diff --git a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/report-file/index.html.template b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/report-file/index.html.template
index 3e57af8735..0a97b426b4 100644
--- a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/report-file/index.html.template
+++ b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/report-file/index.html.template
@@ -33,6 +33,7 @@
         </button>
         <button x-h-button data-variant="outline" data-size="sm" @click="load()"><i role="img" data-lucide="refresh-cw"></i><span>Refresh</span></button>
         <button x-h-button data-variant="outline" data-size="sm" @click="exportCsv()"><i role="img" data-lucide="download"></i><span>Export</span></button>
+        <button x-h-button data-variant="outline" data-size="sm" @click="printReport()"><i role="img" data-lucide="printer"></i><span>Print</span></button>
       </div>
 
       <!-- Per-column filters, typed from the report metadata: date -> range, number -> range,
diff --git a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/report-file/report.js.template b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/report-file/report.js.template
index c22bf1dcaf..1cbbb5ddad 100644
--- a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/report-file/report.js.template
+++ b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/report-file/report.js.template
@@ -198,6 +198,38 @@ document.addEventListener('alpine:init', () => {
       }
     },
 
+    // Print the report: the FULL filtered result set (POST /export, same as the CSV export - not
+    // just the on-screen page) rendered into a minimal print document in a new window.
+    async printReport() {
+      try {
+        const data = await reportHttp.post(this.apiBase + '/export', { conditions: this.conditions() });
+        const rows = Array.isArray(data) ? data : [];
+        if (!rows.length) return;
+        const cols = Object.keys(rows[0]);
+        const esc = (v) => String(v == null ? '' : v).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
+        const th = cols.map(c => '<th class="' + this.alignClass(c) + '">' + esc(c) + '</th>').join('');
+        const body = rows.map(r => '<tr>' + cols.map(c => '<td class="' + this.alignClass(c) + '">' + esc(this.cellText(c, r)) + '</td>').join('') + '</tr>').join('');
+        const html = '<!doctype html><html><head><title>' + esc(this.displayName) + '</title><style>'
+          + 'body{font-family:system-ui,-apple-system,sans-serif;margin:24px;color:#111}'
+          + 'h1{font-size:18px;margin:0 0 4px}'
+          + '.meta{font-size:11px;color:#555;margin:0 0 16px}'
+          + 'table{border-collapse:collapse;width:100%;font-size:12px}'
+          + 'th,td{border:1px solid #999;padding:4px 8px;text-align:left}'
+          + 'th{background:#eee}.text-right{text-align:right}'
+          + '</style></head><body><h1>' + esc(this.displayName) + '</h1>'
+          + '<p class="meta">' + rows.length + ' rows' + (this.activeFilterCount ? ' (filtered)' : '') + ' - ' + esc(new Date().toLocaleString()) + '</p>'
+          + '<table><thead><tr>' + th + '</tr></thead><tbody>' + body + '</tbody></table></body></html>';
+        const w = window.open('', '_blank');
+        if (!w) return;
+        w.document.write(html);
+        w.document.close();
+        w.focus();
+        w.print();
+      } catch (e) {
+        this.error = (e && e.message) || 'Print failed.';
+      }
+    },
+
     refreshIcons() {
       this.${dollar}nextTick(() => { if (window.lucide && window.lucide.createIcons) window.lucide.createIcons(); });
     },
diff --git a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/report/chart-page.js.template b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/report/chart-page.js.template
index 30eac3d4a3..fbba12a0a2 100644
--- a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/report/chart-page.js.template
+++ b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/report/chart-page.js.template
@@ -43,5 +43,21 @@ document.addEventListener('alpine:init', () => {
       if (this._chart) this._chart.destroy();
       this._chart = new Chart(this.$refs.canvas, { type, data: { labels, datasets } });
     },
+
+    // Print the chart: snapshot the canvas as a PNG into a minimal print document in a new window
+    // (printing the live canvas directly would clip it to the viewport).
+    printChart() {
+      const canvas = this.$refs.canvas;
+      if (!canvas || this.state !== 'default') return;
+      const data = canvas.toDataURL('image/png');
+      const w = window.open('', '_blank');
+      if (!w) return;
+      w.document.write('<!doctype html><html><head><title>${name}</title><style>'
+        + 'body{font-family:system-ui,-apple-system,sans-serif;margin:24px;color:#111}'
+        + 'h1{font-size:18px;margin:0 0 16px}img{max-width:100%}'
+        + '</style></head><body><h1>${name}</h1>'
+        + '<img src="' + data + '" onload="window.focus();window.print()" /></body></html>');
+      w.document.close();
+    },
   }));
 }, { once: true });
diff --git a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/report/chart-view.html.template b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/report/chart-view.html.template
index f15c18c896..236ceb8ec7 100644
--- a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/report/chart-view.html.template
+++ b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/report/chart-view.html.template
@@ -4,6 +4,7 @@
     <span x-h-toolbar-title>${name}</span>
     <div x-h-toolbar-spacer></div>
     <button x-h-button data-variant="outline" data-size="sm" @click="load()"><i role="img" data-lucide="refresh-cw"></i><span>Refresh</span></button>
+    <button x-h-button data-variant="outline" data-size="sm" @click="printChart()"><i role="img" data-lucide="printer"></i><span>Print</span></button>
   </div>
   <div x-show="state === 'loading'" class="p-4"><div x-h-spinner></div></div>
   <div x-show="state === 'error'" x-h-alert data-variant="negative" role="alert" class="m-4"><div x-h-alert-description x-text="error"></div></div>
diff --git a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/report/table-page.js.template b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/report/table-page.js.template
index 5cb70250a5..9174e33a41 100644
--- a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/report/table-page.js.template
+++ b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/report/table-page.js.template
@@ -67,5 +67,44 @@ document.addEventListener('alpine:init', () => {
         return [cols.join(',')].concat(rows.map(r => cols.map(c => esc(r[c])).join(','))).join('\n');
       }
     },
+
+    // Column metadata for printing (label + numeric alignment/format), from the report model.
+    printColumns: [
+#foreach($property in $properties)
+      { key: '${property.name}', label: #if($property.widgetLabel)'${property.widgetLabel}'#else'${property.name}'#end#if($property.isNumberType), number: true#end#if($property.isFloatType), float: true, pattern: '${property.formatPattern}'#end },
+#end
+    ],
+
+    // Print the report: the FULL result set (POST /export, same as the CSV export) rendered into a
+    // minimal print document in a new window.
+    async printReport() {
+      try {
+        const data = await App.services.api.post(this.apiPath + '/export', {});
+        const rows = Array.isArray(data) ? data : [];
+        if (!rows.length) return;
+        const esc = (v) => String(v == null ? '' : v).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
+        const cell = (col, row) => col.float ? this.displayNumber(row[col.key], col.pattern) : row[col.key];
+        const th = this.printColumns.map(c => '<th class="' + (c.number ? 'text-right' : '') + '">' + esc(c.label) + '</th>').join('');
+        const body = rows.map(r => '<tr>' + this.printColumns.map(c => '<td class="' + (c.number ? 'text-right' : '') + '">' + esc(cell(c, r)) + '</td>').join('') + '</tr>').join('');
+        const html = '<!doctype html><html><head><title>${name}</title><style>'
+          + 'body{font-family:system-ui,-apple-system,sans-serif;margin:24px;color:#111}'
+          + 'h1{font-size:18px;margin:0 0 4px}'
+          + '.meta{font-size:11px;color:#555;margin:0 0 16px}'
+          + 'table{border-collapse:collapse;width:100%;font-size:12px}'
+          + 'th,td{border:1px solid #999;padding:4px 8px;text-align:left}'
+          + 'th{background:#eee}.text-right{text-align:right}'
+          + '</style></head><body><h1>${name}</h1>'
+          + '<p class="meta">' + rows.length + ' rows - ' + esc(new Date().toLocaleString()) + '</p>'
+          + '<table><thead><tr>' + th + '</tr></thead><tbody>' + body + '</tbody></table></body></html>';
+        const w = window.open('', '_blank');
+        if (!w) return;
+        w.document.write(html);
+        w.document.close();
+        w.focus();
+        w.print();
+      } catch (e) {
+        this.error = App.services.apiErrors.messageFor(e, 'Print failed.');
+      }
+    },
   }));
 }, { once: true });
diff --git a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/report/table-view.html.template b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/report/table-view.html.template
index 6bf727e2f3..e774941c49 100644
--- a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/report/table-view.html.template
+++ b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/perspective/report/table-view.html.template
@@ -5,6 +5,7 @@
     <div x-h-toolbar-spacer></div>
     <button x-h-button data-variant="outline" data-size="sm" @click="load()"><i role="img" data-lucide="refresh-cw"></i><span>Refresh</span></button>
     <button x-h-button data-variant="outline" data-size="sm" @click="exportCsv()"><i role="img" data-lucide="download"></i><span>Export</span></button>
+    <button x-h-button data-variant="outline" data-size="sm" @click="printReport()"><i role="img" data-lucide="printer"></i><span>Print</span></button>
   </div>
   <div x-show="state === 'loading'" class="p-4"><div x-h-spinner></div></div>
   <div x-show="state === 'error'" x-h-alert data-variant="negative" role="alert" class="m-4"><div x-h-alert-description x-text="error"></div></div>
diff --git a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/shell/index.html.template b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/shell/index.html.template
index 6775531db5..bff07eb19e 100644
--- a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/shell/index.html.template
+++ b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/shell/index.html.template
@@ -306,6 +306,7 @@
     <template x-route="/${entity.name}" x-template.target.app="./views/${entity.perspectiveName}/${entity.name}-manage-list.html"></template>
     <template x-route="/${entity.name}/create" x-template.target.app="./views/${entity.perspectiveName}/${entity.name}-form.html"></template>
     <template x-route="/${entity.name}/:id/edit" x-template.target.app="./views/${entity.perspectiveName}/${entity.name}-form.html"></template>
+    <template x-route="/${entity.name}/:id/preview" x-template.target.app="./views/${entity.perspectiveName}/${entity.name}-form.html"></template>
     <template x-route="/${entity.name}/:id" x-template.target.app="./views/${entity.perspectiveName}/${entity.name}-manage-list.html"></template>
 #end
 #end
@@ -315,6 +316,7 @@
     <template x-route="/${entity.name}" x-template.target.app="./views/${entity.perspectiveName}/${entity.name}-manage-list.html"></template>
     <template x-route="/${entity.name}/create" x-template.target.app="./views/${entity.perspectiveName}/${entity.name}-form.html"></template>
     <template x-route="/${entity.name}/:id/edit" x-template.target.app="./views/${entity.perspectiveName}/${entity.name}-form.html"></template>
+    <template x-route="/${entity.name}/:id/preview" x-template.target.app="./views/${entity.perspectiveName}/${entity.name}-form.html"></template>
     <template x-route="/${entity.name}/:id" x-template.target.app="./views/${entity.perspectiveName}/${entity.name}-manage-list.html"></template>
 #end
 #end
@@ -324,6 +326,7 @@
     <template x-route="/${entity.name}" x-template.target.app="./views/${entity.perspectiveName}/${entity.name}-master.html"></template>
     <template x-route="/${entity.name}/create" x-template.target.app="./views/${entity.perspectiveName}/${entity.name}-form.html"></template>
     <template x-route="/${entity.name}/:id/edit" x-template.target.app="./views/${entity.perspectiveName}/${entity.name}-form.html"></template>
+    <template x-route="/${entity.name}/:id/preview" x-template.target.app="./views/${entity.perspectiveName}/${entity.name}-form.html"></template>
     <template x-route="/${entity.name}/:id" x-template.target.app="./views/${entity.perspectiveName}/${entity.name}-master.html"></template>
 #end
 #end
@@ -333,6 +336,7 @@
     <template x-route="/${entity.name}" x-template.target.app="./views/${entity.perspectiveName}/${entity.name}-manage-list.html"></template>
     <template x-route="/${entity.name}/create" x-template.target.app="./views/${entity.perspectiveName}/${entity.name}-document.html"></template>
     <template x-route="/${entity.name}/:id/edit" x-template.target.app="./views/${entity.perspectiveName}/${entity.name}-document.html"></template>
+    <template x-route="/${entity.name}/:id/preview" x-template.target.app="./views/${entity.perspectiveName}/${entity.name}-document.html"></template>
     <template x-route="/${entity.name}/:id" x-template.target.app="./views/${entity.perspectiveName}/${entity.name}-manage-list.html"></template>
 #end
 #end
@@ -341,6 +345,7 @@
 #if(($entity.layoutType == "MANAGE_DETAILS" || $entity.layoutType == "LIST_DETAILS") && $entity.type == "DEPENDENT")
     <template x-route="/${entity.name}/create" x-template.target.app="./views/${entity.perspectiveName}/${entity.name}-form.html"></template>
     <template x-route="/${entity.name}/:id/edit" x-template.target.app="./views/${entity.perspectiveName}/${entity.name}-form.html"></template>
+    <template x-route="/${entity.name}/:id/preview" x-template.target.app="./views/${entity.perspectiveName}/${entity.name}-form.html"></template>
 #end
 #end
     <!-- REPORT entities: a table or chart page. -->
diff --git a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/translations.json.template b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/translations.json.template
index 634e3e1228..5f7cc3414f 100644
--- a/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/translations.json.template
+++ b/components/template/template-application-ui-harmonia-java/src/main/resources/META-INF/dirigible/template-application-ui-harmonia-java/ui/translations.json.template
@@ -62,9 +62,11 @@
         "reset": "Reset",
         "create": "Create",
         "edit": "Edit",
+        "preview": "Preview",
         "update": "Update",
         "delete": "Delete",
         "cancel": "Cancel",
+        "close": "Close",
         "items": "Items",
         "description": "Description",
         "formGrpFilter": "{{name}} Filter",