template fix maybe
This commit is contained in:
DeathKaioken
parent
c824f0849d
commit
a250608131
@ -368,6 +368,9 @@ class InvoiceService {
|
|||||||
let customerName;
|
let customerName;
|
||||||
let customerEmail = '';
|
let customerEmail = '';
|
||||||
let orderedByBlock = '';
|
let orderedByBlock = '';
|
||||||
|
const taxTreatmentBlock = isReverseCharge
|
||||||
|
? ''
|
||||||
|
: `<div class="tax-banner"><div class="tax-banner-title">${isDe ? 'Steuerhinweis' : 'Tax treatment'}</div><p><strong>${this._escapeHtml(isDe ? 'MwSt.' : 'Tax')}</strong> (${this._escapeHtml(vatRate ? `${vatRate}%` : '0%')})</p></div>`;
|
||||||
|
|
||||||
if (isGift) {
|
if (isGift) {
|
||||||
// Recipient info for "Bill To"
|
// Recipient info for "Bill To"
|
||||||
@ -412,6 +415,7 @@ class InvoiceService {
|
|||||||
customerPostalCity: this._escapeHtml([invoice.buyer_postal_code, invoice.buyer_city].filter(Boolean).join(' ')),
|
customerPostalCity: this._escapeHtml([invoice.buyer_postal_code, invoice.buyer_city].filter(Boolean).join(' ')),
|
||||||
customerCountry: this._escapeHtml(invoice.buyer_country || ''),
|
customerCountry: this._escapeHtml(invoice.buyer_country || ''),
|
||||||
orderedByBlock,
|
orderedByBlock,
|
||||||
|
taxTreatmentBlock,
|
||||||
issuedAt: this._escapeHtml(issuedAt),
|
issuedAt: this._escapeHtml(issuedAt),
|
||||||
dueAt: this._escapeHtml(dueAt),
|
dueAt: this._escapeHtml(dueAt),
|
||||||
descriptionHeader: isDe ? 'Beschreibung' : 'Description',
|
descriptionHeader: isDe ? 'Beschreibung' : 'Description',
|
||||||
|
|||||||
@ -21,7 +21,7 @@
|
|||||||
border: 1px solid #dbe3f0;
|
border: 1px solid #dbe3f0;
|
||||||
border-radius: 20px;
|
border-radius: 20px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
box-shadow: 0 24px 60px -38px rgba(15, 23, 42, 0.35);
|
box-shadow: none;
|
||||||
}
|
}
|
||||||
.hero {
|
.hero {
|
||||||
padding: 34px 38px 28px;
|
padding: 34px 38px 28px;
|
||||||
@ -161,6 +161,9 @@
|
|||||||
margin: 0;
|
margin: 0;
|
||||||
color: #334155;
|
color: #334155;
|
||||||
}
|
}
|
||||||
|
.tax-banner:empty {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
.items-table {
|
.items-table {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
border-collapse: collapse;
|
border-collapse: collapse;
|
||||||
@ -277,6 +280,110 @@
|
|||||||
text-align: left;
|
text-align: left;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@page {
|
||||||
|
size: A4;
|
||||||
|
margin: 12mm;
|
||||||
|
}
|
||||||
|
@media print {
|
||||||
|
html,
|
||||||
|
body {
|
||||||
|
width: 210mm;
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
background: #ffffff;
|
||||||
|
color: #111827;
|
||||||
|
font-size: 10.8px;
|
||||||
|
line-height: 1.3;
|
||||||
|
}
|
||||||
|
.page {
|
||||||
|
max-width: none;
|
||||||
|
width: 100%;
|
||||||
|
margin: 0;
|
||||||
|
border: 0;
|
||||||
|
border-radius: 0;
|
||||||
|
box-shadow: none;
|
||||||
|
overflow: visible;
|
||||||
|
}
|
||||||
|
.hero {
|
||||||
|
padding: 14px 16px 12px;
|
||||||
|
}
|
||||||
|
.hero h1 {
|
||||||
|
font-size: 22px;
|
||||||
|
}
|
||||||
|
.invoice-card {
|
||||||
|
min-width: 160px;
|
||||||
|
padding: 10px 12px;
|
||||||
|
}
|
||||||
|
.invoice-card .number {
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
.content {
|
||||||
|
padding: 14px 16px 16px;
|
||||||
|
}
|
||||||
|
.info-grid,
|
||||||
|
.summary-grid {
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
.info-grid {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.info-card,
|
||||||
|
.payment-card,
|
||||||
|
.totals-card,
|
||||||
|
.tax-banner {
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
.tax-banner {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.items-table {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.items-table thead th,
|
||||||
|
.items-table tbody td {
|
||||||
|
padding: 6px 7px;
|
||||||
|
}
|
||||||
|
.bank-list {
|
||||||
|
margin-top: 8px;
|
||||||
|
gap: 4px;
|
||||||
|
}
|
||||||
|
.totals-row {
|
||||||
|
padding: 4px 0;
|
||||||
|
}
|
||||||
|
.totals-row.total {
|
||||||
|
margin-top: 3px;
|
||||||
|
padding-top: 6px;
|
||||||
|
}
|
||||||
|
.footer {
|
||||||
|
margin-top: 10px;
|
||||||
|
padding-top: 8px;
|
||||||
|
font-size: 9.4px;
|
||||||
|
}
|
||||||
|
.hero,
|
||||||
|
.info-grid,
|
||||||
|
.info-card,
|
||||||
|
.tax-banner,
|
||||||
|
.summary-grid,
|
||||||
|
.payment-card,
|
||||||
|
.totals-card,
|
||||||
|
.footer {
|
||||||
|
page-break-inside: avoid;
|
||||||
|
break-inside: avoid;
|
||||||
|
}
|
||||||
|
.summary-grid {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
.items-table {
|
||||||
|
page-break-inside: auto;
|
||||||
|
}
|
||||||
|
.items-table thead {
|
||||||
|
display: table-header-group;
|
||||||
|
}
|
||||||
|
.items-table tr {
|
||||||
|
page-break-inside: avoid;
|
||||||
|
break-inside: avoid;
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
@ -327,10 +434,7 @@
|
|||||||
|
|
||||||
{{orderedByBlock}}
|
{{orderedByBlock}}
|
||||||
|
|
||||||
<div class="tax-banner">
|
{{taxTreatmentBlock}}
|
||||||
<div class="tax-banner-title">Steuerhinweis</div>
|
|
||||||
<p><strong>{{taxLabel}}</strong> ({{vatRateDisplay}})</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<table class="items-table">
|
<table class="items-table">
|
||||||
<thead>
|
<thead>
|
||||||
|
|||||||
@ -21,7 +21,7 @@
|
|||||||
border: 1px solid #dbe3f0;
|
border: 1px solid #dbe3f0;
|
||||||
border-radius: 20px;
|
border-radius: 20px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
box-shadow: 0 24px 60px -38px rgba(15, 23, 42, 0.35);
|
box-shadow: none;
|
||||||
}
|
}
|
||||||
.hero {
|
.hero {
|
||||||
padding: 34px 38px 28px;
|
padding: 34px 38px 28px;
|
||||||
@ -161,6 +161,9 @@
|
|||||||
margin: 0;
|
margin: 0;
|
||||||
color: #334155;
|
color: #334155;
|
||||||
}
|
}
|
||||||
|
.tax-banner:empty {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
.items-table {
|
.items-table {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
border-collapse: collapse;
|
border-collapse: collapse;
|
||||||
@ -277,6 +280,110 @@
|
|||||||
text-align: left;
|
text-align: left;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@page {
|
||||||
|
size: A4;
|
||||||
|
margin: 12mm;
|
||||||
|
}
|
||||||
|
@media print {
|
||||||
|
html,
|
||||||
|
body {
|
||||||
|
width: 210mm;
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
background: #ffffff;
|
||||||
|
color: #111827;
|
||||||
|
font-size: 10.8px;
|
||||||
|
line-height: 1.3;
|
||||||
|
}
|
||||||
|
.page {
|
||||||
|
max-width: none;
|
||||||
|
width: 100%;
|
||||||
|
margin: 0;
|
||||||
|
border: 0;
|
||||||
|
border-radius: 0;
|
||||||
|
box-shadow: none;
|
||||||
|
overflow: visible;
|
||||||
|
}
|
||||||
|
.hero {
|
||||||
|
padding: 14px 16px 12px;
|
||||||
|
}
|
||||||
|
.hero h1 {
|
||||||
|
font-size: 22px;
|
||||||
|
}
|
||||||
|
.invoice-card {
|
||||||
|
min-width: 160px;
|
||||||
|
padding: 10px 12px;
|
||||||
|
}
|
||||||
|
.invoice-card .number {
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
.content {
|
||||||
|
padding: 14px 16px 16px;
|
||||||
|
}
|
||||||
|
.info-grid,
|
||||||
|
.summary-grid {
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
.info-grid {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.info-card,
|
||||||
|
.payment-card,
|
||||||
|
.totals-card,
|
||||||
|
.tax-banner {
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
.tax-banner {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.items-table {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.items-table thead th,
|
||||||
|
.items-table tbody td {
|
||||||
|
padding: 6px 7px;
|
||||||
|
}
|
||||||
|
.bank-list {
|
||||||
|
margin-top: 8px;
|
||||||
|
gap: 4px;
|
||||||
|
}
|
||||||
|
.totals-row {
|
||||||
|
padding: 4px 0;
|
||||||
|
}
|
||||||
|
.totals-row.total {
|
||||||
|
margin-top: 3px;
|
||||||
|
padding-top: 6px;
|
||||||
|
}
|
||||||
|
.footer {
|
||||||
|
margin-top: 10px;
|
||||||
|
padding-top: 8px;
|
||||||
|
font-size: 9.4px;
|
||||||
|
}
|
||||||
|
.hero,
|
||||||
|
.info-grid,
|
||||||
|
.info-card,
|
||||||
|
.tax-banner,
|
||||||
|
.summary-grid,
|
||||||
|
.payment-card,
|
||||||
|
.totals-card,
|
||||||
|
.footer {
|
||||||
|
page-break-inside: avoid;
|
||||||
|
break-inside: avoid;
|
||||||
|
}
|
||||||
|
.summary-grid {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
.items-table {
|
||||||
|
page-break-inside: auto;
|
||||||
|
}
|
||||||
|
.items-table thead {
|
||||||
|
display: table-header-group;
|
||||||
|
}
|
||||||
|
.items-table tr {
|
||||||
|
page-break-inside: avoid;
|
||||||
|
break-inside: avoid;
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
@ -327,10 +434,7 @@
|
|||||||
|
|
||||||
{{orderedByBlock}}
|
{{orderedByBlock}}
|
||||||
|
|
||||||
<div class="tax-banner">
|
{{taxTreatmentBlock}}
|
||||||
<div class="tax-banner-title">Tax treatment</div>
|
|
||||||
<p><strong>{{taxLabel}}</strong> ({{vatRateDisplay}})</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<table class="items-table">
|
<table class="items-table">
|
||||||
<thead>
|
<thead>
|
||||||
@ -370,4 +474,4 @@
|
|||||||
</section>
|
</section>
|
||||||
</div>
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>>
|
||||||
Loading…
Reference in New Issue
Block a user