a9d0cead79
- deploy.ps1, iis-web.config: Windows Server deployment scripts - api/app/routers/sync.py, dashboard.py: router updates - api/app/services/import_service.py, sync_service.py: service updates - api/app/static/css/style.css, js/*.js: UI updates - api/database-scripts/08_PACK_FACTURARE.pck: Oracle package - .gitignore: add .gittoken - CLAUDE.md, agent configs: documentation updates Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
702 lines
30 KiB
JavaScript
702 lines
30 KiB
JavaScript
// ── State ─────────────────────────────────────────
|
||
let dashPage = 1;
|
||
let dashPerPage = 50;
|
||
let dashSortCol = 'order_date';
|
||
let dashSortDir = 'desc';
|
||
let dashSearchTimeout = null;
|
||
let currentQmSku = '';
|
||
let currentQmOrderNumber = '';
|
||
let qmAcTimeout = null;
|
||
|
||
// Sync polling state
|
||
let _pollInterval = null;
|
||
let _lastSyncStatus = null;
|
||
let _lastRunId = null;
|
||
let _currentRunId = null;
|
||
|
||
// ── Init ──────────────────────────────────────────
|
||
|
||
document.addEventListener('DOMContentLoaded', () => {
|
||
loadSchedulerStatus();
|
||
loadDashOrders();
|
||
startSyncPolling();
|
||
wireFilterBar();
|
||
});
|
||
|
||
// ── Smart Sync Polling ────────────────────────────
|
||
|
||
function startSyncPolling() {
|
||
if (_pollInterval) clearInterval(_pollInterval);
|
||
_pollInterval = setInterval(pollSyncStatus, 30000);
|
||
pollSyncStatus(); // immediate first call
|
||
}
|
||
|
||
async function pollSyncStatus() {
|
||
try {
|
||
const data = await fetchJSON('/api/sync/status');
|
||
updateSyncPanel(data);
|
||
const isRunning = data.status === 'running';
|
||
const wasRunning = _lastSyncStatus === 'running';
|
||
if (isRunning && !wasRunning) {
|
||
// Switched to running — speed up polling
|
||
clearInterval(_pollInterval);
|
||
_pollInterval = setInterval(pollSyncStatus, 3000);
|
||
} else if (!isRunning && wasRunning) {
|
||
// Sync just completed — slow down and refresh orders
|
||
clearInterval(_pollInterval);
|
||
_pollInterval = setInterval(pollSyncStatus, 30000);
|
||
loadDashOrders();
|
||
}
|
||
_lastSyncStatus = data.status;
|
||
} catch (e) {
|
||
console.warn('Sync status poll failed:', e);
|
||
}
|
||
}
|
||
|
||
function updateSyncPanel(data) {
|
||
const dot = document.getElementById('syncStatusDot');
|
||
const txt = document.getElementById('syncStatusText');
|
||
const progressArea = document.getElementById('syncProgressArea');
|
||
const progressText = document.getElementById('syncProgressText');
|
||
const startBtn = document.getElementById('syncStartBtn');
|
||
|
||
if (dot) {
|
||
dot.className = 'sync-status-dot ' + (data.status || 'idle');
|
||
}
|
||
const statusLabels = { running: 'A ruleaza...', idle: 'Inactiv', completed: 'Finalizat', failed: 'Eroare' };
|
||
if (txt) txt.textContent = statusLabels[data.status] || data.status || 'Inactiv';
|
||
if (startBtn) startBtn.disabled = data.status === 'running';
|
||
|
||
// Track current running sync run_id
|
||
if (data.status === 'running' && data.run_id) {
|
||
_currentRunId = data.run_id;
|
||
} else {
|
||
_currentRunId = null;
|
||
}
|
||
|
||
// Live progress area
|
||
if (progressArea) {
|
||
progressArea.style.display = data.status === 'running' ? 'flex' : 'none';
|
||
}
|
||
if (progressText && data.phase_text) {
|
||
progressText.textContent = data.phase_text;
|
||
}
|
||
|
||
// Last run info
|
||
const lr = data.last_run;
|
||
if (lr) {
|
||
_lastRunId = lr.run_id;
|
||
const d = document.getElementById('lastSyncDate');
|
||
const dur = document.getElementById('lastSyncDuration');
|
||
const cnt = document.getElementById('lastSyncCounts');
|
||
const st = document.getElementById('lastSyncStatus');
|
||
if (d) d.textContent = lr.started_at ? lr.started_at.replace('T', ' ').slice(0, 16) : '\u2014';
|
||
if (dur) dur.textContent = lr.duration_seconds ? Math.round(lr.duration_seconds) + 's' : '\u2014';
|
||
if (cnt) {
|
||
const newImp = lr.new_imported || 0;
|
||
const already = lr.already_imported || 0;
|
||
if (already > 0) {
|
||
cnt.innerHTML = `<span class="dot dot-green me-1"></span>${newImp} noi, ${already} deja <span class="dot dot-yellow me-1"></span>${lr.skipped || 0} omise <span class="dot dot-red me-1"></span>${lr.errors || 0} erori`;
|
||
} else {
|
||
cnt.innerHTML = `<span class="dot dot-green me-1"></span>${lr.imported || 0} imp. <span class="dot dot-yellow me-1"></span>${lr.skipped || 0} omise <span class="dot dot-red me-1"></span>${lr.errors || 0} erori`;
|
||
}
|
||
}
|
||
if (st) {
|
||
st.textContent = lr.status === 'completed' ? '\u2713' : '\u2715';
|
||
st.style.color = lr.status === 'completed' ? '#10b981' : '#ef4444';
|
||
}
|
||
}
|
||
}
|
||
|
||
// Wire last-sync-row click → journal (use current running sync if active)
|
||
document.addEventListener('DOMContentLoaded', () => {
|
||
document.getElementById('lastSyncRow')?.addEventListener('click', () => {
|
||
const targetId = _currentRunId || _lastRunId;
|
||
if (targetId) window.location = '/logs?run=' + targetId;
|
||
});
|
||
document.getElementById('lastSyncRow')?.addEventListener('keydown', (e) => {
|
||
const targetId = _currentRunId || _lastRunId;
|
||
if ((e.key === 'Enter' || e.key === ' ') && targetId) {
|
||
window.location = '/logs?run=' + targetId;
|
||
}
|
||
});
|
||
});
|
||
|
||
// ── Sync Controls ─────────────────────────────────
|
||
|
||
async function startSync() {
|
||
try {
|
||
const res = await fetch('/api/sync/start', { method: 'POST' });
|
||
const data = await res.json();
|
||
if (data.error) {
|
||
alert(data.error);
|
||
return;
|
||
}
|
||
// Polling will detect the running state — just speed it up immediately
|
||
pollSyncStatus();
|
||
} catch (err) {
|
||
alert('Eroare: ' + err.message);
|
||
}
|
||
}
|
||
|
||
async function stopSync() {
|
||
try {
|
||
await fetch('/api/sync/stop', { method: 'POST' });
|
||
pollSyncStatus();
|
||
} catch (err) {
|
||
alert('Eroare: ' + err.message);
|
||
}
|
||
}
|
||
|
||
async function toggleScheduler() {
|
||
const enabled = document.getElementById('schedulerToggle').checked;
|
||
const interval = parseInt(document.getElementById('schedulerInterval').value) || 10;
|
||
try {
|
||
await fetch('/api/sync/schedule', {
|
||
method: 'PUT',
|
||
headers: { 'Content-Type': 'application/json' },
|
||
body: JSON.stringify({ enabled, interval_minutes: interval })
|
||
});
|
||
} catch (err) {
|
||
alert('Eroare scheduler: ' + err.message);
|
||
}
|
||
}
|
||
|
||
async function updateSchedulerInterval() {
|
||
const enabled = document.getElementById('schedulerToggle').checked;
|
||
if (enabled) {
|
||
await toggleScheduler();
|
||
}
|
||
}
|
||
|
||
async function loadSchedulerStatus() {
|
||
try {
|
||
const res = await fetch('/api/sync/schedule');
|
||
const data = await res.json();
|
||
document.getElementById('schedulerToggle').checked = data.enabled || false;
|
||
if (data.interval_minutes) {
|
||
document.getElementById('schedulerInterval').value = data.interval_minutes;
|
||
}
|
||
} catch (err) {
|
||
console.error('loadSchedulerStatus error:', err);
|
||
}
|
||
}
|
||
|
||
// ── Filter Bar wiring ─────────────────────────────
|
||
|
||
function wireFilterBar() {
|
||
// Period dropdown
|
||
document.getElementById('periodSelect')?.addEventListener('change', function () {
|
||
const cr = document.getElementById('customRangeInputs');
|
||
if (this.value === 'custom') {
|
||
cr?.classList.add('visible');
|
||
} else {
|
||
cr?.classList.remove('visible');
|
||
dashPage = 1;
|
||
loadDashOrders();
|
||
}
|
||
});
|
||
|
||
// Custom range inputs
|
||
['periodStart', 'periodEnd'].forEach(id => {
|
||
document.getElementById(id)?.addEventListener('change', () => {
|
||
const s = document.getElementById('periodStart')?.value;
|
||
const e = document.getElementById('periodEnd')?.value;
|
||
if (s && e) { dashPage = 1; loadDashOrders(); }
|
||
});
|
||
});
|
||
|
||
// Status pills
|
||
document.querySelectorAll('.filter-pill[data-status]').forEach(btn => {
|
||
btn.addEventListener('click', function () {
|
||
document.querySelectorAll('.filter-pill[data-status]').forEach(b => b.classList.remove('active'));
|
||
this.classList.add('active');
|
||
dashPage = 1;
|
||
loadDashOrders();
|
||
});
|
||
});
|
||
|
||
// Search — 300ms debounce
|
||
document.getElementById('orderSearch')?.addEventListener('input', () => {
|
||
clearTimeout(dashSearchTimeout);
|
||
dashSearchTimeout = setTimeout(() => {
|
||
dashPage = 1;
|
||
loadDashOrders();
|
||
}, 300);
|
||
});
|
||
}
|
||
|
||
// ── Dashboard Orders Table ────────────────────────
|
||
|
||
function dashSortBy(col) {
|
||
if (dashSortCol === col) {
|
||
dashSortDir = dashSortDir === 'asc' ? 'desc' : 'asc';
|
||
} else {
|
||
dashSortCol = col;
|
||
dashSortDir = 'asc';
|
||
}
|
||
document.querySelectorAll('.sort-icon').forEach(span => {
|
||
const c = span.dataset.col;
|
||
span.textContent = c === dashSortCol ? (dashSortDir === 'asc' ? '\u2191' : '\u2193') : '';
|
||
});
|
||
dashPage = 1;
|
||
loadDashOrders();
|
||
}
|
||
|
||
async function loadDashOrders() {
|
||
const periodVal = document.getElementById('periodSelect')?.value || '7';
|
||
const params = new URLSearchParams();
|
||
|
||
if (periodVal === 'custom') {
|
||
const s = document.getElementById('periodStart')?.value;
|
||
const e = document.getElementById('periodEnd')?.value;
|
||
if (s && e) {
|
||
params.set('period_start', s);
|
||
params.set('period_end', e);
|
||
params.set('period_days', '0');
|
||
}
|
||
} else {
|
||
params.set('period_days', periodVal);
|
||
}
|
||
|
||
const activeStatus = document.querySelector('.filter-pill.active')?.dataset.status;
|
||
if (activeStatus && activeStatus !== 'all') params.set('status', activeStatus);
|
||
|
||
const search = document.getElementById('orderSearch')?.value?.trim();
|
||
if (search) params.set('search', search);
|
||
|
||
params.set('page', dashPage);
|
||
params.set('per_page', dashPerPage);
|
||
params.set('sort_by', dashSortCol);
|
||
params.set('sort_dir', dashSortDir);
|
||
|
||
try {
|
||
const res = await fetch(`/api/dashboard/orders?${params}`);
|
||
const data = await res.json();
|
||
|
||
// Update filter-pill badge counts
|
||
const c = data.counts || {};
|
||
const el = (id) => document.getElementById(id);
|
||
if (el('cntAll')) el('cntAll').textContent = c.total || 0;
|
||
if (el('cntImp')) el('cntImp').textContent = c.imported_all || c.imported || 0;
|
||
if (el('cntSkip')) el('cntSkip').textContent = c.skipped || 0;
|
||
if (el('cntErr')) el('cntErr').textContent = c.error || c.errors || 0;
|
||
if (el('cntFact')) el('cntFact').textContent = c.facturate || 0;
|
||
if (el('cntNef')) el('cntNef').textContent = c.nefacturate || c.uninvoiced || 0;
|
||
|
||
const tbody = document.getElementById('dashOrdersBody');
|
||
const orders = data.orders || [];
|
||
|
||
if (orders.length === 0) {
|
||
tbody.innerHTML = '<tr><td colspan="9" class="text-center text-muted py-3">Nicio comanda</td></tr>';
|
||
} else {
|
||
tbody.innerHTML = orders.map(o => {
|
||
const dateStr = fmtDate(o.order_date);
|
||
const orderTotal = o.order_total != null ? Number(o.order_total).toFixed(2) : '-';
|
||
|
||
return `<tr style="cursor:pointer" onclick="openDashOrderDetail('${esc(o.order_number)}')">
|
||
<td>${statusDot(o.status)}</td>
|
||
<td class="text-nowrap">${dateStr}</td>
|
||
${renderClientCell(o)}
|
||
<td><code>${esc(o.order_number)}</code></td>
|
||
<td>${o.items_count || 0}</td>
|
||
<td class="text-end text-muted">${fmtCost(o.delivery_cost)}</td>
|
||
<td class="text-end text-muted">${fmtCost(o.discount_total)}</td>
|
||
<td class="text-end fw-bold">${orderTotal}</td>
|
||
<td class="text-center">${invoiceDot(o)}</td>
|
||
</tr>`;
|
||
}).join('');
|
||
}
|
||
|
||
// Mobile flat rows
|
||
const mobileList = document.getElementById('dashMobileList');
|
||
if (mobileList) {
|
||
if (orders.length === 0) {
|
||
mobileList.innerHTML = '<div class="flat-row text-muted py-3 justify-content-center">Nicio comanda</div>';
|
||
} else {
|
||
mobileList.innerHTML = orders.map(o => {
|
||
const d = o.order_date || '';
|
||
let dateFmt = '-';
|
||
if (d.length >= 10) {
|
||
dateFmt = d.slice(8, 10) + '.' + d.slice(5, 7) + '.' + d.slice(2, 4);
|
||
if (d.length >= 16) dateFmt += ' ' + d.slice(11, 16);
|
||
}
|
||
const name = o.shipping_name || o.customer_name || o.billing_name || '\u2014';
|
||
const totalStr = o.order_total ? Number(o.order_total).toFixed(2) : '';
|
||
return `<div class="flat-row" onclick="openDashOrderDetail('${esc(o.order_number)}')" style="font-size:0.875rem">
|
||
${statusDot(o.status)}
|
||
<span style="color:#6b7280" class="text-nowrap">${dateFmt}</span>
|
||
<span class="grow truncate fw-bold">${esc(name)}</span>
|
||
<span class="text-nowrap">x${o.items_count || 0}${totalStr ? ' · <strong>' + totalStr + '</strong>' : ''}</span>
|
||
</div>`;
|
||
}).join('');
|
||
}
|
||
}
|
||
|
||
// Mobile segmented control
|
||
renderMobileSegmented('dashMobileSeg', [
|
||
{ label: 'Toate', count: c.total || 0, value: 'all', active: (activeStatus || 'all') === 'all', colorClass: 'fc-neutral' },
|
||
{ label: 'Imp.', count: c.imported_all || c.imported || 0, value: 'IMPORTED', active: activeStatus === 'IMPORTED', colorClass: 'fc-green' },
|
||
{ label: 'Omise', count: c.skipped || 0, value: 'SKIPPED', active: activeStatus === 'SKIPPED', colorClass: 'fc-yellow' },
|
||
{ label: 'Erori', count: c.error || c.errors || 0, value: 'ERROR', active: activeStatus === 'ERROR', colorClass: 'fc-red' },
|
||
{ label: 'Fact.', count: c.facturate || 0, value: 'INVOICED', active: activeStatus === 'INVOICED', colorClass: 'fc-green' },
|
||
{ label: 'Nefact.', count: c.nefacturate || c.uninvoiced || 0, value: 'UNINVOICED', active: activeStatus === 'UNINVOICED', colorClass: 'fc-red' }
|
||
], (val) => {
|
||
document.querySelectorAll('.filter-pill[data-status]').forEach(b => b.classList.remove('active'));
|
||
const pill = document.querySelector(`.filter-pill[data-status="${val}"]`);
|
||
if (pill) pill.classList.add('active');
|
||
dashPage = 1;
|
||
loadDashOrders();
|
||
});
|
||
|
||
// Pagination
|
||
const pag = data.pagination || {};
|
||
const totalPages = pag.total_pages || data.pages || 1;
|
||
const totalOrders = (data.counts || {}).total || data.total || 0;
|
||
|
||
const pagOpts = { perPage: dashPerPage, perPageFn: 'dashChangePerPage', perPageOptions: [25, 50, 100, 250] };
|
||
const pagHtml = `<small class="text-muted me-auto">${totalOrders} comenzi | Pagina ${dashPage} din ${totalPages}</small>` + renderUnifiedPagination(dashPage, totalPages, 'dashGoPage', pagOpts);
|
||
const pagDiv = document.getElementById('dashPagination');
|
||
if (pagDiv) pagDiv.innerHTML = pagHtml;
|
||
const pagDivTop = document.getElementById('dashPaginationTop');
|
||
if (pagDivTop) pagDivTop.innerHTML = pagHtml;
|
||
|
||
// Update sort icons
|
||
document.querySelectorAll('.sort-icon').forEach(span => {
|
||
const c = span.dataset.col;
|
||
span.textContent = c === dashSortCol ? (dashSortDir === 'asc' ? '\u2191' : '\u2193') : '';
|
||
});
|
||
} catch (err) {
|
||
document.getElementById('dashOrdersBody').innerHTML =
|
||
`<tr><td colspan="9" class="text-center text-danger">${esc(err.message)}</td></tr>`;
|
||
}
|
||
}
|
||
|
||
function dashGoPage(p) {
|
||
dashPage = p;
|
||
loadDashOrders();
|
||
}
|
||
|
||
function dashChangePerPage(val) {
|
||
dashPerPage = parseInt(val) || 50;
|
||
dashPage = 1;
|
||
loadDashOrders();
|
||
}
|
||
|
||
// ── Client cell with Cont tooltip (Task F4) ───────
|
||
|
||
function renderClientCell(order) {
|
||
const shipping = (order.shipping_name || order.customer_name || '').trim();
|
||
const billing = (order.billing_name || '').trim();
|
||
const isDiff = order.is_different_person && billing && shipping !== billing;
|
||
if (isDiff) {
|
||
return `<td class="tooltip-cont fw-bold" data-tooltip="Cont: ${escHtml(billing)}">${escHtml(shipping)} <sup style="color:#6b7280;font-size:0.65rem">▲</sup></td>`;
|
||
}
|
||
return `<td class="fw-bold">${escHtml(shipping || billing || '\u2014')}</td>`;
|
||
}
|
||
|
||
// ── Helper functions ──────────────────────────────
|
||
|
||
async function fetchJSON(url) {
|
||
const res = await fetch(url);
|
||
if (!res.ok) throw new Error(`HTTP ${res.status}`);
|
||
return res.json();
|
||
}
|
||
|
||
function escHtml(s) {
|
||
if (s == null) return '';
|
||
return String(s)
|
||
.replace(/&/g, '&')
|
||
.replace(/</g, '<')
|
||
.replace(/>/g, '>')
|
||
.replace(/"/g, '"')
|
||
.replace(/'/g, ''');
|
||
}
|
||
|
||
// Alias kept for backward compat with inline handlers in modal
|
||
function esc(s) { return escHtml(s); }
|
||
|
||
function fmtCost(v) {
|
||
return v > 0 ? Number(v).toFixed(2) : '–';
|
||
}
|
||
|
||
|
||
function statusLabelText(status) {
|
||
switch ((status || '').toUpperCase()) {
|
||
case 'IMPORTED': return 'Importat';
|
||
case 'ALREADY_IMPORTED': return 'Deja imp.';
|
||
case 'SKIPPED': return 'Omis';
|
||
case 'ERROR': return 'Eroare';
|
||
default: return esc(status);
|
||
}
|
||
}
|
||
|
||
function orderStatusBadge(status) {
|
||
switch ((status || '').toUpperCase()) {
|
||
case 'IMPORTED': return '<span class="badge bg-success">Importat</span>';
|
||
case 'ALREADY_IMPORTED': return '<span class="badge bg-info">Deja importat</span>';
|
||
case 'SKIPPED': return '<span class="badge bg-warning">Omis</span>';
|
||
case 'ERROR': return '<span class="badge bg-danger">Eroare</span>';
|
||
default: return `<span class="badge bg-secondary">${esc(status)}</span>`;
|
||
}
|
||
}
|
||
|
||
function invoiceDot(order) {
|
||
if (order.status !== 'IMPORTED' && order.status !== 'ALREADY_IMPORTED') return '–';
|
||
if (order.invoice && order.invoice.facturat) return '<span class="dot dot-green" title="Facturat"></span>';
|
||
return '<span class="dot dot-red" title="Nefacturat"></span>';
|
||
}
|
||
|
||
function renderCodmatCell(item) {
|
||
if (!item.codmat_details || item.codmat_details.length === 0) {
|
||
return `<code>${esc(item.codmat || '-')}</code>`;
|
||
}
|
||
if (item.codmat_details.length === 1) {
|
||
const d = item.codmat_details[0];
|
||
return `<code>${esc(d.codmat)}</code>`;
|
||
}
|
||
return item.codmat_details.map(d =>
|
||
`<div class="small"><code>${esc(d.codmat)}</code> <span class="text-muted">\xd7${d.cantitate_roa} (${d.procent_pret}%)</span></div>`
|
||
).join('');
|
||
}
|
||
|
||
// ── Order Detail Modal ────────────────────────────
|
||
|
||
async function openDashOrderDetail(orderNumber) {
|
||
document.getElementById('detailOrderNumber').textContent = '#' + orderNumber;
|
||
document.getElementById('detailCustomer').textContent = '...';
|
||
document.getElementById('detailDate').textContent = '';
|
||
document.getElementById('detailStatus').innerHTML = '';
|
||
document.getElementById('detailIdComanda').textContent = '-';
|
||
document.getElementById('detailIdPartener').textContent = '-';
|
||
document.getElementById('detailIdAdresaFact').textContent = '-';
|
||
document.getElementById('detailIdAdresaLivr').textContent = '-';
|
||
document.getElementById('detailItemsBody').innerHTML = '<tr><td colspan="6" class="text-center">Se incarca...</td></tr>';
|
||
document.getElementById('detailError').style.display = 'none';
|
||
const detailItemsTotal = document.getElementById('detailItemsTotal');
|
||
if (detailItemsTotal) detailItemsTotal.textContent = '-';
|
||
const detailOrderTotal = document.getElementById('detailOrderTotal');
|
||
if (detailOrderTotal) detailOrderTotal.textContent = '-';
|
||
const mobileContainer = document.getElementById('detailItemsMobile');
|
||
if (mobileContainer) mobileContainer.innerHTML = '';
|
||
|
||
const modalEl = document.getElementById('orderDetailModal');
|
||
const existing = bootstrap.Modal.getInstance(modalEl);
|
||
if (existing) { existing.show(); } else { new bootstrap.Modal(modalEl).show(); }
|
||
|
||
try {
|
||
const res = await fetch(`/api/sync/order/${encodeURIComponent(orderNumber)}`);
|
||
const data = await res.json();
|
||
|
||
if (data.error) {
|
||
document.getElementById('detailError').textContent = data.error;
|
||
document.getElementById('detailError').style.display = '';
|
||
return;
|
||
}
|
||
|
||
const order = data.order || {};
|
||
document.getElementById('detailCustomer').textContent = order.customer_name || '-';
|
||
document.getElementById('detailDate').textContent = fmtDate(order.order_date);
|
||
document.getElementById('detailStatus').innerHTML = orderStatusBadge(order.status);
|
||
document.getElementById('detailIdComanda').textContent = order.id_comanda || '-';
|
||
document.getElementById('detailIdPartener').textContent = order.id_partener || '-';
|
||
document.getElementById('detailIdAdresaFact').textContent = order.id_adresa_facturare || '-';
|
||
document.getElementById('detailIdAdresaLivr').textContent = order.id_adresa_livrare || '-';
|
||
|
||
if (order.error_message) {
|
||
document.getElementById('detailError').textContent = order.error_message;
|
||
document.getElementById('detailError').style.display = '';
|
||
}
|
||
|
||
const dlvEl = document.getElementById('detailDeliveryCost');
|
||
if (dlvEl) dlvEl.textContent = order.delivery_cost > 0 ? Number(order.delivery_cost).toFixed(2) + ' lei' : '–';
|
||
|
||
const dscEl = document.getElementById('detailDiscount');
|
||
if (dscEl) dscEl.textContent = order.discount_total > 0 ? '–' + Number(order.discount_total).toFixed(2) + ' lei' : '–';
|
||
|
||
const items = data.items || [];
|
||
if (items.length === 0) {
|
||
document.getElementById('detailItemsBody').innerHTML = '<tr><td colspan="6" class="text-center text-muted">Niciun articol</td></tr>';
|
||
return;
|
||
}
|
||
|
||
// Update totals row
|
||
const itemsTotal = items.reduce((sum, item) => sum + (Number(item.price || 0) * Number(item.quantity || 0)), 0);
|
||
document.getElementById('detailItemsTotal').textContent = itemsTotal.toFixed(2) + ' lei';
|
||
document.getElementById('detailOrderTotal').textContent = order.order_total != null ? Number(order.order_total).toFixed(2) + ' lei' : '-';
|
||
|
||
// Mobile article flat list
|
||
const mobileContainer = document.getElementById('detailItemsMobile');
|
||
if (mobileContainer) {
|
||
mobileContainer.innerHTML = '<div class="detail-item-flat">' + items.map((item, idx) => {
|
||
const codmatList = item.codmat_details?.length
|
||
? item.codmat_details.map(d => `<span class="dif-codmat-link" onclick="openQuickMap('${esc(item.sku)}','${esc(item.product_name||'')}','${esc(orderNumber)}')">${esc(d.codmat)}</span>`).join(' ')
|
||
: `<span class="dif-codmat-link" onclick="openQuickMap('${esc(item.sku)}','${esc(item.product_name||'')}','${esc(orderNumber)}')">${esc(item.codmat || '–')}</span>`;
|
||
const valoare = (Number(item.price || 0) * Number(item.quantity || 0)).toFixed(2);
|
||
return `<div class="dif-item">
|
||
<div class="dif-row">
|
||
<span class="dif-sku">${esc(item.sku)}</span>
|
||
${codmatList}
|
||
</div>
|
||
<div class="dif-row">
|
||
<span class="dif-name">${esc(item.product_name || '–')}</span>
|
||
<span class="dif-qty">x${item.quantity || 0}</span>
|
||
<span class="dif-val">${valoare} lei</span>
|
||
</div>
|
||
</div>`;
|
||
}).join('') + '</div>';
|
||
}
|
||
|
||
document.getElementById('detailItemsBody').innerHTML = items.map(item => {
|
||
const valoare = (Number(item.price || 0) * Number(item.quantity || 0)).toFixed(2);
|
||
const codmatCell = `<span class="codmat-link" onclick="openQuickMap('${esc(item.sku)}', '${esc(item.product_name || '')}', '${esc(orderNumber)}')" title="Click pentru mapare">${renderCodmatCell(item)}</span>`;
|
||
return `<tr>
|
||
<td><code>${esc(item.sku)}</code></td>
|
||
<td>${esc(item.product_name || '-')}</td>
|
||
<td>${codmatCell}</td>
|
||
<td>${item.quantity || 0}</td>
|
||
<td>${item.price != null ? Number(item.price).toFixed(2) : '-'}</td>
|
||
<td class="text-end">${valoare}</td>
|
||
</tr>`;
|
||
}).join('');
|
||
} catch (err) {
|
||
document.getElementById('detailError').textContent = err.message;
|
||
document.getElementById('detailError').style.display = '';
|
||
}
|
||
}
|
||
|
||
// ── Quick Map Modal ───────────────────────────────
|
||
|
||
function openQuickMap(sku, productName, orderNumber) {
|
||
currentQmSku = sku;
|
||
currentQmOrderNumber = orderNumber;
|
||
document.getElementById('qmSku').textContent = sku;
|
||
document.getElementById('qmProductName').textContent = productName || '-';
|
||
document.getElementById('qmPctWarning').style.display = 'none';
|
||
|
||
const container = document.getElementById('qmCodmatLines');
|
||
container.innerHTML = '';
|
||
addQmCodmatLine();
|
||
|
||
new bootstrap.Modal(document.getElementById('quickMapModal')).show();
|
||
}
|
||
|
||
function addQmCodmatLine() {
|
||
const container = document.getElementById('qmCodmatLines');
|
||
const idx = container.children.length;
|
||
const div = document.createElement('div');
|
||
div.className = 'border rounded p-2 mb-2 qm-line';
|
||
div.innerHTML = `
|
||
<div class="mb-2 position-relative">
|
||
<label class="form-label form-label-sm mb-1">CODMAT (Articol ROA)</label>
|
||
<input type="text" class="form-control form-control-sm qm-codmat" placeholder="Cauta codmat sau denumire..." autocomplete="off">
|
||
<div class="autocomplete-dropdown d-none qm-ac-dropdown"></div>
|
||
<small class="text-muted qm-selected"></small>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-5">
|
||
<label class="form-label form-label-sm mb-1">Cantitate ROA</label>
|
||
<input type="number" class="form-control form-control-sm qm-cantitate" value="1" step="0.001" min="0.001">
|
||
</div>
|
||
<div class="col-5">
|
||
<label class="form-label form-label-sm mb-1">Procent Pret (%)</label>
|
||
<input type="number" class="form-control form-control-sm qm-procent" value="100" step="0.01" min="0" max="100">
|
||
</div>
|
||
<div class="col-2 d-flex align-items-end">
|
||
${idx > 0 ? `<button type="button" class="btn btn-sm btn-outline-danger" onclick="this.closest('.qm-line').remove()"><i class="bi bi-x"></i></button>` : ''}
|
||
</div>
|
||
</div>
|
||
`;
|
||
container.appendChild(div);
|
||
|
||
const input = div.querySelector('.qm-codmat');
|
||
const dropdown = div.querySelector('.qm-ac-dropdown');
|
||
const selected = div.querySelector('.qm-selected');
|
||
|
||
input.addEventListener('input', () => {
|
||
clearTimeout(qmAcTimeout);
|
||
qmAcTimeout = setTimeout(() => qmAutocomplete(input, dropdown, selected), 250);
|
||
});
|
||
input.addEventListener('blur', () => {
|
||
setTimeout(() => dropdown.classList.add('d-none'), 200);
|
||
});
|
||
}
|
||
|
||
async function qmAutocomplete(input, dropdown, selectedEl) {
|
||
const q = input.value;
|
||
if (q.length < 2) { dropdown.classList.add('d-none'); return; }
|
||
|
||
try {
|
||
const res = await fetch(`/api/articles/search?q=${encodeURIComponent(q)}`);
|
||
const data = await res.json();
|
||
if (!data.results || data.results.length === 0) { dropdown.classList.add('d-none'); return; }
|
||
|
||
dropdown.innerHTML = data.results.map(r =>
|
||
`<div class="autocomplete-item" onmousedown="qmSelectArticle(this, '${esc(r.codmat)}', '${esc(r.denumire)}${r.um ? ' (' + esc(r.um) + ')' : ''}')">
|
||
<span class="codmat">${esc(r.codmat)}</span> — <span class="denumire">${esc(r.denumire)}</span>${r.um ? ` <small class="text-muted">(${esc(r.um)})</small>` : ''}
|
||
</div>`
|
||
).join('');
|
||
dropdown.classList.remove('d-none');
|
||
} catch { dropdown.classList.add('d-none'); }
|
||
}
|
||
|
||
function qmSelectArticle(el, codmat, label) {
|
||
const line = el.closest('.qm-line');
|
||
line.querySelector('.qm-codmat').value = codmat;
|
||
line.querySelector('.qm-selected').textContent = label;
|
||
line.querySelector('.qm-ac-dropdown').classList.add('d-none');
|
||
}
|
||
|
||
async function saveQuickMapping() {
|
||
const lines = document.querySelectorAll('.qm-line');
|
||
const mappings = [];
|
||
|
||
for (const line of lines) {
|
||
const codmat = line.querySelector('.qm-codmat').value.trim();
|
||
const cantitate = parseFloat(line.querySelector('.qm-cantitate').value) || 1;
|
||
const procent = parseFloat(line.querySelector('.qm-procent').value) || 100;
|
||
if (!codmat) continue;
|
||
mappings.push({ codmat, cantitate_roa: cantitate, procent_pret: procent });
|
||
}
|
||
|
||
if (mappings.length === 0) { alert('Selecteaza cel putin un CODMAT'); return; }
|
||
|
||
if (mappings.length > 1) {
|
||
const totalPct = mappings.reduce((s, m) => s + m.procent_pret, 0);
|
||
if (Math.abs(totalPct - 100) > 0.01) {
|
||
document.getElementById('qmPctWarning').textContent = `Suma procentelor trebuie sa fie 100% (actual: ${totalPct.toFixed(2)}%)`;
|
||
document.getElementById('qmPctWarning').style.display = '';
|
||
return;
|
||
}
|
||
}
|
||
document.getElementById('qmPctWarning').style.display = 'none';
|
||
|
||
try {
|
||
let res;
|
||
if (mappings.length === 1) {
|
||
res = await fetch('/api/mappings', {
|
||
method: 'POST',
|
||
headers: { 'Content-Type': 'application/json' },
|
||
body: JSON.stringify({ sku: currentQmSku, codmat: mappings[0].codmat, cantitate_roa: mappings[0].cantitate_roa, procent_pret: mappings[0].procent_pret })
|
||
});
|
||
} else {
|
||
res = await fetch('/api/mappings/batch', {
|
||
method: 'POST',
|
||
headers: { 'Content-Type': 'application/json' },
|
||
body: JSON.stringify({ sku: currentQmSku, mappings })
|
||
});
|
||
}
|
||
const data = await res.json();
|
||
if (data.success) {
|
||
bootstrap.Modal.getInstance(document.getElementById('quickMapModal')).hide();
|
||
if (currentQmOrderNumber) openDashOrderDetail(currentQmOrderNumber);
|
||
loadDashOrders();
|
||
} else {
|
||
alert('Eroare: ' + (data.error || 'Unknown'));
|
||
}
|
||
} catch (err) {
|
||
alert('Eroare: ' + err.message);
|
||
}
|
||
}
|
||
|