Add Excel export to Billplz Transaction Summary

This commit is contained in:
Afiq Hamzah
2026-06-24 15:34:26 +08:00
parent 403459ca2f
commit eea205ef65
5 changed files with 293 additions and 17 deletions
@@ -10,14 +10,23 @@
</breadcrumb>
<div class="container p-4 mx-auto">
<div class="flex mb-0 border-b border-gray-200">
<button class="flex items-center tab-button active" data-tab="pkb-transactions-summary">
<span>PKB (v2)</span>
</button>
<button class="flex items-center tab-button" data-tab="kopkb-transactions-summary">
<span>KOPKB (v3)</span>
</button>
<div class="container pt-4 mx-auto">
<div class="flex mb-0 border-b border-gray-200 justify-between items-center">
<div class="flex">
<button class="flex items-center tab-button active" data-tab="pkb-transactions-summary">
<span>PKB (v2)</span>
</button>
<button class="flex items-center tab-button" data-tab="kopkb-transactions-summary">
<span>KOPKB (v3)</span>
</button>
</div>
<a id="export-summary-btn"
href="{{ route('transaction.online.billplz-transaction-summary.export', ['selectedDate' => $date, 'tab' => 'pkb']) }}"
data-date="{{ $date }}"
class="bg-gray-500 text-white py-2 px-6 font-medium rounded-xl hover:bg-gray-600 transition-all duration-300 mb-1">
<i class="fas fa-file-excel mr-2"></i> <span id="export-summary-text">Export Excel for v2</span>
</a>
</div>
</div>
<div>
<div id="pkb-transactions-summary" class="container p-4 mx-auto bg-yellow-50 tab-content active">
@@ -210,6 +219,17 @@
document.addEventListener('DOMContentLoaded', function() {
const tabButtons = document.querySelectorAll('.tab-button');
const tabContents = document.querySelectorAll('.tab-content');
const exportBtn = document.getElementById('export-summary-btn');
const exportText = document.getElementById('export-summary-text');
const selectedDate = exportBtn.getAttribute('data-date');
const exportBaseUrl = "{{ route('transaction.online.billplz-transaction-summary.export') }}";
function updateExportButton(tabId) {
const tab = tabId === 'kopkb-transactions-summary' ? 'kopkb' : 'pkb';
const version = tabId === 'kopkb-transactions-summary' ? 'v3' : 'v2';
exportBtn.href = exportBaseUrl + '?selectedDate=' + encodeURIComponent(selectedDate) + '&tab=' + tab;
exportText.textContent = 'Export Excel for ' + version;
}
tabButtons.forEach(button => {
button.addEventListener('click', () => {
@@ -221,8 +241,9 @@
// Activate the clicked tab
button.classList.add('active');
console.log(tabId)
document.getElementById(tabId).classList.add('active');
updateExportButton(tabId);
});
});
});