feat: add financial year and YTD defaults to dashboard date filter
This commit is contained in:
@@ -120,6 +120,22 @@
|
||||
<!-- Date Range Filter Bar -->
|
||||
<div class="max-w-[1600px] mx-auto px-6 py-2 flex items-center gap-3 border-t border-white/5">
|
||||
<svg class="w-4 h-4 text-slate-400 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"/></svg>
|
||||
|
||||
<label class="text-xs text-slate-400">Financial Year</label>
|
||||
<select id="filter-fy" onchange="applyFinancialYear()" class="bg-white/5 border border-white/10 rounded-lg px-3 py-1.5 text-xs text-white focus:border-red-500 focus:outline-none focus:ring-1 focus:ring-red-500/30">
|
||||
<option value="" class="bg-slate-900 text-white">Custom / YTD</option>
|
||||
<script>
|
||||
const currentYear = new Date().getFullYear();
|
||||
// If before March, current FY started last year
|
||||
const currentFYStart = new Date().getMonth() < 2 ? currentYear - 1 : currentYear;
|
||||
for (let y = currentFYStart; y >= 2020; y--) {
|
||||
document.write(`<option value="${y}" class="bg-slate-900 text-white">FY ${y}/${(y+1).toString().substring(2)}</option>`);
|
||||
}
|
||||
</script>
|
||||
</select>
|
||||
|
||||
<div class="h-4 border-l border-white/10 mx-1"></div>
|
||||
|
||||
<label class="text-xs text-slate-400">From</label>
|
||||
<input type="date" id="filter-from" class="bg-white/5 border border-white/10 rounded-lg px-3 py-1.5 text-xs text-white focus:border-red-500 focus:outline-none focus:ring-1 focus:ring-red-500/30" />
|
||||
<label class="text-xs text-slate-400">To</label>
|
||||
@@ -377,8 +393,22 @@
|
||||
|
||||
// ── Date filter helpers ──
|
||||
function getDateParams() {
|
||||
const from = document.getElementById('filter-from').value;
|
||||
const to = document.getElementById('filter-to').value;
|
||||
let from = document.getElementById('filter-from').value;
|
||||
let to = document.getElementById('filter-to').value;
|
||||
|
||||
// Default to YTD if both are empty
|
||||
if (!from && !to) {
|
||||
const now = new Date();
|
||||
from = `${now.getFullYear()}-01-01`;
|
||||
to = now.toISOString().split('T')[0];
|
||||
|
||||
// Update the visual inputs
|
||||
document.getElementById('filter-from').value = from;
|
||||
document.getElementById('filter-to').value = to;
|
||||
|
||||
setTimeout(updateFilterStatus, 50);
|
||||
}
|
||||
|
||||
const params = new URLSearchParams();
|
||||
if (from) params.set('from', from);
|
||||
if (to) params.set('to', to);
|
||||
@@ -386,9 +416,32 @@ function getDateParams() {
|
||||
}
|
||||
|
||||
function clearDateFilter() {
|
||||
document.getElementById('filter-fy').value = '';
|
||||
document.getElementById('filter-from').value = '';
|
||||
document.getElementById('filter-to').value = '';
|
||||
document.getElementById('filter-status').textContent = '';
|
||||
// When cleared, getDateParams will automatically set it back to YTD
|
||||
// and updateFilterStatus will be called via timeout
|
||||
loadAllData();
|
||||
}
|
||||
|
||||
function applyFinancialYear() {
|
||||
const fyYear = document.getElementById('filter-fy').value;
|
||||
if (!fyYear) return;
|
||||
|
||||
const startYear = parseInt(fyYear);
|
||||
const endYear = startYear + 1;
|
||||
|
||||
// Financial year starts March 1st
|
||||
const from = `${startYear}-03-01`;
|
||||
|
||||
// Calculate last day of Feb taking leap years into account
|
||||
const isLeapYear = (endYear % 4 === 0 && endYear % 100 !== 0) || (endYear % 400 === 0);
|
||||
const to = `${endYear}-02-${isLeapYear ? '29' : '28'}`;
|
||||
|
||||
document.getElementById('filter-from').value = from;
|
||||
document.getElementById('filter-to').value = to;
|
||||
|
||||
updateFilterStatus();
|
||||
loadAllData();
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user