754 lines
32 KiB
HTML
754 lines
32 KiB
HTML
{% extends "shared/frontend/base.html" %}
|
|
|
|
{% block title %}Ordre #{{ draft_id }} - BMC Hub{% endblock %}
|
|
|
|
{% block extra_css %}
|
|
<style>
|
|
.ordre-header {
|
|
background: var(--bg-card);
|
|
border-radius: 12px;
|
|
padding: 1.5rem;
|
|
margin-bottom: 1.5rem;
|
|
border: 1px solid rgba(0,0,0,0.06);
|
|
}
|
|
.info-item {
|
|
margin-bottom: 0.75rem;
|
|
}
|
|
.info-label {
|
|
font-size: 0.8rem;
|
|
text-transform: uppercase;
|
|
color: var(--text-secondary);
|
|
letter-spacing: 0.5px;
|
|
}
|
|
.info-value {
|
|
font-size: 1.1rem;
|
|
font-weight: 600;
|
|
color: var(--text-primary);
|
|
}
|
|
.summary-card {
|
|
background: var(--bg-card);
|
|
border-radius: 12px;
|
|
padding: 1rem 1.25rem;
|
|
border: 1px solid rgba(0,0,0,0.06);
|
|
}
|
|
.summary-title {
|
|
font-size: 0.8rem;
|
|
text-transform: uppercase;
|
|
color: var(--text-secondary);
|
|
margin-bottom: 0.35rem;
|
|
letter-spacing: 0.6px;
|
|
}
|
|
.summary-value {
|
|
font-size: 1.35rem;
|
|
font-weight: 700;
|
|
color: var(--text-primary);
|
|
}
|
|
.table thead th {
|
|
font-size: 0.8rem;
|
|
text-transform: uppercase;
|
|
color: white;
|
|
background: var(--accent);
|
|
}
|
|
.sync-card {
|
|
background: var(--bg-card);
|
|
border-radius: 12px;
|
|
padding: 1rem 1.25rem;
|
|
border: 1px solid rgba(0,0,0,0.06);
|
|
margin-bottom: 1rem;
|
|
}
|
|
.sync-label {
|
|
font-size: 0.8rem;
|
|
text-transform: uppercase;
|
|
color: var(--text-secondary);
|
|
letter-spacing: 0.5px;
|
|
margin-bottom: 0.25rem;
|
|
}
|
|
.sync-value {
|
|
font-weight: 600;
|
|
color: var(--text-primary);
|
|
}
|
|
.event-payload {
|
|
max-width: 360px;
|
|
white-space: pre-wrap;
|
|
word-break: break-word;
|
|
font-size: 0.8rem;
|
|
}
|
|
</style>
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="container-fluid py-4">
|
|
<div class="d-flex flex-wrap justify-content-between align-items-center mb-3">
|
|
<div>
|
|
<h2 class="mb-1"><i class="bi bi-receipt me-2"></i>Ordre #{{ draft_id }}</h2>
|
|
<div class="text-muted">Detaljeret visning</div>
|
|
</div>
|
|
<div class="d-flex gap-2">
|
|
<a href="/ordre" class="btn btn-outline-secondary"><i class="bi bi-arrow-left me-1"></i>Tilbage til liste</a>
|
|
<button class="btn btn-success" onclick="addManualLine()"><i class="bi bi-plus-circle me-1"></i>Tilføj linje</button>
|
|
<button class="btn btn-primary" onclick="saveOrder()"><i class="bi bi-save me-1"></i>Gem</button>
|
|
<button class="btn btn-warning" onclick="exportOrder()"><i class="bi bi-cloud-upload me-1"></i>Eksporter til e-conomic</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="safetyBanner" class="alert alert-warning d-none">
|
|
<i class="bi bi-shield-exclamation me-1"></i>
|
|
<strong>Safety mode aktiv:</strong> e-conomic eksport er read-only eller dry-run.
|
|
</div>
|
|
|
|
<div class="d-flex justify-content-end mb-3">
|
|
<div class="form-check form-switch">
|
|
<input class="form-check-input" type="checkbox" id="forceExportToggle">
|
|
<label class="form-check-label" for="forceExportToggle">Force export (brug kun ved retry)</label>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="ordre-header">
|
|
<div class="row g-3">
|
|
<div class="col-md-3">
|
|
<div class="info-item">
|
|
<div class="info-label">Titel</div>
|
|
<input type="text" id="orderTitle" class="form-control" placeholder="Ordre titel">
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<div class="info-item">
|
|
<div class="info-label">Kunde ID</div>
|
|
<input type="number" id="customerId" class="form-control" placeholder="Kunde ID">
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<div class="info-item">
|
|
<div class="info-label">Layout nr.</div>
|
|
<input type="number" id="layoutNumber" class="form-control" placeholder="e-conomic layout">
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<div class="info-item">
|
|
<div class="info-label">Status</div>
|
|
<div id="orderStatus" class="info-value">-</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-12">
|
|
<div class="info-item">
|
|
<div class="info-label">Noter</div>
|
|
<textarea id="orderNotes" class="form-control" rows="2" placeholder="Valgfri noter til ordren"></textarea>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row g-3 mb-3">
|
|
<div class="col-md-3"><div class="summary-card"><div class="summary-title">Antal linjer</div><div id="sumLines" class="summary-value">0</div></div></div>
|
|
<div class="col-md-3"><div class="summary-card"><div class="summary-title">Total beløb</div><div id="sumAmount" class="summary-value">0 kr.</div></div></div>
|
|
<div class="col-md-3"><div class="summary-card"><div class="summary-title">Oprettet</div><div id="createdAt" class="summary-value">-</div></div></div>
|
|
<div class="col-md-3"><div class="summary-card"><div class="summary-title">Sidst opdateret</div><div id="updatedAt" class="summary-value">-</div></div></div>
|
|
</div>
|
|
|
|
<div class="sync-card">
|
|
<div class="d-flex flex-wrap justify-content-between align-items-center gap-2 mb-3">
|
|
<div>
|
|
<h5 class="mb-1"><i class="bi bi-arrow-repeat me-2"></i>Sync Lifecycle</h5>
|
|
<div class="text-muted small">Manuel statusstyring og audit events for denne ordre</div>
|
|
</div>
|
|
<div class="d-flex gap-2">
|
|
<button class="btn btn-outline-secondary btn-sm" onclick="loadSyncEvents(0)">
|
|
<i class="bi bi-arrow-clockwise me-1"></i>Opdater events
|
|
</button>
|
|
<button class="btn btn-outline-success btn-sm" onclick="markDraftPaid()">
|
|
<i class="bi bi-cash-coin me-1"></i>Markér som betalt
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row g-3 align-items-end mb-3">
|
|
<div class="col-md-3">
|
|
<div class="sync-label">Sync status</div>
|
|
<select id="syncStatusSelect" class="form-select form-select-sm">
|
|
<option value="pending">pending</option>
|
|
<option value="exported">exported</option>
|
|
<option value="failed">failed</option>
|
|
<option value="posted">posted</option>
|
|
<option value="paid">paid</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<div class="sync-label">e-conomic ordre nr.</div>
|
|
<input id="economicOrderNumber" type="text" class="form-control form-control-sm" placeholder="fx 12345">
|
|
</div>
|
|
<div class="col-md-3">
|
|
<div class="sync-label">e-conomic faktura nr.</div>
|
|
<input id="economicInvoiceNumber" type="text" class="form-control form-control-sm" placeholder="fx 998877">
|
|
</div>
|
|
<div class="col-md-3 d-grid">
|
|
<button class="btn btn-primary btn-sm" onclick="updateSyncStatus()">
|
|
<i class="bi bi-check2-circle me-1"></i>Gem sync status
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row g-3 mb-3">
|
|
<div class="col-md-3">
|
|
<div class="sync-label">Aktuel status</div>
|
|
<div id="syncStatusBadge" class="sync-value">-</div>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<div class="sync-label">Sidste sync</div>
|
|
<div id="lastSyncAt" class="sync-value">-</div>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<div class="sync-label">Ordrenummer</div>
|
|
<div id="economicOrderNumberView" class="sync-value">-</div>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<div class="sync-label">Fakturanummer</div>
|
|
<div id="economicInvoiceNumberView" class="sync-value">-</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row g-2 align-items-end mb-3">
|
|
<div class="col-md-3">
|
|
<label class="form-label mb-1">Event type</label>
|
|
<input id="eventTypeFilter" type="text" class="form-control form-control-sm" placeholder="fx export_success">
|
|
</div>
|
|
<div class="col-md-2">
|
|
<label class="form-label mb-1">Fra status</label>
|
|
<input id="fromStatusFilter" type="text" class="form-control form-control-sm" placeholder="fx pending">
|
|
</div>
|
|
<div class="col-md-2">
|
|
<label class="form-label mb-1">Til status</label>
|
|
<input id="toStatusFilter" type="text" class="form-control form-control-sm" placeholder="fx exported">
|
|
</div>
|
|
<div class="col-md-2">
|
|
<label class="form-label mb-1">Fra dato</label>
|
|
<input id="fromDateFilter" type="date" class="form-control form-control-sm">
|
|
</div>
|
|
<div class="col-md-2">
|
|
<label class="form-label mb-1">Til dato</label>
|
|
<input id="toDateFilter" type="date" class="form-control form-control-sm">
|
|
</div>
|
|
<div class="col-md-1 d-grid">
|
|
<button class="btn btn-outline-primary btn-sm" onclick="loadSyncEvents(0)">
|
|
<i class="bi bi-funnel"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="table-responsive">
|
|
<table class="table table-sm align-middle mb-2">
|
|
<thead>
|
|
<tr>
|
|
<th>Tidspunkt</th>
|
|
<th>Type</th>
|
|
<th>Fra</th>
|
|
<th>Til</th>
|
|
<th>Payload</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="syncEventsBody">
|
|
<tr><td colspan="5" class="text-muted text-center py-3">Indlæser events...</td></tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<div class="d-flex justify-content-between align-items-center">
|
|
<div id="syncEventsMeta" class="small text-muted">-</div>
|
|
<div class="d-flex gap-2">
|
|
<button id="eventsPrevBtn" class="btn btn-outline-secondary btn-sm" onclick="changeEventsPage(-1)">Forrige</button>
|
|
<button id="eventsNextBtn" class="btn btn-outline-secondary btn-sm" onclick="changeEventsPage(1)">Næste</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<div class="card-body">
|
|
<div class="table-responsive">
|
|
<table class="table table-hover align-middle">
|
|
<thead>
|
|
<tr>
|
|
<th>Kilde</th>
|
|
<th>Beskrivelse</th>
|
|
<th>Antal</th>
|
|
<th>Enhedspris</th>
|
|
<th>Rabat %</th>
|
|
<th>Beløb</th>
|
|
<th>Enhed</th>
|
|
<th>Status</th>
|
|
<th>Handling</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="linesTableBody">
|
|
<tr><td colspan="9" class="text-muted text-center py-4">Indlæser...</td></tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="toast-container position-fixed bottom-0 end-0 p-3" style="z-index: 1080;">
|
|
<div id="detailToast" class="toast align-items-center text-bg-dark border-0" role="alert" aria-live="assertive" aria-atomic="true">
|
|
<div class="d-flex">
|
|
<div class="toast-body" id="detailToastBody">-</div>
|
|
<button type="button" class="btn-close btn-close-white me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|
|
|
|
{% block extra_js %}
|
|
<script>
|
|
const draftId = {{ draft_id }};
|
|
let orderData = null;
|
|
let orderLines = [];
|
|
const syncEventsLimit = 10;
|
|
let syncEventsOffset = 0;
|
|
let syncEventsTotal = 0;
|
|
let detailToast = null;
|
|
|
|
function showToast(message, variant = 'dark') {
|
|
const toastEl = document.getElementById('detailToast');
|
|
const bodyEl = document.getElementById('detailToastBody');
|
|
if (!toastEl || !bodyEl || typeof bootstrap === 'undefined') {
|
|
console.log(message);
|
|
return;
|
|
}
|
|
|
|
toastEl.className = 'toast align-items-center border-0';
|
|
toastEl.classList.add(`text-bg-${variant}`);
|
|
bodyEl.textContent = message;
|
|
if (!detailToast) {
|
|
detailToast = new bootstrap.Toast(toastEl, { delay: 3200 });
|
|
}
|
|
detailToast.show();
|
|
}
|
|
|
|
function formatCurrency(value) {
|
|
return new Intl.NumberFormat('da-DK', { style: 'currency', currency: 'DKK' }).format(Number(value || 0));
|
|
}
|
|
|
|
function formatDate(dateStr) {
|
|
if (!dateStr) return '-';
|
|
const date = new Date(dateStr);
|
|
return date.toLocaleDateString('da-DK', { day: '2-digit', month: '2-digit', year: 'numeric', hour: '2-digit', minute: '2-digit' });
|
|
}
|
|
|
|
function sourceBadge(type) {
|
|
if (type === 'subscription') return '<span class="badge bg-primary">Abonnement</span>';
|
|
if (type === 'hardware') return '<span class="badge bg-secondary">Hardware</span>';
|
|
if (type === 'manual') return '<span class="badge bg-info">Manuel</span>';
|
|
return '<span class="badge bg-success">Salg</span>';
|
|
}
|
|
|
|
function escapeHtml(value) {
|
|
return String(value || '')
|
|
.replace(/&/g, '&')
|
|
.replace(/</g, '<')
|
|
.replace(/>/g, '>')
|
|
.replace(/"/g, '"')
|
|
.replace(/'/g, ''');
|
|
}
|
|
|
|
function syncStatusBadge(status) {
|
|
const normalized = String(status || 'pending').toLowerCase();
|
|
if (normalized === 'paid') return '<span class="badge bg-success">paid</span>';
|
|
if (normalized === 'posted') return '<span class="badge bg-info text-dark">posted</span>';
|
|
if (normalized === 'exported') return '<span class="badge bg-primary">exported</span>';
|
|
if (normalized === 'failed') return '<span class="badge bg-danger">failed</span>';
|
|
return '<span class="badge bg-warning text-dark">pending</span>';
|
|
}
|
|
|
|
function refreshSyncPanelFromOrder() {
|
|
document.getElementById('syncStatusSelect').value = (orderData.sync_status || 'pending').toLowerCase();
|
|
document.getElementById('economicOrderNumber').value = orderData.economic_order_number || '';
|
|
document.getElementById('economicInvoiceNumber').value = orderData.economic_invoice_number || '';
|
|
|
|
document.getElementById('syncStatusBadge').innerHTML = syncStatusBadge(orderData.sync_status);
|
|
document.getElementById('lastSyncAt').textContent = formatDate(orderData.last_sync_at);
|
|
document.getElementById('economicOrderNumberView').textContent = orderData.economic_order_number || '-';
|
|
document.getElementById('economicInvoiceNumberView').textContent = orderData.economic_invoice_number || '-';
|
|
}
|
|
|
|
function renderLines() {
|
|
const tbody = document.getElementById('linesTableBody');
|
|
if (!orderLines.length) {
|
|
tbody.innerHTML = '<tr><td colspan="9" class="text-muted text-center py-4">Ingen linjer</td></tr>';
|
|
updateSummary();
|
|
return;
|
|
}
|
|
|
|
tbody.innerHTML = orderLines.map((line, index) => {
|
|
const isManual = line.source_type === 'manual';
|
|
const descriptionField = isManual
|
|
? `<input type="text" class="form-control form-control-sm" value="${line.description || ''}"
|
|
onchange="orderLines[${index}].description = this.value;">`
|
|
: (line.description || '-');
|
|
|
|
const exportStatus = line.export_status || '-';
|
|
const statusBadge = exportStatus === 'exported'
|
|
? '<span class="badge bg-success">Eksporteret</span>'
|
|
: exportStatus === 'dry-run'
|
|
? '<span class="badge bg-warning text-dark">Dry-run</span>'
|
|
: '<span class="badge bg-light text-dark border">Ikke eksporteret</span>';
|
|
|
|
return `
|
|
<tr>
|
|
<td>${sourceBadge(line.source_type)}</td>
|
|
<td>${descriptionField}</td>
|
|
<td style="min-width:100px;">
|
|
<input type="number" min="0.01" step="0.01" class="form-control form-control-sm" value="${Number(line.quantity || 1)}"
|
|
onchange="orderLines[${index}].quantity = Number(this.value || 0); updateLineAmount(${index});">
|
|
</td>
|
|
<td style="min-width:120px;">
|
|
<input type="number" min="0" step="0.01" class="form-control form-control-sm" value="${Number(line.unit_price || 0)}"
|
|
onchange="orderLines[${index}].unit_price = Number(this.value || 0); updateLineAmount(${index});">
|
|
</td>
|
|
<td style="min-width:110px;">
|
|
<input type="number" min="0" max="100" step="0.01" class="form-control form-control-sm" value="${Number(line.discount_percentage || 0)}"
|
|
onchange="orderLines[${index}].discount_percentage = Number(this.value || 0); updateLineAmount(${index});">
|
|
</td>
|
|
<td id="lineAmount-${index}" class="fw-semibold">${formatCurrency(line.amount)}</td>
|
|
<td>${line.unit || 'stk'}</td>
|
|
<td>${statusBadge}</td>
|
|
<td>
|
|
${isManual ? `<button class="btn btn-sm btn-outline-danger" onclick="deleteLine(${index})" title="Slet linje"><i class="bi bi-trash"></i></button>` : '-'}
|
|
</td>
|
|
</tr>
|
|
`;
|
|
}).join('');
|
|
|
|
updateSummary();
|
|
}
|
|
|
|
function updateLineAmount(index) {
|
|
const line = orderLines[index];
|
|
const qty = Number(line.quantity || 0);
|
|
const price = Number(line.unit_price || 0);
|
|
const discount = Number(line.discount_percentage || 0);
|
|
const gross = qty * price;
|
|
const net = gross * (1 - (discount / 100));
|
|
line.amount = Number(net.toFixed(2));
|
|
renderLines();
|
|
}
|
|
|
|
function updateSummary() {
|
|
const totalAmount = orderLines.reduce((sum, line) => sum + Number(line.amount || 0), 0);
|
|
document.getElementById('sumLines').textContent = orderLines.length;
|
|
document.getElementById('sumAmount').textContent = formatCurrency(totalAmount);
|
|
}
|
|
|
|
function addManualLine() {
|
|
const newLine = {
|
|
line_key: `manual-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
|
|
source_type: 'manual',
|
|
source_id: null,
|
|
customer_name: '-',
|
|
customer_id: null,
|
|
description: 'Ny linje',
|
|
quantity: 1,
|
|
unit_price: 0,
|
|
discount_percentage: 0,
|
|
amount: 0,
|
|
unit: 'stk',
|
|
selected: true,
|
|
};
|
|
orderLines.push(newLine);
|
|
renderLines();
|
|
}
|
|
|
|
function deleteLine(index) {
|
|
if (!confirm('Slet denne linje?')) return;
|
|
orderLines.splice(index, 1);
|
|
renderLines();
|
|
}
|
|
|
|
function normalizeOrderLine(line) {
|
|
// Handle e-conomic format (product.description, unitNetPrice, etc.)
|
|
if (line.product && line.product.description && !line.description) {
|
|
return {
|
|
line_key: line.line_key || `imported-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
|
|
source_type: line.source_type || 'manual',
|
|
source_id: line.source_id || null,
|
|
customer_name: line.customer_name || '-',
|
|
customer_id: line.customer_id || null,
|
|
description: line.product.description || '',
|
|
quantity: Number(line.quantity || 1),
|
|
unit_price: Number(line.unitNetPrice || 0),
|
|
discount_percentage: Number(line.discountPercentage || 0),
|
|
amount: Number(line.totalNetAmount || 0),
|
|
unit: line.unit || 'stk',
|
|
product_id: line.product.productNumber || null,
|
|
selected: line.selected !== false,
|
|
export_status: line.export_status || null,
|
|
};
|
|
}
|
|
// Already in our internal format
|
|
return {
|
|
...line,
|
|
quantity: Number(line.quantity || 1),
|
|
unit_price: Number(line.unit_price || 0),
|
|
discount_percentage: Number(line.discount_percentage || 0),
|
|
amount: Number(line.amount || 0),
|
|
};
|
|
}
|
|
|
|
async function loadOrder() {
|
|
try {
|
|
const res = await fetch(`/api/v1/ordre/drafts/${draftId}`);
|
|
if (!res.ok) throw new Error('Kunne ikke hente ordre');
|
|
|
|
orderData = await res.json();
|
|
orderLines = Array.isArray(orderData.lines_json)
|
|
? orderData.lines_json.map(normalizeOrderLine)
|
|
: [];
|
|
|
|
document.getElementById('orderTitle').value = orderData.title || '';
|
|
document.getElementById('customerId').value = orderData.customer_id || '';
|
|
document.getElementById('layoutNumber').value = orderData.layout_number || '';
|
|
document.getElementById('orderNotes').value = orderData.notes || '';
|
|
|
|
const hasExported = orderData.last_exported_at ? true : false;
|
|
document.getElementById('orderStatus').innerHTML = hasExported
|
|
? '<span class="badge bg-success">Eksporteret</span>'
|
|
: '<span class="badge bg-warning text-dark">Ikke eksporteret</span>';
|
|
|
|
document.getElementById('createdAt').textContent = formatDate(orderData.created_at);
|
|
document.getElementById('updatedAt').textContent = formatDate(orderData.updated_at);
|
|
|
|
renderLines();
|
|
refreshSyncPanelFromOrder();
|
|
await loadConfig();
|
|
await loadSyncEvents(syncEventsOffset);
|
|
} catch (error) {
|
|
console.error(error);
|
|
showToast(`Fejl: ${error.message}`, 'danger');
|
|
}
|
|
}
|
|
|
|
async function updateSyncStatus() {
|
|
const payload = {
|
|
sync_status: (document.getElementById('syncStatusSelect').value || 'pending').trim().toLowerCase(),
|
|
economic_order_number: document.getElementById('economicOrderNumber').value.trim() || null,
|
|
economic_invoice_number: document.getElementById('economicInvoiceNumber').value.trim() || null,
|
|
};
|
|
|
|
try {
|
|
const res = await fetch(`/api/v1/ordre/drafts/${draftId}/sync-status`, {
|
|
method: 'PATCH',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
body: JSON.stringify(payload),
|
|
});
|
|
const data = await res.json();
|
|
if (!res.ok) throw new Error(data.detail || 'Kunne ikke opdatere sync status');
|
|
|
|
orderData = data;
|
|
refreshSyncPanelFromOrder();
|
|
await loadSyncEvents(0);
|
|
showToast('Sync status opdateret', 'success');
|
|
} catch (error) {
|
|
showToast(`Fejl: ${error.message}`, 'danger');
|
|
}
|
|
}
|
|
|
|
async function markDraftPaid() {
|
|
if (!confirm('Markér denne ordre som betalt (kun hvis status er posted)?')) return;
|
|
|
|
try {
|
|
const res = await fetch('/api/v1/billing/drafts/reconcile-sync-status', {
|
|
method: 'POST',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
body: JSON.stringify({ apply: true, mark_paid_ids: [draftId] }),
|
|
});
|
|
const data = await res.json();
|
|
if (!res.ok) throw new Error(data.detail || 'Kunne ikke markere som betalt');
|
|
|
|
await loadOrder();
|
|
if ((orderData.sync_status || '').toLowerCase() !== 'paid') {
|
|
showToast('Ingen statusændring. Ordren skal være i status posted før den kan markeres som paid.', 'warning');
|
|
return;
|
|
}
|
|
showToast('Ordre markeret som betalt', 'success');
|
|
} catch (error) {
|
|
showToast(`Fejl: ${error.message}`, 'danger');
|
|
}
|
|
}
|
|
|
|
function buildEventsQuery(offset) {
|
|
const params = new URLSearchParams();
|
|
params.set('limit', String(syncEventsLimit));
|
|
params.set('offset', String(Math.max(0, offset || 0)));
|
|
|
|
const eventType = document.getElementById('eventTypeFilter').value.trim();
|
|
const fromStatus = document.getElementById('fromStatusFilter').value.trim();
|
|
const toStatus = document.getElementById('toStatusFilter').value.trim();
|
|
const fromDate = document.getElementById('fromDateFilter').value;
|
|
const toDate = document.getElementById('toDateFilter').value;
|
|
|
|
if (eventType) params.set('event_type', eventType);
|
|
if (fromStatus) params.set('from_status', fromStatus);
|
|
if (toStatus) params.set('to_status', toStatus);
|
|
if (fromDate) params.set('from_date', fromDate);
|
|
if (toDate) params.set('to_date', toDate);
|
|
|
|
return params.toString();
|
|
}
|
|
|
|
function renderSyncEvents(items) {
|
|
const body = document.getElementById('syncEventsBody');
|
|
if (!Array.isArray(items) || items.length === 0) {
|
|
body.innerHTML = '<tr><td colspan="5" class="text-muted text-center py-3">Ingen events fundet</td></tr>';
|
|
return;
|
|
}
|
|
|
|
body.innerHTML = items.map((event) => {
|
|
const payload = typeof event.event_payload === 'object'
|
|
? JSON.stringify(event.event_payload, null, 2)
|
|
: String(event.event_payload || '');
|
|
|
|
return `
|
|
<tr>
|
|
<td>${formatDate(event.created_at)}</td>
|
|
<td><span class="badge bg-light text-dark border">${escapeHtml(event.event_type || '-')}</span></td>
|
|
<td>${escapeHtml(event.from_status || '-')}</td>
|
|
<td>${escapeHtml(event.to_status || '-')}</td>
|
|
<td><pre class="event-payload mb-0">${escapeHtml(payload)}</pre></td>
|
|
</tr>
|
|
`;
|
|
}).join('');
|
|
}
|
|
|
|
function updateEventsPager() {
|
|
const start = syncEventsTotal === 0 ? 0 : syncEventsOffset + 1;
|
|
const end = Math.min(syncEventsOffset + syncEventsLimit, syncEventsTotal);
|
|
document.getElementById('syncEventsMeta').textContent = `Viser ${start}-${end} af ${syncEventsTotal}`;
|
|
|
|
document.getElementById('eventsPrevBtn').disabled = syncEventsOffset <= 0;
|
|
document.getElementById('eventsNextBtn').disabled = syncEventsOffset + syncEventsLimit >= syncEventsTotal;
|
|
}
|
|
|
|
function changeEventsPage(delta) {
|
|
const nextOffset = syncEventsOffset + (delta * syncEventsLimit);
|
|
if (nextOffset < 0 || nextOffset >= syncEventsTotal) {
|
|
return;
|
|
}
|
|
loadSyncEvents(nextOffset);
|
|
}
|
|
|
|
async function loadSyncEvents(offset = 0) {
|
|
syncEventsOffset = Math.max(0, offset);
|
|
const body = document.getElementById('syncEventsBody');
|
|
body.innerHTML = '<tr><td colspan="5" class="text-muted text-center py-3">Indlæser events...</td></tr>';
|
|
|
|
try {
|
|
const query = buildEventsQuery(syncEventsOffset);
|
|
const res = await fetch(`/api/v1/ordre/drafts/${draftId}/sync-events?${query}`);
|
|
const data = await res.json();
|
|
if (!res.ok) throw new Error(data.detail || 'Kunne ikke hente sync events');
|
|
|
|
syncEventsTotal = Number(data.total || 0);
|
|
renderSyncEvents(data.items || []);
|
|
updateEventsPager();
|
|
} catch (error) {
|
|
body.innerHTML = `<tr><td colspan="5" class="text-danger text-center py-3">${escapeHtml(error.message)}</td></tr>`;
|
|
syncEventsTotal = 0;
|
|
updateEventsPager();
|
|
}
|
|
}
|
|
|
|
async function loadConfig() {
|
|
try {
|
|
const res = await fetch('/api/v1/ordre/config');
|
|
if (!res.ok) return;
|
|
const cfg = await res.json();
|
|
if (cfg.economic_read_only || cfg.economic_dry_run) {
|
|
document.getElementById('safetyBanner').classList.remove('d-none');
|
|
}
|
|
if (!document.getElementById('layoutNumber').value && cfg.default_layout) {
|
|
document.getElementById('layoutNumber').value = cfg.default_layout;
|
|
}
|
|
} catch (err) {
|
|
console.error('Config load failed', err);
|
|
}
|
|
}
|
|
|
|
async function saveOrder() {
|
|
const payload = {
|
|
title: document.getElementById('orderTitle').value || 'Ordre',
|
|
customer_id: Number(document.getElementById('customerId').value || 0) || null,
|
|
lines: orderLines,
|
|
notes: document.getElementById('orderNotes').value || null,
|
|
layout_number: Number(document.getElementById('layoutNumber').value || 0) || null,
|
|
};
|
|
|
|
try {
|
|
const res = await fetch(`/api/v1/ordre/drafts/${draftId}`, {
|
|
method: 'PATCH',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
body: JSON.stringify(payload),
|
|
});
|
|
const data = await res.json();
|
|
if (!res.ok) throw new Error(data.detail || 'Kunne ikke gemme ordre');
|
|
|
|
showToast('Ordre gemt', 'success');
|
|
await loadOrder();
|
|
} catch (err) {
|
|
showToast(`Kunne ikke gemme ordre: ${err.message}`, 'danger');
|
|
}
|
|
}
|
|
|
|
async function exportOrder() {
|
|
const customerId = Number(document.getElementById('customerId').value || 0);
|
|
if (!customerId) {
|
|
showToast('Angiv kunde ID før eksport', 'warning');
|
|
return;
|
|
}
|
|
|
|
if (!orderLines.length) {
|
|
showToast('Ingen linjer at eksportere', 'warning');
|
|
return;
|
|
}
|
|
|
|
const payload = {
|
|
customer_id: customerId,
|
|
lines: orderLines.map(line => ({
|
|
line_key: line.line_key,
|
|
source_type: line.source_type,
|
|
source_id: line.source_id,
|
|
description: line.description,
|
|
quantity: Number(line.quantity || 0),
|
|
unit_price: Number(line.unit_price || 0),
|
|
discount_percentage: Number(line.discount_percentage || 0),
|
|
unit: line.unit || 'stk',
|
|
product_id: line.product_id || null,
|
|
selected: true,
|
|
})),
|
|
notes: document.getElementById('orderNotes').value || null,
|
|
layout_number: Number(document.getElementById('layoutNumber').value || 0) || null,
|
|
draft_id: draftId,
|
|
force_export: document.getElementById('forceExportToggle').checked,
|
|
};
|
|
|
|
try {
|
|
const res = await fetch('/api/v1/ordre/export', {
|
|
method: 'POST',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
body: JSON.stringify(payload),
|
|
});
|
|
const data = await res.json();
|
|
if (!res.ok) {
|
|
throw new Error(data.detail || 'Eksport fejlede');
|
|
}
|
|
|
|
showToast(data.message || 'Eksport udført', data.dry_run ? 'warning' : 'success');
|
|
await loadOrder();
|
|
} catch (err) {
|
|
console.error(err);
|
|
showToast(`Eksport fejlede: ${err.message}`, 'danger');
|
|
}
|
|
}
|
|
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
loadOrder();
|
|
});
|
|
</script>
|
|
{% endblock %}
|