Example Reports Summary section report
This is an example report using the summary-section template
Contents
<div id="dpr-report-page" class="dpr-report-page govuk-width-container report-list-container">
<div class="dpr-report-print-message-container">
</div>
<div class="dpr-report-page__heading-container">
<div class="dpr-report-header">
<div class="dpr-report-heading__actions">
<div class="report-actions" data-dpr-module="report-actions">
<div class="moj-button-menu"></div>
<div class="dpr-display-none"></div>
</div>
</div>
<div class="dpr-report-heading">
<div class="dpr-report-heading__title">
<h1 id="dpr-report-name" class="govuk-heading-xl">
<span class="govuk-caption-l">Report templates</span>
Summary-section
</h1>
</div>
</div>
<details class="govuk-details dpr-meta-data-details">
<summary class="govuk-details__summary">
<span class="govuk-details__summary-text">
Report details
</span>
</summary>
<div class="govuk-details__text">
<div class="dpr-request-details">
<table class="dpr-request-details__table" id="dpr-request-details-table">
<tbody>
<tr>
<td class="dpr-request-details__table-heading">
<p class="govuk-body-m dpr-request-details__table-heading_name">Name:</p>
</td>
<td>
<p class="govuk-heading-s govuk-!-margin-bottom-0">Summary-section</p>
</td>
</tr>
<tr>
<td class="dpr-request-details__table-heading">
<p class="govuk-body-m dpr-request-details__table-heading_name">Product:</p>
</td>
<td>
<p class="govuk-heading-s govuk-!-margin-bottom-0">Report templates</p>
</td>
</tr>
<tr>
<td class="dpr-request-details__table-heading">
<p class="govuk-body-m dpr-request-details__table-heading_name">Description:</p>
</td>
<td>
<p class="govuk-body-m govuk-!-margin-bottom-0">template: "summary-section".</br> A report with summaries in sections</p>
</td>
</tr>
<tr>
<td class="dpr-request-details__table-heading">
<p class="govuk-body-m dpr-request-details__table-heading_name">Classification:</p>
</td>
<td>
<p class="govuk-body-m govuk-!-margin-bottom-0">OFFICIAL</p>
</td>
</tr>
<tr>
<td class="dpr-request-details__table-heading">
<p class="govuk-body-m dpr-request-details__table-heading_name">Requested at:</p>
</td>
<td>
<p class="govuk-body-m govuk-!-margin-bottom-0">26/01/2026, 19:07:42</p>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</details>
<div class="dpr-report-details-print">
<div class="dpr-request-details">
<table class="dpr-request-details__table" id="dpr-request-details-table">
<tbody>
<tr>
<td class="dpr-request-details__table-heading">
<p class="govuk-body-m dpr-request-details__table-heading_name">Name:</p>
</td>
<td>
<p class="govuk-heading-s govuk-!-margin-bottom-0">Summary-section</p>
</td>
</tr>
<tr>
<td class="dpr-request-details__table-heading">
<p class="govuk-body-m dpr-request-details__table-heading_name">Product:</p>
</td>
<td>
<p class="govuk-heading-s govuk-!-margin-bottom-0">Report templates</p>
</td>
</tr>
<tr>
<td class="dpr-request-details__table-heading">
<p class="govuk-body-m dpr-request-details__table-heading_name">Description:</p>
</td>
<td>
<p class="govuk-body-m govuk-!-margin-bottom-0">template: "summary-section".</br> A report with summaries in sections</p>
</td>
</tr>
<tr>
<td class="dpr-request-details__table-heading">
<p class="govuk-body-m dpr-request-details__table-heading_name">Classification:</p>
</td>
<td>
<p class="govuk-body-m govuk-!-margin-bottom-0">OFFICIAL</p>
</td>
</tr>
<tr>
<td class="dpr-request-details__table-heading">
<p class="govuk-body-m dpr-request-details__table-heading_name">Requested at:</p>
</td>
<td>
<p class="govuk-body-m govuk-!-margin-bottom-0">26/01/2026, 19:07:42</p>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="dpr-report-interactive-actions">
</div>
</div>
</div>
<div class="dpr-report-page__template-container">
<div class="dpr-report-template-container ">
<div class="dpr-report-template__page-summaries dpr-report-template__page-summaries--header">
</div>
<div class="dpr-report-template__page-totals dpr-report-template__page-totals--header">
<div class="dpr-report-totals">
<p class="govuk-body"></p>
</div>
</div>
<div class="dpr-report-template__sections dpr-report-template__sections--summary-section">
<div id="dpr-report-sections">
<div id="dpr-summary-section-section-1" class="dpr-summary-section-section dpr-report-section" aria-labelledby="section-title-1">
<span id="section-title-1-prev" aria-hidden="true"></span>
<div class="dpr-report-section__title">
<h2 id="section-title-1" class="govuk-heading-m">
First: One, Second: A
</h2>
<div class="dpr-report-section__actions">
<div class="dpr-report-section__actions--left-aligned ">
<a class="govuk-link govuk-link--no-visited-state govuk-body-s" href="#section-title-2">Next</a>
</div>
<div class="dpr-report-section__actions--right-aligned">
<a class="govuk-link govuk-link--no-visited-state govuk-body-s dpr-report-section__action--right-aligned" href="#dpr-report-page">Return to Top</a>
|
<a class="govuk-link govuk-link--no-visited-state govuk-body-s dpr-report-section__action--right-aligned" href="#dpr-report-page-bottom">Go to End</a>
</div>
</div>
</div>
<div class="dpr-summary-container-group dpr-summary-container-group-section-footer">
<div class="dpr-summary-container">
<table class="govuk-table">
<thead class="govuk-table__head">
<tr class="govuk-table__row">
<th scope="col" class="govuk-table__header">Field 1</th>
<th scope="col" class="govuk-table__header">Field 2</th>
<th scope="col" class="govuk-table__header">Field 3</th>
<th scope="col" class="govuk-table__header">Field 4</th>
</tr>
</thead>
<tbody class="govuk-table__body">
<tr class="govuk-table__row">
<td class="govuk-table__cell govuk-table__cell--string">Section One A Header</td>
<td class="govuk-table__cell govuk-table__cell--numeric">1</td>
<td class="govuk-table__cell govuk-table__cell--numeric">12219380923</td>
<td class="govuk-table__cell govuk-table__cell--string">4 Freds</td>
</tr>
</tbody>
</table>
</div>
<div class="dpr-summary-container">
<table class="govuk-table">
<thead class="govuk-table__head">
<tr class="govuk-table__row">
<th scope="col" class="govuk-table__header">Field 1</th>
<th scope="col" class="govuk-table__header">Field 2</th>
<th scope="col" class="govuk-table__header">Field 3</th>
<th scope="col" class="govuk-table__header">Field 4</th>
</tr>
</thead>
<tbody class="govuk-table__body">
<tr class="govuk-table__row">
<td class="govuk-table__cell govuk-table__cell--string">Section One A Footer</td>
<td class="govuk-table__cell govuk-table__cell--numeric">1</td>
<td class="govuk-table__cell govuk-table__cell--numeric">12219380923</td>
<td class="govuk-table__cell govuk-table__cell--string">6 Freds</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div id="dpr-summary-section-section-2" class="dpr-summary-section-section dpr-report-section" aria-labelledby="section-title-2">
<span id="section-title-2-prev" aria-hidden="true"></span>
<div class="dpr-report-section__title">
<h2 id="section-title-2" class="govuk-heading-m">
First: One, Second: B
</h2>
<div class="dpr-report-section__actions">
<div class="dpr-report-section__actions--left-aligned ">
<a class="govuk-link govuk-link--no-visited-state govuk-body-s" href="#section-title-3">Next</a>
| <a class="govuk-link govuk-link--no-visited-state govuk-body-s" href="#section-title-1-prev">Previous</a>
</div>
<div class="dpr-report-section__actions--right-aligned">
<a class="govuk-link govuk-link--no-visited-state govuk-body-s dpr-report-section__action--right-aligned" href="#dpr-report-page">Return to Top</a>
|
<a class="govuk-link govuk-link--no-visited-state govuk-body-s dpr-report-section__action--right-aligned" href="#dpr-report-page-bottom">Go to End</a>
</div>
</div>
</div>
<div class="dpr-summary-container-group dpr-summary-container-group-section-footer">
<div class="dpr-summary-container">
<table class="govuk-table">
<thead class="govuk-table__head">
<tr class="govuk-table__row">
<th scope="col" class="govuk-table__header">Field 1</th>
<th scope="col" class="govuk-table__header">Field 2</th>
<th scope="col" class="govuk-table__header">Field 3</th>
<th scope="col" class="govuk-table__header">Field 4</th>
</tr>
</thead>
<tbody class="govuk-table__body">
<tr class="govuk-table__row">
<td class="govuk-table__cell govuk-table__cell--string">Section One B Footer</td>
<td class="govuk-table__cell govuk-table__cell--numeric">1</td>
<td class="govuk-table__cell govuk-table__cell--numeric">12219380923</td>
<td class="govuk-table__cell govuk-table__cell--string">7 Freds</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div id="dpr-summary-section-section-3" class="dpr-summary-section-section dpr-report-section" aria-labelledby="section-title-3">
<span id="section-title-3-prev" aria-hidden="true"></span>
<div class="dpr-report-section__title">
<h2 id="section-title-3" class="govuk-heading-m">
First: Two, Second: A
</h2>
<div class="dpr-report-section__actions">
<div class="dpr-report-section__actions--left-aligned ">
<a class="govuk-link govuk-link--no-visited-state govuk-body-s" href="#section-title-4">Next</a>
| <a class="govuk-link govuk-link--no-visited-state govuk-body-s" href="#section-title-2-prev">Previous</a>
</div>
<div class="dpr-report-section__actions--right-aligned">
<a class="govuk-link govuk-link--no-visited-state govuk-body-s dpr-report-section__action--right-aligned" href="#dpr-report-page">Return to Top</a>
|
<a class="govuk-link govuk-link--no-visited-state govuk-body-s dpr-report-section__action--right-aligned" href="#dpr-report-page-bottom">Go to End</a>
</div>
</div>
</div>
<div class="dpr-summary-container-group dpr-summary-container-group-section-footer">
<div class="dpr-summary-container">
<table class="govuk-table">
<thead class="govuk-table__head">
<tr class="govuk-table__row">
<th scope="col" class="govuk-table__header">Field 1</th>
<th scope="col" class="govuk-table__header">Field 2</th>
<th scope="col" class="govuk-table__header">Field 3</th>
<th scope="col" class="govuk-table__header">Field 4</th>
</tr>
</thead>
<tbody class="govuk-table__body">
<tr class="govuk-table__row">
<td class="govuk-table__cell govuk-table__cell--string">Section Two A Header</td>
<td class="govuk-table__cell govuk-table__cell--numeric">1</td>
<td class="govuk-table__cell govuk-table__cell--numeric">12219380923</td>
<td class="govuk-table__cell govuk-table__cell--string">5 Freds</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div id="dpr-summary-section-section-4" class="dpr-summary-section-section dpr-report-section" aria-labelledby="section-title-4">
<span id="section-title-4-prev" aria-hidden="true"></span>
<div class="dpr-report-section__title">
<h2 id="section-title-4" class="govuk-heading-m">
First: Two, Second: B
</h2>
<div class="dpr-report-section__actions">
<div class="dpr-report-section__actions--left-aligned ">
<a class="govuk-link govuk-link--no-visited-state govuk-body-s" href="#section-title-5">Next</a>
| <a class="govuk-link govuk-link--no-visited-state govuk-body-s" href="#section-title-3-prev">Previous</a>
</div>
<div class="dpr-report-section__actions--right-aligned">
<a class="govuk-link govuk-link--no-visited-state govuk-body-s dpr-report-section__action--right-aligned" href="#dpr-report-page">Return to Top</a>
|
<a class="govuk-link govuk-link--no-visited-state govuk-body-s dpr-report-section__action--right-aligned" href="#dpr-report-page-bottom">Go to End</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="dpr-report-template__page-totals dpr-report-template__page-totals--footer">
<div class="dpr-report-totals">
<p class="govuk-body"></p>
</div>
</div>
<div class="dpr-report-template__page-summaries dpr-report-template__page-summaries--footer">
</div>
</div>
</div>
<div id="dpr-report-page-bottom"></div>
</div>
</div>
{%- from "dpr/components/_reports/report-page/view.njk" import dprReportPage -%}
{%
set data = {
filterData: {
filters: [],
selectedFilters: [],
canSaveDefaults: true
},
count: 100,
nestedBaseUrl: '/embedded/platform',
csrfToken: 'csrfToken',
loadType: 'async',
type: 'report',
tableId: 'tblId_1769454461356',
reportId: 'report-template-examples',
id: 'report-template-example-summary-section-better',
actions: [],
canDownload: false,
reportName: 'Report templates',
name: 'Summary-section',
description: 'template: "summary-section".</br> A report with summaries in sections',
classification: 'OFFICIAL',
printable: true,
specification: {
template: 'summary-section',
sections: ['section1', 'section2'],
fields: [
{
name: 'section1',
display: 'First',
sortable: false,
defaultsort: false,
type: 'string',
mandatory: false,
visible: false
},
{
name: 'section2',
display: 'Second',
sortable: false,
defaultsort: false,
type: 'string',
mandatory: false,
visible: false
}
]
},
template: 'summary-section',
fields: [
{
name: 'section1',
display: 'First',
sortable: false,
defaultsort: false,
type: 'string',
mandatory: false,
visible: false
},
{
name: 'section2',
display: 'Second',
sortable: false,
defaultsort: false,
type: 'string',
mandatory: false,
visible: false
}
],
executionId: 'exId_1769454461356',
requestedTimestamp: '26/01/2026, 19:07:42',
querySummary: [],
queryData: {},
requestUrl: {
fullUrl:
'http://localhost:3010/embedded/platform/dpr/request-report/report/report-template-examples/report-template-example-summary-section-better/filters',
pathname:
'/embedded/platform/dpr/request-report/report/report-template-examples/report-template-example-summary-section-better/filters',
search: ''
},
reportUrl:
'/embedded/platform/dpr/view-report/async/report/report-template-examples/report-template-example-summary-section-better/tblId_1769454461356/report',
pathname:
'/embedded/platform/dpr/view-report/async/report/report-template-examples/report-template-example-summary-section-better/tblId_1769454461356/report',
dataTable: {
rowCount: 100,
summaries: {},
sections: [
{
key: '[{"name":"section1","value":"One"},{"name":"section2","value":"A"}]',
keyObj: [
{
name: 'section1',
value: 'One'
},
{
name: 'section2',
value: 'A'
}
],
title: 'First: One, Second: A',
count: 17,
summaries: {
'section-footer': [
{
head: [
{
text: 'Field 1'
},
{
text: 'Field 2'
},
{
text: 'Field 3'
},
{
text: 'Field 4'
}
],
rows: [
[
{
fieldName: 'field1',
text: 'Section One A Header',
format: 'string',
classes: ''
},
{
fieldName: 'field2',
text: 1,
format: 'numeric',
classes: ''
},
{
fieldName: 'field3',
text: 12219380923,
format: 'numeric',
classes: ''
},
{
fieldName: 'field4',
text: '4 Freds',
format: 'string',
classes: ''
}
]
],
rowCount: 1,
colCount: 4
},
{
head: [
{
text: 'Field 1'
},
{
text: 'Field 2'
},
{
text: 'Field 3'
},
{
text: 'Field 4'
}
],
rows: [
[
{
fieldName: 'field1',
text: 'Section One A Footer',
format: 'string',
classes: ''
},
{
fieldName: 'field2',
text: 1,
format: 'numeric',
classes: ''
},
{
fieldName: 'field3',
text: 12219380923,
format: 'numeric',
classes: ''
},
{
fieldName: 'field4',
text: '6 Freds',
format: 'string',
classes: ''
}
]
],
rowCount: 1,
colCount: 4
}
]
},
data: {
head: [],
rows: [],
rowCount: 17,
colCount: 0
}
},
{
key: '[{"name":"section1","value":"One"},{"name":"section2","value":"B"}]',
keyObj: [
{
name: 'section1',
value: 'One'
},
{
name: 'section2',
value: 'B'
}
],
title: 'First: One, Second: B',
count: 33,
summaries: {
'section-footer': [
{
head: [
{
text: 'Field 1'
},
{
text: 'Field 2'
},
{
text: 'Field 3'
},
{
text: 'Field 4'
}
],
rows: [
[
{
fieldName: 'field1',
text: 'Section One B Footer',
format: 'string',
classes: ''
},
{
fieldName: 'field2',
text: 1,
format: 'numeric',
classes: ''
},
{
fieldName: 'field3',
text: 12219380923,
format: 'numeric',
classes: ''
},
{
fieldName: 'field4',
text: '7 Freds',
format: 'string',
classes: ''
}
]
],
rowCount: 1,
colCount: 4
}
]
},
data: {
head: [],
rows: [],
rowCount: 33,
colCount: 0
}
},
{
key: '[{"name":"section1","value":"Two"},{"name":"section2","value":"A"}]',
keyObj: [
{
name: 'section1',
value: 'Two'
},
{
name: 'section2',
value: 'A'
}
],
title: 'First: Two, Second: A',
count: 17,
summaries: {
'section-footer': [
{
head: [
{
text: 'Field 1'
},
{
text: 'Field 2'
},
{
text: 'Field 3'
},
{
text: 'Field 4'
}
],
rows: [
[
{
fieldName: 'field1',
text: 'Section Two A Header',
format: 'string',
classes: ''
},
{
fieldName: 'field2',
text: 1,
format: 'numeric',
classes: ''
},
{
fieldName: 'field3',
text: 12219380923,
format: 'numeric',
classes: ''
},
{
fieldName: 'field4',
text: '5 Freds',
format: 'string',
classes: ''
}
]
],
rowCount: 1,
colCount: 4
}
]
},
data: {
head: [],
rows: [],
rowCount: 17,
colCount: 0
}
},
{
key: '[{"name":"section1","value":"Two"},{"name":"section2","value":"B"}]',
keyObj: [
{
name: 'section1',
value: 'Two'
},
{
name: 'section2',
value: 'B'
}
],
title: 'First: Two, Second: B',
count: 33,
summaries: {},
data: {
head: [],
rows: [],
rowCount: 33,
colCount: 0
}
}
]
}
}
%}
{{ dprReportPage(data) }}```
</div>
</div>
</div>