getnamingo-registry/cp/resources/views/partials/js-transactions.twig
2024-01-09 08:10:23 +02:00

89 lines
No EOL
4 KiB
Twig

<script src="/assets/js/tabulator.min.js" defer></script>
<script src="/assets/js/tabler.min.js" defer></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.18.5/xlsx.full.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf-autotable/3.6.0/jspdf.plugin.autotable.min.js"></script>
<script>
var table;
currency = "{{ currency }} ";
document.addEventListener("DOMContentLoaded", function(){
table = new Tabulator("#transactionTable", {
ajaxURL:"/api/records/statement?join=registrar", // Set the URL for your JSON data
ajaxConfig:"GET",
pagination:"local",
paginationSize:10,
ajaxResponse:function(url, params, response){
return response.records;
},
layout:"fitDataFill",
responsiveLayout: "collapse",
responsiveLayoutCollapseStartOpen:false,
resizableColumns:false,
initialSort:[
{column:"date", dir:"desc"},
],
columns:[
{formatter:"responsiveCollapse", width:30, minWidth:30, hozAlign:"center", resizable:false, headerSort:false, responsive:0},
{title:"{{ __('Registrar') }}", field:"registrar_id.name", headerSort:true, responsive:0},
{title:"{{ __('Date') }}", field:"date", headerSort:true, responsive:2},
{title:"{{ __('Command') }}", field:"command", headerSort:true, responsive:2},
{title:"{{ __('Domain') }}", field:"domain_name", headerSort:false, download:false, responsive:0},
{title:"{{ __('Length') }}", field:"length_in_months", headerSort:true, responsive:2},
{title:"{{ __('From') }}", field:"fromS", headerSort:true, responsive:2},
{title:"{{ __('To') }}", field:"toS", headerSort:true, responsive:2},
{title:"{{ __('Amount') }}", field:"amount", headerSort:false, download:false, responsive:2, formatter:"money", formatterParams:{
decimal:".",
thousand:" ",
symbol:currency,
negativeSign:true,
}},
],
placeholder:function(){
return this.getHeaderFilters().length ? "No Matching Data" : "{{ __('No Data') }}"; //set placeholder based on if there are currently any header filters
}
});
var searchInput = document.getElementById("search-input");
searchInput.addEventListener("input", function () {
var term = searchInput.value.toLowerCase();
if (term) { // Only apply the filter when there's a term to search for
table.setFilter(function (data) {
// Check if any of the fields contain the search term
return (
String(data.registrar_id.name).toLowerCase().includes(term) ||
String(data.date).toLowerCase().includes(term) ||
String(data.command).toLowerCase().includes(term) ||
String(data.domain_name).toLowerCase().includes(term) ||
String(data.length_in_months).toString().toLowerCase().includes(term) ||
String(data.from).toLowerCase().includes(term) ||
String(data.to).toLowerCase().includes(term) ||
String(data.amount).toString().toLowerCase().includes(term)
);
});
} else {
table.clearFilter(); // Clear the filter when the search box is emptied
}
});
});
function downloadCSV() {
table.download("csv", "data.csv");
}
function downloadJSON() {
table.download("json", "data.json");
}
function downloadXLSX() {
table.download("xlsx", "data.xlsx", {sheetName:"My Transactions"});
}
function downloadPDF() {
table.download("pdf", "data.pdf", {
orientation:"portrait",
title:"My Transactions",
jsPDF:{unit:"mm", format:"a4", orientation:"p"}
});
}
</script>