UI spruce up on invoice details, also now more mobile friendly

This commit is contained in:
johnnyq
2023-02-17 13:58:55 -05:00
parent 8a91ae0e46
commit 3742051e03
4 changed files with 102 additions and 77 deletions

View File

@@ -23,20 +23,20 @@ if (isset($_GET['invoice_id'])) {
}
$row = mysqli_fetch_array($sql);
$invoice_id = $row['invoice_id'];
$invoice_id = intval($row['invoice_id']);
$invoice_prefix = htmlentities($row['invoice_prefix']);
$invoice_number = htmlentities($row['invoice_number']);
$invoice_scope = htmlentities($row['invoice_scope']);
$invoice_status = htmlentities($row['invoice_status']);
$invoice_date = $row['invoice_date'];
$invoice_due = $row['invoice_due'];
$invoice_date = htmlentities($row['invoice_date']);
$invoice_due = htmlentities($row['invoice_due']);
$invoice_amount = floatval($row['invoice_amount']);
$invoice_currency_code = htmlentities($row['invoice_currency_code']);
$invoice_note = htmlentities($row['invoice_note']);
$invoice_url_key = htmlentities($row['invoice_url_key']);
$invoice_created_at = $row['invoice_created_at'];
$category_id = $row['invoice_category_id'];
$client_id = $row['client_id'];
$invoice_created_at = htmlentities($row['invoice_created_at']);
$category_id = intval($row['invoice_category_id']);
$client_id = intval($row['client_id']);
$client_name = htmlentities($row['client_name']);
$location_address = htmlentities($row['location_address']);
$location_city = htmlentities($row['location_city']);
@@ -48,11 +48,11 @@ if (isset($_GET['invoice_id'])) {
$contact_mobile = formatPhoneNumber($row['contact_mobile']);
$client_website = htmlentities($row['client_website']);
$client_currency_code = htmlentities($row['client_currency_code']);
$client_net_terms = htmlentities($row['client_net_terms']);
$client_net_terms = intval($row['client_net_terms']);
if ($client_net_terms == 0) {
$client_net_terms = $config_default_net_terms;
}
$company_id = $row['company_id'];
$company_id = intval($row['company_id']);
$company_name = htmlentities($row['company_name']);
$company_country = htmlentities($row['company_country']);
$company_address = htmlentities($row['company_address']);
@@ -119,7 +119,7 @@ if (isset($_GET['invoice_id'])) {
<div class="row">
<div class="col-md-4">
<div class="col-8">
<?php if ($invoice_status == 'Draft') { ?>
<button class="btn btn-success btn-sm dropdown-toggle" type="button" data-toggle="dropdown">
<i class="fas fa-fw fa-paper-plane"></i> Send
@@ -134,30 +134,46 @@ if (isset($_GET['invoice_id'])) {
<?php } ?>
<?php if ($invoice_status !== 'Paid' && $invoice_status !== 'Cancelled' && $invoice_status !== 'Draft') { ?>
<a class="btn btn-success btn-sm" href="#" data-toggle="modal" data-target="#addPaymentModal"><i class="fa fa-fw fa-credit-card"></i> Add Payment</a>
<a class="btn btn-success" href="#" data-toggle="modal" data-target="#addPaymentModal"><i class="fa fa-fw fa-credit-card mr-2"></i>Add Payment</a>
<?php } ?>
</div>
<div class="col-md-8">
<div class="col-4">
<div class="dropdown dropleft text-center">
<button class="btn btn-primary btn-sm float-right" type="button" data-toggle="dropdown">
<i class="fas fa-fw fa-ellipsis-v"></i>
<div class="dropdown dropleft text-center float-right">
<button class="btn btn-dark" type="button" data-toggle="dropdown">
<i class="fas fa-ellipsis-v"></i>
</button>
<div class="dropdown-menu">
<a class="dropdown-item" href="#" data-toggle="modal" data-target="#editInvoiceModal<?php echo $invoice_id; ?>">Edit</a>
<a class="dropdown-item" href="#" data-toggle="modal" data-target="#addInvoiceCopyModal<?php echo $invoice_id; ?>">Copy</a>
<a class="dropdown-item" href="#" data-toggle="modal" data-target="#addInvoiceRecurringModal<?php echo $invoice_id; ?>">Recurring</a>
<a class="dropdown-item" href="#" data-toggle="modal" data-target="#editInvoiceModal<?php echo $invoice_id; ?>">
<i class="fa fa-fw fa-edit text-secondary mr-2"></i>Edit
</a>
<a class="dropdown-item" href="#" data-toggle="modal" data-target="#addInvoiceCopyModal<?php echo $invoice_id; ?>">
<i class="fa fa-fw fa-copy text-secondary mr-2"></i>Copy
</a>
<a class="dropdown-item" href="#" data-toggle="modal" data-target="#addInvoiceRecurringModal<?php echo $invoice_id; ?>">
<i class="fa fa-fw fa-sync-alt text-secondary mr-2"></i>Recurring
</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#" onclick="window.print();">Print</a>
<a class="dropdown-item" href="#" onclick="pdfMake.createPdf(docDefinition).download('<?php echo "$invoice_date-$company_name-$client_name-Invoice-$invoice_prefix$invoice_number.pdf"; ?>');">Download PDF</a>
<a class="dropdown-item" href="#" onclick="window.print();">
<i class="fa fa-fw fa-print text-secondary mr-2"></i>Print
</a>
<a class="dropdown-item" href="#" onclick="pdfMake.createPdf(docDefinition).download('<?php echo "$invoice_date-$company_name-$client_name-Invoice-$invoice_prefix$invoice_number.pdf"; ?>');">
<i class="fa fa-fw fa-download text-secondary mr-2"></i>Download PDF
</a>
<?php if (!empty($config_smtp_host) && !empty($contact_email)) { ?>
<a class="dropdown-item" href="post.php?email_invoice=<?php echo $invoice_id; ?>">Send Email</a>
<a class="dropdown-item" href="post.php?email_invoice=<?php echo $invoice_id; ?>">
<i class="fa fa-fw fa-paper-plane text-secondary mr-2"></i>Send Email
</a>
<?php } ?>
<a class="dropdown-item" target="_blank" href="guest_view_invoice.php?invoice_id=<?php echo "$invoice_id&url_key=$invoice_url_key"; ?>">Guest URL</a>
<a class="dropdown-item" target="_blank" href="guest_view_invoice.php?invoice_id=<?php echo "$invoice_id&url_key=$invoice_url_key"; ?>">
<i class="fa fa-fw fa-link text-secondary mr-2"></i>Guest URL
</a>
<?php if ($invoice_status !== 'Cancelled' && $invoice_status !== 'Paid') { ?>
<div class="dropdown-divider"></div>
<a class="dropdown-item text-danger" href="post.php?cancel_invoice=<?php echo $invoice_id; ?>">Cancel</a>
<a class="dropdown-item text-danger text-bold" href="post.php?cancel_invoice=<?php echo $invoice_id; ?>">
<i class="fa fa-fw fa-times mr-2"></i>Cancel
</a>
<?php } ?>
</div>
</div>
@@ -171,10 +187,10 @@ if (isset($_GET['invoice_id'])) {
<div class="card-body">
<div class="row mb-4">
<div class="col-sm-2">
<div class="col-2">
<img class="img-fluid" src="<?php echo "uploads/settings/$company_id/$company_logo"; ?>" alt="Company logo">
</div>
<div class="col-sm-10">
<div class="col-10">
<div class="ribbon-wrapper">
<div class="ribbon bg-<?php echo $invoice_badge_color; ?>">
<?php echo $invoice_status; ?>
@@ -185,7 +201,7 @@ if (isset($_GET['invoice_id'])) {
</div>
<div class="row mb-4">
<div class="col-sm">
<div class="col">
<ul class="list-unstyled">
<li><h4><strong><?php echo $company_name; ?></strong></h4></li>
<li><?php echo $company_address; ?></li>
@@ -195,7 +211,7 @@ if (isset($_GET['invoice_id'])) {
<li><?php echo $company_website; ?></li>
</ul>
</div>
<div class="col-sm">
<div class="col">
<ul class="list-unstyled text-right">
<li><h4><strong><?php echo $client_name; ?></strong></h4></li>
<li><?php echo $location_address; ?></li>
@@ -248,25 +264,34 @@ if (isset($_GET['invoice_id'])) {
$sub_total = 0;
while ($row = mysqli_fetch_array($sql_invoice_items)) {
$item_id = $row['item_id'];
$item_id = intval($row['item_id']);
$item_name = htmlentities($row['item_name']);
$item_description = htmlentities($row['item_description']);
$item_quantity = floatval($row['item_quantity']);
$item_price = floatval($row['item_price']);
$item_tax = floatval($row['item_tax']);
$item_total = floatval($row['item_total']);
$item_created_at = $row['item_created_at'];
$tax_id = $row['item_tax_id'];
$item_created_at = htmlentities($row['item_created_at']);
$tax_id = intval($row['item_tax_id']);
$total_tax = $item_tax + $total_tax;
$sub_total = $item_price * $item_quantity + $sub_total;
?>
<tr>
<td class="text-center d-print-none">
<td class="d-print-none">
<?php if ($invoice_status !== "Paid" && $invoice_status !== "Cancelled") { ?>
<a class="text-secondary" href="#" data-toggle="modal" data-target="#editItemModal<?php echo $item_id; ?>"><i class="fa fa-fw fa-edit"></i></a>
<a class="text-danger" href="post.php?delete_invoice_item=<?php echo $item_id; ?>"><i class="fa fa-fw fa-trash-alt"></i></a>
<div class="dropdown">
<button class="btn btn-sm btn-light" type="button" data-toggle="dropdown">
<i class="fas fa-ellipsis-v"></i>
</button>
<div class="dropdown-menu">
<a class="dropdown-item" href="#" data-toggle="modal" data-target="#editItemModal<?php echo $item_id; ?>"><i class="fa fa-fw fa-edit mr-2"></i>Edit</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item text-danger" href="post.php?delete_invoice_item=<?php echo $item_id; ?>"><i class="fa fa-fw fa-times mr-2"></i>Remove</a>
</div>
</div>
<?php } ?>
</td>
<td><?php echo $item_name; ?></td>
@@ -296,15 +321,15 @@ if (isset($_GET['invoice_id'])) {
<td><input type="number" step="0.01" min="0" class="form-control" style="text-align: center;" id="qty" name="qty" placeholder="QTY"></td>
<td><input type="number" step="0.01" class="form-control" style="text-align: right;" id="price" name="price" placeholder="Price (<?php echo $invoice_currency_code; ?>)"></td>
<td>
<select class="form-control select2" name="tax_id" required>
<option value="0">None</option>
<select class="form-control" name="tax_id" required>
<option value="0">No Tax</option>
<?php
$taxes_sql = mysqli_query($mysqli, "SELECT * FROM taxes WHERE company_id = $session_company_id ORDER BY tax_name ASC");
while ($row = mysqli_fetch_array($taxes_sql)) {
$tax_id = $row['tax_id'];
$tax_id = intval($row['tax_id']);
$tax_name = htmlentities($row['tax_name']);
$tax_percent = htmlentities($row['tax_percent']);
$tax_percent = floatval($row['tax_percent']);
?>
<option value="<?php echo $tax_id; ?>"><?php echo "$tax_name $tax_percent%"; ?></option>
@@ -313,9 +338,9 @@ if (isset($_GET['invoice_id'])) {
?>
</select>
</td>
<td>
<button class="btn btn-link text-success" type="submit" name="add_invoice_item">
<i class="fa fa-fw fa-check"></i>
<td class="text-center">
<button class="btn btn-light text-success" type="submit" name="add_invoice_item">
<i class="fa fa-check"></i>
</button>
</td>
</form>
@@ -330,10 +355,10 @@ if (isset($_GET['invoice_id'])) {
<div class="row mb-4">
<div class="col-sm-7">
<div class="card">
<div class="card-header">
<div class="card-header text-bold">
Notes
<div class="card-tools d-print-none">
<a href="#" class="btn btn-tool" data-toggle="modal" data-target="#invoiceNoteModal">
<a href="#" class="btn btn-light btn-tool" data-toggle="modal" data-target="#invoiceNoteModal">
<i class="fas fa-edit"></i>
</a>
</div>
@@ -380,8 +405,8 @@ if (isset($_GET['invoice_id'])) {
<div class="row d-print-none mb-3">
<div class="col-sm">
<div class="card">
<div class="card-header">
<i class="fa fa-fw fa-history"></i> History
<div class="card-header text-bold">
<i class="fa fa-fw fa-history mr-2"></i>History
<div class="card-tools">
<button type="button" class="btn btn-tool" data-card-widget="collapse">
<i class="fas fa-minus"></i>
@@ -394,11 +419,11 @@ if (isset($_GET['invoice_id'])) {
<div class="card-body">
<table class="table">
<thead>
<tr>
<th>Date</th>
<th>Status</th>
<th>Description</th>
</tr>
<tr>
<th>Date</th>
<th>Status</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<?php
@@ -425,8 +450,8 @@ if (isset($_GET['invoice_id'])) {
</div>
<div class="col-sm d-print-none">
<div class="card">
<div class="card-header">
<i class="fa fa-fw fa-credit-card"></i> Payments
<div class="card-header text-bold">
<i class="fa fa-fw fa-credit-card mr-2"></i>Payments
<div class="card-tools">
<button type="button" class="btn btn-tool" data-card-widget="collapse">
<i class="fas fa-minus"></i>
@@ -439,21 +464,21 @@ if (isset($_GET['invoice_id'])) {
<div class="card-body">
<div class="table-responsive">
<table class="table">
<thead>
<tr>
<th>Date</th>
<th class="text-right">Amount</th>
<th>Reference</th>
<th>Account</th>
<th class="text-center">Action</th>
</tr>
<thead class="<?php if(mysqli_num_rows($sql_payments) == 0) { echo "d-none"; } ?>">
<tr>
<th>Date</th>
<th class="text-right">Amount</th>
<th>Reference</th>
<th>Account</th>
<th></th>
</tr>
</thead>
<tbody>
<?php
while ($row = mysqli_fetch_array($sql_payments)) {
$payment_id = $row['payment_id'];
$payment_date = $row['payment_date'];
$payment_id = intval($row['payment_id']);
$payment_date = htmlentities($row['payment_date']);
$payment_amount = floatval($row['payment_amount']);
$payment_currency_code = htmlentities($row['payment_currency_code']);
$payment_reference = htmlentities($row['payment_reference']);
@@ -465,7 +490,7 @@ if (isset($_GET['invoice_id'])) {
<td class="text-right"><?php echo numfmt_format_currency($currency_format, $payment_amount, $payment_currency_code); ?></td>
<td><?php echo $payment_reference; ?></td>
<td><?php echo $account_name; ?></td>
<td class="text-center"><a class="btn btn-danger btn-sm" href="post.php?delete_payment=<?php echo $payment_id; ?>"><i class="fa fa-trash"></i></a></td>
<td class="text-center"><a class="btn btn-light text-danger" href="post.php?delete_payment=<?php echo $payment_id; ?>"><i class="fa fa-times"></i></a></td>
</tr>
<?php
}