refactor: clean and standardize print template for general ledger report

(cherry picked from commit 3ba36212b0)
This commit is contained in:
Shllokkk
2026-03-24 13:16:15 +05:30
committed by Mergify
parent 0d07083299
commit 04893ae0e3

View File

@@ -1,51 +1,84 @@
<!-- Modified on 25-11-2024
-->
<style type="text/css"> <style type="text/css">
/* General styles for both screen display and print */
body, html { body, html {
margin-top: 10; margin-top: 10;
padding: 0; padding: 0;
width: 100%; width: 100%;
height: auto; /* Allow content to expand */ height: auto;
font-family: Arial, sans-serif; /* Example font */ font-family: "Inter", sans-serif;
color: #525252;
} }
/* Ensure consistent letter spacing across all media */
.title-letter-spacing { .title-letter-spacing {
letter-spacing: .2rem; letter-spacing: .2rem;
color: #525252;
} }
/* Styles specific to printing and PDF generation */ table {
@media print { width: 100%;
/* Set page size and margins for printing */ font-size: 11px;
@page { border-collapse: collapse;
size: A4; /* Use fixed A4 page size */ table-layout: fixed;
margin-top: 10mm; border: 1px solid #ededed;
} }
/* Force a page break before elements with the class "page-break" */ thead tr {
.page-break { background: #f8f8f8;
page-break-before: always; text-align: center;
margin-top: 10mm; /* Add some space after the break */ font-weight: bold;
}
/* Ensure table headers repeat on each printed page */
thead {
display: table-header-group;
}
/* Ensure table footers repeat on each printed page */
tfoot {
display: table-footer-group;
} }
th, td { th, td {
padding: 1px; padding: 6px 8px;
border: 1px solid black; /* Example border for clarity */ border: 1px solid #ededed;
vertical-align: top;
word-wrap: break-word;
}
.text-center { text-align: center; }
.text-right {
text-align: right;
font-variant-numeric: tabular-nums;
}
.text-left { text-align: left; }
.text-muted { color: #7c7c7c; }
.text-bold { font-weight: bold; }
.show-filters {
margin: 10px 0 14px;
padding: 8px 10px;
background: #f8f8f8;
border: 1px solid #ededed;
border-radius: 6px;
font-size: 12.5px;
color: #525252;
}
.show-filters .filter-row {
margin-bottom: 4px;
line-height: 1.5;
}
.show-filters .filter-row strong {
color: #7c7c7c;
font-weight: 500;
}
@media print {
@page {
size: A4;
margin-top: 10mm;
}
thead {
display: table-header-group;
}
tfoot {
display: table-footer-group;
}
tr {
page-break-inside: avoid;
} }
/* Hide elements that should not appear in print (optional) */
.no-print { .no-print {
display: none !important; display: none !important;
} }
@@ -53,129 +86,151 @@
</style> </style>
<br> <br>
<div style="font-family:Arial">
<div> <div>
<div class="title-letter-spacing" style="text-align:center; font-size:15px; text-decoration:underline;"> <!-- Title -->
<b> <div class="text-center" style="margin-bottom: 12px;">
{%= __("STATEMENT OF ACCOUNTS") %}<br>
<!-- Title -->
<div class="title-letter-spacing" style="font-size: 17px; font-weight: 600; color: #171717;">
{%= __("STATEMENT OF ACCOUNTS") %}
</div>
<!-- Party / Account -->
<div style="margin-top: 6px; font-size: 12.5px; color: #525252;">
{% if (filters.party_name) { %} {% if (filters.party_name) { %}
<br>{%= filters.party_name %} {%= filters.party_name %}
{% } else if (filters.party && filters.party.length) { %} {% } else if (filters.party && filters.party.length) { %}
<br>{%= filters.party %} {%= filters.party %}
{% } else if (filters.account) { %} {% } else if (filters.account) { %}
<br>{%= filters.account %} {%= filters.account %}
{% } else { %} {% } else { %}
<br>{%= __("All Parties ") %} {%= __("All Parties") %}
{% } %} {% } %}
</b>
</div> </div>
<div style="text-align:center; font-size:13px;">
<b> <!-- Date Range -->
{%= __("{0} to {1}", [frappe.datetime.str_to_user(filters.from_date), frappe.datetime.str_to_user(filters.to_date)]) %}<br><br> <div style="margin-top: 4px; font-size: 12.5px; color: #525252;">
</b> {%= __("{0} to {1}", [
frappe.datetime.str_to_user(filters.from_date),
frappe.datetime.str_to_user(filters.to_date)
]) %}
</div> </div>
</div> </div>
<!-- Filters -->
<div class="show-filters"> <div class="show-filters">
{% if subtitle %} {% if subtitle %}
{{ subtitle }} {{ subtitle }}
<hr>
{% endif %} {% endif %}
</div> </div>
<table style="width:100%; font-size: 11px">
<!-- Table -->
<table>
<thead> <thead>
<tr class="title-letter-spacing" style="text-align: center; font-weight:bold"> <tr class="title-letter-spacing">
<td style="border: 1.5px solid black; width: 7em">{%= __("Date").toLocaleUpperCase() %}</td> <th style="width: 7em">{%= __("Date").toLocaleUpperCase() %}</th>
<td style="border: 1.5px solid black">{%= __("Particulars").toLocaleUpperCase() %}</td> <th>{%= __("Particulars").toLocaleUpperCase() %}</th>
{% if(filters.show_remarks) { %} {% if(filters.show_remarks) { %}
<td style="border: 1.5px solid black">{%= __("Remarks").toLocaleUpperCase() %}</td> <th>{%= __("Remarks").toLocaleUpperCase() %}</th>
{% } %} {% } %}
<td style="border: 1.5px solid black; width: 9em">{%= __("Debit").toLocaleUpperCase() %}</td>
<td style="border: 1.5px solid black; width: 9em">{%= __("Credit").toLocaleUpperCase() %}</td> <th style="width: 9em">{%= __("Debit").toLocaleUpperCase() %}</th>
<td style="border: 1.5px solid black; width: 10.2em">{%= __("Balance").toLocaleUpperCase() %}</td> <th style="width: 9em">{%= __("Credit").toLocaleUpperCase() %}</th>
<th style="width: 10.2em">{%= __("Balance").toLocaleUpperCase() %}</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
{% for(var i=0, l=data.length; i<l; i++) { %} {% for(var i=0, l=data.length; i<l; i++) { %}
<tr style="border-bottom: 1px solid black"> {% var row = data[i]; %}
{% if(data[i].posting_date) { %} <tr>
<td style="text-align: center; border: 1px dotted black">
{%= frappe.datetime.str_to_user(data[i].posting_date) %} <!-- DATE COLUMN -->
</td> <td class="text-center">
<td style="border-right: 1px dotted black"> {% if(row.posting_date) { %}
{%= data[i].voucher_type %} {%= data[i].voucher_no %} {%= frappe.datetime.str_to_user(row.posting_date) %}
{% if(!(filters.party || filters.account)) { %} {% } else if(i == 0) { %}
{%= data[i].party || data[i].account %}
{% } %}<br>
{% if(data[i].bill_no) { %}
{%= __("Supplier Invoice No") %}: {%= data[i].bill_no %}
{% } %}
</td>
{% if(filters.show_remarks) { %}
<td style="border-right: 1px dotted black; font-size: 10px">
{% if(data[i].remarks != "No Remarks" && data[i].remarks != "") { %}
{%= __("Remarks") %}: {%= data[i].remarks %}<br>
{% } %}
</td>
{% } %}
<td style="text-align: right; border-right: 1px dotted black">
{% if data[i].debit != 0 %}
{%= format_currency(data[i].debit, filters.presentation_currency) %}
{% } %}
</td>
<td style="text-align: right; border-right: 1px dotted black">
{% if data[i].credit != 0 %}
{%= format_currency(data[i].credit, filters.presentation_currency) %}
{% } %}
</td>
{% } else { %}
<td style="text-align: center; border: 1px dotted black">
{% if(i == 0) { %}
{%= frappe.datetime.str_to_user(filters.from_date) %} {%= frappe.datetime.str_to_user(filters.from_date) %}
{% } %} {% } %}
</td> </td>
<td style="text-align: left; border-right: 1px dotted black"><b>
<!-- PARTICULARS -->
<td class="{% if(!row.posting_date) { %}text-left text-bold{% } %}">
{% if(row.posting_date) { %}
{%= row.voucher_type %} {%= row.voucher_no %}
{% if(!(filters.party || filters.account)) { %}
{%= row.party || row.account %}
{% } %}<br>
{% if(row.bill_no) { %}
{%= __("Supplier Invoice No") %}: {%= row.bill_no %}
{% } %}
{% } else { %}
{% if(i == l-2) { %} {% if(i == l-2) { %}
{%= __("Total") %} {%= __("Total") %}
{% } else { %} {% } else if(i == l-1) { %}
{% if(i == l-1) { %}
{%= __("Closing [Opening + Total] ") %} {%= __("Closing [Opening + Total] ") %}
{% } else { %} {% } else { %}
{%= frappe.format(data[i].account, {fieldtype: "Link"}) || "&nbsp;" %} {%= frappe.format(row.account, {fieldtype: "Link"}) || "&nbsp;" %}
{% } %}
{% } %}</b>
</td>
{% if(filters.show_remarks) { %} <td style="text-align: left; border-right: 1px dotted black"></td>{% } %}
<td style="text-align: right; border-right: 1px dotted black">
{% if(i != 0){ %}
{% if(i != l-1){ %}
{%= data[i].account && format_currency(data[i].debit, filters.presentation_currency) %}
{% } %} {% } %}
{% } %} {% } %}
</td> </td>
<td style="text-align: right; border-right: 1px dotted black">
{% if(i != 0){ %} <!-- REMARKS -->
{% if(i != l-1){ %} {% if(filters.show_remarks) { %}
{%= data[i].account && format_currency(data[i].credit, filters.presentation_currency) %} <td class="text-muted" style="font-size: 10px">
{% } %} {% if(row.posting_date && row.remarks != "No Remarks" && row.remarks != "") { %}
{%= row.remarks %}
{% } %} {% } %}
</td> </td>
{% } %} {% } %}
<!-- DEBIT -->
<td class="text-right">
{% if(row.posting_date) { %}
{% if(row.debit != 0) { %}
{%= format_currency(row.debit, filters.presentation_currency) %}
{% } %}
{% } else if(i != 0 && i != l-1) { %}
{%= row.account && format_currency(row.debit, filters.presentation_currency) %}
{% } %}
</td>
<!-- CREDIT -->
<td class="text-right">
{% if(row.posting_date) { %}
{% if(row.credit != 0) { %}
{%= format_currency(row.credit, filters.presentation_currency) %}
{% } %}
{% } else if(i != 0 && i != l-1) { %}
{%= row.account && format_currency(row.credit, filters.presentation_currency) %}
{% } %}
</td>
<!-- BALANCE -->
<td class="text-right {% if(i == l-1) { %}text-bold{% } %}">
{% if(i == l-1) { %} {% if(i == l-1) { %}
<td style="text-align: right; font-weight:bold; border-right: 1px dotted black"> {%= format_currency(row.balance, filters.presentation_currency) %}
{%= format_currency(data[i].balance, filters.presentation_currency) %} {% if(row.balance < 0){ %}Cr{% } %}
{% if(data[i].balance < 0){ %}Cr{% } %} {% if(row.balance > 0){ %}Dr{% } %}
{% if(data[i].balance > 0){ %}Dr{% } %} {% } else if(i != l-2) { %}
</td> {%= format_currency(row.balance, filters.presentation_currency) %}
{% } else { %}
<td style="text-align: right; border-right: 1px dotted black">
{% if(i != l-2) { %}
{%= format_currency(data[i].balance, filters.presentation_currency) %}
{% } %} {% } %}
</td> </td>
{% } %}
</tr> </tr>
{% endfor %} {% endfor %}
</tbody> </tbody>
</table> </table>
<p class="text-right text-muted">{%= __("Printed on {0}", [frappe.datetime.str_to_user(frappe.datetime.get_datetime_as_string())]) %}</p>
<p class="text-right text-muted">
{%= __("Printed on {0}", [
frappe.datetime.str_to_user(frappe.datetime.get_datetime_as_string())
]) %}
</p>
</div> </div>