fix: botón Historial en clientes abre modal con historial completo de compras
This commit is contained in:
@@ -387,10 +387,80 @@ const Customers = (() => {
|
||||
if (btns.length >= 2) btns[1].onclick = () => editCurrent();
|
||||
if (btns.length >= 3) btns[2].onclick = () => showStatement();
|
||||
if (btns.length >= 4) btns[3].onclick = () => {
|
||||
if (currentCustomer) selectCustomer(currentCustomer.id);
|
||||
if (currentCustomer) showCustomerHistory(currentCustomer.id);
|
||||
};
|
||||
}
|
||||
|
||||
async function showCustomerHistory(customerId) {
|
||||
try {
|
||||
const res = await api(`/pos/api/customers/${customerId}/purchases`);
|
||||
const purchases = res.data || [];
|
||||
let modal = document.getElementById('customerHistoryModal');
|
||||
if (!modal) {
|
||||
modal = document.createElement('div');
|
||||
modal.id = 'customerHistoryModal';
|
||||
modal.className = 'modal-overlay';
|
||||
modal.style.display = 'none';
|
||||
modal.innerHTML = `
|
||||
<div class="modal-content" style="max-width:700px;">
|
||||
<div class="modal-header">
|
||||
<h3>Historial de Compras — <span id="customerHistoryName"></span></h3>
|
||||
<button class="modal-close" onclick="Customers.closeCustomerHistoryModal()">×</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<table class="history-table" style="width:100%;">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Fecha</th>
|
||||
<th>Folio</th>
|
||||
<th>Total</th>
|
||||
<th>Pago</th>
|
||||
<th>Estado</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="customerHistoryBody"></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
document.body.appendChild(modal);
|
||||
}
|
||||
|
||||
const tbody = document.getElementById('customerHistoryBody');
|
||||
const title = document.getElementById('customerHistoryName');
|
||||
if (title && currentCustomer) title.textContent = currentCustomer.name;
|
||||
|
||||
if (purchases.length === 0) {
|
||||
tbody.innerHTML = '<tr><td colspan="5" style="text-align:center;color:var(--color-text-muted);padding:var(--space-4);">Sin compras registradas</td></tr>';
|
||||
} else {
|
||||
tbody.innerHTML = purchases.map(p => {
|
||||
const statusClass = p.status === 'paid' ? 'mbadge--paid' : p.status === 'cancelled' ? 'mbadge--error' : p.status === 'overdue' ? 'mbadge--overdue' : 'mbadge--pending';
|
||||
const statusLabel = p.status === 'paid' ? 'Pagado' : p.status === 'cancelled' ? 'Cancelado' : p.status === 'overdue' ? 'Vencido' : 'Pendiente';
|
||||
return `<tr>
|
||||
<td class="date">${formatDate(p.created_at)}</td>
|
||||
<td class="folio">NX-${String(p.id).padStart(5, '0')}</td>
|
||||
<td class="total">${fmt(p.total)}</td>
|
||||
<td>${p.payment_method || '-'}</td>
|
||||
<td><span class="mbadge ${statusClass}">${statusLabel}</span></td>
|
||||
</tr>`;
|
||||
}).join('');
|
||||
}
|
||||
modal.style.display = 'flex';
|
||||
modal.classList.add('active');
|
||||
} catch (e) {
|
||||
console.error('Error loading customer history:', e);
|
||||
alert('Error al cargar historial: ' + e.message);
|
||||
}
|
||||
}
|
||||
|
||||
function closeCustomerHistoryModal() {
|
||||
const modal = document.getElementById('customerHistoryModal');
|
||||
if (modal) {
|
||||
modal.style.display = 'none';
|
||||
modal.classList.remove('active');
|
||||
}
|
||||
}
|
||||
|
||||
// ─── Create/Edit Modal ───────────────
|
||||
function showCreateModal() {
|
||||
const modal = document.getElementById('customerModal');
|
||||
@@ -819,6 +889,7 @@ const Customers = (() => {
|
||||
showCreateModal, editCurrent, editCustomer, closeModal, save,
|
||||
showStatement, closeStatement,
|
||||
showPaymentModal, closePayment, recordPayment,
|
||||
showCustomerHistory, closeCustomerHistoryModal,
|
||||
};
|
||||
|
||||
// Bulk selection
|
||||
|
||||
Reference in New Issue
Block a user