date drop added

This commit is contained in:
odzugkoev
2026-03-10 20:36:25 -04:00
parent 50f4501cdd
commit 1b40187ade
6 changed files with 305 additions and 24 deletions

View File

@@ -301,8 +301,16 @@ class DatabaseManager {
params.push(filters.status);
}
if (filters.date) {
// Get orders from start of day to end of day
if (filters.startDate && filters.endDate) {
query += ' AND created_at BETWEEN ? AND ?';
params.push(filters.startDate, filters.endDate);
} else if (filters.startDate) {
query += ' AND created_at >= ?';
params.push(filters.startDate);
} else if (filters.endDate) {
query += ' AND created_at <= ?';
params.push(filters.endDate);
} else if (filters.date) {
const startOfDay = Math.floor(new Date(filters.date).setHours(0, 0, 0, 0) / 1000);
const endOfDay = Math.floor(new Date(filters.date).setHours(23, 59, 59, 999) / 1000);
query += ' AND created_at BETWEEN ? AND ?';
@@ -333,9 +341,7 @@ class DatabaseManager {
}));
}
getOrderStats() {
const today = Math.floor(new Date().setHours(0, 0, 0, 0) / 1000);
getOrderStats(startDate = null, endDate = null) {
const stats = {
total: 0,
new: 0,
@@ -343,12 +349,23 @@ class DatabaseManager {
ready: 0
};
const rows = this.db.prepare(`
SELECT local_status, COUNT(*) as count
FROM orders
WHERE created_at >= ?
GROUP BY local_status
`).all(today);
let query, params;
if (startDate != null && endDate != null) {
query = 'SELECT local_status, COUNT(*) as count FROM orders WHERE created_at BETWEEN ? AND ? GROUP BY local_status';
params = [startDate, endDate];
} else if (startDate != null) {
query = 'SELECT local_status, COUNT(*) as count FROM orders WHERE created_at >= ? GROUP BY local_status';
params = [startDate];
} else if (endDate != null) {
query = 'SELECT local_status, COUNT(*) as count FROM orders WHERE created_at <= ? GROUP BY local_status';
params = [endDate];
} else {
const today = Math.floor(new Date().setHours(0, 0, 0, 0) / 1000);
query = 'SELECT local_status, COUNT(*) as count FROM orders WHERE created_at >= ? GROUP BY local_status';
params = [today];
}
const rows = this.db.prepare(query).all(...params);
for (const row of rows) {
if (row.local_status === 'new') stats.new = row.count;

View File

@@ -1,6 +1,6 @@
{
"name": "kitchen-agent",
"version": "1.0.6",
"version": "1.0.7",
"description": "Kitchen Agent for ThinkLink Food Order Management",
"main": "server.js",
"scripts": {

View File

@@ -420,6 +420,70 @@ button, a, input, select, textarea {
color: white;
}
/* Date Filter */
.date-filter-group {
display: flex;
align-items: center;
gap: 10px;
flex-wrap: wrap;
}
.date-filter-select {
padding: 10px 14px;
border: 2px solid #ddd;
border-radius: 4px;
font-size: 15px;
font-weight: 500;
color: #333;
background-color: #fff;
cursor: pointer;
min-height: 48px;
min-width: 160px;
transition: border-color 0.3s;
appearance: auto;
}
.date-filter-select:focus {
outline: none;
border-color: #667eea;
}
.date-filter-custom {
display: flex;
align-items: center;
gap: 8px;
flex-wrap: wrap;
}
.date-filter-input {
padding: 9px 12px;
border: 2px solid #ddd;
border-radius: 4px;
font-size: 14px;
color: #333;
background-color: #fff;
min-height: 44px;
transition: border-color 0.3s;
}
.date-filter-input:focus {
outline: none;
border-color: #667eea;
}
.date-filter-separator {
font-size: 14px;
color: #666;
font-weight: 500;
}
.date-filter-apply {
padding: 9px 18px !important;
font-size: 14px !important;
min-height: 44px !important;
white-space: nowrap;
}
/* Sync Button with Integrated Loading State */
.sync-button {
position: relative;
@@ -1047,6 +1111,14 @@ button, a, input, select, textarea {
justify-content: center;
}
.date-filter-group {
justify-content: center;
}
.date-filter-select {
min-width: 140px;
}
.tabs {
flex-direction: column;
}
@@ -1074,6 +1146,28 @@ button, a, input, select, textarea {
width: 100%;
}
.date-filter-group {
flex-direction: column;
align-items: stretch;
}
.date-filter-select {
width: 100%;
}
.date-filter-custom {
flex-direction: column;
align-items: stretch;
}
.date-filter-input {
width: 100%;
}
.date-filter-separator {
text-align: center;
}
.status-modal-content {
padding: 25px 20px;
}

View File

@@ -1,6 +1,9 @@
// Dashboard functionality
let currentFilter = 'all';
let currentDateFilter = 'today';
let customDateStart = '';
let customDateEnd = '';
let currentOrderIdForCancel = null;
let pendingStatusChange = {
orderId: null,
@@ -118,6 +121,7 @@ function refreshAbandonedCallCount() {
// Initialize dashboard
document.addEventListener('DOMContentLoaded', function() {
setupFilterButtons();
setupDateFilter();
audioNotification.init();
refreshOrders();
refreshAbandonedCallCount();
@@ -136,19 +140,135 @@ function setupFilterButtons() {
filterButtons.forEach(button => {
button.addEventListener('click', function() {
// Remove active class from all buttons
filterButtons.forEach(btn => btn.classList.remove('active'));
// Add active class to clicked button
this.classList.add('active');
// Update filter and refresh
currentFilter = this.dataset.filter;
refreshOrders();
});
});
}
function setupDateFilter() {
const select = document.getElementById('dateFilterSelect');
const customPanel = document.getElementById('dateFilterCustom');
const applyBtn = document.getElementById('dateFilterApply');
const fromInput = document.getElementById('dateFilterFrom');
const toInput = document.getElementById('dateFilterTo');
if (!select || !customPanel || !applyBtn || !fromInput || !toInput) return;
// Set default dates on the pickers to today
const todayStr = formatDateForInput(new Date());
fromInput.value = todayStr;
toInput.value = todayStr;
select.addEventListener('change', function() {
const val = this.value;
currentDateFilter = val;
if (val === 'custom') {
customPanel.style.display = 'flex';
// Entering custom mode should immediately reflect the currently selected dates
// (defaults to today on first use). Further changes require pressing Apply.
if (fromInput.value && toInput.value) {
customDateStart = fromInput.value;
customDateEnd = toInput.value;
}
refreshOrders();
} else {
customPanel.style.display = 'none';
refreshOrders();
}
updateStatsTotalLabel();
});
applyBtn.addEventListener('click', function() {
if (!fromInput.value || !toInput.value) {
showToast('Please select both start and end dates', 'error');
return;
}
if (fromInput.value > toInput.value) {
showToast('Start date must be before end date', 'error');
return;
}
customDateStart = fromInput.value;
customDateEnd = toInput.value;
refreshOrders();
updateStatsTotalLabel();
});
// Allow pressing Enter in date inputs to apply
fromInput.addEventListener('keydown', function(e) { if (e.key === 'Enter') applyBtn.click(); });
toInput.addEventListener('keydown', function(e) { if (e.key === 'Enter') applyBtn.click(); });
}
function getDateRangeParams() {
const now = new Date();
switch (currentDateFilter) {
case 'today': {
const start = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 0, 0, 0);
const end = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 23, 59, 59, 999);
return { startDate: Math.floor(start.getTime() / 1000), endDate: Math.floor(end.getTime() / 1000) };
}
case 'yesterday': {
const yd = new Date(now);
yd.setDate(yd.getDate() - 1);
const start = new Date(yd.getFullYear(), yd.getMonth(), yd.getDate(), 0, 0, 0);
const end = new Date(yd.getFullYear(), yd.getMonth(), yd.getDate(), 23, 59, 59, 999);
return { startDate: Math.floor(start.getTime() / 1000), endDate: Math.floor(end.getTime() / 1000) };
}
case 'last7': {
const start = new Date(now);
start.setDate(start.getDate() - 6);
start.setHours(0, 0, 0, 0);
const end = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 23, 59, 59, 999);
return { startDate: Math.floor(start.getTime() / 1000), endDate: Math.floor(end.getTime() / 1000) };
}
case 'last30': {
const start = new Date(now);
start.setDate(start.getDate() - 29);
start.setHours(0, 0, 0, 0);
const end = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 23, 59, 59, 999);
return { startDate: Math.floor(start.getTime() / 1000), endDate: Math.floor(end.getTime() / 1000) };
}
case 'all':
// Use a minimal unix start date to represent "all time" without relying on server defaults.
return { startDate: 1 };
case 'custom': {
if (!customDateStart || !customDateEnd) return {};
const start = new Date(customDateStart + 'T00:00:00');
const end = new Date(customDateEnd + 'T23:59:59');
return { startDate: Math.floor(start.getTime() / 1000), endDate: Math.floor(end.getTime() / 1000) };
}
default:
return {};
}
}
function formatDateForInput(date) {
const y = date.getFullYear();
const m = String(date.getMonth() + 1).padStart(2, '0');
const d = String(date.getDate()).padStart(2, '0');
return y + '-' + m + '-' + d;
}
function updateStatsTotalLabel() {
const label = document.getElementById('stat-total-label');
if (!label) return;
const labels = {
today: 'Total Today',
yesterday: 'Total Yesterday',
last7: 'Total (7 Days)',
last30: 'Total (30 Days)',
all: 'Total (All Time)',
custom: 'Total (Custom)'
};
label.textContent = labels[currentDateFilter] || 'Total';
}
function refreshOrders() {
const syncButton = document.getElementById('syncButton');
const syncText = syncButton ? syncButton.querySelector('.sync-text') : null;
@@ -161,8 +281,15 @@ function refreshOrders() {
}
}
const statusParam = currentFilter === 'all' ? '' : currentFilter;
const url = '/api/orders' + (statusParam ? '?status=' + statusParam : '');
const params = new URLSearchParams();
if (currentFilter !== 'all') {
params.set('status', currentFilter);
}
const dateRange = getDateRangeParams();
if (dateRange.startDate) params.set('startDate', dateRange.startDate);
if (dateRange.endDate) params.set('endDate', dateRange.endDate);
const qs = params.toString();
const url = '/api/orders' + (qs ? '?' + qs : '');
fetch(url)
.then(response => response.json())

View File

@@ -36,12 +36,39 @@ async function ordersRoutes(fastify, options) {
limit: parseInt(req.query.limit, 10) || 50
};
// Get today's date for stats
const today = new Date();
filters.date = today;
const normalizeUnixSeconds = (v) => {
const n = Number(v);
if (!Number.isFinite(n) || n <= 0) return 0;
// Accept both seconds and milliseconds.
return n > 1e12 ? Math.floor(n / 1000) : Math.floor(n);
};
let startDate = normalizeUnixSeconds(req.query.startDate);
let endDate = normalizeUnixSeconds(req.query.endDate);
// Be resilient to inverted ranges
if (startDate > 0 && endDate > 0 && startDate > endDate) {
const tmp = startDate;
startDate = endDate;
endDate = tmp;
}
if (startDate > 0 && endDate > 0) {
filters.startDate = startDate;
filters.endDate = endDate;
} else if (startDate > 0) {
filters.startDate = startDate;
} else if (endDate > 0) {
filters.endDate = endDate;
} else {
filters.date = new Date();
}
const orders = database.getOrders(filters);
const stats = database.getOrderStats();
const stats = database.getOrderStats(
filters.startDate || null,
filters.endDate || null
);
return { error: false, orders, stats };
});

View File

@@ -37,7 +37,7 @@
<% if (showStats) { %>
<div class="stats-bar" id="statsBar">
<div class="stat-card">
<div class="stat-label">Total Today</div>
<div class="stat-label" id="stat-total-label">Total Today</div>
<div class="stat-value" id="stat-total"><%= stats.total %></div>
</div>
<div class="stat-card stat-new">
@@ -62,6 +62,22 @@
<button class="filter-btn" data-filter="preparing">Preparing</button>
<button class="filter-btn" data-filter="ready">Ready</button>
</div>
<div class="date-filter-group">
<select class="date-filter-select" id="dateFilterSelect">
<option value="today" selected>Today</option>
<option value="yesterday">Yesterday</option>
<option value="last7">Last 7 Days</option>
<option value="last30">Last 30 Days</option>
<option value="all">All Time</option>
<option value="custom">Custom Range...</option>
</select>
<div class="date-filter-custom" id="dateFilterCustom" style="display:none;">
<input type="date" id="dateFilterFrom" class="date-filter-input" title="Start date">
<span class="date-filter-separator">to</span>
<input type="date" id="dateFilterTo" class="date-filter-input" title="End date">
<button class="btn btn-primary btn-sm date-filter-apply" id="dateFilterApply">Apply</button>
</div>
</div>
<button class="btn btn-secondary sync-button" id="syncButton" onclick="manualSync()" title="Check for new orders now">
<span class="sync-spinner"></span>
<span class="sync-text">Sync Now</span>