File: /home/slfopp7cb1df/www/conradinvestmentgroup.com/pm/app/Views/invoices/invoice_overview_widget.php
<?php
$progress_overdue = 0;
$progress_not_paid = 0;
$progress_partially_paid = 0;
$progress_fully_paid = 0;
$progress_draft = 0;
if ($total_invoices) {
$progress_overdue = round($overdue_invoices / $total_invoices * 100);
$progress_not_paid = round($not_paid_invoices / $total_invoices * 100);
$progress_partially_paid = round($partially_paid_invoices / $total_invoices * 100);
$progress_fully_paid = round($fully_paid_invoices / $total_invoices * 100);
$progress_draft = round($draft_invoices / $total_invoices * 100);
}
?>
<div id="invoice-overview-widget-container">
<div class="card bg-white">
<div class="card-header">
<i data-feather="file-text" class="icon-16"></i> <?php echo app_lang("invoice_overview"); ?>
<?php if ($currencies && $login_user->user_type == "staff") { ?>
<div class="float-end">
<span class="float-end dropdown">
<div class="dropdown-toggle clickable" type="button" data-bs-toggle="dropdown" aria-expanded="true" >
<span class="ml10 mr10"><i data-feather="more-horizontal" class="icon"></i></span>
</div>
<ul class="dropdown-menu" role="menu">
<li>
<?php
$default_currency = get_setting("default_currency");
$default_currency_symbol = get_setting("currency_symbol");
echo js_anchor($default_currency, array("class" => "dropdown-item load-currency-wise-data-for-invoice-overview", "data-value" => $default_currency, "data-currency-symbol" => $default_currency_symbol)); //default currency
foreach ($currencies as $currency) {
echo js_anchor($currency->currency, array("class" => "dropdown-item load-currency-wise-data-for-invoice-overview", "data-value" => $currency->currency, "data-currency-symbol" => $currency->currency_symbol));
}
?>
</li>
</ul>
</span>
</div>
<?php } ?>
</div>
<div class="card-body rounded-bottom" id="invoice-overview-container">
<a href="<?php echo get_uri('invoices/index/custom/overdue/' . $invoice_currency); ?>" data-filter="overdue" class="text-default">
<div class="d-flex p-2">
<div class="w40p text-truncate">
<div style="background-color: #F5325C;" class="color-tag border-circle wh10"></div><?php echo app_lang("overdue"); ?>
</div>
<div class="w20p">
<div class='progress widget-progress-bar' title='<?php echo $progress_overdue; ?>%'>
<div class='progress-bar bg-danger' role='progressbar' style="width: <?php echo $progress_overdue; ?>%;" aria-valuenow='<?php echo $progress_overdue; ?>%' aria-valuemin='0' aria-valuemax='100'></div>
</div>
</div>
<div class="w15p text-center"><?php echo $overdue_invoices; ?></div>
<div class="w25p text-end"><?php echo to_currency($invoices_info->overdue, $currency_symbol); ?></div>
</div>
</a>
<a href="<?php echo get_uri('invoices/index/custom/not_paid/' . $invoice_currency); ?>" data-filter="not_paid" class="text-default">
<div class="d-flex p-2">
<div class="w40p text-truncate">
<div style="background-color: #FAC108;" class="color-tag border-circle wh10"></div><?php echo app_lang("not_paid"); ?>
</div>
<div class="w20p">
<div class='progress widget-progress-bar' title='<?php echo $progress_not_paid; ?>%'>
<div class='progress-bar bg-orange' role='progressbar' style="width: <?php echo $progress_not_paid; ?>%;" aria-valuenow='<?php echo $progress_not_paid; ?>%' aria-valuemin='0' aria-valuemax='100'></div>
</div>
</div>
<div class="w15p text-center"><?php echo $not_paid_invoices; ?></div>
<div class="w25p text-end"><?php echo to_currency($invoices_info->not_paid, $currency_symbol); ?></div>
</div>
</a>
<a href="<?php echo get_uri('invoices/index/custom/partially_paid/' . $invoice_currency); ?>" data-filter="partially_paid" class="text-default">
<div class="d-flex p-2">
<div class="w40p text-truncate">
<div style="background-color: #6690F4;" class="color-tag border-circle wh10"></div><?php echo app_lang("partially_paid"); ?>
</div>
<div class="w20p">
<div class='progress widget-progress-bar' title='<?php echo $progress_partially_paid; ?>%'>
<div class='progress-bar' role='progressbar' style="width: <?php echo $progress_partially_paid; ?>%; background-color: #6690F4;" aria-valuenow='<?php echo $progress_partially_paid; ?>%' aria-valuemin='0' aria-valuemax='100'></div>
</div>
</div>
<div class="w15p text-center"><?php echo $partially_paid_invoices; ?></div>
<div class="w25p text-end"><?php echo to_currency($invoices_info->partially_paid_total, $currency_symbol); ?></div>
</div>
</a>
<a href="<?php echo get_uri('invoices/index/custom/fully_paid/' . $invoice_currency); ?>" data-filter="fully_paid" class="text-default">
<div class="d-flex p-2">
<div class="w40p text-truncate">
<div style="background-color: #485BBD;" class="color-tag border-circle wh10"></div><?php echo app_lang("fully_paid"); ?>
</div>
<div class="w20p">
<div class='progress widget-progress-bar' title='<?php echo $progress_fully_paid; ?>%'>
<div class='progress-bar' role='progressbar' style="width: <?php echo $progress_fully_paid; ?>%; background-color: #485BBD;" aria-valuenow='<?php echo $progress_fully_paid; ?>%' aria-valuemin='0' aria-valuemax='100'></div>
</div>
</div>
<div class="w15p text-center"><?php echo $fully_paid_invoices; ?></div>
<div class="w25p text-end"><?php echo to_currency($invoices_info->fully_paid_total, $currency_symbol); ?></div>
</div>
</a>
<a href="<?php echo get_uri('invoices/index/custom/draft/' . $invoice_currency); ?>" data-filter="draft" class="text-default">
<div class="d-flex p-2">
<div class="w40p text-truncate">
<div style="background-color: #6C757D;" class="color-tag border-circle wh10"></div><?php echo app_lang("draft"); ?>
</div>
<div class="w20p">
<div class='progress widget-progress-bar' title='<?php echo $progress_draft; ?>%'>
<div class="progress-bar bg-secondary" role="progressbar" style="width: <?php echo $progress_draft; ?>%;" aria-valuenow="<?php echo $progress_draft; ?>" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<div class="w15p text-center"><?php echo $draft_invoices; ?></div>
<div class="w25p text-end"><?php echo to_currency($invoices_info->draft_total, $currency_symbol); ?></div>
</div>
</a>
<div class='widget-footer bottom-25 position-absolute w90p'>
<div class="col-md-12">
<div class="row">
<div class='col-md-5 col-5 ps-4'>
<div><?php echo app_lang("total_invoiced"); ?></div>
<div class="strong"><?php echo to_currency($invoices_info->invoices_total, $currency_symbol); ?></div>
<div class="mt10"><?php echo app_lang("due"); ?></div>
<div class="strong "><?php echo to_currency($invoices_info->due, $currency_symbol); ?></div>
</div>
<div class="col-md-7 col-7">
<div><?php echo app_lang("last_12_months"); ?></div>
<div class="invoice-line-chart-container">
<canvas id="invoice-overview-chart" style="width: 100%; height: 70px;"></canvas>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script>
$(document).ready(function () {
initScrollbar('#invoice-overview-container', {
setHeight: 330
});
var invoicePaymentChart = document.getElementById("invoice-overview-chart");
var ticks = <?php echo $ticks; ?>;
new Chart(invoicePaymentChart, {
type: 'line',
data: {
labels: ticks,
datasets: [{
label: "<?php echo app_lang('invoices'); ?>",
borderColor: '#6690F4',
backgroundColor: 'transparent',
borderWidth: 2,
pointRadius: 0,
fill: true,
data: <?php echo $invoices; ?>
}]
},
options: {
responsive: true,
tooltips: {
intersect: false,
enabled: true,
callbacks: {
title: function (tooltipItems, data) {
return false;
},
label: function (tooltipItems, data) {
if (tooltipItems) {
return tooltipItems.xLabel + ": " + toCurrency(tooltipItems.yLabel, " <?php echo $currency_symbol; ?>");
} else {
return false;
}
}
}
},
legend: {
display: false
},
scales: {
xAxes: [{
display: false
}],
yAxes: [{
gridLines: {
display: false
},
ticks: {
display: false
}
}]
}
}
});
$(".load-currency-wise-data-for-invoice-overview").click(function () {
var currencyValue = $(this).attr("data-value");
var currencySymbol = $(this).attr("data-currency-symbol");
$.ajax({
url: "<?php echo get_uri('invoices/load_invoice_overview_statistics_of_selected_currency') ?>",
type: 'POST',
data: {
"currency": currencyValue,
"currency_symbol": currencySymbol
},
dataType: 'json',
success: function (result) {
if (result.success) {
$("#invoice-overview-widget-container").html(result.statistics);
}
}
});
});
});
</script>