Fixed up UI Invoice PDF and No Records

This commit is contained in:
johnnyq
2021-04-06 17:41:41 -04:00
parent 9318f40fcd
commit 72d379504b
3 changed files with 321 additions and 339 deletions

View File

@@ -1,14 +1,9 @@
<div class="modal" id="deleteClientModal<?php echo $client_id; ?>" tabindex="-1"> <div class="modal" id="deleteClientModal<?php echo $client_id; ?>" tabindex="-1">
<div class="modal-dialog"> <div class="modal-dialog">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header bg-danger">
<button type="button" class="close text-white" data-dismiss="modal">
<span>&times;</span>
</button>
</div>
<div class="modal-body"> <div class="modal-body">
<center class="mb-4"> <center class="mb-4">
<i class="far fa-8x fa-times-circle text-danger mb-3 mt-3"></i> <i class="far fa-10x fa-times-circle text-danger mb-3 mt-3"></i>
<h2>Are you sure?</h2> <h2>Are you sure?</h2>
<h6 class="mb-4 text-secondary">Do you really want to delete <?php echo $client_name; ?>? This process cannot be undone.</h6> <h6 class="mb-4 text-secondary">Do you really want to delete <?php echo $client_name; ?>? This process cannot be undone.</h6>
<button type="button" class="btn btn-outline-secondary btn-lg px-5 mr-4" data-dismiss="modal">Cancel</button> <button type="button" class="btn btn-outline-secondary btn-lg px-5 mr-4" data-dismiss="modal">Cancel</button>

View File

@@ -487,298 +487,287 @@ include("footer.php");
?> ?>
<script src='plugins/pdfmake/pdfmake.js'></script> <script src='plugins/pdfmake/pdfmake.js'></script>
<script src='plugins/pdfmake/vfs_fonts.js'></script> <script src='plugins/pdfmake/vfs_fonts.js'></script>
<script>
<script> // Invoice markup
// Author: Max Kostinevich
// BETA (no styles)
// http://pdfmake.org/playground.html
// playground requires you to assign document definition to a variable called dd
// Invoice markup // CodeSandbox Example: https://codesandbox.io/s/pdfmake-invoice-oj81y
// Author: Max Kostinevich
// BETA (no styles)
// http://pdfmake.org/playground.html
// playground requires you to assign document definition to a variable called dd
// CodeSandbox Example: https://codesandbox.io/s/pdfmake-invoice-oj81y
var docDefinition = { var docDefinition = {
info: { info: {
title: '<?php echo "$company_name - Invoice"; ?>', title: '<?php echo "$company_name - Invoice"; ?>',
author: '<?php echo $company_name; ?>' author: '<?php echo $company_name; ?>'
}, },
footer: {
columns: [
{ text: '<?php echo $config_invoice_footer; ?>', style: 'documentFooterCenter' },
]
},
//watermark: {text: '<?php echo $invoice_status; ?>', color: 'lightgrey', opacity: 0.3, bold: true, italics: false},
footer: { content: [
columns: [ // Header
{
{ text: '<?php echo $config_invoice_footer; ?>', style: 'documentFooterCenter' }, columns: [
<?php if(!empty($company_logo_base64)){ ?>
] {
}, image: '<?php echo "data:image;base64,$company_logo_base64"; ?>',
width: 120
},
<?php } ?>
[
{
text: 'Invoice',
style: 'invoiceTitle',
width: '*'
},
{
text: '<?php echo "$invoice_prefix$invoice_number"; ?>',
style: 'invoiceNumber',
width: '*'
},
],
],
},
// Billing Headers
{
columns: [
{
text: '<?php echo $company_name; ?>',
style:'invoiceBillingTitle',
},
{
text: '<?php echo $client_name; ?>',
style:'invoiceBillingTitleClient',
},
]
},
// Billing Address
{
columns: [
{
text: '<?php echo $company_address; ?> \n <?php echo "$company_city $company_state $company_zip"; ?> \n <?php echo $company_phone; ?> \n <?php echo $company_website; ?>',
style: 'invoiceBillingAddress'
},
{
text: '<?php echo $client_address; ?> \n <?php echo "$client_city $client_state $client_zip"; ?> \n <?php echo $client_email; ?> \n <?php echo $client_phone; ?>',
style: 'invoiceBillingAddressClient'
},
]
},
// Invoice Dates
{
columns: [
{
text:'Invoice Date',
style:'invoiceDateTitle',
width: '*'
},
{
text:'<?php echo $invoice_date ?>',
style:'invoiceDateValue',
width: 80
},
]
},
{
columns: [
{
text:'Due Date',
style:'invoiceDateTitle',
width: '*'
},
{
text:'<?php echo $invoice_due ?>',
style:'invoiceDateValue',
width: 80
},
]
},
// Line breaks
'\n\n',
// Items
{
table: {
// headers are automatically repeated if the table spans over multiple pages
// you can declare how many rows should be treated as headers
headerRows: 1,
widths: [ '*', 40, 'auto', 'auto', 80 ],
//watermark: {text: '<?php echo $invoice_status; ?>', color: 'lightgrey', opacity: 0.3, bold: true, italics: false}, body: [
// Table Header
[
{
text: 'Product',
style: 'itemsHeader'
},
{
text: 'Qty',
style: [ 'itemsHeader', 'center']
},
{
text: 'Price',
style: [ 'itemsHeader', 'center']
},
{
text: 'Tax',
style: [ 'itemsHeader', 'center']
},
{
text: 'Total',
style: [ 'itemsHeader', 'center']
}
],
// Items
<?php
$total_tax = 0;
$sub_total = 0;
content: [ $sql_invoice_items = mysqli_query($mysqli,"SELECT * FROM invoice_items WHERE invoice_id = $invoice_id ORDER BY item_id ASC");
// Header
{ while($row = mysqli_fetch_array($sql_invoice_items)){
columns: [ $item_name = $row['item_name'];
<?php if(!empty($company_logo_base64)){ ?> $item_description = $row['item_description'];
{ $item_quantity = $row['item_quantity'];
image: '<?php echo "data:image;base64,$company_logo_base64"; ?>', $item_price = $row['item_price'];
width: 120 $item_subtotal = $row['item_price'];
}, $item_tax = $row['item_tax'];
<?php } ?> $item_total = $row['item_total'];
$tax_id = $row['tax_id'];
[ $total_tax = $item_tax + $total_tax;
{ $total_tax = number_format($total_tax,2);
text: 'Invoice', $sub_total = $item_price * $item_quantity + $sub_total;
style: 'invoiceTitle', $sub_total = number_format($sub_total, 2);
width: '*' ?>
},
{
text: '<?php echo "$invoice_prefix$invoice_number"; ?>',
style: 'invoiceNumber',
width: '*'
},
],
],
},
// Billing Headers
{
columns: [
{
text: '<?php echo $company_name; ?>',
style:'invoiceBillingTitle',
},
{
text: '<?php echo $client_name; ?>',
style:'invoiceBillingTitleClient',
},
]
},
// Billing Address
{
columns: [
{
text: '<?php echo $company_address; ?> \n <?php echo "$company_city $company_state $company_zip"; ?> \n <?php echo $company_phone; ?> \n <?php echo $company_website; ?>',
style: 'invoiceBillingAddress'
},
{
text: '<?php echo $client_address; ?> \n <?php echo "$client_city $client_state $client_zip"; ?> \n <?php echo $client_email; ?> \n <?php echo $client_phone; ?>',
style: 'invoiceBillingAddressClient'
},
]
},
// Invoice Dates
{
columns: [
{
text:'Invoice Date',
style:'invoiceDateTitle',
width: '*'
},
{
text:'<?php echo $invoice_date ?>',
style:'invoiceDateValue',
width: 80
}
]
},
{
columns: [
{
text:'Due Date',
style:'invoiceDateTitle',
width: '*'
},
{
text:'<?php echo $invoice_due ?>',
style:'invoiceDateValue',
width: 80
}
]
},
// Line breaks
'\n\n',
// Items
{
table: {
// headers are automatically repeated if the table spans over multiple pages
// you can declare how many rows should be treated as headers
headerRows: 1,
widths: [ '*', 40, 'auto', 'auto', 80 ],
body: [ // Item
// Table Header [
[ [
{ {
text: 'Product', text: '<?php echo $item_name; ?>',
style: 'itemsHeader' style:'itemTitle'
}, },
{ {
text: 'Qty', text: '<?php echo $item_description; ?>',
style: [ 'itemsHeader', 'center'] style:'itemDescription'
}, }
{ ],
text: 'Price', {
style: [ 'itemsHeader', 'center'] text:'<?php echo $item_quantity; ?>',
}, style:'itemQty'
{ },
text: 'Tax', {
style: [ 'itemsHeader', 'center'] text:'$<?php echo $item_price; ?>',
}, style:'itemNumber'
{ },
text: 'Total', {
style: [ 'itemsHeader', 'center'] text:'$<?php echo $item_tax; ?>',
} style:'itemNumber'
], },
// Items {
<?php text: '$<?php echo $item_total; ?>',
$total_tax = 0; style:'itemTotal'
$sub_total = 0; }
],
<?php
}
?>
// END Items
]
}, // table
layout: 'lightHorizontalLines'
},
// TOTAL
{
table: {
// headers are automatically repeated if the table spans over multiple pages
// you can declare how many rows should be treated as headers
headerRows: 0,
widths: [ '*', 80 ],
$sql_invoice_items = mysqli_query($mysqli,"SELECT * FROM invoice_items WHERE invoice_id = $invoice_id ORDER BY item_id ASC"); body: [
// Total
while($row = mysqli_fetch_array($sql_invoice_items)){ [
$item_name = $row['item_name']; {
$item_description = $row['item_description']; text:'Subtotal',
$item_quantity = $row['item_quantity']; style:'itemsFooterSubTitle'
$item_price = $row['item_price']; },
$item_subtotal = $row['item_price']; {
$item_tax = $row['item_tax']; text:'$<?php echo $sub_total; ?>',
$item_total = $row['item_total']; style:'itemsFooterSubValue'
$tax_id = $row['tax_id']; }
$total_tax = $item_tax + $total_tax; ],
$total_tax = number_format($total_tax,2); [
$sub_total = $item_price * $item_quantity + $sub_total; {
$sub_total = number_format($sub_total, 2); text:'Tax',
echo " style:'itemsFooterSubTitle'
},
// Item 1 {
[ text: '$<?php echo number_format($total_tax,2); ?>',
[ style:'itemsFooterSubValue'
{ }
text: '$item_name', ],
style:'itemTitle' [
}, {
{ text:'Total',
text: '$item_description', style:'itemsFooterTotalTitle'
style:'itemDescription' },
{
} text: '$<?php echo number_format($invoice_amount,2); ?>',
], style:'itemsFooterTotalValue'
{ }
text:'$item_quantity', ],
style:'itemQty' [
}, {
{ text:'Paid',
text:'$$item_price', style:'itemsFooterSubTitle'
style:'itemNumber' },
}, {
{ text: '$<?php echo number_format($amount_paid,2); ?>',
text:'$$item_tax', style:'itemsFooterSubValue'
style:'itemNumber' }
}, ],
{ [
text: '$$item_total', {
style:'itemTotal' text:'Balance',
} style:'itemsFooterSubTitle'
], },
{
"; text: '$<?php echo number_format($balance,2); ?>',
style:'itemsFooterSubValue'
} }
],
?> ]
}, // table
// END Items layout: 'lightHorizontalLines'
] },
}, // table {
layout: 'lightHorizontalLines' text: 'Notes',
}, style:'notesTitle'
// TOTAL },
{ {
table: { text: '<?php //echo $invoice_note; ?>',
// headers are automatically repeated if the table spans over multiple pages style:'notesText'
// you can declare how many rows should be treated as headers }
headerRows: 0, ], //End Content,
widths: [ '*', 80 ], styles: {
// Document Footer
body: [ documentFooterCenter: {
// Total fontSize: 10,
[ margin: [5,5,5,5],
{ alignment:'center'
text:'Subtotal', },
style:'itemsFooterSubTitle' // Invoice Title
},
{
text:'$<?php echo $sub_total; ?>',
style:'itemsFooterSubValue'
}
],
[
{
text:'Tax',
style:'itemsFooterSubTitle'
},
{
text: '$<?php echo number_format($total_tax,2); ?>',
style:'itemsFooterSubValue'
}
],
[
{
text:'Total',
style:'itemsFooterTotalTitle'
},
{
text: '$<?php echo number_format($invoice_amount,2); ?>',
style:'itemsFooterTotalValue'
}
],
[
{
text:'Paid',
style:'itemsFooterSubTitle'
},
{
text: '$<?php echo number_format($amount_paid,2); ?>',
style:'itemsFooterSubValue'
}
],
[
{
text:'Balance',
style:'itemsFooterSubTitle'
},
{
text: '$<?php echo number_format($balance,2); ?>',
style:'itemsFooterSubValue'
}
],
]
}, // table
layout: 'lightHorizontalLines'
},
{
text: 'Notes',
style:'notesTitle'
},
{
text: '<?php ?>',
style:'notesText'
}
],
styles: {
// Document Footer
documentFooterCenter: {
fontSize: 10,
margin: [5,5,5,5],
alignment:'center'
},
// Invoice Title
invoiceTitle: { invoiceTitle: {
fontSize: 18, fontSize: 18,
bold: true, bold: true,
@@ -790,7 +779,6 @@ include("footer.php");
fontSize: 14, fontSize: 14,
alignment:'right' alignment:'right'
}, },
// Billing Headers // Billing Headers
invoiceBillingTitle: { invoiceBillingTitle: {
fontSize: 14, fontSize: 14,
@@ -806,14 +794,14 @@ include("footer.php");
}, },
// Billing Details // Billing Details
invoiceBillingAddress: { invoiceBillingAddress: {
fontSize: 10, fontSize: 10,
lineHeight: 1.2 lineHeight: 1.2
}, },
invoiceBillingAddressClient: { invoiceBillingAddressClient: {
fontSize: 10, fontSize: 10,
lineHeight: 1.2, lineHeight: 1.2,
alignment:'right', alignment:'right',
margin:[0,0,0,30] margin:[0,0,0,30]
}, },
// Invoice Dates // Invoice Dates
invoiceDateTitle: { invoiceDateTitle: {
@@ -827,77 +815,76 @@ include("footer.php");
}, },
// Items Header // Items Header
itemsHeader: { itemsHeader: {
fontSize: 10, fontSize: 10,
margin: [0,5,0,5], margin: [0,5,0,5],
bold: true bold: true
}, },
// Item Title // Item Title
itemTitle: { itemTitle: {
fontSize: 10, fontSize: 10,
bold: true, bold: true,
margin: [0,5,0,3] margin: [0,5,0,3]
}, },
itemDescription: { itemDescription: {
italics: true, italics: true,
fontSize: 9, fontSize: 9,
lineHeight: 1.1, lineHeight: 1.1,
margin: [0,3,0,5] margin: [0,3,0,5]
}, },
itemQty: { itemQty: {
fontSize: 10, fontSize: 10,
margin: [0,5,0,5], margin: [0,5,0,5],
alignment: 'center', alignment: 'center',
}, },
itemNumber: { itemNumber: {
fontSize: 10, fontSize: 10,
margin: [0,5,0,5], margin: [0,5,0,5],
alignment: 'center', alignment: 'center',
}, },
itemTotal: { itemTotal: {
fontSize: 10, fontSize: 10,
margin: [0,5,0,5], margin: [0,5,0,5],
bold: true, bold: true,
alignment: 'center', alignment: 'center',
}, },
// Items Footer (Subtotal, Total, Tax, etc) // Items Footer (Subtotal, Total, Tax, etc)
itemsFooterSubTitle: { itemsFooterSubTitle: {
fontSize: 10, fontSize: 10,
margin: [0,5,0,5], margin: [0,5,0,5],
alignment:'right', alignment:'right',
}, },
itemsFooterSubValue: { itemsFooterSubValue: {
fontSize: 10, fontSize: 10,
margin: [0,5,0,5], margin: [0,5,0,5],
bold: true, bold: true,
alignment:'center', alignment:'center',
}, },
itemsFooterTotalTitle: { itemsFooterTotalTitle: {
fontSize: 10, fontSize: 10,
margin: [0,5,0,5], margin: [0,5,0,5],
bold: true, bold: true,
alignment:'right', alignment:'right',
}, },
itemsFooterTotalValue: { itemsFooterTotalValue: {
fontSize: 10, fontSize: 10,
margin: [0,5,0,5], margin: [0,5,0,5],
bold: true, bold: true,
alignment:'center', alignment:'center',
}, },
notesTitle: { notesTitle: {
fontSize: 10, fontSize: 10,
bold: true, bold: true,
margin: [0,50,0,3], margin: [0,50,0,3],
}, },
notesText: { notesText: {
fontSize: 10 fontSize: 10
}, },
center: { center: {
alignment:'center', alignment:'center',
}, },
}, },
defaultStyle: { defaultStyle: {
columnGap: 20, columnGap: 20,
} }
}; }
</script> </script>

View File

@@ -86,7 +86,7 @@ if ($total_found_rows > 10) {
} }
if($total_found_rows == 0){ if($total_found_rows == 0){
echo "<center><h3 class='text-secondary'><i class='fa fa-fw fa-2x fa-meh-rolling-eyes'></i><br>Records? What..</h3></center>"; echo "<center><i class='far fa-fw fa-6x fa-meh-rolling-eyes text-secondary'></i><h3 class='text-secondary mt-2'>Records? whattt</h3></center>";
} }
?> ?>