consultoria-as
f55925fa6a
Replace all hardcoded/demo data with live API calls: - KPIs from /pos/api/register/daily-summary (ventas, tickets, promedio, cajas) - Inventory alerts from /pos/api/inventory/alerts (zero, low, over stock) - Top products aggregated from /pos/api/sales detail items - Weekly bar chart from 7-day daily summaries - Recent sales table with real items from sale detail endpoint - Auto-refresh every 2 minutes, manual refresh button - Dynamic greeting with time-of-day and JWT user name Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
533 lines
24 KiB
JavaScript
533 lines
24 KiB
JavaScript
// /home/Autopartes/pos/static/js/dashboard.js
|
|
// Dashboard module: fetches real data from POS APIs
|
|
|
|
const Dashboard = (() => {
|
|
function token() {
|
|
return localStorage.getItem('pos_token') || '';
|
|
}
|
|
|
|
function checkAuth() {
|
|
if (!token()) {
|
|
window.location.href = '/pos/login';
|
|
return false;
|
|
}
|
|
return true;
|
|
}
|
|
|
|
function headers() {
|
|
return { 'Authorization': `Bearer ${token()}`, 'Content-Type': 'application/json' };
|
|
}
|
|
|
|
function fmt(n) {
|
|
return '$' + parseFloat(n || 0).toLocaleString('es-MX', { minimumFractionDigits: 2, maximumFractionDigits: 2 });
|
|
}
|
|
|
|
function fmtInt(n) {
|
|
return parseInt(n || 0).toLocaleString('es-MX');
|
|
}
|
|
|
|
/** Today as YYYY-MM-DD */
|
|
function todayStr() {
|
|
return new Date().toISOString().slice(0, 10);
|
|
}
|
|
|
|
/** Return a date N days ago as YYYY-MM-DD */
|
|
function daysAgo(n) {
|
|
const d = new Date();
|
|
d.setDate(d.getDate() - n);
|
|
return d.toISOString().slice(0, 10);
|
|
}
|
|
|
|
const DAY_NAMES_SHORT = ['Dom', 'Lun', 'Mar', 'Mie', 'Jue', 'Vie', 'Sab'];
|
|
const MONTH_NAMES = ['enero', 'febrero', 'marzo', 'abril', 'mayo', 'junio',
|
|
'julio', 'agosto', 'septiembre', 'octubre', 'noviembre', 'diciembre'];
|
|
const DAY_NAMES_LONG = ['Domingo', 'Lunes', 'Martes', 'Miercoles', 'Jueves', 'Viernes', 'Sabado'];
|
|
|
|
// -------------------------------------------------------------------------
|
|
// Theme switcher
|
|
// -------------------------------------------------------------------------
|
|
function setTheme(theme) {
|
|
document.documentElement.setAttribute('data-theme', theme);
|
|
try { localStorage.setItem('nexus-theme', theme); } catch(e) {}
|
|
const btnInd = document.getElementById('btn-industrial');
|
|
const btnMod = document.getElementById('btn-modern');
|
|
if (btnInd) btnInd.classList.toggle('active', theme === 'industrial');
|
|
if (btnMod) btnMod.classList.toggle('active', theme === 'modern');
|
|
}
|
|
window.setTheme = setTheme;
|
|
|
|
// -------------------------------------------------------------------------
|
|
// Sidebar toggle (mobile)
|
|
// -------------------------------------------------------------------------
|
|
function toggleSidebar() {
|
|
const sidebar = document.getElementById('sidebar');
|
|
const overlay = document.getElementById('sidebar-overlay');
|
|
if (!sidebar) return;
|
|
const isOpen = sidebar.classList.contains('open');
|
|
sidebar.classList.toggle('open', !isOpen);
|
|
if (overlay) overlay.classList.toggle('open', !isOpen);
|
|
document.body.style.overflow = isOpen ? '' : 'hidden';
|
|
}
|
|
window.toggleSidebar = toggleSidebar;
|
|
|
|
function closeSidebar() {
|
|
const sidebar = document.getElementById('sidebar');
|
|
const overlay = document.getElementById('sidebar-overlay');
|
|
if (sidebar) sidebar.classList.remove('open');
|
|
if (overlay) overlay.classList.remove('open');
|
|
document.body.style.overflow = '';
|
|
}
|
|
window.closeSidebar = closeSidebar;
|
|
|
|
window.addEventListener('resize', function() {
|
|
if (window.innerWidth >= 768) closeSidebar();
|
|
});
|
|
|
|
// -------------------------------------------------------------------------
|
|
// Period selector (placeholder for future use)
|
|
// -------------------------------------------------------------------------
|
|
function setPeriod(btn) {
|
|
btn.closest('.period-selector').querySelectorAll('.period-btn').forEach(function(b) {
|
|
b.classList.remove('active');
|
|
});
|
|
btn.classList.add('active');
|
|
}
|
|
window.setPeriod = setPeriod;
|
|
|
|
// -------------------------------------------------------------------------
|
|
// Generic fetch helper
|
|
// -------------------------------------------------------------------------
|
|
async function apiFetch(url) {
|
|
try {
|
|
const resp = await fetch(url, { headers: headers() });
|
|
if (resp.status === 401) {
|
|
window.location.href = '/pos/login';
|
|
return null;
|
|
}
|
|
if (!resp.ok) return null;
|
|
return await resp.json();
|
|
} catch (err) {
|
|
console.error('Dashboard fetch error:', url, err);
|
|
return null;
|
|
}
|
|
}
|
|
|
|
// -------------------------------------------------------------------------
|
|
// Set header greeting with real date and user info
|
|
// -------------------------------------------------------------------------
|
|
function setGreeting() {
|
|
const now = new Date();
|
|
const h = now.getHours();
|
|
let saludo = 'Buenos dias';
|
|
if (h >= 12 && h < 19) saludo = 'Buenas tardes';
|
|
else if (h >= 19) saludo = 'Buenas noches';
|
|
|
|
// Try to get user name from JWT payload
|
|
let userName = '';
|
|
try {
|
|
const payload = JSON.parse(atob(token().split('.')[1]));
|
|
userName = payload.name || payload.sub || '';
|
|
} catch(e) {}
|
|
|
|
const greetEl = document.getElementById('header-greeting');
|
|
if (greetEl) greetEl.textContent = userName ? `${saludo}, ${userName}` : saludo;
|
|
|
|
const subEl = document.getElementById('header-subtitle');
|
|
if (subEl) {
|
|
const dayName = DAY_NAMES_LONG[now.getDay()];
|
|
const day = now.getDate();
|
|
const month = MONTH_NAMES[now.getMonth()];
|
|
const year = now.getFullYear();
|
|
subEl.textContent = `${dayName}, ${day} de ${month} de ${year}`;
|
|
}
|
|
}
|
|
|
|
// -------------------------------------------------------------------------
|
|
// 1. Ventas de hoy KPIs (daily summary)
|
|
// -------------------------------------------------------------------------
|
|
async function loadDailySummary() {
|
|
const today = todayStr();
|
|
const data = await apiFetch(`/pos/api/register/daily-summary?date=${today}`);
|
|
if (!data) {
|
|
setKpiError('kpi-ventas-total', 'kpi-ventas-meta');
|
|
setKpiError('kpi-tickets-count', 'kpi-tickets-meta');
|
|
setKpiError('kpi-promedio-value', 'kpi-promedio-meta');
|
|
return null;
|
|
}
|
|
|
|
// Ventas Hoy
|
|
const totalEl = document.getElementById('kpi-ventas-total');
|
|
const metaEl = document.getElementById('kpi-ventas-meta');
|
|
if (totalEl) totalEl.textContent = fmt(data.total_sales);
|
|
if (metaEl) {
|
|
const methods = Object.entries(data.sales_by_method || {})
|
|
.map(([m, v]) => `${capitalize(m)}: ${fmt(v.amount)}`)
|
|
.join(' | ');
|
|
metaEl.innerHTML = methods
|
|
? `<span class="kpi-meta-text">${methods}</span>`
|
|
: '<span class="kpi-meta-text">Sin ventas aun</span>';
|
|
}
|
|
|
|
// Tickets Hoy
|
|
const ticketsEl = document.getElementById('kpi-tickets-count');
|
|
const ticketsMetaEl = document.getElementById('kpi-tickets-meta');
|
|
if (ticketsEl) ticketsEl.textContent = fmtInt(data.total_sales_count);
|
|
if (ticketsMetaEl) {
|
|
const cancelled = data.cancelled_count || 0;
|
|
ticketsMetaEl.innerHTML = cancelled > 0
|
|
? `<span class="kpi-tag kpi-tag--neutral">${cancelled} cancelada${cancelled > 1 ? 's' : ''}</span><span class="kpi-meta-text">de ${data.total_sales_count + cancelled} totales</span>`
|
|
: `<span class="kpi-meta-text">${data.total_sales_count} completada${data.total_sales_count !== 1 ? 's' : ''}</span>`;
|
|
}
|
|
|
|
// Ticket Promedio
|
|
const promedioEl = document.getElementById('kpi-promedio-value');
|
|
const promedioMetaEl = document.getElementById('kpi-promedio-meta');
|
|
const avg = data.total_sales_count > 0 ? data.total_sales / data.total_sales_count : 0;
|
|
if (promedioEl) promedioEl.textContent = fmt(avg);
|
|
if (promedioMetaEl) {
|
|
promedioMetaEl.innerHTML = `<span class="kpi-meta-text">sobre ${fmtInt(data.total_sales_count)} ventas</span>`;
|
|
}
|
|
|
|
// Cajas del Día KPI
|
|
const cajasCountEl = document.getElementById('kpi-cajas-count');
|
|
const cajasMetaEl = document.getElementById('kpi-cajas-meta');
|
|
const regs = data.registers || [];
|
|
const activeRegs = regs.filter(r => r.status === 'open');
|
|
const closedRegs = regs.filter(r => r.status === 'closed');
|
|
if (cajasCountEl) cajasCountEl.textContent = regs.length;
|
|
if (cajasMetaEl) {
|
|
cajasMetaEl.innerHTML = `<span class="kpi-tag kpi-tag--up">${activeRegs.length} abierta${activeRegs.length !== 1 ? 's' : ''}</span><span class="kpi-meta-text">${closedRegs.length} cerrada${closedRegs.length !== 1 ? 's' : ''}</span>`;
|
|
}
|
|
|
|
// Also populate registers list
|
|
renderRegisters(regs);
|
|
|
|
return data;
|
|
}
|
|
|
|
function setKpiError(valueId, metaId) {
|
|
const v = document.getElementById(valueId);
|
|
const m = document.getElementById(metaId);
|
|
if (v) v.textContent = '--';
|
|
if (m) m.innerHTML = '<span class="kpi-meta-text" style="color:var(--color-error)">Error al cargar</span>';
|
|
}
|
|
|
|
function capitalize(s) {
|
|
if (!s) return '';
|
|
return s.charAt(0).toUpperCase() + s.slice(1);
|
|
}
|
|
|
|
// -------------------------------------------------------------------------
|
|
// 2. Registers list
|
|
// -------------------------------------------------------------------------
|
|
function renderRegisters(registers) {
|
|
const container = document.getElementById('registers-list');
|
|
if (!container) return;
|
|
|
|
if (!registers || registers.length === 0) {
|
|
container.innerHTML = '<div class="rank-item" style="justify-content:center;color:var(--color-text-muted);font-size:var(--text-caption);">Sin cajas registradas hoy</div>';
|
|
return;
|
|
}
|
|
|
|
const maxSale = Math.max(...registers.map(r => r.sale_total || 0), 1);
|
|
container.innerHTML = registers.map((r, i) => {
|
|
const statusClass = r.status === 'open' ? 'kpi-tag--up' : 'kpi-tag--neutral';
|
|
const statusLabel = r.status === 'open' ? 'Abierta' : 'Cerrada';
|
|
const pct = maxSale > 0 ? Math.round((r.sale_total / maxSale) * 100) : 0;
|
|
return `
|
|
<div class="rank-item">
|
|
<div class="rank-num ${i === 0 ? 'rank-num--1' : i === 1 ? 'rank-num--2' : ''}">${i + 1}</div>
|
|
<div class="rank-item__info">
|
|
<div class="rank-item__name">Caja ${r.register_number || r.id}</div>
|
|
<div class="rank-item__sub">${r.employee_name || 'Sin cajero'} · ${r.sale_count || 0} ventas <span class="kpi-tag ${statusClass}" style="font-size:9px;padding:1px 6px;">${statusLabel}</span></div>
|
|
<div class="rank-item__bar-bg">
|
|
<div class="rank-item__bar-fill" style="width:${pct}%"></div>
|
|
</div>
|
|
</div>
|
|
<div class="rank-item__value">${fmt(r.sale_total)}</div>
|
|
</div>`;
|
|
}).join('');
|
|
}
|
|
|
|
// -------------------------------------------------------------------------
|
|
// 3. Inventory alerts
|
|
// -------------------------------------------------------------------------
|
|
async function loadAlerts() {
|
|
const data = await apiFetch('/pos/api/inventory/alerts');
|
|
const container = document.getElementById('alerts-grid');
|
|
if (!container) return;
|
|
|
|
if (!data || !data.data || data.data.length === 0) {
|
|
container.innerHTML = `
|
|
<div class="alert-item" style="border-left:4px solid var(--color-success);justify-content:center;">
|
|
<div class="alert-icon-wrap" style="background-color:rgba(34,197,94,0.1);color:var(--color-success);">
|
|
<svg width="18" height="18" viewBox="0 0 18 18" fill="none"><circle cx="9" cy="9" r="7" stroke="currentColor" stroke-width="1.5"/><path d="M6 9l2 2 4-4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
|
</div>
|
|
<div class="alert-content">
|
|
<span class="alert-title">Sin alertas</span>
|
|
<div class="alert-desc">Todo el inventario dentro de parametros normales.</div>
|
|
</div>
|
|
</div>`;
|
|
return;
|
|
}
|
|
|
|
const alerts = data.data;
|
|
// Group by type
|
|
const zero = alerts.filter(a => a.type === 'zero');
|
|
const low = alerts.filter(a => a.type === 'low');
|
|
const over = alerts.filter(a => a.type === 'over');
|
|
|
|
let html = '';
|
|
|
|
if (zero.length > 0) {
|
|
const items = zero.slice(0, 5).map(a => `${a.name}: <strong>${a.stock} uds</strong>`).join(' · ');
|
|
html += buildAlertCard('error', 'Stock Agotado', `${zero.length} items`, items,
|
|
'<svg width="18" height="18" viewBox="0 0 18 18" fill="none"><path d="M9 3L16.5 15H1.5L9 3z" stroke="currentColor" stroke-width="1.5" stroke-linejoin="round"/><path d="M9 8v3M9 12.5v.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>');
|
|
}
|
|
|
|
if (low.length > 0) {
|
|
const items = low.slice(0, 5).map(a => `${a.name}: <strong>${a.stock} uds</strong> (min ${a.min_stock})`).join(' · ');
|
|
html += buildAlertCard('warning', 'Stock Bajo', `${low.length} items`, items,
|
|
'<svg width="18" height="18" viewBox="0 0 18 18" fill="none"><path d="M9 3L16.5 15H1.5L9 3z" stroke="currentColor" stroke-width="1.5" stroke-linejoin="round"/><path d="M9 8v3M9 12.5v.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>');
|
|
}
|
|
|
|
if (over.length > 0) {
|
|
const items = over.slice(0, 5).map(a => `${a.name}: <strong>${a.stock} uds</strong> (max ${a.max_stock})`).join(' · ');
|
|
html += buildAlertCard('orange', 'Sobrestock', `${over.length} items`, items,
|
|
'<svg width="18" height="18" viewBox="0 0 18 18" fill="none"><rect x="2" y="2" width="14" height="14" rx="2" stroke="currentColor" stroke-width="1.5"/><path d="M9 6v3M9 11v.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>');
|
|
}
|
|
|
|
container.innerHTML = html || '<div class="alert-item" style="border-left:none;justify-content:center;color:var(--color-text-muted);">Sin alertas</div>';
|
|
}
|
|
|
|
function buildAlertCard(severity, title, badge, desc, iconSvg) {
|
|
return `
|
|
<div class="alert-item alert-item--${severity}">
|
|
<div class="alert-icon-wrap alert-icon-wrap--${severity}">${iconSvg}</div>
|
|
<div class="alert-content">
|
|
<div style="display:flex;align-items:center;gap:var(--space-2);margin-bottom:3px;">
|
|
<span class="alert-title">${title}</span>
|
|
<span class="alert-badge alert-badge--${severity}">${badge}</span>
|
|
</div>
|
|
<div class="alert-desc">${desc}</div>
|
|
</div>
|
|
<a href="/pos/inventory#alertas" class="alert-action" style="text-decoration:none;">Ver</a>
|
|
</div>`;
|
|
}
|
|
|
|
// -------------------------------------------------------------------------
|
|
// 4. Top Products (from today's sales detail)
|
|
// -------------------------------------------------------------------------
|
|
async function loadTopProducts() {
|
|
const today = todayStr();
|
|
// Fetch all today's sales with pagination
|
|
const data = await apiFetch(`/pos/api/sales?date_from=${today}&date_to=${today}&status=completed&per_page=200`);
|
|
const container = document.getElementById('top-products-list');
|
|
if (!container) return;
|
|
|
|
if (!data || !data.data || data.data.length === 0) {
|
|
container.innerHTML = '<div class="rank-item" style="justify-content:center;color:var(--color-text-muted);font-size:var(--text-caption);">Sin ventas hoy</div>';
|
|
return;
|
|
}
|
|
|
|
// Fetch detail for each sale to get items (up to 20 sales for performance)
|
|
const salesToFetch = data.data.slice(0, 20);
|
|
const details = await Promise.all(
|
|
salesToFetch.map(s => apiFetch(`/pos/api/sales/${s.id}`))
|
|
);
|
|
|
|
// Aggregate items
|
|
const productMap = {};
|
|
for (const sale of details) {
|
|
if (!sale || !sale.items) continue;
|
|
for (const item of sale.items) {
|
|
const key = item.part_number || item.name;
|
|
if (!productMap[key]) {
|
|
productMap[key] = { name: item.name, part_number: item.part_number || '', qty: 0, revenue: 0 };
|
|
}
|
|
productMap[key].qty += item.quantity || 0;
|
|
productMap[key].revenue += item.subtotal || 0;
|
|
}
|
|
}
|
|
|
|
const sorted = Object.values(productMap).sort((a, b) => b.revenue - a.revenue).slice(0, 5);
|
|
|
|
if (sorted.length === 0) {
|
|
container.innerHTML = '<div class="rank-item" style="justify-content:center;color:var(--color-text-muted);font-size:var(--text-caption);">Sin productos vendidos</div>';
|
|
return;
|
|
}
|
|
|
|
const maxRev = sorted[0].revenue || 1;
|
|
container.innerHTML = sorted.map((p, i) => {
|
|
const pct = Math.round((p.revenue / maxRev) * 100);
|
|
return `
|
|
<div class="rank-item">
|
|
<div class="rank-num ${i === 0 ? 'rank-num--1' : i === 1 ? 'rank-num--2' : ''}">${i + 1}</div>
|
|
<div class="rank-item__info">
|
|
<div class="rank-item__name">${escHtml(p.name)}</div>
|
|
<div class="rank-item__sub">${escHtml(p.part_number)} · ${p.qty} pzas vendidas</div>
|
|
<div class="rank-item__bar-bg">
|
|
<div class="rank-item__bar-fill" style="width:${pct}%"></div>
|
|
</div>
|
|
</div>
|
|
<div class="rank-item__value">${fmt(p.revenue)}</div>
|
|
</div>`;
|
|
}).join('');
|
|
}
|
|
|
|
function escHtml(s) {
|
|
const div = document.createElement('div');
|
|
div.textContent = s || '';
|
|
return div.innerHTML;
|
|
}
|
|
|
|
// -------------------------------------------------------------------------
|
|
// 5. Weekly bar chart (last 7 days)
|
|
// -------------------------------------------------------------------------
|
|
async function loadWeeklyChart() {
|
|
const chartEl = document.getElementById('bar-chart');
|
|
const totalEl = document.getElementById('chart-week-total');
|
|
if (!chartEl) return;
|
|
|
|
// Fetch daily summary for each of last 7 days
|
|
const days = [];
|
|
for (let i = 6; i >= 0; i--) {
|
|
days.push(daysAgo(i));
|
|
}
|
|
|
|
const summaries = await Promise.all(
|
|
days.map(d => apiFetch(`/pos/api/register/daily-summary?date=${d}`))
|
|
);
|
|
|
|
let weekTotal = 0;
|
|
const dayData = days.map((dateStr, i) => {
|
|
const s = summaries[i];
|
|
const total = s ? (s.total_sales || 0) : 0;
|
|
weekTotal += total;
|
|
const d = new Date(dateStr + 'T12:00:00');
|
|
return {
|
|
label: DAY_NAMES_SHORT[d.getDay()],
|
|
total: total,
|
|
isToday: dateStr === todayStr(),
|
|
};
|
|
});
|
|
|
|
// Update week total
|
|
if (totalEl) {
|
|
totalEl.innerHTML = `Total semana: <strong style="color:var(--color-primary);font-family:var(--font-mono);">${fmt(weekTotal)}</strong>`;
|
|
}
|
|
|
|
const maxVal = Math.max(...dayData.map(d => d.total), 1);
|
|
|
|
chartEl.innerHTML = dayData.map(d => {
|
|
const heightPct = Math.max(Math.round((d.total / maxVal) * 100), 2);
|
|
const todayClass = d.isToday ? ' today' : '';
|
|
const todayLabelStyle = d.isToday ? ' style="color:var(--color-primary);font-weight:700;"' : '';
|
|
const tooltip = d.isToday ? `${fmt(d.total)} ← Hoy` : fmt(d.total);
|
|
return `
|
|
<div class="bar-chart__col">
|
|
<div class="bar-chart__bar-wrap">
|
|
<div class="bar-chart__bar${todayClass}" style="height:${heightPct}%" data-value="${tooltip}"></div>
|
|
</div>
|
|
<span class="bar-chart__label"${todayLabelStyle}>${d.label}</span>
|
|
</div>`;
|
|
}).join('');
|
|
}
|
|
|
|
// -------------------------------------------------------------------------
|
|
// 6. Recent sales table
|
|
// -------------------------------------------------------------------------
|
|
async function loadRecentSales() {
|
|
const today = todayStr();
|
|
const data = await apiFetch(`/pos/api/sales?date_from=${today}&date_to=${today}&per_page=10`);
|
|
const tbody = document.getElementById('recent-sales-tbody');
|
|
if (!tbody) return;
|
|
|
|
if (!data || !data.data || data.data.length === 0) {
|
|
tbody.innerHTML = '<tr><td colspan="5" style="text-align:center;color:var(--color-text-muted);font-size:var(--text-caption);">Sin ventas hoy</td></tr>';
|
|
return;
|
|
}
|
|
|
|
// Fetch items for first 5 sales
|
|
const salesToShow = data.data.slice(0, 5);
|
|
const details = await Promise.all(
|
|
salesToShow.map(s => apiFetch(`/pos/api/sales/${s.id}`))
|
|
);
|
|
|
|
tbody.innerHTML = salesToShow.map((sale, idx) => {
|
|
const detail = details[idx];
|
|
const time = sale.created_at ? sale.created_at.slice(11, 16) : '--:--';
|
|
const client = sale.customer_name || 'Publico General';
|
|
const total = sale.total || 0;
|
|
const method = sale.payment_method || 'efectivo';
|
|
|
|
// Build products summary from detail items
|
|
let productsSummary = '';
|
|
if (detail && detail.items && detail.items.length > 0) {
|
|
productsSummary = detail.items.slice(0, 3).map(it =>
|
|
`${escHtml(it.name)}${it.quantity > 1 ? ' (x' + it.quantity + ')' : ''}`
|
|
).join(', ');
|
|
if (detail.items.length > 3) productsSummary += '...';
|
|
}
|
|
|
|
const methodClass = getPaymentBadgeClass(method);
|
|
const methodLabel = capitalize(method);
|
|
|
|
const statusTag = sale.status === 'cancelled'
|
|
? ' <span style="color:var(--color-error);font-size:10px;font-weight:700;">[CANCELADA]</span>' : '';
|
|
|
|
return `
|
|
<tr>
|
|
<td><span class="td-time">${time}</span></td>
|
|
<td><span class="td-client">${escHtml(client)}</span>${statusTag}</td>
|
|
<td class="td-products">${productsSummary}</td>
|
|
<td><span class="td-mono">${fmt(total)}</span></td>
|
|
<td><span class="pago-badge pago-badge--${methodClass}">${methodLabel}</span></td>
|
|
</tr>`;
|
|
}).join('');
|
|
}
|
|
|
|
function getPaymentBadgeClass(method) {
|
|
const m = (method || '').toLowerCase();
|
|
if (m.includes('efectivo') || m === 'cash') return 'efectivo';
|
|
if (m.includes('tarjeta') || m === 'card') return 'tarjeta';
|
|
if (m.includes('transferencia') || m === 'transfer') return 'transferencia';
|
|
if (m.includes('credito') || m === 'credit') return 'credito';
|
|
return 'efectivo';
|
|
}
|
|
|
|
// -------------------------------------------------------------------------
|
|
// Init
|
|
// -------------------------------------------------------------------------
|
|
function init() {
|
|
if (!checkAuth()) return;
|
|
|
|
// Restore theme
|
|
try {
|
|
const saved = localStorage.getItem('nexus-theme');
|
|
if (saved === 'industrial' || saved === 'modern') {
|
|
setTheme(saved);
|
|
}
|
|
} catch(e) {}
|
|
|
|
setGreeting();
|
|
|
|
// Load all data in parallel
|
|
loadDailySummary();
|
|
loadAlerts();
|
|
loadTopProducts();
|
|
loadWeeklyChart();
|
|
loadRecentSales();
|
|
|
|
// Auto-refresh every 2 minutes
|
|
setInterval(() => {
|
|
loadDailySummary();
|
|
loadRecentSales();
|
|
}, 120000);
|
|
}
|
|
|
|
document.addEventListener('DOMContentLoaded', init);
|
|
|
|
return { init, setTheme };
|
|
})();
|