Improvements for html presentation of invoice in client portal

This commit is contained in:
David Bomba 2023-07-12 16:57:03 +10:00
parent 8812286ccb
commit c239a77dd4
2 changed files with 63 additions and 33 deletions

View File

@ -26,6 +26,7 @@ use App\Services\Pdf\PdfDesigner;
use App\Services\Pdf\PdfConfiguration;
use App\Models\PurchaseOrderInvitation;
use App\Models\RecurringInvoiceInvitation;
use App\Jobs\Vendor\CreatePurchaseOrderPdf;
class PdfSlot extends Component
{
@ -45,13 +46,11 @@ class PdfSlot extends Component
private $entity_type;
public $download_button_text;
protected $listeners = ['viewportChanged' => 'getPdf'];
public function mount()
{
MultiDB::setDb($this->db);
$this->download_button_text = ctrans('texts.download_pdf');
}
public function getPdf()
@ -62,11 +61,12 @@ class PdfSlot extends Component
public function downloadPdf()
{
$this->download_button_text = ctrans('texts.working');
$file_name = $this->entity->numberFormatter().'.pdf';
$file = (new \App\Jobs\Entity\CreateRawPdf($this->invitation, $this->invitation->company->db))->handle();
if($this->entity instanceof \App\Models\PurchaseOrder)
$file = (new CreatePurchaseOrderPdf($this->invitation, $this->invitation->company->db))->rawPdf();
else
$file = (new \App\Jobs\Entity\CreateRawPdf($this->invitation, $this->invitation->company->db))->handle();
$headers = ['Content-Type' => 'application/pdf'];
@ -74,8 +74,6 @@ class PdfSlot extends Component
echo $file;
}, $file_name, $headers);
$this->download_button_text = ctrans('texts.download_pdf');
}
public function render()
@ -110,7 +108,6 @@ class PdfSlot extends Component
{
$html = strtr($string, $this->html_variables['labels']);
$html = strtr($html, $this->html_variables['values']);
return $html;
@ -148,20 +145,20 @@ class PdfSlot extends Component
if($this->entity_type == 'invoice' || $this->entity_type == 'recurring_invoice') {
foreach($this->settings->pdf_variables->invoice_details as $variable)
$entity_details .= "<div class='flex px-3 block'><p class= w-36 block'>{$variable}_label</p><p class='pl-1 w-36 block'>{$variable}</p></div>";
$entity_details .= "<div class='flex px-3 block'><p class= w-36 block'>{$variable}_label</p><p class='pl-1 w-36 block entity-field'>{$variable}</p></div>";
}
elseif($this->entity_type == 'quote'){
foreach($this->settings->pdf_variables->quote_details as $variable)
$entity_details .= "<div class='flex px-3 block'><p class= w-36 block'>{$variable}_label</p><p class='pl-1 w-36 block'>{$variable}</p></div>";
$entity_details .= "<div class='flex px-3 block'><p class= w-36 block'>{$variable}_label</p><p class='pl-1 w-36 block entity-field'>{$variable}</p></div>";
}
elseif($this->entity_type == 'credit') {
foreach($this->settings->pdf_variables->credit_details as $variable)
$entity_details .= "<div class='flex px-3 block'><p class= w-36 block'>{$variable}_label</p><p class='pl-1 w-36 block'>{$variable}</p></div>";
$entity_details .= "<div class='flex px-3 block'><p class= w-36 block'>{$variable}_label</p><p class='pl-1 w-36 block entity-field'>{$variable}</p></div>";
}
elseif($this->entity_type == 'purchase_order'){
foreach($this->settings->pdf_variables->purchase_order_details as $variable)
$entity_details .= "<div class='flex px-3 block'><p class= w-36 block'>{$variable}_label</p><p class='pl-1 w-36 block'>{$variable}</p></div>";
$entity_details .= "<div class='flex px-3 block'><p class= w-36 block'>{$variable}_label</p><p class='pl-1 w-36 block entity-field'>{$variable}</p></div>";
}
return $this->convertVariables($entity_details);

View File

@ -39,7 +39,7 @@ span {
<div class="border-fuchsia-600 border-b-2 pb-3 mt-3">
<div class=""> {!! $entity_details !!} </div>
<div id="entity-details"> {!! $entity_details !!} </div>
</div>
@ -118,27 +118,13 @@ span {
@endif
<div id="totals" class="mb-10 mr-3 ml-3">
<table width="100%">
<thead>
</thead>
<tbody>
<tr style="display: table-row;">
<td>
<div class="">
<div class="">
<p class="px-2 text-lg">{{ ctrans('texts.total') }}</p>
</div>
</div>
</td>
<tr>
<td style="text-align:left; padding-right:10px;" class="text-lg">{{ ctrans('texts.total') }}</td>
<td style="text-align:right; padding-right:10px;" class="text-lg">{{ $amount }}</td>
</tr>
<tr style="display: table-row;">
<td>
<div class="">
<div class="">
<p class="px-2 text-lg">{{ ctrans('texts.balance') }}</p>
</div>
</div>
</td>
<tr>
<td style="text-align:left; padding-right:10px;" class="text-lg">{{ ctrans('texts.balance') }}</td>
<td style="text-align:right; padding-right:10px;" class="text-lg">{{ $balance }}</td>
</tr>
</tbody>
@ -190,4 +176,51 @@ span {
</div>
@endif
@endif
<script>
document.addEventListener('DOMContentLoaded', () => {
Array.from(document.getElementsByClassName("entity-field")).forEach(function(item) {
if(item.innerText.length == 0){
item.parentNode.remove();
}
});
Livewire.hook('message.processed', (message, component) => {
Array.from(document.getElementsByClassName("entity-field")).forEach(function(item) {
if(item.innerText.length == 0){
item.parentNode.remove();
}
});
})
var timeout = false;
/* Watch for resize of window and ensure we unset props with no values */
window.addEventListener('resize', function() {
clearTimeout(timeout);
timeout = setTimeout(getDimensions, 250);
});
getDimensions();
function getDimensions() {
const width = window.innerWidth;
if(width < 900){
Array.from(document.getElementsByClassName("entity-field")).forEach(function(item) {
if(item.innerText.length == 0){
item.parentNode.remove();
}
});
}
}
});
</script>