FIX_INVOICE FORM, FEAT_TOTAL IN REPORT

This commit is contained in:
Srinivas-Saravanan 2024-12-31 15:41:01 +05:30
parent 1c3e47b623
commit 9cbf6ac3fa
3 changed files with 355 additions and 347 deletions

View File

@ -483,13 +483,13 @@ if (isset($invoice_item_details[0]['to_subscription']) && !empty($invoice_item_d
<div class="form-group col-md-6"> <div class="form-group col-md-6">
<span style="<?= $shippingChargesStyle ?>"> <span style="<?= $shippingChargesStyle ?>">
<label for="shippingChargesLabel">Charge Name </label> <label for="shippingChargesLabel">Charge Name </label>
<input type="text" class="form-control" id="shippingChargesLabel" name="shippingChargesLabel" placeholder="Shipping Charges Label" value="<?= isset($invoice_details['shipping_label']) ? $invoice_details['shipping_label'] : 'Shipping Charge' ?>" oninput="calculateOverallTotals()" <?= $shippingChargesHidden ?>> <input type="text" class="form-control" id="shippingChargesLabel" name="shippingChargesLabel" placeholder="Shipping Charges Label" value="<?= isset($invoice_details['shipping_label']) ? $invoice_details['shipping_label'] : 'Shipping Charge' ?>" <?= $shippingChargesHidden ?>>
</span> </span>
</div> </div>
<div class="form-group col-md-6"> <div class="form-group col-md-6">
<span style="<?= $shippingChargesStyle ?>"> <span style="<?= $shippingChargesStyle ?>">
<label for="shippingCharges">Charge Amount </label> <label for="shippingCharges">Charge Amount </label>
<input type="number" class="form-control" id="shippingCharges" name="shippingCharges" placeholder="Charges Amount" value="<?= isset($invoice_details['shipping_charge']) ? $invoice_details['shipping_charge'] : 0 ?>" oninput="calculateOverallTotals()" <?= $shippingChargesHidden ?> step="0.001" > <input type="number" class="form-control" id="shippingCharges" name="shippingCharges" placeholder="Charges Amount" value="<?= isset($invoice_details['shipping_charge']) ? $invoice_details['shipping_charge'] : 0 ?>" oninput="if(this.value) calculateOverallTotals()" <?= $shippingChargesHidden ?> step="0.001" >
</span> </span>
</div> </div>
</div> </div>
@ -1197,7 +1197,7 @@ if (isset($invoice_item_details[0]['to_subscription']) && !empty($invoice_item_d
// Calculate the total using the formula: subtotal - tax + shipping - discount // Calculate the total using the formula: subtotal - tax + shipping - discount
var total = overallAmount - overallTax + shippingCharges - overallDiscount; var total = overallAmount - overallTax + shippingCharges - overallDiscount;
console.log(total); // console.log(total);
// Update the subtotal, tax, shipping charges, discount, and total in the calculation card // Update the subtotal, tax, shipping charges, discount, and total in the calculation card
var subtotalElement = parseFloat(overallAmount.toFixed(2)); var subtotalElement = parseFloat(overallAmount.toFixed(2));
@ -2551,111 +2551,112 @@ $('#saveButton').click(function() {
function hideBillingShippingModel(params) { function hideBillingShippingModel(params) {
$('#editAddressesCheckbox').click(); $('#editAddressesCheckbox').click();
} }
// When discount is entered (keyup event)
$('#discount').keyup(function() {
// Ensure the discount type is set (percentage or fixed amount)
if ($('#discount-type').css('display') == 'none') {
$('#discount-type').val('%');
}
$('#discount-type').show();
$('#discount-type').attr('name', 'dis_type');
// Clear individual item discount fields
$('.item-discount-amount').val('');
$('#discount').keyup(function() { var discountValue = $(this).val();
if($('#discount-type').css('display') == 'none'){ var discountType = $('#discount-type').val();
$('#discount-type').val('%');
}
$('#discount-type').show();
$('#discount-type').attr('name', 'dis_type');
$('.item-discount-amount').val(''); // Calculate the total amount of items (subtotal)
var totalAmount = 0;
var discountValue = $(this).val(); $('.item-amount').each(function() {
var discountType = $('#discount-type').val(); totalAmount += parseFloat($(this).val()) || 0; // Ensure it's a number
var totalAmount = 0 ;
var discountLastValue = 0;
$('.item-amount').each(function() {
totalAmount += parseInt($(this).val());
});
if (discountType == '%') {
discountLastValue = totalAmount - (totalAmount * discountValue / 100 );
}else{
discountLastValue = totalAmount - discountValue;
}
var shippingCharges = $('#shippingCharges').val();
if (isNaN(shippingCharges)) {
shippingCharges =0;
}
discountLastValue += parseInt(shippingCharges);
$('#exacttotal').val(discountLastValue);
$('#grandtotal').val(parseInt(discountLastValue));
$('#balanceAmount').val(parseInt(discountLastValue));
// var discountedPrice = calculateDiscountedPrice(discountValue);
// $('#discounted-price').text(discountedPrice);
}); });
function discountTypeKeyup(params) { // Apply the discount based on the discount type
if($('#discount-type').css('display') == 'none'){ var discountedAmount = 0;
$('#discount-type').val('%'); if (discountType == '%') {
} discountedAmount = totalAmount - (totalAmount * discountValue / 100);
$('#discount-type').show(); } else {
discountedAmount = totalAmount - discountValue;
$('.item-discount-amount').val('');
var discountValue = $('#discount').val();
var discountType = $('#discount-type').val();
var totalAmount = 0 ;
var discountLastValue = 0;
$('.item-amount').each(function() {
totalAmount += parseInt($(this).val());
});
if (discountType == '%') {
discountLastValue = totalAmount - (totalAmount * discountValue / 100 );
}else{
discountLastValue = totalAmount - discountValue;
}
var shippingCharges = $('#shippingCharges').val();
if (isNaN(shippingCharges)) {
shippingCharges =0;
}
discountLastValue += parseInt(shippingCharges);
$('#exacttotal').val(discountLastValue );
$('#grandtotal').val(parseInt(discountLastValue));
$('#balanceAmount').val(parseInt(discountLastValue));
} }
$('#discount-type').change(function () { // Get the shipping charges and ensure it's a valid number
var shippingCharges = parseFloat($('#shippingCharges').val()) || 0;
var discountValue = $('#discount').val(); // Final total after adding shipping charges
var discountType = $(this).val(); var finalTotal = discountedAmount + shippingCharges;
var totalAmount = 0 ; // Update the fields with the calculated values
var discountLastValue = 0; $('#subtotal').val(totalAmount.toFixed(2)); // Subtotal remains as the sum of item amounts
$('.item-amount').each(function() { $('#exacttotal').val(finalTotal.toFixed(2)); // Final total after discount and shipping
totalAmount += parseInt( $(this).val()); $('#grandtotal').val(finalTotal.toFixed(2)); // Grand total
}); $('#balanceAmount').val(finalTotal.toFixed(2)); // Balance amount (same as final total)
});
if (discountType == '%') { // When the discount type is changed (percentage or fixed)
discountLastValue = totalAmount - (totalAmount * discountValue / 100 ); $('#discount-type').change(function() {
}else{ var discountValue = $('#discount').val();
discountLastValue = totalAmount - discountValue; var discountType = $(this).val();
}
var shippingCharges = $('#shippingCharges').val(); // Calculate the total amount of items (subtotal)
if (isNaN(shippingCharges)) { var totalAmount = 0;
shippingCharges =0; $('.item-amount').each(function() {
} totalAmount += parseFloat($(this).val()) || 0; // Ensure it's a number
discountLastValue += parseInt(shippingCharges); });
// Apply the discount based on the discount type
var discountedAmount = 0;
if (discountType == '%') {
discountedAmount = totalAmount - (totalAmount * discountValue / 100);
} else {
discountedAmount = totalAmount - discountValue;
}
// Get the shipping charges and ensure it's a valid number
var shippingCharges = parseFloat($('#shippingCharges').val()) || 0;
// Final total after adding shipping charges
var finalTotal = discountedAmount + shippingCharges;
// Update the fields with the calculated values
$('#subtotal').val(totalAmount.toFixed(2)); // Subtotal remains as the sum of item amounts
$('#exacttotal').val(finalTotal.toFixed(2)); // Final total after discount and shipping
$('#grandtotal').val(finalTotal.toFixed(2)); // Grand total
$('#balanceAmount').val(finalTotal.toFixed(2)); // Balance amount (same as final total)
});
// When shipping charge is updated
$('#shippingCharges').keyup(function() {
// Recalculate the final total with shipping charge
var shippingCharges = parseFloat($(this).val()) || 0;
// Recalculate the discount and apply shipping
var discountValue = $('#discount').val();
var discountType = $('#discount-type').val();
// Calculate the total amount of items (subtotal)
var totalAmount = 0;
$('.item-amount').each(function() {
totalAmount += parseFloat($(this).val()) || 0; // Ensure it's a number
});
// Apply the discount based on the discount type
var discountedAmount = 0;
if (discountType == '%') {
discountedAmount = totalAmount - (totalAmount * discountValue / 100);
} else {
discountedAmount = totalAmount - discountValue;
}
// Final total after adding shipping charges
var finalTotal = discountedAmount + shippingCharges;
// Update the fields with the recalculated values
$('#exacttotal').val(finalTotal.toFixed(2)); // Final total after discount and shipping
$('#grandtotal').val(finalTotal.toFixed(2)); // Grand total
$('#balanceAmount').val(finalTotal.toFixed(2)); // Balance amount (same as final total)
});
$('#exacttotal').val(discountLastValue);
$('#grandtotal').val(parseInt(discountLastValue));
$('#balanceAmount').val(parseInt(discountLastValue));
})
</script> </script>

View File

@ -24,40 +24,45 @@
</div> </div>
</div> </div>
<!-- Table Section -->
<div class="row"> <div class="row">
<div class="col-12"> <div class="col-12">
<div class="card"> <div class="card">
<div class="card-body"> <div class="card-body">
<div class="table-responsive"> <div class="table-responsive">
<table style="width: 100;" id="datatable-buttons" class="table table-striped nowrap w-100"> <table style="width: 100%;" id="datatable-buttons" class="table table-striped nowrap w-100">
<thead> <thead>
<tr> <tr>
<th><b>Publisher Code</b></th> <th><b>Publisher Code</b></th>
<th><b>Publisher Item Count</b></th> <th><b>Publisher Item Count</b></th>
<th><b>Publisher Total Cost</b></th> <th><b>Publisher Total Cost</b></th>
<th style="width: 10%;"><b>Book Name</b></th> <th style="width: 10%;"><b>Book Name</b></th>
<th><b>Item Count</b></th> <th><b>Item Count</b></th>
<th><b>Payment method</b></th> <th><b>Payment method</b></th>
<th style="text-align: center;"><b>Total Cost</b></th> <th style="text-align: center;"><b>Total Cost</b></th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<?php foreach ($report_data as $row): ?> <?php foreach ($report_data as $row): ?>
<?php foreach ($row->books as $book): ?> <?php foreach ($row->books as $book): ?>
<tr> <tr>
<td style="text-align: center;"><?= isset($row->publisher_code) ? $row->publisher_code : '-' ?></td> <td style="text-align: center;"><?= isset($row->publisher_code) ? $row->publisher_code : '-' ?></td>
<td style="text-align: center;"><?= $row->publisher_item_count ?></td> <td style="text-align: center;"><?= $row->publisher_item_count ?></td>
<td style="text-align: right;"><?= number_format($row->publisher_total_cost, 2) ?></td> <td style="text-align: right;"><?= number_format($row->publisher_total_cost, 2) ?></td>
<td style="text-align: left;"><?= $book->book_name ?></td> <td style="text-align: left;"><?= $book->book_name ?></td>
<td style="text-align: center;"><?= $book->item_count ?></td> <td style="text-align: center;"><?= $book->item_count ?></td>
<td style="text-align: left;"><?= strtoupper($row->payment_method) ?></td> <td style="text-align: left;"><?= strtoupper($row->payment_method) ?></td>
<td style="text-align: right;"><?= number_format($book->total_cost, 2) ?></td> <td style="text-align: right;"><?= number_format($book->total_cost, 2) ?></td>
</tr> </tr>
<?php endforeach; ?>
<?php endforeach; ?> <?php endforeach; ?>
</tr> <?php endforeach; ?>
</tbody> </tbody>
<tfoot>
<tr class="total-row">
<td colspan="6" style="text-align: right; font-weight: bold;">Total</td>
<td class="total" style="text-align: right;"></td>
</tr>
</tfoot>
</table> </table>
</div> </div>
</div> <!-- end card body--> </div> <!-- end card body-->
@ -66,43 +71,64 @@
</div> </div>
<!-- end row--> <!-- end row-->
<script> <script>
$(document).ready(function() { $(document).ready(function () {
var table = $('#datatable-buttons').DataTable({ var table = $('#datatable-buttons').DataTable({
"order": [ dom: '<"row mb-3"<"col-md-6 d-flex align-items-center"B><"col-md-6 d-flex justify-content-end"f>>rtip',
[0, 'desc'] buttons: [
], {
"dom": '<"row mb-3"<"col-md-6 d-flex align-items-center"B><"col-md-6 d-flex justify-content-end"f>>rtip',
buttons: [{
extend: 'print', extend: 'print',
title: '<?= $page_name.' ' .$selected_data ?>', title: '<?= $page_name . " " . $selected_data ?>',
text: 'Print', text: 'Print',
customize: function(win) { customize: function (win) {
// Exclude the first and last columns var total = calculateTotal();
$(win.document.body).find('table').find('th:first-child, td:first-child').remove(); $(win.document.body)
.append(`<div style="text-align: right; font-weight: bold; margin-top: 20px;">Total Amount: ₹${total}</div>`);
} }
}, },
{ {
extend: 'csv', extend: 'csv',
text: 'CSV', text: 'CSV',
title: '<?= $page_name.' ' .$selected_data ?>', title: '<?= $page_name . " " . $selected_data ?>',
exportOptions: { customize: function (csv) {
columns: ':not(:first-child)' var total = calculateTotal();
var csvRows = csv.split("\n");
var columnCount = csvRows[0].split(",").length;
var emptyCells = Array(columnCount - 2).fill("").join(","); // Adjust the number of empty cells
var totalRow = `${emptyCells},Total,₹${total}`;
csvRows.push(totalRow);
return csvRows.join("\n");
} }
} }
],
columnDefs: [{
type: 'date',
targets: [1, 2, 3, 4, 5, 6],
orderable: false
}
// Specify the column index for date sorting and disable sorting
] ]
}); });
// Add date range filter and dropdowns // Function to calculate the total for print/CSV export
function calculateTotal() {
var total = table.rows({ filter: 'applied' }).data().pluck(6).reduce(function (a, b) {
return a + parseFloat(b) || 0; // Sum the 7th column (index 6) which represents the total cost
}, 0);
return total.toFixed(2);
}
// Add total row to the table footer (this will display the total in the table)
table.on('draw', function () {
updateTotal();
});
// Function to update the total in the footer
function updateTotal() {
var total = table.rows({ filter: 'applied' }).data().pluck(6).reduce(function (a, b) {
return a + parseFloat(b) || 0;
}, 0);
$('#datatable-buttons tfoot .total').html(`₹${total.toFixed(2)}`);
}
// Add date range filter and dropdowns for the table columns
$('#datatable-buttons thead tr').clone(true).appendTo('#datatable-buttons thead'); $('#datatable-buttons thead tr').clone(true).appendTo('#datatable-buttons thead');
$('#datatable-buttons thead tr:eq(1) th').each(function(i) { $('#datatable-buttons thead tr:eq(1) th').each(function(i) {
var title = $(this).text(); var title = $(this).text();
@ -122,65 +148,54 @@
select.append('<option value="' + d + '">' + d + '</option>'); select.append('<option value="' + d + '">' + d + '</option>');
}); });
// Handle column search using the input
$('input', this).on('keyup change', function() { $('input', this).on('keyup change', function() {
if (table.column(i).search() !== this.value) { if (table.column(i).search() !== this.value) {
table table.column(i).search(this.value).draw();
.column(i)
.search(this.value)
.draw();
} }
}); });
}); });
// Add date range filter for "Invoice Date" column // Date range picker initialization
moment.updateLocale('en', { var $select_data = '<?php echo $selected_data; ?>';
longDateFormat: {
L: 'DD/MM/YYYY',
// LTS: 'h:mm:ss A',
// LTS: 'h:mm A',
}
});
$(document).ready(function() { var dateRangeFilter = $('input.input-daterange-datepicker')
var $select_data = '<?php echo $selected_data; ?>'; .daterangepicker({
locale: {
var dateRangeFilter = $('input.input-daterange-datepicker') format: 'DD/MM/YYYY',
.daterangepicker({ cancelLabel: 'Clear'
locale: { },
format: 'DD/MM/YYYY', startDate: $select_data ? moment($select_data.split(' - ')[0], 'DD/MM/YYYY') : moment(),
cancelLabel: 'Clear' endDate: $select_data ? moment($select_data.split(' - ')[1], 'DD/MM/YYYY') : moment(),
}, ranges: {
startDate: $select_data ? moment($select_data.split(' - ')[0], 'DD/MM/YYYY') : moment(), 'Today': [moment(), moment()],
endDate: $select_data ? moment($select_data.split(' - ')[1], 'DD/MM/YYYY') : moment(), 'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
ranges: { 'This Month': [moment().startOf('month'), moment().endOf('month')]
'Today': [moment(), moment()], }
'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')], })
'This Month': [moment().startOf('month'), moment().endOf('month')] .on('apply.daterangepicker', function(ev, picker) {
} var formattedStartDate = picker.startDate.format('DD/MM/YYYY');
}) var formattedEndDate = picker.endDate.format('DD/MM/YYYY');
.on('apply.daterangepicker', function(ev, picker) { var selectedDateRange = formattedStartDate + ' - ' + formattedEndDate;
var formattedStartDate = picker.startDate.format('DD/MM/YYYY'); $(this).val(selectedDateRange);
var formattedEndDate = picker.endDate.format('DD/MM/YYYY'); table.draw(); // Redraw table when date range changes
var selectedDateRange = formattedStartDate + ' - ' + formattedEndDate; })
$(this).val(selectedDateRange); .on('cancel.daterangepicker', function() {
}) $(this).val('');
.on('cancel.daterangepicker', function() { table.draw(); // Redraw table when date range is cleared
$(this).val('');
});
$('.today-btn').on('click', function() {
var today = moment();
dateRangeFilter.data('daterangepicker').setStartDate(today);
dateRangeFilter.data('daterangepicker').setEndDate(today);
dateRangeFilter.val(today.format('DD/MM/YYYY') + ' - ' + today.format('DD/MM/YYYY'));
dateRangeFilter.trigger('apply.daterangepicker');
}); });
// Trigger "Today" button click to set it as default if $select_data is empty $('.today-btn').on('click', function() {
if ($select_data === '') { var today = moment();
$('.today-btn').trigger('click'); dateRangeFilter.data('daterangepicker').setStartDate(today);
} dateRangeFilter.data('daterangepicker').setEndDate(today);
dateRangeFilter.val(today.format('DD/MM/YYYY') + ' - ' + today.format('DD/MM/YYYY'));
dateRangeFilter.trigger('apply.daterangepicker');
}); });
// Trigger "Today" button click to set it as default if $select_data is empty
if ($select_data === '') {
$('.today-btn').trigger('click');
}
}); });
</script> </script>

View File

@ -1,46 +1,45 @@
<style> <style>
.payment-button {
background-color: #f9f9f9;
color: #333;
border: 1px solid #ddd;
border-radius: 5px;
padding: 8px;
font-size: 0.9rem;
cursor: pointer;
text-align: center;
line-height: 1.3;
width: 100%;
height: 100%;
box-shadow: none;
}
.payment-button { .payment-button:hover {
background-color: #f9f9f9; /* Light background color matching the card */ background-color: #f0f0f0;
color: #333; /* Dark text for readability */ }
border: 1px solid #ddd; /* Subtle border for the button */
border-radius: 5px; /* Rounded corners */
padding: 8px; /* Inner padding for compactness */
font-size: 0.9rem; /* Font size for button text */
cursor: pointer; /* Pointer cursor on hover */
text-align: center; /* Center-align text */
line-height: 1.3; /* Adjust line height for multiline text */
width: 100%; /* Button fills card width */
height: 100%; /* Button fills card height */
box-shadow: none; /* Remove extra shadow for a flat look */
}
.payment-button:hover { .card-summary {
background-color: #f0f0f0; /* Slightly darker background on hover */ flex: 0 1 auto;
box-shadow: none; /* Keep flat design on hover */ text-align: center;
} border: none;
background-color: transparent;
width: 170px;
height: 70px;
padding-left: 20px;
}
.card-summary { .nav {
flex: 0 1 auto; /* Prevent layout disruptions */ display: flex;
text-align: center; /* Center-align content */ flex-wrap: wrap;
border: none; /* No border for container */ gap: 10px;
background-color: transparent; /* Transparent container */ list-style: none;
width: 170px; /* Card width */ padding: 5px;
height: 70px; /* Card height */ margin-bottom: 10px;
padding-left: 20px; }
}
.nav {
display: flex; /* Keep existing layout */
flex-wrap: wrap; /* Allow wrapping */
gap: 10px; /* Spacing between cards */
list-style: none; /* Remove list style */
padding: 5px; /* Padding for layout */
margin-bottom: 10px; /* Margin below */
}
</style> </style>
<!-- start page title -->
<div class="row d-flex align-items-center"> <!-- start page title -->
<div class="row d-flex align-items-center">
<!-- Title Section --> <!-- Title Section -->
<div class="col-md-4"> <div class="col-md-4">
<div class="page-title-box page-title-box-alt"> <div class="page-title-box page-title-box-alt">
@ -65,46 +64,44 @@
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div> <div>
<ul class="nav"> <ul class="nav">
<?php <?php
// Initialize an empty array to combine amounts // Initialize an empty array to combine amounts
$combinedPayments = []; $combinedPayments = [];
foreach ($payment_data['result2'] as $key => $amount) { foreach ($payment_data['result2'] as $key => $amount) {
if ($key != '' && $key != null) { if ($key != '' && $key != null) {
// Simplify and group payment method names // Simplify and group payment method names
$key = strtoupper($key); $key = strtoupper($key);
if (stripos($key, 'PAYTM') !== false) { if (stripos($key, 'PAYTM') !== false) {
$key = 'PAYTM'; $key = 'PAYTM';
} elseif (stripos($key, 'BANKTRANSFER') !== false) { } elseif (stripos($key, 'BANKTRANSFER') !== false) {
$key = 'BANK TRANSFER'; $key = 'BANK TRANSFER';
} elseif (stripos($key, 'CASH ON DELIVERY') !== false) { } elseif (stripos($key, 'CASH ON DELIVERY') !== false) {
$key = 'COD'; $key = 'COD';
} }
// Combine amounts for the same payment method // Combine amounts for the same payment method
if (!isset($combinedPayments[$key])) { if (!isset($combinedPayments[$key])) {
$combinedPayments[$key] = 0; $combinedPayments[$key] = 0;
}
$combinedPayments[$key] += $amount;
} }
$combinedPayments[$key] += $amount;
} }
}
// Display the combined results
foreach ($combinedPayments as $paymentMethod => $totalAmount) { ?>
<li>
<div class="card-summary">
<button id='payment_method_button' class="payment-button" style="font-weight: 401;">
<?= $paymentMethod ?> <br> ₹<?= $totalAmount ?>
</button>
</div>
</li>
<?php } ?>
</ul>
// Display the combined results
foreach ($combinedPayments as $paymentMethod => $totalAmount) { ?>
<li>
<div class="card-summary">
<button id='payment_method_button' class="payment-button" style="font-weight: 401;">
<?= $paymentMethod ?> <br> ₹<?= $totalAmount ?>
</button>
</div>
</li>
<?php } ?>
</ul>
</div> </div>
</div> </div>
@ -125,7 +122,7 @@
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<?php $total = 0; // Initialize total variable ?> <?php $total = 0; ?>
<?php foreach ($payment_data['result1'] as $row) { ?> <?php foreach ($payment_data['result1'] as $row) { ?>
<tr> <tr>
<td style="text-align: left;"><?php echo $row["invoice_number"]; ?></td> <td style="text-align: left;"><?php echo $row["invoice_number"]; ?></td>
@ -137,24 +134,17 @@
<td style="text-align: center;"><?= $row['payment_status'] ?></td> <td style="text-align: center;"><?= $row['payment_status'] ?></td>
<td style="text-align:right;padding-right: 67px;"><?= $row['total_amount'] ?></td> <td style="text-align:right;padding-right: 67px;"><?= $row['total_amount'] ?></td>
<?php <?php
$total += $row['total_amount']; // Add each row's total_amount to $total $total += $row['total_amount'];
?> ?>
</tr> </tr>
<?php } ?> <?php } ?>
<!-- Total row -->
</tbody> </tbody>
<!-- <tr> <tfoot>
<tr>
<td colspan="5" style="text-align: right; font-weight: bold;">Total Amount</td> <td colspan="5" style="text-align: right; font-weight: bold;">Total Amount</td>
<td class="total-row" style="text-align: right;"></td> <td class="total-row" style="text-align: right;"></td>
</tr> --> </tr>
<?php //<?= isset($total) ? $total : "" ?> </tfoot>
<tfoot>
<tr>
<td colspan="5" style="text-align: right; font-weight: bold;">Total Amount</td>
<td class="total-row" style="text-align: right;"></td>
</tr>
</tfoot>
</table> </table>
</div> </div>
</div> <!-- end card body--> </div> <!-- end card body-->
@ -166,23 +156,40 @@
<script> <script>
$(document).ready(function () { $(document).ready(function () {
var table = $('#datatable-buttons').DataTable({ var table = $('#datatable-buttons').DataTable({
"dom": '<"row mb-3"<"col-md-6 d-flex align-items-center"B><"col-md-6 d-flex justify-content-end"f>>rtip', dom: '<"row mb-3"<"col-md-6 d-flex align-items-center"B><"col-md-6 d-flex justify-content-end"f>>rtip',
buttons: [ buttons: [
{ {
extend: 'print', extend: 'print',
title: '<?= $page_name.' ' .$selected_data ?>', title: '<?= $page_name . " " . $selected_data ?>',
text: 'Print', text: 'Print',
customize: function (win) { } customize: function (win) {
var total = calculateTotal();
$(win.document.body)
.append(`<div style="text-align: right; font-weight: bold; margin-top: 20px;">Total Amount: ₹${total}</div>`);
}
}, },
{ {
extend: 'csv', extend: 'csv',
text: 'CSV', text: 'CSV',
title: '<?= $page_name.' ' .$selected_data ?>', title: '<?= $page_name . " " . $selected_data ?>',
exportOptions: {} customize: function (csv) {
var total = calculateTotal();
var csvRows = csv.split("\n");
var columnCount = csvRows[0].split(",").length;
var emptyCells = Array(columnCount - 2).fill("").join(",");
var totalRow = `${emptyCells},Total,₹${total}`;
csvRows.push(totalRow);
return csvRows.join("\n");
}
} }
] ]
}); });
// Function to calculate the total of the filtered rows
function updateTotal() { function updateTotal() {
var total = table.rows({ filter: 'applied' }).data().pluck(5).reduce(function (a, b) { var total = table.rows({ filter: 'applied' }).data().pluck(5).reduce(function (a, b) {
return a + parseFloat(b) || 0; return a + parseFloat(b) || 0;
@ -191,9 +198,16 @@
$('#datatable-buttons tfoot .total-row').html(total.toFixed(2)); $('#datatable-buttons tfoot .total-row').html(total.toFixed(2));
} }
// Function to calculate the total for print/CSV export
function calculateTotal() {
var total = table.rows({ filter: 'applied' }).data().pluck(5).reduce(function (a, b) {
return a + parseFloat(b) || 0;
}, 0);
return total.toFixed(2);
}
$(document).on('click', '.payment-button', function () { $(document).on('click', '.payment-button', function () {
var paymentMethod = $(this).contents().first().text().trim().toUpperCase().split(" ").join(""); var paymentMethod = $(this).contents().first().text().trim().toUpperCase().split(" ").join("");
console.log(paymentMethod);
if (!paymentMethod) { if (!paymentMethod) {
return; return;
} }
@ -201,7 +215,7 @@
paymentMethod = 'Cash on delivery'; paymentMethod = 'Cash on delivery';
} }
table.column(3) table.column(3)
.search('^' + paymentMethod + '$', true, false) // Use regex for exact match .search('^' + paymentMethod + '$', true, false)
.draw(); .draw();
updateTotal(); updateTotal();
@ -211,66 +225,44 @@
}); });
</script> </script>
<script> <script>
// $(document).ready(function () { $(document).ready(function() {
// // Initially hide all nested tables var $select_data = '<?php echo $selected_data; ?>';
// $('.nested-table-data').hide();
// // Toggle nested table visibility on parent row click var dateRangeFilter = $('input.input-daterange-datepicker')
// $('.custom-tbody tr').click(function () { .daterangepicker({
// var nestedTable = $(this).next().find('.nested-table-data'); locale: {
format: 'DD/MM/YYYY',
// // Toggle visibility cancelLabel: 'Clear'
// nestedTable.slideToggle(); },
startDate: $select_data ? moment($select_data.split(' - ')[0], 'DD/MM/YYYY') : moment(),
// // You can add additional styling or animation here if needed endDate: $select_data ? moment($select_data.split(' - ')[1], 'DD/MM/YYYY') : moment(),
ranges: {
// // Prevent the parent row from triggering the toggle when nested table row is clicked 'Today': [moment(), moment()],
// return false; 'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
// }); 'This Month': [moment().startOf('month'), moment().endOf('month')]
// });
// </script>
<script>
$(document).ready(function() {
var $select_data = '<?php echo $selected_data; ?>';
var dateRangeFilter = $('input.input-daterange-datepicker')
.daterangepicker({
locale: {
format: 'DD/MM/YYYY',
cancelLabel: 'Clear'
},
startDate: $select_data ? moment($select_data.split(' - ')[0], 'DD/MM/YYYY') : moment(),
endDate: $select_data ? moment($select_data.split(' - ')[1], 'DD/MM/YYYY') : moment(),
ranges: {
'Today': [moment(), moment()],
'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
'This Month': [moment().startOf('month'), moment().endOf('month')]
}
})
.on('apply.daterangepicker', function(ev, picker) {
var formattedStartDate = picker.startDate.format('DD/MM/YYYY');
var formattedEndDate = picker.endDate.format('DD/MM/YYYY');
var selectedDateRange = formattedStartDate + ' - ' + formattedEndDate;
$(this).val(selectedDateRange);
})
.on('cancel.daterangepicker', function() {
$(this).val('');
});
$('.today-btn').on('click', function() {
var today = moment();
dateRangeFilter.data('daterangepicker').setStartDate(today);
dateRangeFilter.data('daterangepicker').setEndDate(today);
dateRangeFilter.val(today.format('DD/MM/YYYY') + ' - ' + today.format('DD/MM/YYYY'));
dateRangeFilter.trigger('apply.daterangepicker');
});
// Trigger "Today" button click to set it as default if $select_data is empty
if ($select_data === '') {
$('.today-btn').trigger('click');
} }
})
.on('apply.daterangepicker', function(ev, picker) {
var formattedStartDate = picker.startDate.format('DD/MM/YYYY');
var formattedEndDate = picker.endDate.format('DD/MM/YYYY');
var selectedDateRange = formattedStartDate + ' - ' + formattedEndDate;
$(this).val(selectedDateRange);
})
.on('cancel.daterangepicker', function() {
$(this).val('');
}); });
</script>
$('.today-btn').on('click', function() {
var today = moment();
dateRangeFilter.data('daterangepicker').setStartDate(today);
dateRangeFilter.data('daterangepicker').setEndDate(today);
dateRangeFilter.val(today.format('DD/MM/YYYY') + ' - ' + today.format('DD/MM/YYYY'));
dateRangeFilter.trigger('apply.daterangepicker');
});
if ($select_data === '') {
$('.today-btn').trigger('click');
}
});
</script>