1
0
mirror of https://github.com/invoiceninja/invoiceninja.git synced 2024-11-10 21:22:58 +01:00

Merge pull request #9001 from turbo124/v5-develop

v5.7.55
This commit is contained in:
David Bomba 2023-11-29 10:11:44 +11:00 committed by GitHub
commit 61466df9e4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
21 changed files with 2869 additions and 49 deletions

View File

@ -1 +1 @@
5.7.54
5.7.55

View File

@ -95,7 +95,6 @@ class PreviewController extends BaseController
}
/**
* Returns the mocked PDF for the invoice design preview.
*
@ -108,6 +107,10 @@ class PreviewController extends BaseController
{
$start = microtime(true);
if($request->has('entity_type') && in_array($request->entity_type, ['payment_receipt', 'payment_refund', 'statement', 'delivery_note'])) {
return $this->liveTemplate($request->all());
}
/** @var \App\Models\User $user */
$user = auth()->user();
@ -234,6 +237,44 @@ class PreviewController extends BaseController
return $this->blankEntity();
}
private function liveTemplate(array $request_data)
{
nlog($request_data['entity_type']);
/** @var \App\Models\User $user */
$user = auth()->user();
/** @var \App\Models\Company $company */
$company = $user->company();
$design = \App\Models\Design::query()
->where('id', $request_data['design_id'])
->where(function ($q) use ($user){
$q->whereNull('company_id')->orWhere('company_id', $user->companyId());
})
->first();
$ts = (new TemplateService($design));
try {
if(isset($request_data['settings']) && is_array($request_data['settings'])) {
$ts->setSettings(json_decode(json_encode($request_data['settings'])));
}
$ts->setCompany($company)
->compose()
->mock();
} catch(SyntaxError $e) {
// return response()->json(['message' => 'Twig syntax is invalid.', 'errors' => new \stdClass], 422);
}
$response = Response::make($ts->getPdf(), 200);
$response->header('Content-Type', 'application/pdf');
return $response;
}
private function template()
{
@ -256,31 +297,11 @@ class PreviewController extends BaseController
// return response()->json(['message' => 'Twig syntax is invalid.', 'errors' => new \stdClass], 422);
}
$html = $ts->getHtml();
if (request()->query('html') == 'true') {
return $html;
return $ts->getHtml();
}
if (config('ninja.phantomjs_pdf_generation') || config('ninja.pdf_generator') == 'phantom') {
return (new Phantom)->convertHtmlToPdf($html);
}
if (config('ninja.invoiceninja_hosted_pdf_generation') || config('ninja.pdf_generator') == 'hosted_ninja') {
$pdf = (new NinjaPdf())->build($html);
$numbered_pdf = $this->pageNumbering($pdf, $company);
if ($numbered_pdf) {
$pdf = $numbered_pdf;
}
return $pdf;
}
$file_path = (new PreviewPdf($html, $company))->handle();
$response = Response::make($file_path, 200);
$response = Response::make($ts->getPdf(), 200);
$response->header('Content-Type', 'application/pdf');
return $response;

View File

@ -45,12 +45,12 @@ class DesignPreviewRequest extends Request
public function rules()
{
$rules = [
'entity_type' => 'bail|required|in:invoice,quote,credit,purchase_order',
'entity_type' => 'bail|required|in:invoice,quote,credit,purchase_order,statement,payment_receipt,payment_refund,delivery_note',
'settings_type' => 'bail|required|in:company,group,client',
'settings' => 'sometimes',
'group_id' => 'sometimes',
'client_id' => 'sometimes',
'design' => 'bail|sometimes|array'
'design' => 'bail|sometimes|array',
];
return $rules;

View File

@ -113,6 +113,7 @@ class PdfBuilder
$contents = $this->document->getElementsByTagName('ninja');
$template_service = new TemplateService();
$template_service->setCompany($this->service->company);
$data = $template_service->processData($this->service->options)->getData();
$twig = $template_service->twig;

View File

@ -64,8 +64,14 @@ class PdfMock
$pdf_config->setPdfVariables();
$pdf_config->setCurrency(Currency::find($this->settings->currency_id));
$pdf_config->setCountry(Country::find($this->settings->country_id ?: 840));
$pdf_config->design = Design::withTrashed()->find($this->decodePrimaryKey($pdf_config->entity_design_id));
$pdf_config->currency_entity = $this->mock->client;
if(isset($this->request['design_id']) && $design = Design::withTrashed()->find($this->request['design_id'])) {
$pdf_config->design = $design;
$pdf_config->entity_design_id = $design->hashed_id;
}
else
$pdf_config->design = Design::withTrashed()->find($this->decodePrimaryKey($pdf_config->entity_design_id));
$pdf_service->config = $pdf_config;
@ -1389,6 +1395,7 @@ class PdfMock
'$delivery_note_label' => ctrans('texts.delivery_note'),
'$quantity_label' => ctrans('texts.quantity'),
'$order_number_label' => ctrans('texts.order_number'),
'$shipping_label' => ctrans('texts.shipping_address'),
];
}
}

View File

@ -81,6 +81,17 @@ class PdfMaker
$contents = $this->document->getElementsByTagName('ninja');
$ts = new TemplateService();
if(isset($this->data['template']['entity'])){
try{
$entity = $this->data['template']['entity'];
$ts->setCompany($entity->company);
}
catch(\Exception $e){
}
}
$data = $ts->processData($this->options)->getData();
$twig = $ts->twig;

View File

@ -17,6 +17,8 @@ use App\Services\Pdf\PdfMock;
class TemplateMock
{
protected ?object $settings;
public array $engines = [];
public array $variables = [];
@ -74,15 +76,21 @@ class TemplateMock
'entity_type' => rtrim($type, "s"),
'design' => '',
'settings_type' => 'company',
'settings' => $this->company->settings,
'settings' => $this->settings ?? $this->company->settings,
];
$mock = (new PdfMock($data, $this->company));
$mock->settings = $this->company->settings;
$mock->settings = $this->settings ?? $this->company->settings;
$mock->build();
return [$type => $mock->getStubVariables()];
}
public function setSettings($settings): self
{
$this->settings = $settings;
return $this;
}
}

View File

@ -55,11 +55,11 @@ class TemplateService
private array $global_vars = [];
public ?Company $company;
public ?Company $company = null;
private ?Client $client;
private ?Client $client = null;
private ?Vendor $vendor;
private ?Vendor $vendor = null;
private Invoice | Quote | Credit | PurchaseOrder | RecurringInvoice $entity;
@ -67,6 +67,8 @@ class TemplateService
private CommonMarkConverter $commonmark;
private ?object $settings = null;
public function __construct(public ?Design $template = null)
{
$this->template = $template;
@ -167,6 +169,25 @@ class TemplateService
return $this;
}
public function setSettings($settings): self
{
$this->settings = $settings;
return $this;
}
private function getSettings(): object
{
if($this->settings)
return $this->settings;
if($this->client)
return $this->client->getMergedSettings();
return $this->company->settings;
}
public function addGlobal(array $var): self
{
$this->global_vars = array_merge($this->global_vars, $var);
@ -182,7 +203,7 @@ class TemplateService
public function mock(): self
{
$tm = new TemplateMock($this->company);
$tm->init();
$tm->setSettings($this->getSettings())->init();
$this->entity = $this->company->invoices()->first();
@ -218,6 +239,8 @@ class TemplateService
public function getPdf(): string
{
// nlog($this->getHtml());
if (config('ninja.invoiceninja_hosted_pdf_generation') || config('ninja.pdf_generator') == 'hosted_ninja') {
$pdf = (new NinjaPdf())->build($this->compiled_html);
} else {
@ -345,7 +368,7 @@ class TemplateService
*
* @return self
*/
private function compose(): self
public function compose(): self
{
if(!$this->template) {
return $this;
@ -403,19 +426,19 @@ class TemplateService
match ($key) {
'variables' => $processed = $value->first() ?? [],
'invoices' => $processed = (new HtmlEngine($value->first()->invitations()->first()))->generateLabelsAndValues() ?? [],
'quotes' => $processed = (new HtmlEngine($value->first()->invitations()->first()))->generateLabelsAndValues() ?? [],
'credits' => $processed = (new HtmlEngine($value->first()->invitations()->first()))->generateLabelsAndValues() ?? [],
'payments' => $processed = (new PaymentHtmlEngine($value->first(), $value->first()->client->contacts()->first()))->generateLabelsAndValues() ?? [],
'invoices' => $processed = (new HtmlEngine($value->first()->invitations()->first()))->setSettings($this->getSettings())->generateLabelsAndValues() ?? [],
'quotes' => $processed = (new HtmlEngine($value->first()->invitations()->first()))->setSettings($this->getSettings())->generateLabelsAndValues() ?? [],
'credits' => $processed = (new HtmlEngine($value->first()->invitations()->first()))->setSettings($this->getSettings())->generateLabelsAndValues() ?? [],
'payments' => $processed = (new PaymentHtmlEngine($value->first(), $value->first()->client->contacts()->first()))->setSettings($this->getSettings())->generateLabelsAndValues() ?? [],
'tasks' => $processed = [],
'projects' => $processed = [],
'purchase_orders' => (new VendorHtmlEngine($value->first()->invitations()->first()))->generateLabelsAndValues() ?? [],
'purchase_orders' => (new VendorHtmlEngine($value->first()->invitations()->first()))->setSettings($this->getSettings())->generateLabelsAndValues() ?? [],
'aging' => $processed = [],
default => $processed = [],
};
nlog($key);
nlog($processed);
// nlog($key);
// nlog($processed);
return $processed;
@ -1159,7 +1182,7 @@ class TemplateService
$var_set = $this->getVarSet();
$company_details =
collect($this->company->settings->pdf_variables->company_details)
collect($this->getSettings()->pdf_variables->company_details)
->filter(function ($variable) use ($var_set) {
return isset($var_set['values'][$variable]) && !empty($var_set['values'][$variable]);
})
@ -1186,7 +1209,7 @@ class TemplateService
$var_set = $this->getVarSet();
$company_address =
collect($this->company->settings->pdf_variables->company_address)
collect($this->getSettings()->pdf_variables->company_address)
->filter(function ($variable) use ($var_set) {
return isset($var_set['values'][$variable]) && !empty($var_set['values'][$variable]);
})
@ -1251,7 +1274,7 @@ class TemplateService
$var_set = $this->getVarSet();
$client_details =
collect($this->company->settings->pdf_variables->client_details)
collect($this->getSettings()->pdf_variables->client_details)
->filter(function ($variable) use ($var_set) {
return isset($var_set['values'][$variable]) && !empty($var_set['values'][$variable]);
})
@ -1314,7 +1337,7 @@ class TemplateService
$var_set = $this->getVarSet();
$entity_details =
collect($this->company->settings->pdf_variables->{$entity_string_prop})
collect($this->getSettings()->pdf_variables->{$entity_string_prop})
->filter(function ($variable) use ($var_set) {
return isset($var_set['values'][$variable]) && !empty($var_set['values'][$variable]);
})->toArray();
@ -1372,7 +1395,7 @@ class TemplateService
$var_set = $this->getVarSet();
$vendor_details =
collect($this->company->settings->pdf_variables->vendor_details)
collect($this->getSettings()->pdf_variables->vendor_details)
->filter(function ($variable) use ($var_set) {
return isset($var_set['values'][$variable]) && !empty($var_set['values'][$variable]);
})->when(!$include_labels, function ($collection) {

View File

@ -90,6 +90,12 @@ class HtmlEngine
$this->helpers = new Helpers();
}
public function setSettings($settings): self
{
$this->settings = $settings;
return $this;
}
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////
@ -138,7 +144,8 @@ class HtmlEngine
$data['$app_url'] = ['value' => $this->generateAppUrl(), 'label' => ''];
$data['$from'] = ['value' => '', 'label' => ctrans('texts.from')];
$data['$to'] = ['value' => '', 'label' => ctrans('texts.to')];
$data['$ship_to'] = ['value' => '', 'label' => ctrans('texts.ship_to')];
$data['$shipping'] = ['value' => '', 'label' => ctrans('texts.ship_to')];
$data['$total_tax_labels'] = ['value' => $this->totalTaxLabels(), 'label' => ctrans('texts.taxes')];
$data['$total_tax_values'] = ['value' => $this->totalTaxValues(), 'label' => ctrans('texts.taxes')];
$data['$line_tax_labels'] = ['value' => $this->lineTaxLabels(), 'label' => ctrans('texts.taxes')];
@ -147,6 +154,7 @@ class HtmlEngine
$data['$status_logo'] = ['value' => ' ', 'label' => ' '];
$data['$delivery_note'] = ['value' => ' ', 'label' => ctrans('texts.delivery_note')];
$data['$receipt'] = ['value' => ' ', 'label' => ctrans('texts.receipt')];
$data['$shipping'] = ['value' => ' ', 'label' => ctrans('texts.ship_to')];
$data['$invoice.date'] = &$data['$date'];
$data['$invoiceDate'] = &$data['$date'];

View File

@ -45,6 +45,13 @@ class PaymentHtmlEngine
$this->helpers = new Helpers();
}
public function setSettings($settings):self
{
$this->settings = $settings;
return $this;
}
public function makePaymentVariables()
{
App::forgetInstance('translator');

View File

@ -83,6 +83,13 @@ class VendorHtmlEngine
$this->helpers = new Helpers();
}
public function setSettings($settings):self
{
$this->settings = $settings;
return $this;
}
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////

View File

@ -17,8 +17,8 @@ return [
'require_https' => env('REQUIRE_HTTPS', true),
'app_url' => rtrim(env('APP_URL', ''), '/'),
'app_domain' => env('APP_DOMAIN', 'invoicing.co'),
'app_version' => env('APP_VERSION', '5.7.54'),
'app_tag' => env('APP_TAG', '5.7.54'),
'app_version' => env('APP_VERSION', '5.7.55'),
'app_tag' => env('APP_TAG', '5.7.55'),
'minimum_client_version' => '5.0.16',
'terms_version' => '1.0.1',
'api_secret' => env('API_SECRET', false),

View File

@ -0,0 +1,254 @@
<!DOCTYPE html>
<html>
<!-- Basic Statement Design -->
<head>
<style>
body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-family: $font_name, Helvetica, sans-serif;
font-size: $font_sizepx !important;
zoom: 80%;
}
@page {
margin: 0 !important;
size: $page_size $page_layout;
}
p {
margin: 0;
padding: 0;
line-height: 1.5;
white-space: nowrap;
}
table {
margin-top: 2rem;
min-width: 100%;
table-layout: fixed;
overflow-wrap: break-word;
}
th {
text-align: center;
padding-left: 6px;
padding-right: 6px;
padding-top: 6px;
padding-bottom: 6px;
}
td {
text-align: center;
padding-left: 6px;
padding-right: 6px;
padding-top: 6px;
padding-bottom: 6px;
}
.item-row {
border-bottom: 1px #000 dotted;
}
.totals-row-label {
text-align: right;
white-space: nowrap;
}
.totals-row-value {
text-align: right;
white-space: nowrap;
}
.table-totals {
display: grid;
grid-template-columns: 2fr 1fr;
}
.entity-container {
margin-left: auto;
margin-right: auto;
border: 0px solid #000;
}
.entity-container h2 {
text-align: center;
}
span {
padding-right: 5px;
width: 100%;
}
.label {
text-align: right;
padding: 0;
margin-right: 1rem;
}
.value {
text-align: left;
padding: 0;
}
.two-col-grid {
display: grid;
grid-template-columns: 1fr 1fr;
borderx: 1px solid #000;
}
#statement-details {
margin: auto;
}
#client-details {
margin-left: auto;
margin-right: auto;
}
#company-details {
margin-left: auto;
margin-right: auto;
}
</style>
</head>
<body>
<!-- Header -->
<div class="two-col-grid">
<div id="client-details"></div>
<div id="company-details"></div>
</div>
<!-- Details -->
<div class="two-col-grid">
<div>
</div>
<div id="statement-details">
<ninja>
<h2>{{ t('statement') }}</h2>
<p>$start_date - $end_date</p>
</ninja>
</div>
</div>
<ninja>
{% if invoices|e %}
<div class="entity-container">
<h2>{{ t('invoices') }}<h2>
<table width="100%" cellspacing="0" cellpadding="0" class="">
<thead class="">
<tr class="">
<th class="">{{ t('invoice')}} #</th>
<th class="">{{ t('invoice_date') }}</th>
<th class="">{{ t('invoice_due_date') }}</th>
<th class="">{{ t('total') }}</th>
<th class="">{{ t('balance') }}</th>
</tr>
</thead>
<tbody>
{% for invoice in invoices %}
<tr class="item-row">
<td class="">{{ invoice.number }}</td>
<td class="">{{ invoice.date }}</td>
<td class="">{{ invoice.due_date }}</td>
<td class="">{{ invoice.amount }}</td>
<td class="">{{ invoice.balance }}</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% endif %}
</ninja>
<ninja>
{% if payments|e %}
<div class="entity-container">
<h2>{{ t('payments') }}<h2>
<table width="100%" cellspacing="0" cellpadding="0" class="">
<thead class="">
<tr class="">
<th class="">{{ t('invoice') }} #</th>
<th class="">{{ t('payment_date') }}</th>
<th class="">{{ t('method') }}</th>
<th class="">{{ t('amount') }}</th>
</tr>
</thead>
<tbody>
{% for payment in payments %}
<tr class="item-row">
<td class="">{{ payment.number }}</td>
<td class="">{{ payment.date }}</td>
{%if payment.is_credit %}
<td class="">Credit {{ payment.number }}</td>
{%else%}
<td class="">{{ payment.method }}</td>
{%endif%}
<td class="">{{ payment.amount }}</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% endif %}
</ninja>
<ninja>
{% if credits|e %}
<div class="entity-container">
<h2>Credits<h2>
<table width="100%" cellspacing="0" cellpadding="0" class="">
<thead class="">
<tr class="">
<th class="">{{ t('credit') }} #</th>
<th class="">{{ t('credit_date') }}</th>
<th class="">{{ t('total') }}</th>
<th class="">{{ t('balance') }}</th>
</tr>
</thead>
<tbody>
{% for credit in credits %}
<tr class="item-row">
<td class="">{{ credit.number }}</td>
<td class="">{{ credit.date }}</td>
<td class="">{{ credit.amount }}</td>
<td class="">{{ credit.balance }}</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% endif %}
</ninja>
<ninja>
{% if aging %}
<div class="entity-container">
<h2>{{ t('aging') }}<h2>
<table width="100%" cellspacing="0" cellpadding="0" class="">
<thead class="">
<tr class="">
{% for key, age in aging %}
<th class="">{{ key }}</th>
{% endfor %}
</tr>
</thead>
<tbody>
<tr class="item-row">
{% for key, age in aging %}
<td>{{ age }}</td>
{% endfor %}
</tr>
</tbody>
</table>
</div>
{% endif %}
</ninja>
</body>
</html>

View File

@ -0,0 +1,550 @@
<html>
<head>
<title>Refund #$number</title>
<style>
@import url($font_url);
:root {
--primary-color: $primary_color;
--secondary-color: $secondary_color;
--line-height: 1.6;
}
body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-family: $font_name, Helvetica, sans-serif;
font-size: $font_sizepx !important;
zoom: 80%;
}
@page {
margin: 0 !important;
size: $page_size $page_layout;
}
</style>
</head>
<body style="padding-top:2rem;">
<ninja>
{%set payment = payments|first %}
{%set pivot = payment.paymentables|filter(pivot => pivot.refunded_raw > 0)|first %}
<table align="center" bgcolor="#ffffff" border="0" cellpadding="0" cellspacing="0" width="600"
style="border-top-left-radius:16px;border-top-right-radius:16px;margin:0 auto;min-width:600px">
<tbody>
<tr>
<td style="border:0;margin:0;padding:0">
<table border="0" cellpadding="0" cellspacing="0" width="600" style="min-width:600px">
<tbody>
<tr>
<td align="center" height="0"
style="border:0;margin:0;padding:0;color:#ffffff;display:none!important;font-size:1px;line-height:1px;max-height:0;max-width:0;opacity:0;overflow:hidden">
<span style="color:#ffffff;text-decoration:none;">$refund_label{{ pivot.refunded
}}
$date_label {{ pivot.updated_at }}</span>
</td>
</tr>
</tbody>
</table>
<div
style="background-color:$primary_color;padding-top:20px; padding-bottom:20px; border-radius:5px;">
<table dir="ltr" width="100%"
style="border:0;border-collapse:collapse;margin:0;padding:0;background-color:#ffffff">
<tbody>
<tr>
<td style="background-color:$primary_color;border:0;border-collapse:collapse;margin:0;padding:0;font-size:0;line-height:0px;background-size:100% 100%;"
align="center" valign="center" width="600" height="152">
{{ img('$company.logo','max-width: $company_logo_size; max-height: 100px;
vertical-align: middle;') }}
</td>
</tr>
</tbody>
</table>
</div>
<table border="0" cellpadding="0" cellspacing="0" width="600" style="min-width:600px">
<tr>
<td height="10"></td>
</tr>
</table>
<table border="0" cellpadding="0" cellspacing="0" width="600" style="min-width:600px">
<tbody>
<tr>
<td align="center"
style="border:0;border-collapse:collapse;margin:0;padding:0;width:472px;vertical-align:middle;color:#32325d;font-size:24px;line-height:32px">
$refund_label #$number
</td>
</tr>
<tr>
<td colspan="3" height="12"
style="border:0;margin:0;padding:0;font-size:1px;line-height:1px">
<div>&nbsp;</div>
</td>
</tr>
</tbody>
</table>
<ninja>
{%set payment = payments|first %}
{%if payment.transaction_reference %}
<table class="" width="100%"
style="border:0;border-collapse:collapse;margin:0;padding:0;background-color:#ffffff">
<tbody>
<tr>
<td class="" width="64"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
<td class="Content" align="center"
style="border:0;border-collapse:collapse;margin:0;padding:0;width:472px;vertical-align:middle;color:#8898aa;font-size:15px;line-height:18px">
<span class="il">$reference_label:</span> {{ payment.transaction_reference
}}
</td>
<td class="" width="64"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
</tbody>
</table>
{% endif %}
</ninja>
<table border="0" cellpadding="0" cellspacing="0" width="600" style="min-width:600px">
<tbody>
<tr>
<td align="center"
style="border:0;border-collapse:collapse;margin:0;padding:0;width:472px;vertical-align:middle;color:#8898aa;font-size:15px;line-height:18px">
<span></span>
</td>
</tr>
<tr>
<td colspan="3" height="12"
style="border:0;margin:0;padding:0;font-size:1px;line-height:1px">
<div>&nbsp;</div>
</td>
</tr>
</tbody>
</table>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td height="20"
style="border:0;margin:0;padding:0;font-size:1px;line-height:1px;max-height:1px">
<div>&nbsp;</div>
</td>
</tr>
</tbody>
</table>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td
style="border:0;margin:0;padding:0;color:#687385;font-size:12px;font-weight:bold;line-height:16px;text-transform:uppercase">
</td>
<td width="64"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
<td valign="top" style="border:0;border-collapse:collapse;margin:0;padding:0">
<table style="border:0;border-collapse:collapse;margin:0;padding:0">
<tbody>
<tr>
<td
style="border:0;border-collapse:collapse;margin:0;padding:0;vertical-align:middle;color:#8898aa;font-size:12px;line-height:16px;white-space:nowrap;font-weight:bold;text-transform:uppercase">
$refunded_label
</td>
</tr>
<tr>
<td
style="border:0;border-collapse:collapse;margin:0;padding:0;vertical-align:middle;color:#525f7f;font-size:15px;line-height:24px;white-space:nowrap">
{{ payment.refunded }}
</td>
</tr>
</tbody>
</table>
</td>
<td width="20"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
<td valign="top" style="border:0;border-collapse:collapse;margin:0;padding:0">
<table style="border:0;border-collapse:collapse;margin:0;padding:0">
<tbody>
<tr>
<td
style="border:0;border-collapse:collapse;margin:0;padding:0;vertical-align:middle;color:#8898aa;font-size:12px;line-height:16px;white-space:nowrap;font-weight:bold;text-transform:uppercase">
$refund_label $date_label
</td>
</tr>
<tr>
<td
style="border:0;border-collapse:collapse;margin:0;padding:0;vertical-align:middle;color:#525f7f;font-size:15px;line-height:24px;white-space:nowrap">
{{ payment.updated_at}}
</td>
</tr>
</tbody>
</table>
</td>
<td width="20"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
<td valign="top" style="border:0;border-collapse:collapse;margin:0;padding:0">
<table style="border:0;border-collapse:collapse;margin:0;padding:0">
<tbody>
<tr>
<td
style="border:0;border-collapse:collapse;margin:0;padding:0;vertical-align:middle;color:#8898aa;font-size:12px;line-height:16px;white-space:nowrap;font-weight:bold;text-transform:uppercase">
$method_label
</td>
</tr>
<tr>
<td
style="border:0;border-collapse:collapse;margin:0;padding:0;vertical-align:middle;color:#525f7f;font-size:15px;line-height:24px;white-space:nowrap">
{% if payment.method %}
<span>
{{ payment.method }}
</span>
{% else %}
<span
style="width:100%; min-width:100%; display:block; text-align:center;">
-
</span>
{% endif %}
</td>
</tr>
</tbody>
</table>
</td>
<td width="64"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
</tbody>
</table>
<table border="0" cellpadding="0" cellspacing="0" width="600" style="min-width:600px">
<tbody>
<tr>
<td colspan="3" height="24"
style="border:0;margin:0;padding:0;font-size:1px;line-height:1px;max-height:1px">
<div>&nbsp;</div>
</td>
</tr>
<tr>
<td style="border:0;margin:0;padding:0;font-size:1px;line-height:1px;max-height:1px"
width="48">
<div>&nbsp;</div>
</td>
<td bgcolor="#e6ebf1" height="1"
style="border:0;margin:0;padding:0;font-size:1px;line-height:1px;max-height:1px">
<div>&nbsp;</div>
</td>
<td style="border:0;margin:0;padding:0;font-size:1px;line-height:1px;max-height:1px"
width="48">
<div>&nbsp;</div>
</td>
</tr>
<tr>
<td colspan="3" height="24"
style="border:0;margin:0;padding:0;font-size:1px;line-height:1px;max-height:1px">
<div>&nbsp;</div>
</td>
</tr>
</tbody>
</table>
<table border="0" cellpadding="0" cellspacing="0" width="600" style="min-width:600px">
<tbody>
<tr>
<td colspan="3" height="24"
style="border:0;margin:0;padding:0;font-size:1px;line-height:1px">
<div>&nbsp;</div>
</td>
</tr>
<tr>
<td style="border:0;margin:0;padding:0;font-size:1px;line-height:1px" width="48">
<div>&nbsp;</div>
</td>
<td style="border:0;margin:0;padding:0">
<table bgcolor="#f6f9fc" border="0" cellpadding="0" cellspacing="0"
style="border-radius:8px" width="100%">
<tbody>
<tr>
<td style="border:0;margin:0;padding:0">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td colspan="3" height="12"
style="border:0;margin:0;padding:0;font-size:1px;line-height:1px">
<div>&nbsp;</div>
</td>
</tr>
<tr>
<td style="border:0;margin:0;padding:0;font-size:1px;line-height:1px"
width="16">
<div>&nbsp;</div>
</td>
<td
style="border:0;margin:0;padding:0;color:#414552;font-size:16px;line-height:24px">
<table
style="padding-left:5px;padding-right:5px"
width="100%">
<tbody>
<tr>
<td></td>
</tr>
{% set totalInvoices = 0 %}
{% set totalRefunds = 0 %}
{% for pivot in
payment.paymentables|filter((pivot) =>
(pivot.is_credit == '0'
and pivot.refunded_raw > 0)) %}
<tr>
<td
style="white-space:nowrap;border:0;border-collapse:collapse;margin:0;padding:0;vertical-align:middle;color:#525f7f;font-size:15px;line-height:24px;width:100%">
Invoice: #{{ pivot.invoice }}
({{ pivot.amount }})
</td>
<td width="8"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
<td align="right" width="50"
valign="top"
style="white-space:nowrap;border:0;border-collapse:collapse;margin:0;padding:0;vertical-align:middle;color:#525f7f;font-size:15px;line-height:24px">
$refunded_label {{
pivot.refunded }}
</td>
</tr>
{% set totalInvoices = totalInvoices +
pivot.amount_raw %}
{% set totalRefunds = totalRefunds +
pivot.refunded_raw %}
{% endfor %}
<tr>
<td colspan="3" height="6"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
<tr>
<td colspan="3" height="6"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
<tr>
<td bgcolor="e6ebf1" colspan="3"
height="1"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
<tr>
<td colspan="3" height="8"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
<tr>
<td
style="border:0;border-collapse:collapse;margin:0;padding:0;vertical-align:middle;color:#525f7f;font-size:15px;line-height:24px;width:100%">
$total_label $invoices_label
</td>
<td width="8"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
<td align="right" valign="top"
style="border:0;border-collapse:collapse;margin:0;padding:0;vertical-align:middle;color:#525f7f;font-size:15px;line-height:24px">
{{
totalInvoices|format_currency(currency_code)
}}
</td>
</tr>
<tr>
<td colspan="3" height="6"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
<tr>
<td
style="border:0;border-collapse:collapse;margin:0;padding:0;vertical-align:middle;color:#525f7f;font-size:15px;line-height:24px;width:100%">
$total_label $refunded_label
</td>
<td width="8"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
<td align="right" valign="top"
style="border:0;border-collapse:collapse;margin:0;padding:0;vertical-align:middle;color:#525f7f;font-size:15px;line-height:24px">
{{ payment.refunded }}
</td>
</tr>
<tr>
<td colspan="3" height="6"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
<tr>
<td colspan="3" height="6"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
</tbody>
</table>
</td>
<td style="border:0;margin:0;padding:0;font-size:1px;line-height:1px"
width="16">
<div>&nbsp;</div>
</td>
</tr>
<tr>
<td colspan="3" height="12"
style="border:0;margin:0;padding:0;font-size:1px;line-height:1px">
<div>&nbsp;</div>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
<td style="border:0;margin:0;padding:0;font-size:1px;line-height:1px" width="48">
<div>&nbsp;</div>
</td>
</tr>
<tr>
<td colspan="3" height="24"
style="border:0;margin:0;padding:0;font-size:1px;line-height:1px">
<div>&nbsp;</div>
</td>
</tr>
</tbody>
</table>
{% if payment.refund_activity %}
<table border="0" cellpadding="0" cellspacing="0" width="600" style="min-width:600px">
<tbody>
<tr>
<td colspan="3" height="8"
style="border:0;margin:0;padding:0;font-size:1px;line-height:1px">
<div>&nbsp;</div>
</td>
</tr>
<tr>
<td style="border:0;margin:0;padding:0;font-size:1px;line-height:1px" width="48">
<div>&nbsp;</div>
</td>
<td
style="border:0;margin:0;padding:0;color:#687385;font-weight:400;font-size:12px;line-height:16px;text-transform:uppercase">
<span style="border:0;margin:0;padding:0;font-weight:bold">
History
</span>
</td>
<td style="border:0;margin:0;padding:0;font-size:1px;line-height:1px" width="48">
<div>&nbsp;</div>
</td>
</tr>
<tr>
<td colspan="3" height="8"
style="border:0;margin:0;padding:0;font-size:1px;line-height:1px">
<div>&nbsp;</div>
</td>
</tr>
</tbody>
</table>
<table border="0" cellpadding="0" cellspacing="0" width="600" style="min-width:600px">
<tbody>
<tr>
<td colspan="3" height="24"
style="border:0;margin:0;padding:0;font-size:1px;line-height:1px">
<div>&nbsp;</div>
</td>
</tr>
<tr>
<td style="border:0;margin:0;padding:0;font-size:1px;line-height:1px" width="48">
<div>&nbsp;</div>
</td>
<td style="border:0;margin:0;padding:0">
<table bgcolor="#f6f9fc" border="0" cellpadding="0" cellspacing="0"
style="border-radius:8px" width="100%">
<tbody>
<tr>
<td style="border:0;margin:0;padding:0">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td colspan="3" height="12"
style="border:0;margin:0;padding:0;font-size:1px;line-height:1px">
<div>&nbsp;</div>
</td>
</tr>
<tr>
<td style="border:0;margin:0;padding:0;font-size:1px;line-height:1px"
width="16">
<div>&nbsp;</div>
</td>
<td
style="border:0;margin:0;padding:0;color:#414552;font-size:16px;line-height:24px">
<table
style="padding-left:5px;padding-right:5px"
width="100%">
<tbody>
<tr>
<td></td>
</tr>
{% for activity in
payment.refund_activity %}
<tr>
<td
style="white-space:nowrap;border:0;border-collapse:collapse;margin:0;padding:0;vertical-align:middle;color:#525f7f;font-size:15px;line-height:24px;width:100%">
{{ activity }}
</td>
<td width="8"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
<td align="right" width="50"
valign="top"
style="white-space:nowrap;border:0;border-collapse:collapse;margin:0;padding:0;vertical-align:middle;color:#525f7f;font-size:15px;line-height:24px">
</td>
</tr>
{% endfor %}
</tbody>
</table>
</td>
<td style="border:0;margin:0;padding:0;font-size:1px;line-height:1px"
width="16">
<div>&nbsp;</div>
</td>
</tr>
<tr>
<td colspan="3" height="12"
style="border:0;margin:0;padding:0;font-size:1px;line-height:1px">
<div>&nbsp;</div>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
<td style="border:0;margin:0;padding:0;font-size:1px;line-height:1px" width="48">
<div>&nbsp;</div>
</td>
</tr>
<tr>
<td colspan="3" height="24"
style="border:0;margin:0;padding:0;font-size:1px;line-height:1px">
<div>&nbsp;</div>
</td>
</tr>
</tbody>
</table>
{% endif %}
</td>
</tr>
</tbody>
</table>
</ninja>
</body>
</html>

View File

@ -0,0 +1,186 @@
<!doctype html>
<html>
<!-- Refund -->
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
@import url($font_url);
@page {
padding-top: 0;
padding-bottom: 0;
margin-top: 0;
margin-bottom: 0;
size: A5 landscape;
/* size: 210mm 75mm; */
border: 0px solid #000;
}
body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-family: $font_name, Helvetica, sans-serif;
font-size: $font_sizepx !important;
zoom: 80%;
}
.centered {
text-align: center;
}
p {
margin: 0;
padding: 0;
}
.two-col-grid {
display: grid;
grid-template-columns: 1fr 1fr;
}
.four-col-grid {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
}
.key-value-grid {
display: grid;
grid-template-columns: 1fr 4fr;
}
.primary-color-highlight {
color: $primary_color;
}
.secondary-color-highlight {
color: $secondary_color;
}
.company-logo {
max-width: $company_logo_size;
max-height: 100px;
vertical-align: middle;
}
.border {
border: 1px solid #000;
}
.zero {
margin: 0;
padding: 0;
}
.pull-left {
margin-left: 0;
margin-right: auto;
}
.pull-right {
margin-left: auto;
margin-right: 0;
}
.italic {
font-style: italic;
}
.bottom-border {
border-bottom: 1px solid $primary_color;
}
</style>
</head>
<body>
<ninja>
<div class="two-col-grid">
<div class="pull-left">
<h1 class="primary-color-highlight" style="margin-top:0; margin-bottom:0rem;">$refund_label {% if
payments|length == 1%}#$number {% endif %}</h2>
</div>
<div class="pull-right">{{ img('$company.logo','max-width: $company_logo_size; max-height: 100px;
vertical-align: middle;') }}</div>
</div>
</ninja>
<div class="two-col-grid">
<div class="pull-left">
<h4 class="italic" style="margin-bottom:0.5rem;">$to_label</h3>
<p style="margin-bottom:0.5rem;">$client.name</p>
<ninja>
{% set payment = payments|first %}
{% if payment.client.vat_number %}
<p>$vat_number_label: $vat_number</p>
{% endif %}
</ninja>
</div>
<div class="pull-right">
<!-- <h3 class="secondary-color-highlight zero italic">$to_label</h3>
<p>$company.name</p> -->
</div>
</div>
<div class="" style="margin-top:20px;">
<ninja>
{% if payments|e %}
{% set totalInvoices = 0 %}
{% set totalRefunds = 0 %}
{% for payment in payments %}
{% for pivot in payment.paymentables|filter((pivot) => (pivot.is_credit == '0' and pivot.refunded_raw > 0))
%}
<div class="two-col-grid bottom-border" style="padding:2px; padding:5px;">
<div style="display:flex;">
<p class="primary-color-highlight">$invoice_label #{{ pivot.invoice }}</p>
<p class="primary-color-highlight" style="padding-left:1rem;"> ({{ pivot.amount }})</p>
</div>
<div style="display:flex;">
<p>{{ pivot.refunded }}</p>
<p style="padding-left:1rem;">($refund_label)</p>
</div>
<div>
</div>
<div>
</div>
</div>
{% set totalInvoices = totalInvoices + pivot.amount_raw %}
{% set totalRefunds = totalRefunds + pivot.refunded_raw %}
{% endfor %}
{% endfor %}
<div class="four-col-grid bottom-border" style="padding:2px; padding:5px;">
<div style="display:flex; margin-top:1rem">
<p class="primary-color-highlight">$invoices_label:</p>
</div>
<div style="display:flex; margin-top:1rem;">
<p style="">{{ totalInvoices|format_currency(currency_code) }}</p>
</div>
<div style="display:flex; margin-top:1rem">
<p class="primary-color-highlight">$refund_label:</p>
</div>
<div style="display:flex; margin-top:1rem;">
<p style="">{{ totalRefunds|format_currency(currency_code) }}</p>
</div>
</div>
{% endif %}
</ninja>
</div>
<div class="two-col-grid"
style="margin-top: 1rem; position:absolute; bottom: 0; width:100%; margin-right:0rem !important; padding-right:0rem;">
<div id="company-details" class="pull-left" style="padding-bottom:1rem;">
<!-- <h3>$company.name</h3> -->
</div>
<div class="pull-right" style="padding-right:1rem;">
<p>$public_notes</p>
</div>
</div>
</body>
</html>

View File

@ -0,0 +1,273 @@
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
@import url($font_url);
@page {
padding-top: 0;
padding-bottom: 0;
margin-top: 0;
margin-bottom: 0;
size: $page_size $page_layout;
}
body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-family: $font_name, Helvetica, sans-serif;
font-size: $font_sizepx !important;
zoom: 80%;
}
table {
margin-bottom: 0rem;
min-width: 100%;
table-layout: fixed;
overflow-wrap: break-word;
}
.table-header>tr>th {
border-bottom: solid 1px #efefef;
}
.table-body>tr>td {
border-bottom: solid 1px #efefef;
}
th {
text-align: left;
padding-left: 6px;
padding-right: 6px;
padding-top: 6px;
padding-bottom: 6px;
}
td {
padding-left: 6px;
padding-right: 6px;
padding-top: 1rem;
padding-bottom: 1rem;
}
.item-row {
border-bottom: 1px #000 dotted;
}
.totals-row-label {
text-align: right;
white-space: nowrap;
}
.totals-row-value {
text-align: right;
white-space: nowrap;
}
.table-totals {
display: grid;
grid-template-columns: 2fr 1fr;
}
.centered {
text-align: center;
}
.doc-title {
font-size: 32px;
}
p {
margin: 0;
padding: 0;
}
span {
padding-right: 5px;
width: 100%;
}
div .label {
text-align: right;
padding-right: 10px;
}
div .value {
text-align: left;
padding-left: 5px;
}
.two-col-grid {
display: grid;
grid-template-columns: 1fr 1fr;
}
.client-details {
margin-bottom: 0.3rem;
}
.container {
padding-top: 2rem;
}
.bottom-margin {
padding-bottom: 0.5rem;
}
.bottom-border {
border-bottom: 0.5px dashed $primary_color;
}
.top-border {
border-top: 0.5px dashed $primary_color;
}
.section-title {
font-style: italic;
color: #454545
}
.primary-color-highlight {
color: $primary_color;
}
.secondary-color-highlight {
color: $secondary_color;
}
.header-table {
margin-top: 0 !important;
padding-top: 0 !important;
}
#footer {
position: fixed;
bottom: 0;
border-top: 1px solid #000;
width: 82%;
min-height: 100px;
padding-top: 0.5rem;
margin-top: 40px;
}
.company-logo {
/* max-width: 65%;*/
max-width: $company_logo_size;
}
</style>
</head>
<body>
<table style="min-width:100%">
<thead>
</thead>
<tbody>
<tr>
<td>
<table width="100%" cellspacing="0" cellpadding="0" class="" border="0">
<tr>
<td align="left" class="doc-title">$delivery_note_label</td>
<td align="right"><img src="$company.logo" class="company-logo"></td>
</tr>
</table>
<table width="100%" height="100%" cellspacing="0" cellpadding="0" class="" border="0">
<tr>
<td align="left" class="">
<div class="" style="">
<div class="client-details">
<p class="section-title">$to_label:</p>
</div>
<div id="client-details"></div>
</div>
</td>
<td align="left">
<div class="" style="height:100%;">
<div class="client-details">
<p class="section-title">$ship_to_label:</p>
</div>
<div id="shipping-details"></div>
</div>
</td>
</tr>
</table>
<table width="100%" cellspacing="0" cellpadding="0" class="">
<tr>
<td align="left" class="">
<div>
<p class="bottom-border">$order_number_label # $invoice.po_number</p>
</div>
</td>
<td align="left">
<div class="">
<p class="bottom-border">$date_label: $invoice.date</p>
</div>
</td>
</tr>
</table>
<ninja>
{% set invoice = invoices|first %}
<table width="100%" cellspacing="0" cellpadding="0" class="">
<thead class="table-header">
<tr class="table-header primary-color-highlight">
<th class="">$item_label #</th>
<th class="" width="50%">$description_label</th>
<th class="centered">$quantity_label</th>
<!-- <th class="totals-row-label centered">Delivered</th>
<th class="totals-row-label centered">Backorder</th> -->
</tr>
</thead>
<tbody class="table-body">
{% for item in invoice.line_items|filter(item => item.type_id == 1) %}
<tr class="item-row">
<td class="">{{ item.product_key }}</td>
<td class="">{{ item.notes }}</td>
<td class="centered">{{ item.quantity }}</td>
<!-- <td class="totals-row-label centered">{{ item.quantity }}</td>
<td class="totals-row-label centered">{{ item.quantity - item.quantity }}</td> -->
</tr>
{% endfor %}
</tbody>
</table>
</ninja>
<table width="100%" cellspacing="0" cellpadding="0" class="">
<div class="container">
<p class="bottom-margin primary-color-highlight">$notes_label:</p>
$invoice.public_notes
</div>
</table>
</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>
<div style="border: 0px solid #000; height:100px;">
</div>
</td>
</tr>
</tfoot>
</table>
<div id="footer" style="border: 0px solid red; width: 95%;">
<div style="width: 100%; padding:10px;" class="two-col-grid top-border">
<div id="company-details" style="margin-left:0; margin-right:auto;"></div>
<div id="company-address" style="margin-right:0; margin-left:auto;"></div>
</div>
</div>
</body>
</html>

View File

@ -0,0 +1,246 @@
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
@import url($font_url);
body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-family: $font_name, Helvetica, sans-serif;
font-size: $font_sizepx !important;
zoom: 80%;
}
table {
margin-top: 1rem;
min-width: 100%;
table-layout: fixed;
overflow-wrap: break-word;
}
.table-header>tr>th {
border-bottom: solid 1px #efefef;
}
.table-body>tr>td {
border-bottom: solid 1px #efefef;
}
th {
text-align: left;
padding-left: 6px;
padding-right: 6px;
padding-top: 6px;
padding-bottom: 6px;
}
td {
padding-left: 6px;
padding-right: 6px;
padding-top: 1rem;
padding-bottom: 1rem;
}
.item-row {
border-bottom: 1px #000 dotted;
}
.totals-row-label {
text-align: right;
white-space: nowrap;
}
.totals-row-value {
text-align: right;
white-space: nowrap;
}
.table-totals {
display: grid;
grid-template-columns: 2fr 1fr;
}
.centered {
text-align: center;
}
.doc-title {
font-size: 32px;
}
p {
margin: 0;
padding: 0;
}
span {
padding-right: 5px;
width: 100%;
}
div .label {
text-align: right;
padding-right: 10px;
}
div .value {
text-align: left;
padding-left: 5px;
}
.two-col-grid {
display: grid;
grid-template-columns: 1fr 1fr;
}
.three-col-grid {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
column-gap: 0.4rem;
}
.client-details {}
.container {
padding-top: 2rem;
}
.bottom-margin {
padding-bottom: 2rem;
}
.section-title {
font-style: italic;
color: #454545;
margin-bottom: 0.3rem;
}
.primary-color-highlight {
color: $primary_color;
}
.secondary-color-highlight {
color: $secondary_color;
}
.order-details {
white-space: nowrap;
line-height: 1.4;
}
.align-left {
text-align: left;
line-height: 1.4;
}
dt {
margin-right: 7px;
}
dd {
margin-left: 3px;
}
.company-logo {
max-width: $company_logo_size;
}
</style>
</head>
<body>
<table width="100%" cellspacing="0" cellpadding="0" class="" border="0">
<tr>
<td align="left" class="doc-title">$delivery_note_label</td>
<td align="right"><img src="$company.logo" class="company-logo"></td>
</tr>
</table>
<table width="100%" height="100%" cellspacing="0" cellpadding="0" class="" border="0">
<tr>
<td style="">
<div class="three-col-grid">
<div class="" style="margin-left:0; margin-right:auto;">
<div class="client-details">
<p class="section-title">$to_label:</p>
</div>
<div id="client-details"></div>
</div>
<div class="" style="margin-left:auto; margin-right:auto;">
<div class="client-details">
<p class="section-title">$ship_to_label:</p>
</div>
<div id="shipping-details"></div>
</div>
<div style="margin-right:0; margin-left: auto;">
<div class="client-details">
<p class="section-title" style="padding-right:10px;">$details_label:</p>
</div>
<div class="two-col-grid">
<dt class="order-details primary-color-highlight">$order_number_label #</dt>
<ninja>
{%set invoice = invoices|first|e %}
<dd class="align-left primary-color-highlight">{% if invoice.po_number %} {{
invoice.po_number }} {% else %} {{ invoice.number}} {% endif %}</dd>
</ninja>
<dt class="order-details">$date_label</dt>
<dd class="align-left">$invoice.date</dd>
<dt class="order-details">$client_label #</dt>
<dd class="align-left">$client.number</dd>
<!-- <dt class="order-details">Dispatch Date </dt>
<dd class="align-left">$date</dd>
<dt class="order-details">Delivery Method </dt>
<dd class="align-left">UPS</dd> -->
</div>
</div>
</td>
</tr>
</table>
<ninja>
{% set invoice = invoices|first %}
<table width="100%" cellspacing="0" cellpadding="0" class="">
<thead class="table-header">
<tr class="table-header primary-color-highlight">
<th class="">$item_label #</th>
<th class="" width="50%">$description_label</th>
<th class="centered">$quantity_label</th>
<!-- <th class="totals-row-label centered">Delivered</th>
<th class="totals-row-label centered">Backorder</th> -->
</tr>
</thead>
<tbody class="table-body">
{% for item in invoice.line_items|filter(item => item.type_id == 1) %}
<tr class="item-row">
<td class="">{{ item.product_key }}</td>
<td class="">{{ item.notes }}</td>
<td class="centered">{{ item.quantity }}</td>
<!-- <td class="totals-row-label centered">{{ item.quantity }}</td>
<td class="totals-row-label centered">{{ item.quantity - item.quantity }}</td> -->
</tr>
{% endfor %}
</tbody>
</table>
</ninja>
<table width="100%" cellspacing="0" cellpadding="0" class="">
<div class="container">
<p class="bottom-margin primary-color-highlight">$notes_label:</p>
$invoice.public_notes
</div>
</table>
</body>
</html>

View File

@ -0,0 +1,320 @@
<html>
<head>
<style>
@page {
margin: 50 0 50 0 !important;
}
body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-family: $font_name, Helvetica, sans-serif;
font-size: $font_sizepx !important;
zoom: 80%;
}
img {
display: block;
margin-left: auto;
margin-right: auto;
}
h2 {
color: $primary_color;
margin-bottom: 0.5rem;
}
table {
padding-top: 1rem;
min-width: 100%;
table-layout: fixed;
overflow-wrap: break-word;
border: 0px solid #000;
}
th {
text-align: center;
}
td {
text-align: center;
}
tr.border-bottom td {
height: 2rem;
border-bottom: 1px dashed $primary_color;
}
#logo-container {
width: 100%;
margin-top: 0;
}
#client-wrapper {
width: 100%;
display: grid;
grid-template-columns: 1fr 1fr;
border: 0px solid #000;
}
#client-details {
line-height: 0.5;
border: 0px solid #000;
}
#company-details {
line-height: 0.5 !important;
}
#company-address {
line-height: 0.5 !important;
}
#company-wrapper {
margin-left: auto;
margin-right: 0;
}
#statement-details {
margin-left: auto;
margin-right: 0;
}
#entity-container {
padding-left: 2rem;
padding-right: 2rem;
break-inside: avoid-region;
}
#entity-container h2 {
text-align: center;
}
#date-range {
padding: 0;
margin-top: 0;
border: 0px solid #000;
}
.two-col-grid {
display: grid;
grid-template-columns: 1fr 1fr;
border: 0px solid #000;
}
.body-margin {
margin-left: 2rem;
margin-right: 2rem;
}
.aging-table {
border: 1px dashed $primary_color;
}
.company-logo {
max-width: $company_logo_size;
max-height: 100px;
vertical-align: middle;
}
</style>
</head>
<body>
<div id="logo-container">
<img src="$company.logo" class="company-logo">
</div>
<div class="two-col-grid body-margin">
<div id="client-details"></div>
<div id="company-wrapper">
<div id="company-details"></div>
<div id="company-address"></div>
</div>
</div>
<div class="two-col-grid body-margin">
<div></div>
<div id="statement-details">
<h2>$statement_label</h2>
<p id="date-range">$start_date - $end_date</p>
</div>
</div>
<ninja>
{% if invoices|e %}
<div id="entity-container">
<h2>{{ t('invoices') }}<h2>
<table width="100%" cellspacing="0" cellpadding="0" class="">
<thead class="">
<tr class="">
<th class="">{{ t('invoice') }} #</th>
<th class="">{{ t('invoice_date') }}</th>
<th class="">{{ t('invoice_due_date') }}</th>
<th class="">{{ t('total') }}</th>
<th class="">{{ t('balance') }}</th>
</tr>
</thead>
<tbody>
{% for invoice in invoices %}
<tr class="item-row border-bottom">
<td class="">{{ invoice.number }}</td>
<td class="">{{ invoice.date }}</td>
<td class="">{{ invoice.due_date }}</td>
<td class="">{{ invoice.amount }}</td>
<td class="">{{ invoice.balance }}</td>
</tr>
{% endfor %}
{% set sum_balance = invoices|sum('balance_raw') %}
{% if sum_balance > 0 %}
<tr class="item-row border-bottom">
<td></td>
<td></td>
<td></td>
<td><b>$balance_label</b></td>
<td><b>{{ sum_balance|format_currency(currency_code) }}</b> </td>
</tr>
{% endif %}
</tbody>
</table>
</div>
{% endif %}
</ninja>
<ninja>
{% if invoices|e and show_payments %}
<div id="entity-container">
<h2>{{ t('payments') }}<h2>
<table width="100%" cellspacing="0" cellpadding="0" class="">
<thead class="">
<tr class="">
<th class="">{{ t('invoice') }} #</th>
<th class="">{{ t('payment_date') }}</th>
<th></th>
<th class="">{{ t('method') }}</th>
<th class="">{{ t('amount') }}</th>
</tr>
</thead>
<tbody>
{% set net_refunds = 0 %}
{% set total_payments = 0%}
{% for invoice in invoices %}
{% if invoice.payments|e %}
{% set parent_payment = invoice.payments|first %}
{% for payment in invoice.payments %}
{% set currency_code = payment.currency %}
{% for pivot in payment.paymentables %}
<tr class="item-row border-bottom">
<td class="">{{ pivot.invoice }}</td>
<td class="">{{ pivot.created_at }}</td>
<td></td>
{%if pivot.is_credit %}
<td class="">$credit_label {{ pivot.number }}</td>
{%else%}
<td class="">{{ payment.method }}</td>
{%endif%}
<td class="">{{ pivot.amount }} </td>
</tr>
{% if pivot.refunded_raw > 0 %}
<tr class="item-row border-bottom">
<td>{{ pivot.invoice }}</td>
<td>{{ pivot.updated_at }}</td>
<td></td>
<td>$refund_label</td>
<td>({{ pivot.refunded }})</td>
</tr>
{% set net_refunds = net_refunds + pivot.refunded_raw %}
{% endif %}
{% set total_payments = total_payments + pivot.amount_raw %}
{% endfor %}
{% endfor %}
{% endif %}
{% endfor %}
<tr class="item-row border-bottom">
<td>{{ currency_code }}</td>
<td></td>
<td></td>
<td><b>$payments_label</b></td>
<td><b>{{ total_payments|format_currency(currency_code) }}</b></td>
</tr>
{% if net_refunds > 0 %}
<tr class="item-row border-bottom">
<td></td>
<td></td>
<td></td>
<td><b>$refunded_label</b></td>
<td><b>({{ net_refunds|format_currency(currency_code) }})</b></td>
</tr>
<tr class="item-row border-bottom">
<td></td>
<td></td>
<td></td>
<td><b>$net_label</b></td>
<td><b>{{ (total_payments-net_refunds)|format_currency(currency_code) }}</b> </td>
</tr>
{% endif %}
</tbody>
</table>
</div>
{% endif %}
</ninja>
<ninja>
{% if credits|e and show_credits %}
<div id="entity-container">
<h2>{{ t('credits') }}<h2>
<table width="100%" cellspacing="0" cellpadding="0" class="">
<thead class="">
<tr class="">
<th class="">{{ t('credit') }} #</th>
<th class="">{{ t('credit_date') }}</th>
<th class="">{{ t('total') }}</th>
<th class="">{{ t('balance') }}</th>
</tr>
</thead>
<tbody>
{% for credit in credits %}
<tr class="item-row border-bottom">
<td class="">{{ credit.number }}</td>
<td class="">{{ credit.date }}</td>
<td class="">{{ credit.amount }}</td>
<td class="">{{ credit.balance }}</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% endif %}
</ninja>
<ninja>
{% if aging and show_aging %}
<div id="entity-container" style="break-inside: avoid;">
<h2>{{ t('aging') }}<h2>
<table width="100%" cellspacing="0" cellpadding="0" class="">
<thead class="">
<tr class="item-row border-bottom">
{% for key, age in aging %}
<th class="">{{ key }}</th>
{% endfor %}
</tr>
</thead>
<tbody>
<tr class="item-row">
{% for key, age in aging %}
<td class="aging-table">{{ age }}</td>
{% endfor %}
</tr>
</tbody>
</table>
</div>
{% endif %}
</ninja>
</body>
</html>

View File

@ -0,0 +1,451 @@
<html>
<!-- Receipt -->
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
@import url($font_url);
.company-logo {
max-width: $company_logo_size;
}
body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-family: $font_name, Helvetica, sans-serif;
font-size: $font_sizepx !important;
zoom: 80%;
}
</style>
</head>
<body>
<table class="Wrapper" align="center"
style="border:0;border-collapse:collapse;margin:0 auto!important;padding:0;max-width:600px;min-width:600px;width:600px">
<tbody>
<tr>
<td style="border:0;border-collapse:collapse;margin:0;padding:0">
<table class="Divider--kill" width="100%"
style="border:0;border-collapse:collapse;margin:0;padding:0">
<tbody>
<tr>
<td height="20"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
</tbody>
</table>
<div style="border-bottom-left-radius:5px;border-bottom-right-radius:5px">
<table dir="ltr" class=" Header" width="100%"
style="border:0;border-collapse:collapse;margin:0;padding:0;background-color:#ffffff">
<tbody>
<tr>
<td class="Header-left Target"
style="background-color:$primary_color;border:0;border-collapse:collapse;margin:0;padding:0;font-size:0;line-height:0px;background-size:100% 100%;border-top-left-radius:5px; border-top-right-radius:5px;"
align="center" height="156" valign="middle" width="">
<img src="$company.logo" class="company-logo">
</td>
</tr>
</tbody>
</table>
<table class="" width="100%"
style="border:0;border-collapse:collapse;margin:0;padding:0;background-color:#ffffff;margin-top:1rem;">
<tbody>
<tr>
<td class="" width="64"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
<td class="Content" align="center"
style="border:0;border-collapse:collapse;margin:0;padding:0;width:472px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;vertical-align:middle;color:#32325d;font-size:24px;line-height:32px">
<span class="il">$receipt_label</span> $from_label <span
dir="ltr">$company.name</span>
</td>
<td class="" width="64"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
</tbody>
</table>
<table class="" width="100%"
style="border:0;border-collapse:collapse;margin:0;padding:0;background-color:#ffffff">
<tbody>
<tr>
<td height="8"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
</tbody>
</table>
<table class="" width="100%"
style="border:0;border-collapse:collapse;margin:0;padding:0;background-color:#ffffff">
<tbody>
<tr>
<td height="4"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
</tbody>
</table>
<table class="" width="100%"
style="border:0;border-collapse:collapse;margin:0;padding:0;background-color:#ffffff">
<tbody>
<tr>
<td class="" width="64"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
<td class="Content" align="center"
style="border:0;border-collapse:collapse;margin:0;padding:0;width:472px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;vertical-align:middle;color:#8898aa;font-size:15px;line-height:18px">
<span class="il">$receipt_label</span> #$number
</td>
<td class="" width="64"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
<ninja>
{%set payment = payments|first %}
{%if payment.transaction_reference %}
<tr>
<td class="" width="64"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
<td class="Content" align="center"
style="border:0;border-collapse:collapse;margin:0;padding:0;width:472px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;vertical-align:middle;color:#8898aa;font-size:15px;line-height:18px">
<span class="il">Reference:</span> {{ payment.transaction_reference }}
</td>
<td class="" width="64"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
{% endif %}
</ninja>
</tbody>
</table>
<table class="" width="100%"
style="border:0;border-collapse:collapse;margin:0;padding:0;background-color:#ffffff">
<tbody>
<tr>
<td height="24"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
</tbody>
</table>
<table class="" width="100%"
style="border:0;border-collapse:collapse;margin:0;padding:0;background-color:#ffffff;width:100%">
<tbody>
<tr>
<td class="" width="64"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
<td class="Content"
style="border:0;border-collapse:collapse;margin:0;padding:0;width:472px">
<table style="border:0;border-collapse:collapse;margin:0;padding:0;width:100%">
<tbody>
<tr>
<td class="DataBlocks-item" valign="top"
style="border:0;border-collapse:collapse;margin:0;padding:0">
<table
style="border:0;border-collapse:collapse;margin:0;padding:0">
<tbody>
<tr>
<td
style="border:0;border-collapse:collapse;margin:0;padding:0;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;vertical-align:middle;color:#8898aa;font-size:12px;line-height:16px;white-space:nowrap;font-weight:bold;text-transform:uppercase;">
$amount_paid_label
</td>
</tr>
<tr>
<td
style="border:0;border-collapse:collapse;margin:0;padding:0;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;vertical-align:middle;color:#525f7f;font-size:15px;line-height:24px;white-space:nowrap">
$amount
</td>
</tr>
</tbody>
</table>
</td>
<td class="DataBlocks-spacer" width="20"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
<td class="DataBlocks-item" valign="top"
style="border:0;border-collapse:collapse;margin:0;padding:0">
<table
style="border:0;border-collapse:collapse;margin:0;padding:0">
<tbody>
<tr>
<td
style="border:0;border-collapse:collapse;margin:0;padding:0;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;vertical-align:middle;color:#8898aa;font-size:12px;line-height:16px;white-space:nowrap;font-weight:bold;text-transform:uppercase">
$date_label
</td>
</tr>
<tr>
<td
style="border:0;border-collapse:collapse;margin:0;padding:0;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;vertical-align:middle;color:#525f7f;font-size:15px;line-height:24px;white-space:nowrap">
$payment.date
</td>
</tr>
</tbody>
</table>
</td>
<td class="DataBlocks-spacer" width="20"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
<td class="DataBlocks-item" valign="top"
style="border:0;border-collapse:collapse;margin:0;padding:0">
<table
style="border:0;border-collapse:collapse;margin:0;padding:0">
<tbody>
<tr>
<td
style="border:0;border-collapse:collapse;margin:0;padding:0;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;vertical-align:middle;color:#8898aa;font-size:12px;line-height:16px;white-space:nowrap;font-weight:bold;text-transform:uppercase">
$method_label
</td>
</tr>
<tr>
<td
style="border:0;border-collapse:collapse;margin:0;padding:0;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;vertical-align:middle;color:#525f7f;font-size:15px;line-height:24px;white-space:nowrap">
<span>
<ninja>
{% set payment = payments|first %}
{% if payment %}
{{ payment.method }}
{% endif %}
</ninja>
</span>
<span></span>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
<td class="" width="64"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
</tbody>
</table>
<table class="" width="100%"
style="border:0;border-collapse:collapse;margin:0;padding:0;background-color:#ffffff">
<tbody>
<tr>
<td height="32"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
</tbody>
</table>
<table class=""
style="border:0;border-collapse:collapse;margin:0;padding:0;background-color:#ffffff">
<tbody>
<tr>
<td class="" width="64"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
<td class="Content"
style="border:0;border-collapse:collapse;margin:0;padding:0;width:472px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;vertical-align:middle;color:#8898aa;font-size:12px;line-height:16px;font-weight:bold;text-transform:uppercase">
Summary
</td>
<td class="" width="64"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
<tr>
<td colspan="3" height="12"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
</tbody>
</table>
<table class="" width="100%"
style="border:0;border-collapse:collapse;margin:0;padding:0;background-color:#ffffff">
<tbody>
<tr>
<td class="Spacer--kill" width="64"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
<td class="Content"
style="border:0;border-collapse:collapse;margin:0;padding:0;width:472px">
<table
style="border:0;border-collapse:collapse;margin:0;padding:0;width:100%;background-color:#f6f9fc;border-radius:4px">
<tbody>
<tr>
<td colspan="3" height="4"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
<tr>
<td class="" width="20"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
<td class="Table-content"
style="border:0;border-collapse:collapse;margin:0;padding:0;width:432px">
<table class="Table-rows" width="432"
style="border:0;border-collapse:collapse;margin:0;padding:0">
<tbody>
<tr>
<td colspan="3" height="6"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
<tr>
<td colspan="3" height="6"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
<ninja>
{% set totalPrice = 0 %}
{% for payment in payments %}
{% for pivot in payment.paymentables|filter(pivot =>
pivot.is_credit == '0') %}
<tr>
<td
style="border:0;border-collapse:collapse;margin:0;padding:0;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;vertical-align:middle;color:#8898aa;font-size:12px;line-height:16px;font-weight:bold;text-transform:uppercase">
{{ pivot.date }}
</td>
<td width="8"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
<td
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
<tr>
<td colspan="3" height="6"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
<tr>
<td colspan="3" height="6"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
<tr>
<td
style="border:0;border-collapse:collapse;margin:0;padding:0;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;vertical-align:middle;color:#525f7f;font-size:15px;line-height:24px">
<div>
$invoice_label #{{ pivot.invoice }}
<span class="Content"
style="border:0;border-collapse:collapse;margin:0;padding:0;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;color:#8898aa;font-size:14px;line-height:14px">
</span>
</div>
</td>
<td width="8"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
<td align="right" valign="top"
style="border:0;border-collapse:collapse;margin:0;padding:0;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;vertical-align:middle;color:#525f7f;font-size:15px;line-height:24px">
{{ pivot.amount }}
</td>
</tr>
<tr>
<td colspan="3" height="6"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
<tr>
<td colspan="3" height="6"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
<tr>
<td bgcolor="e6ebf1" colspan="3" height="1"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
<tr>
<td colspan="3" height="8"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
{% set totalPrice = totalPrice + pivot.amount_raw %}
{% endfor %}
{% endfor %}
<tr>
<td colspan="3" height="6"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
<tr>
<td
style="border:0;border-collapse:collapse;margin:0;padding:0;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;vertical-align:middle;color:#525f7f;font-size:15px;line-height:24px;font-weight:bold">
$amount_paid_label
</td>
<td width="8"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
<td align="right" valign="top"
style="border:0;border-collapse:collapse;margin:0;padding:0;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;vertical-align:middle;color:#525f7f;font-size:15px;line-height:24px;font-weight:bold">
${{ totalPrice|number_format(2, '.', ',') }}
<td>
</ninja>
</tr>
<tr>
<td colspan="3" height="6"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
</tbody>
</table>
</td>
<td class="" width="20"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
<tr>
<td colspan="3" height="4"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
</tbody>
</table>
</td>
<td class="Spacer--kill" width="64"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
</tbody>
</table>
<table class="" width="100%" style="border:0;border-collapse:collapse;margin:0;padding:0;background-color:#ffffff">
<tbody>
<tr>
<td height="44"
style="border:0;border-collapse:collapse;margin:0;padding:0;color:#ffffff;font-size:1px;line-height:1px">
&nbsp;</td>
</tr>
</tbody>
</table>
</div>
</td>
</tr>
</tbody>
</table>
</body>
</html>

View File

@ -0,0 +1,166 @@
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
@import url($font_url);
@page {
padding-top: 0;
padding-bottom: 0;
margin-top: 0;
margin-bottom: 0;
size: A5 landscape;
/* size: 210mm 75mm; */
border: 0px solid #000;
}
body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-family: $font_name, Helvetica, sans-serif;
font-size: $font_sizepx !important;
zoom: 80%;
}
.centered {
text-align: center;
}
p {
margin: 0;
padding: 0;
}
.two-col-grid {
display: grid;
grid-template-columns: 1fr 1fr;
}
.four-col-grid {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
}
.key-value-grid {
display: grid;
grid-template-columns: 1fr 4fr;
}
.primary-color-highlight {
color: $primary_color;
}
.secondary-color-highlight {
color: $secondary_color;
}
.company-logo {
max-width: $company_logo_size;
max-height: 100px;
vertical-align: middle;
}
.border {
border: 1px solid #000;
}
.zero {
margin: 0;
padding: 0;
}
.pull-left {
margin-left: 0;
margin-right: auto;
}
.pull-right {
margin-left: auto;
margin-right: 0;
}
.italic {
font-style: italic;
}
.bottom-border {
border-bottom: 1px solid $primary_color;
}
</style>
</head>
<body>
<div class="two-col-grid" style="">
<ninja>
<div class="pull-left">
<h1 class="primary-color-highlight" style="margin-top:0;">$receipt_label {%if payments|length == 1%}#$number{% endif %}</h2>
</div>
</ninja>
<div class="pull-right"><img src="$company.logo" class="company-logo"></div>
</div>
<div class="two-col-grid">
<div class="pull-left">
<h4 class="italic" style="margin-bottom:0.5rem;">$to_label</h3>
<p style="margin-bottom:0.5rem;">$client.name</p>
<ninja>
{% set payment = payments|first %}
{% if payment.client.vat_number %}
<p>$vat_number_label: $vat_number</p>
{% endif %}
</ninja>
</div>
<div class="pull-right">
<!-- <h3 class="secondary-color-highlight zero italic">$to_label</h3>
<p>$company.name</p> -->
</div>
</div>
<div class="" style="margin-top:20px;">
<div class="four-col-grid" style="padding:2px; margin-bottom:2px;">
<div style="">$number_label</div>
<div style="">$date_label</div>
<div style="">$method_label</div>
<div style="">$amount_label</div>
</div>
<ninja>
{% if payments|e %}
{% for payment in payments %}
<div class="four-col-grid bottom-border" style="padding:2px;">
<div>
<p class="primary-color-highlight">#{{ payment.number }}</p>
</div>
<div>
<p>{{ payment.date }}</p>
</div>
<div>
<p>{{ payment.method }}</p>
</div>
<div>
<p>{{ payment.amount }}</p>
</div>
</div>
{% endfor %}
{% endif %}
</ninja>
</div>
<div class="two-col-grid"
style="margin-top: 1rem; position:absolute; bottom: 0; width:100%; margin-right:0rem !important; padding-right:0rem;">
<div id="company-details" class="pull-left" style="padding-bottom:1rem;">
<!-- <h3>$company.name</h3> -->
</div>
<div class="pull-right" style="padding-right:1rem;">
<p>$public_notes</p>
</div>
</div>
</body>
</html>

View File

@ -0,0 +1,281 @@
<html>
<head>
<style>
body,
html {
height: 100%;
margin: 0;
margin-bottom: 2rem;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-family: $font_name, Helvetica, sans-serif;
font-size: $font_sizepx;
zoom: 80%;
}
@page {
margin-top: 2rem;
margin-bottom: 2rem;
}
table tr td,
table tr,
th {
font-size: $font_sizepx !important;
}
table {
padding-top: 1rem;
min-width: 100%;
table-layout: fixed;
overflow-wrap: break-word;
border: 0px solid #000;
padding-right: 1rem;
break-inside: auto;
}
th {
text-align: center;
padding: 0.5rem;
background-color: #7e7d80;
color: #fff;
font-size: 26px !important;
font-weight: bold;
}
td {
text-align: center;
border-right: 1px solid #000;
border-bottom: 1px solid #000;
height: 2rem;
}
[data-ref="table"]>tbody>tr>td:first-child {
border-left: 1px solid #000;
}
[data-ref="table"]>tbody>tr>td:last-child {
border-right: 1px solid #000;
}
tr {
break-inside: avoid;
}
.container {
display: flex;
height: 100%;
}
.vertical-first {
flex: 3%;
border-left: 6px solid #000;
}
.vertical-second {
flex: 97%;
margin-left: 2rem;
}
[data-ref="table"]>tbody>tr:nth-child(odd) {
background-color: #ebebeb;
}
.centered-text {
text-align: right;
/* Center text within the transformed div */
margin: 0;
/* Reset margin to ensure full centering */
color: $primary_color;
font-size: 54px !important;
letter-spacing: 10px;
text-transform: uppercase;
font-weight: bolder;
}
.date-text {
text-align: right;
/* Center text within the transformed div */
margin: 0;
/* Reset margin to ensure full centering */
padding-top: 3rem;
font-size: 48px !important;
letter-spacing: 5px;
text-transform: uppercase;
font-weight: bold;
}
.vertical-text {
background-color: #f0f0f0;
/* Change background color as desired */
writing-mode: vertical-lr;
/* Set vertical writing mode */
text-orientation: mixed;
/* Ensure text orientation */
transform: rotate(-180deg);
/* Rotate text to be upright */
padding: 20px;
justify-content: center;
/* Center content horizontally */
align-items: center;
/* Center content vertically */
}
.two-col-grid {
display: grid;
grid-template-columns: 1fr 1fr;
border: 0px solid #000;
}
.company-logo {
max-width: $company_logo_size;
text-align: right;
float: right;
margin-right: 0;
max-height: 200px;
text-align: right;
}
#logo-container {
display: inline-block;
max-height: 200px;
border: 0px solid #000;
}
#company-wrapper {
margin-left: auto;
margin-right: 0;
border: 0px solid #000;
margin-top: 1rem;
}
#client-details {
line-height: 0.5;
border: 0px solid #000;
font-size: 1.3rem;
}
#company-details {
line-height: 0.5;
font-size: 1.3rem;
}
#company-address {
line-height: 0.5;
font-size: 1.3rem;
}
#date-range {
padding: 0;
margin-top: 2rem;
border: 0px solid #000;
font-size: 1.3rem;
font-weight: bold;
}
</style>
</head>
<body>
<div class="container">
<div class="vertical-first vertical-text">
<p class="centered-text">$statement_label</p>
</div>
<div class="vertical-second">
<div class="two-col-grid" style="border-bottom: 6px solid #000;" s>
<div>
<h1>$company.name</h1>
</div>
<div id="logo-container">
<img src="$company.logo" class="company-logo">
</div>
</div>
<div class="two-col-grid body-margin">
<div id="client-details"></div>
<div id="company-wrapper">
<div id="company-details"></div>
<div id="company-address"></div>
<p id="date-range">$start_date - $end_date</p>
</div>
</div>
<div style="min-width:100%; width:100%; padding-bottom: 1rem; margin-bottom:1rem;">
<ninja>
{% if invoices|e %}
<table width="100%" cellspacing="0" cellpadding="0" class="" data-ref="table">
<thead class="">
<tr class="">
<th class="">$date_label</th>
<th class="">$invoice_label #</th>
<th class="">{{ t('charges') }}</th>
<th class="">{{ t('credits') }}</th>
<th class="">{{ t('line_total') }}</th>
</tr>
</thead>
<tbody>
{% set running_total = 0%}
{% for invoice in invoices %}
<tr class="item-row border-bottom">
<td class="">{{ invoice.date }}</td>
<td class="">{{ invoice.number }}</td>
<td class="">{{ invoice.amount }}</td>
<td class="">{%set running_total = running_total + invoice.amount_raw %}</td>
<td class="">{{ running_total|format_currency(currency_code) }}</td>
</tr>
{% for payment in invoice.payments %}
{% for pivot in payment.paymentables %}
<tr class="item-row border-bottom">
<td class="">{{ invoice.date }}</td>
<td class="">{{ invoice.number }}</td>
<td class="">{%set running_total = running_total - pivot.amount_raw %}</td>
<td class="">{{ pivot.amount }}</td>
<td class="">{{ running_total|format_currency(currency_code) }}</td>
</tr>
{% if pivot.refunded_raw > 0%}
<tr class="item-row border-bottom">
<td class="">{{ invoice.date }}</td>
<td class="">{{ invoice.number }} $refund_label</td>
<td class="">{%set running_total = running_total + pivot.refunded_raw %}</td>
<td class="">({{ pivot.refunded }})</td>
<td class="">{{ running_total|format_currency(currency_code) }}</td>
</tr>
{% endif %}
{% endfor %}
{% endfor %}
{% endfor %}
</tbody>
</table>
{% endif %}
</ninja>
<ninja>
{% if aging and show_aging %}
<div id="entity-container" style="break-inside: avoid;">
<table width="100%" cellspacing="0" cellpadding="0" class="" data-ref="table">
<thead class="">
<tr class="item-row border-bottom">
{% for key, age in aging %}
<th class="">{{ key }}</th>
{% endfor %}
</tr>
</thead>
<tbody>
<tr class="item-row">
{% for key, age in aging %}
<td class="aging-table">{{ age }}</td>
{% endfor %}
</tr>
</tbody>
</table>
</div>
{% endif %}
</ninja>
</div>
</div>
</div>
</body>
</html>