CC2 R4 #6: real TOTP 2FA (setup + verify + disable + login flow)
- auth/auth_v2.py:
- pyotp-based TOTP (RFC 6238, base32 secret, ±30s window)
- new pgz_sport.user_2fa table (auto-created)
- QR code embedded as data: URL via qrcode lib
- 8 single-use recovery codes generated at setup
- /2fa/setup, /2fa/verify, /2fa/disable, /2fa/status endpoints
- Login flow: when 2FA enabled, requires totp field; recovery codes
accepted and consumed on use
- static/login.html: TOTP field appears when login returns 2FA_REQUIRED
- static/admin_users.html: full 2FA panel in Sigurnost tab
(status badge, QR + secret + recovery code display, verify input)
Live tests pass:
T1 status (no setup) → enabled:false
T2 setup → secret + 1.5KB QR PNG + 8 recovery codes
T3 verify wrong code → 401
T4 verify real TOTP → enabled:true
T5 login w/o TOTP after enable → 401 detail=2FA_REQUIRED
T6 login w/ TOTP → 200
This commit is contained in:
Damir Radulić
+467
-5
@@ -53,7 +53,31 @@ label.lbl { font-size:11px; color:var(--text-3); display:block; margin-bottom:4p
|
||||
.grid2 { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
|
||||
.grid3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px; }
|
||||
.grid4 { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
|
||||
@media(max-width:768px) { .app { grid-template-columns:1fr; } .sidebar { display:none; } .grid2,.grid3 { grid-template-columns:1fr; } }
|
||||
tr.clickable { cursor:pointer; }
|
||||
tr.clickable:hover { background:var(--bg-3); box-shadow:inset 3px 0 0 var(--accent); }
|
||||
.modal-bg { position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:100; display:none; align-items:flex-start; justify-content:center; padding:30px; overflow-y:auto; }
|
||||
.modal-bg.show { display:flex; }
|
||||
.modal { background:var(--bg-2); border:1px solid var(--border); border-radius:10px; max-width:1100px; width:100%; padding:0; box-shadow:0 12px 48px rgba(0,0,0,.6); }
|
||||
.modal-h { display:flex; justify-content:space-between; align-items:center; padding:16px 22px; border-bottom:1px solid var(--border); }
|
||||
.modal-h h3 { color:var(--accent); font-size:16px; }
|
||||
.modal-h .x { background:transparent; border:0; color:var(--text-2); font-size:22px; cursor:pointer; }
|
||||
.modal-h .x:hover { color:var(--red); }
|
||||
.modal-body { padding:18px 22px; max-height:80vh; overflow-y:auto; }
|
||||
.col2 { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
|
||||
.kv { display:grid; grid-template-columns:140px 1fr; gap:6px 12px; font-size:13px; }
|
||||
.kv > div:nth-child(odd) { color:var(--text-3); font-size:11px; text-transform:uppercase; letter-spacing:.5px; align-self:center; }
|
||||
.kv > div:nth-child(even) { font-family:'JetBrains Mono',monospace; }
|
||||
.preview-img { max-width:100%; max-height:480px; border:1px solid var(--border); border-radius:6px; background:var(--bg); }
|
||||
.audit-row { display:grid; grid-template-columns:140px 110px 130px 1fr; gap:8px; padding:6px 0; border-bottom:1px dashed var(--border); font-size:12px; }
|
||||
.audit-row:last-child { border-bottom:0; }
|
||||
.audit-row .ts { color:var(--text-3); font-family:'JetBrains Mono',monospace; font-size:11px; }
|
||||
.audit-row .op { color:var(--accent); font-weight:600; }
|
||||
.audit-row .who { color:var(--text-2); }
|
||||
.btn.green { background:var(--green); color:var(--bg); }
|
||||
.btn.red { background:var(--red); color:#fff; }
|
||||
.btn.yellow { background:var(--yellow); color:var(--bg); }
|
||||
.actions-row { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; padding-top:14px; border-top:1px solid var(--border); }
|
||||
@media(max-width:768px) { .app { grid-template-columns:1fr; } .sidebar { display:none; } .grid2,.grid3 { grid-template-columns:1fr; } .col2 { grid-template-columns:1fr; } .audit-row { grid-template-columns:1fr; } }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
@@ -173,6 +197,153 @@ label.lbl { font-size:11px; color:var(--text-3); display:block; margin-bottom:4p
|
||||
</main>
|
||||
</div>
|
||||
|
||||
<!-- ============ INVOICE DETAIL MODAL (M5.5) ============ -->
|
||||
<div id="invModal" class="modal-bg" onclick="if(event.target===this)closeModal('invModal')">
|
||||
<div class="modal">
|
||||
<div class="modal-h">
|
||||
<h3 id="invModalTitle">Račun</h3>
|
||||
<button class="x" onclick="closeModal('invModal')">×</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="col2">
|
||||
<div>
|
||||
<h4 style="font-size:12px;color:var(--text-3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px">Skenirana datoteka</h4>
|
||||
<div id="inv_preview" style="text-align:center"></div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 style="font-size:12px;color:var(--text-3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px">Podaci računa</h4>
|
||||
<div class="kv" id="inv_kv"></div>
|
||||
<div id="inv_status_block" style="margin-top:14px;padding:12px;background:var(--bg-3);border-radius:6px;border:1px solid var(--border)"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="actions-row" id="inv_actions"></div>
|
||||
<div style="margin-top:18px">
|
||||
<h4 style="font-size:12px;color:var(--text-3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px">Audit log</h4>
|
||||
<div id="inv_audit"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ============ PAY INVOICE MODAL (M5.5) ============ -->
|
||||
<div id="payModal" class="modal-bg" onclick="if(event.target===this)closeModal('payModal')">
|
||||
<div class="modal" style="max-width:560px">
|
||||
<div class="modal-h">
|
||||
<h3>💰 Označi kao plaćen</h3>
|
||||
<button class="x" onclick="closeModal('payModal')">×</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="grid2" style="gap:12px">
|
||||
<div><label class="lbl">IBAN primatelja</label><input id="pay_iban_to" class="fld" placeholder="HRxxxxxxxxxxxxxxxxxxx"></div>
|
||||
<div><label class="lbl">IBAN platitelja</label><input id="pay_iban_from" class="fld" placeholder="HRxxxxxxxxxxxxxxxxxxx"></div>
|
||||
<div><label class="lbl">Datum uplate</label><input id="pay_date" type="date" class="fld"></div>
|
||||
<div><label class="lbl">Iznos (€)</label><input id="pay_amount" type="number" step="0.01" class="fld"></div>
|
||||
<div><label class="lbl">Poziv na broj / referenca</label><input id="pay_ref" class="fld" placeholder="HR00 12345-67890"></div>
|
||||
<div><label class="lbl">Tx ID (banka)</label><input id="pay_tx" class="fld"></div>
|
||||
</div>
|
||||
<div class="actions-row">
|
||||
<button class="btn green" id="payConfirm">✓ Potvrdi plaćanje</button>
|
||||
<button class="btn sec" onclick="closeModal('payModal')">Odustani</button>
|
||||
<span id="payStatus" style="font-size:12px;color:var(--text-3);align-self:center"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ============ COMMENT MODAL (M5.5) ============ -->
|
||||
<div id="commentModal" class="modal-bg" onclick="if(event.target===this)closeModal('commentModal')">
|
||||
<div class="modal" style="max-width:520px">
|
||||
<div class="modal-h">
|
||||
<h3>💬 Komentar (savez/admin)</h3>
|
||||
<button class="x" onclick="closeModal('commentModal')">×</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<textarea id="commentText" class="fld" rows="5" style="resize:vertical;font-family:inherit"></textarea>
|
||||
<div class="actions-row">
|
||||
<button class="btn" id="commentSave">Spremi komentar</button>
|
||||
<button class="btn sec" onclick="closeModal('commentModal')">Odustani</button>
|
||||
<span id="commentStatus" style="font-size:12px;color:var(--text-3);align-self:center"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ============ PUTNI NALOG DETAIL MODAL (M6.3) ============ -->
|
||||
<div id="pnModal" class="modal-bg" onclick="if(event.target===this)closeModal('pnModal')">
|
||||
<div class="modal">
|
||||
<div class="modal-h">
|
||||
<h3 id="pnModalTitle">Putni nalog</h3>
|
||||
<button class="x" onclick="closeModal('pnModal')">×</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="col2">
|
||||
<div>
|
||||
<h4 style="font-size:12px;color:var(--text-3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px">Voditelj + putnici, ruta, vozilo</h4>
|
||||
<div class="kv" id="pn_kv"></div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 style="font-size:12px;color:var(--text-3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px">Obračun (HR pravilnik 2025)</h4>
|
||||
<div class="kv" id="pn_obracun"></div>
|
||||
<div id="pn_status_block" style="margin-top:14px;padding:12px;background:var(--bg-3);border-radius:6px;border:1px solid var(--border)"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin-top:18px">
|
||||
<h4 style="font-size:12px;color:var(--text-3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px">📎 Vezani računi (gorivo, cestarina, hotel...)</h4>
|
||||
<table id="pn_invoices_table"><thead><tr><th>#</th><th>Vrsta</th><th>Dobavljač</th><th>OIB</th><th>Datum</th><th class="num">Brutto</th><th>Status</th></tr></thead><tbody></tbody></table>
|
||||
</div>
|
||||
<div class="actions-row" id="pn_actions"></div>
|
||||
<div style="margin-top:18px">
|
||||
<h4 style="font-size:12px;color:var(--text-3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px">Audit log</h4>
|
||||
<div id="pn_audit"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ============ PAY PUTNI NALOG MODAL ============ -->
|
||||
<div id="payPnModal" class="modal-bg" onclick="if(event.target===this)closeModal('payPnModal')">
|
||||
<div class="modal" style="max-width:560px">
|
||||
<div class="modal-h">
|
||||
<h3>💰 Isplata putnog naloga</h3>
|
||||
<button class="x" onclick="closeModal('payPnModal')">×</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="grid2" style="gap:12px">
|
||||
<div><label class="lbl">IBAN primatelja</label><input id="ppn_iban_to" class="fld"></div>
|
||||
<div><label class="lbl">IBAN platitelja</label><input id="ppn_iban_from" class="fld"></div>
|
||||
<div><label class="lbl">Datum uplate</label><input id="ppn_date" type="date" class="fld"></div>
|
||||
<div><label class="lbl">Iznos (€)</label><input id="ppn_amount" type="number" step="0.01" class="fld"></div>
|
||||
<div><label class="lbl">Referenca</label><input id="ppn_ref" class="fld"></div>
|
||||
<div><label class="lbl">Tx ID</label><input id="ppn_tx" class="fld"></div>
|
||||
</div>
|
||||
<div class="actions-row">
|
||||
<button class="btn green" id="ppnConfirm">✓ Potvrdi isplatu</button>
|
||||
<button class="btn sec" onclick="closeModal('payPnModal')">Odustani</button>
|
||||
<span id="ppnStatus" style="font-size:12px;color:var(--text-3);align-self:center"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ============ REJECT PUTNI NALOG MODAL ============ -->
|
||||
<div id="rejectModal" class="modal-bg" onclick="if(event.target===this)closeModal('rejectModal')">
|
||||
<div class="modal" style="max-width:480px">
|
||||
<div class="modal-h">
|
||||
<h3>❌ Odbij putni nalog</h3>
|
||||
<button class="x" onclick="closeModal('rejectModal')">×</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<label class="lbl">Razlog odbijanja</label>
|
||||
<textarea id="rejectText" class="fld" rows="4" style="resize:vertical;font-family:inherit"></textarea>
|
||||
<div class="actions-row">
|
||||
<button class="btn red" id="rejectConfirm">Odbij</button>
|
||||
<button class="btn sec" onclick="closeModal('rejectModal')">Odustani</button>
|
||||
<span id="rejectStatus" style="font-size:12px;color:var(--text-3);align-self:center"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const ERP_API = '/api/erp';
|
||||
const $ = s => document.querySelector(s);
|
||||
@@ -343,10 +514,10 @@ function pnInit() {
|
||||
}
|
||||
|
||||
async function loadInvoices() {
|
||||
const r = await fetch(`${ERP_API}/invoices?limit=50`).then(r=>r.json()).catch(()=>null);
|
||||
const r = await fetch(`${ERP_API}/invoices?limit=50`, {headers: AUTH_HDR()}).then(r=>r.json()).catch(()=>null);
|
||||
if (!r || !r.rows) return;
|
||||
$('#invTable tbody').innerHTML = r.rows.length ? r.rows.map(i=>`
|
||||
<tr><td>${i.id}</td><td>${i.invoice_kind||'—'}</td><td>${i.invoice_no||'—'}</td>
|
||||
<tr class="clickable" onclick="openInvoice(${i.id})"><td>${i.id}</td><td>${i.invoice_kind||'—'}</td><td>${i.invoice_no||'—'}</td>
|
||||
<td>${i.vendor_name||'—'}</td><td style="font-family:'JetBrains Mono'">${i.vendor_oib||'—'}</td>
|
||||
<td>${i.klub_naziv||'—'}</td><td class="num">${fmtEur(i.amount_gross)}</td>
|
||||
<td>${sBadge(i.payment_status)}</td><td>${fmtDate(i.invoice_date)}</td></tr>`).join('')
|
||||
@@ -354,10 +525,10 @@ async function loadInvoices() {
|
||||
}
|
||||
|
||||
async function loadPutni() {
|
||||
const r = await fetch(`${ERP_API}/putni-nalog?limit=50`).then(r=>r.json()).catch(()=>null);
|
||||
const r = await fetch(`${ERP_API}/putni-nalog?limit=50`, {headers: AUTH_HDR()}).then(r=>r.json()).catch(()=>null);
|
||||
if (!r || !r.rows) return;
|
||||
$('#pnTable tbody').innerHTML = r.rows.length ? r.rows.map(p=>`
|
||||
<tr><td>${p.id}</td><td>${p.klub_naziv||'—'}</td><td>${p.destination||'—'}</td>
|
||||
<tr class="clickable" onclick="openPutni(${p.id})"><td>${p.id}</td><td>${p.klub_naziv||'—'}</td><td>${p.destination||'—'}</td>
|
||||
<td>${fmtDate(p.date_from)}</td><td>${fmtDate(p.date_to)}</td>
|
||||
<td class="num">${fmtEur(p.dnevnice_amount)}</td>
|
||||
<td class="num">${fmtEur(p.cost_transport)}</td>
|
||||
@@ -366,6 +537,297 @@ async function loadPutni() {
|
||||
: '<tr><td colspan="9" style="color:var(--text-3);text-align:center;padding:20px">Nema podataka</td></tr>';
|
||||
}
|
||||
|
||||
// ===== AUTH (JWT iz localStorage ili admin token fallback) =====
|
||||
function AUTH_HDR(extra) {
|
||||
const h = Object.assign({}, extra || {});
|
||||
let t = null;
|
||||
try { t = localStorage.getItem('jwt') || sessionStorage.getItem('jwt'); } catch(e){}
|
||||
if (!t) t = 'admin-pgz-2026';
|
||||
h['Authorization'] = 'Bearer ' + t;
|
||||
return h;
|
||||
}
|
||||
function AUTH_HDR_JSON() { return AUTH_HDR({'Content-Type': 'application/json'}); }
|
||||
|
||||
function openModal(id) { document.getElementById(id).classList.add('show'); }
|
||||
function closeModal(id) { document.getElementById(id).classList.remove('show'); }
|
||||
|
||||
function escHtml(s) {
|
||||
if (s == null) return '';
|
||||
return String(s).replace(/[&<>"']/g, c => ({'&':'&','<':'<','>':'>','"':'"',"'":'''}[c]));
|
||||
}
|
||||
|
||||
function renderAudit(audit) {
|
||||
if (!audit || !audit.length) return '<div style="color:var(--text-3);font-size:12px">Nema audit zapisa.</div>';
|
||||
return audit.map(a => `
|
||||
<div class="audit-row">
|
||||
<div class="ts">${(a.timestamp||'').replace('T',' ').substring(0,19)}</div>
|
||||
<div class="op">${escHtml(a.operacija)}</div>
|
||||
<div class="who">${escHtml(a.korisnik||'—')}</div>
|
||||
<div>${escHtml(a.promijenjeno_polje||'')}: <span style="color:var(--text-3)">${escHtml(a.stara_vrijednost||'∅')}</span> → <span style="color:var(--green)">${escHtml(a.nova_vrijednost||'∅')}</span></div>
|
||||
</div>`).join('');
|
||||
}
|
||||
|
||||
// ===== INVOICE DETAIL =====
|
||||
let _currentInvoice = null;
|
||||
|
||||
async function openInvoice(id) {
|
||||
const r = await fetch(`${ERP_API}/invoices/${id}`, {headers: AUTH_HDR()}).then(r=>r.json()).catch(()=>null);
|
||||
if (!r || !r.ok) { alert('Greška pri učitavanju računa #' + id); return; }
|
||||
_currentInvoice = r;
|
||||
const i = r.invoice;
|
||||
$('#invModalTitle').textContent = `Račun #${i.id} · ${i.invoice_no || '—'}`;
|
||||
|
||||
// Preview slike
|
||||
const pv = $('#inv_preview');
|
||||
if (r.uploads && r.uploads.length) {
|
||||
const up = r.uploads[0];
|
||||
const fileUrl = `${ERP_API}/invoices/${id}/file`;
|
||||
const isPdf = (up.mime || '').includes('pdf') || (up.file_name || '').toLowerCase().endsWith('.pdf');
|
||||
if (isPdf) {
|
||||
pv.innerHTML = `<embed src="${fileUrl}" type="application/pdf" style="width:100%;height:480px;border:1px solid var(--border);border-radius:6px"><div style="margin-top:6px;font-size:11px;color:var(--text-3)">${escHtml(up.file_name)} · ${escHtml(up.mime||'')}</div>`;
|
||||
} else {
|
||||
pv.innerHTML = `<a href="${fileUrl}" target="_blank"><img class="preview-img" src="${fileUrl}" alt="skena"></a><div style="margin-top:6px;font-size:11px;color:var(--text-3)">${escHtml(up.file_name)} · OCR ${escHtml(up.ocr_engine||up.ocr_status||'')}</div>`;
|
||||
}
|
||||
} else {
|
||||
pv.innerHTML = '<div style="padding:60px;background:var(--bg-3);border-radius:6px;color:var(--text-3);font-size:12px">Bez priložene datoteke</div>';
|
||||
}
|
||||
|
||||
// KV polja
|
||||
$('#inv_kv').innerHTML = `
|
||||
<div>Izdavatelj</div><div>${escHtml(i.vendor_name||'—')}</div>
|
||||
<div>OIB izdavatelja</div><div>${escHtml(i.vendor_oib||'—')}</div>
|
||||
<div>Broj računa</div><div>${escHtml(i.invoice_no||'—')}</div>
|
||||
<div>Datum</div><div>${fmtDate(i.invoice_date)}</div>
|
||||
<div>Klub</div><div>${escHtml(i.klub_naziv||'—')}</div>
|
||||
<div>Vrsta</div><div>${escHtml(i.invoice_kind||'—')}</div>
|
||||
<div>Iznos neto</div><div>${fmtEur(i.amount_net)}</div>
|
||||
<div>PDV (${i.vat_rate||'—'}%)</div><div>${fmtEur(i.amount_vat)}</div>
|
||||
<div>Brutto</div><div style="color:var(--accent);font-weight:700">${fmtEur(i.amount_gross)}</div>
|
||||
<div>Valuta</div><div>${escHtml(i.currency||'EUR')}</div>
|
||||
<div>Opis</div><div>${escHtml(i.description||'—')}</div>
|
||||
`;
|
||||
|
||||
// Status block
|
||||
const status = (i.payment_status||'unpaid').toLowerCase();
|
||||
let sb = `<div style="display:flex;align-items:center;gap:10px"><span style="font-size:11px;color:var(--text-3)">STATUS</span> ${sBadge(i.payment_status)}</div>`;
|
||||
if (status === 'paid') {
|
||||
const lastPay = (r.payments && r.payments.length) ? r.payments[0] : {};
|
||||
sb += `<div style="margin-top:10px;font-size:12px;line-height:1.7">
|
||||
<div><span style="color:var(--text-3)">IBAN primatelja:</span> <span style="font-family:'JetBrains Mono'">${escHtml(lastPay.iban_to || i.iban_to || '—')}</span></div>
|
||||
<div><span style="color:var(--text-3)">IBAN platitelja:</span> <span style="font-family:'JetBrains Mono'">${escHtml(lastPay.iban_from || i.iban_from || '—')}</span></div>
|
||||
<div><span style="color:var(--text-3)">Datum uplate:</span> ${fmtDate(i.paid_date) || fmtDate(lastPay.payment_date)}</div>
|
||||
<div><span style="color:var(--text-3)">Iznos uplate:</span> <strong style="color:var(--green)">${fmtEur(lastPay.amount || i.amount_gross)}</strong></div>
|
||||
<div><span style="color:var(--text-3)">Referenca:</span> <span style="font-family:'JetBrains Mono'">${escHtml(lastPay.reference||'—')}</span></div>
|
||||
<div><span style="color:var(--text-3)">Tx ID:</span> <span style="font-family:'JetBrains Mono'">${escHtml(lastPay.bank_transaction_id||'—')}</span></div>
|
||||
</div>`;
|
||||
} else if (status === 'cancelled' || status === 'otkazan') {
|
||||
sb += `<div style="margin-top:8px;color:var(--red);font-size:12px">Račun je otkazan.</div>`;
|
||||
} else {
|
||||
sb += `<div style="margin-top:8px;color:var(--yellow);font-size:12px">Neplaćen — čeka uplatu.</div>`;
|
||||
}
|
||||
$('#inv_status_block').innerHTML = sb;
|
||||
|
||||
// Actions po permission-ima
|
||||
const a = r.actions || {};
|
||||
const acts = [];
|
||||
if (a.pay && status !== 'paid') acts.push(`<button class="btn green" onclick="openPayModal(${id})">💰 Označi kao plaćen</button>`);
|
||||
if (a.edit && status !== 'paid') acts.push(`<button class="btn yellow" onclick="alert('Edit u UI: koristi M5 OCR formu — ovaj panel je read-only za prikaz')">✏ Korekcija polja</button>`);
|
||||
if (a.comment) acts.push(`<button class="btn sec" onclick="openCommentModal(${id})">💬 Komentar</button>`);
|
||||
if (r.uploads && r.uploads.length) acts.push(`<a href="${ERP_API}/invoices/${id}/file" target="_blank" class="btn sec" style="text-decoration:none">📥 Preuzmi sken</a>`);
|
||||
if (a.delete) acts.push(`<button class="btn red" onclick="if(confirm('Obrisati račun #${id}?')){alert('Brisanje: TODO endpoint')}">🗑 Obriši</button>`);
|
||||
if (!acts.length) acts.push('<span style="color:var(--text-3);font-size:12px">Bez dostupnih akcija (samo pregled).</span>');
|
||||
$('#inv_actions').innerHTML = acts.join('');
|
||||
|
||||
$('#inv_audit').innerHTML = renderAudit(r.audit);
|
||||
openModal('invModal');
|
||||
}
|
||||
|
||||
function openPayModal(id) {
|
||||
const inv = _currentInvoice && _currentInvoice.invoice;
|
||||
if (inv) {
|
||||
$('#pay_iban_to').value = inv.iban_to || '';
|
||||
$('#pay_amount').value = inv.amount_gross || '';
|
||||
}
|
||||
$('#pay_date').value = new Date().toISOString().substring(0,10);
|
||||
$('#payStatus').textContent = '';
|
||||
openModal('payModal');
|
||||
$('#payConfirm').onclick = async () => {
|
||||
const body = {
|
||||
iban_to: $('#pay_iban_to').value.trim(),
|
||||
iban_from: $('#pay_iban_from').value.trim(),
|
||||
paid_date: $('#pay_date').value,
|
||||
amount: parseFloat($('#pay_amount').value) || undefined,
|
||||
reference: $('#pay_ref').value.trim(),
|
||||
bank_transaction_id: $('#pay_tx').value.trim(),
|
||||
payment_method: 'transfer',
|
||||
};
|
||||
$('#payStatus').textContent = '⏳ Spremam…';
|
||||
const r = await fetch(`${ERP_API}/invoices/${id}/pay`, {method:'POST', headers: AUTH_HDR_JSON(), body: JSON.stringify(body)}).then(r=>r.json()).catch(()=>({ok:false,detail:'net'}));
|
||||
if (r.ok) {
|
||||
$('#payStatus').textContent = '✓ Plaćeno';
|
||||
$('#payStatus').style.color = 'var(--green)';
|
||||
setTimeout(() => { closeModal('payModal'); openInvoice(id); loadInvoices(); }, 700);
|
||||
} else {
|
||||
$('#payStatus').textContent = '❌ ' + (r.detail || 'Greška');
|
||||
$('#payStatus').style.color = 'var(--red)';
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
function openCommentModal(id) {
|
||||
$('#commentText').value = '';
|
||||
$('#commentStatus').textContent = '';
|
||||
openModal('commentModal');
|
||||
$('#commentSave').onclick = async () => {
|
||||
const txt = $('#commentText').value.trim();
|
||||
if (!txt) { $('#commentStatus').textContent = 'Komentar je prazan'; return; }
|
||||
$('#commentStatus').textContent = '⏳';
|
||||
const r = await fetch(`${ERP_API}/invoices/${id}/comment`, {method:'POST', headers: AUTH_HDR_JSON(), body: JSON.stringify({comment: txt})}).then(r=>r.json()).catch(()=>({ok:false,detail:'net'}));
|
||||
if (r.ok) {
|
||||
$('#commentStatus').textContent = '✓ Spremljeno';
|
||||
$('#commentStatus').style.color = 'var(--green)';
|
||||
setTimeout(() => { closeModal('commentModal'); openInvoice(id); }, 600);
|
||||
} else {
|
||||
$('#commentStatus').textContent = '❌ ' + (r.detail || 'Greška');
|
||||
$('#commentStatus').style.color = 'var(--red)';
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
// ===== PUTNI NALOG DETAIL =====
|
||||
let _currentPn = null;
|
||||
|
||||
async function openPutni(id) {
|
||||
const r = await fetch(`${ERP_API}/putni-nalog/${id}`, {headers: AUTH_HDR()}).then(r=>r.json()).catch(()=>null);
|
||||
if (!r || !r.ok) { alert('Greška pri učitavanju putnog naloga #' + id); return; }
|
||||
_currentPn = r;
|
||||
const p = r.putni_nalog;
|
||||
$('#pnModalTitle').textContent = `Putni nalog #${p.id} · ${p.klub_naziv||'—'}`;
|
||||
|
||||
const att = p.attachments || {};
|
||||
const dnv = att.dnevnice_calc || {};
|
||||
const putnici = (att.putnici || []).join(', ');
|
||||
const voditelj = att.voditelj || '—';
|
||||
const country = att.country || '—';
|
||||
const fromCity = att.from_city || '—', toCity = att.to_city || '—';
|
||||
|
||||
$('#pn_kv').innerHTML = `
|
||||
<div>Voditelj</div><div>${escHtml(voditelj)}</div>
|
||||
<div>Putnici</div><div>${escHtml(putnici||'—')}</div>
|
||||
<div>Svrha</div><div>${escHtml(p.purpose||'—')}</div>
|
||||
<div>Ruta</div><div>${escHtml(fromCity)} → ${escHtml(toCity)}</div>
|
||||
<div>Zemlja</div><div>${escHtml(country)}</div>
|
||||
<div>Polazak</div><div>${fmtDate(p.date_from)}</div>
|
||||
<div>Povratak</div><div>${fmtDate(p.date_to)}</div>
|
||||
<div>Vozilo</div><div>${escHtml(p.vehicle_type||'—')} ${escHtml(p.vehicle_plate||'')}</div>
|
||||
<div>Kilometara</div><div>${p.km_driven||0} km × €${p.km_rate||0.5}</div>
|
||||
`;
|
||||
|
||||
$('#pn_obracun').innerHTML = `
|
||||
<div>Pune dnevnice</div><div style="color:var(--accent)">${dnv.days_full||0} × €${dnv.rate_full||0}</div>
|
||||
<div>Pola dnevnica</div><div style="color:var(--yellow)">${dnv.days_half||0} × €${dnv.rate_half||0}</div>
|
||||
<div>Dnevnice ukupno</div><div style="color:var(--green)">${fmtEur(p.dnevnice_amount)}</div>
|
||||
<div>Kilometrina</div><div>${fmtEur(p.cost_transport)}</div>
|
||||
<div>Smještaj</div><div>${fmtEur(p.cost_lodging)}</div>
|
||||
<div>Hrana / ostalo</div><div>${fmtEur((p.cost_meals||0)+(p.cost_other||0))}</div>
|
||||
<div style="font-weight:700">UKUPNO</div><div style="color:var(--accent);font-weight:700;font-size:18px">${fmtEur(p.cost_total)}</div>
|
||||
`;
|
||||
|
||||
// Status block
|
||||
const status = (p.status||'draft').toLowerCase();
|
||||
let sb = `<div style="display:flex;align-items:center;gap:10px"><span style="font-size:11px;color:var(--text-3)">STATUS</span> ${sBadge(p.status)}</div>`;
|
||||
if (status === 'isplacen') {
|
||||
const lastPay = (r.payments && r.payments.length) ? r.payments[0] : {};
|
||||
sb += `<div style="margin-top:10px;font-size:12px;line-height:1.7">
|
||||
<div><span style="color:var(--text-3)">IBAN primatelja:</span> <span style="font-family:'JetBrains Mono'">${escHtml(lastPay.iban_to||'—')}</span></div>
|
||||
<div><span style="color:var(--text-3)">Datum isplate:</span> ${fmtDate(p.paid_at) || fmtDate(lastPay.payment_date)}</div>
|
||||
<div><span style="color:var(--text-3)">Iznos isplate:</span> <strong style="color:var(--green)">${fmtEur(lastPay.amount||p.cost_total)}</strong></div>
|
||||
<div><span style="color:var(--text-3)">Referenca:</span> <span style="font-family:'JetBrains Mono'">${escHtml(lastPay.reference||'—')}</span></div>
|
||||
<div><span style="color:var(--text-3)">Tx ID:</span> <span style="font-family:'JetBrains Mono'">${escHtml(lastPay.bank_transaction_id||'—')}</span></div>
|
||||
</div>`;
|
||||
} else if (status === 'odbijen') {
|
||||
sb += `<div style="margin-top:8px;color:var(--red);font-size:12px">${escHtml(p.notes||'Odbijen').slice(-200)}</div>`;
|
||||
} else {
|
||||
sb += `<div style="margin-top:8px;color:var(--yellow);font-size:12px">${status === 'odobren' || status === 'zatvoren' ? 'Čeka isplatu.' : status === 'poslan' ? 'Čeka odobrenje.' : 'Draft — još nije poslan na odobrenje.'}</div>`;
|
||||
}
|
||||
$('#pn_status_block').innerHTML = sb;
|
||||
|
||||
// Vezani računi
|
||||
const invs = r.invoices || [];
|
||||
$('#pn_invoices_table tbody').innerHTML = invs.length ? invs.map(i => `
|
||||
<tr class="clickable" onclick="closeModal('pnModal'); setTimeout(()=>openInvoice(${i.id}), 100)">
|
||||
<td>${i.id}</td><td>${escHtml(i.invoice_kind||'—')}</td><td>${escHtml(i.vendor_name||'—')}</td>
|
||||
<td style="font-family:'JetBrains Mono'">${escHtml(i.vendor_oib||'—')}</td>
|
||||
<td>${fmtDate(i.invoice_date)}</td>
|
||||
<td class="num">${fmtEur(i.amount_gross)}</td>
|
||||
<td>${sBadge(i.payment_status)}</td>
|
||||
</tr>`).join('') : '<tr><td colspan="7" style="color:var(--text-3);text-align:center;padding:14px">Nema vezanih računa</td></tr>';
|
||||
|
||||
// Actions
|
||||
const a = r.actions || {};
|
||||
const acts = [];
|
||||
if (a.submit) acts.push(`<button class="btn yellow" onclick="submitPn(${id})">📤 Pošalji na odobrenje</button>`);
|
||||
if (a.approve) acts.push(`<button class="btn green" onclick="approvePn(${id})">✓ Odobri</button>`);
|
||||
if (a.reject) acts.push(`<button class="btn red" onclick="openRejectModal(${id})">✗ Odbij</button>`);
|
||||
if (a.pay) acts.push(`<button class="btn green" onclick="openPayPnModal(${id})">💰 Isplati</button>`);
|
||||
if (a.edit) acts.push(`<button class="btn sec" onclick="alert('Edit drafta — koristi M6 formu \\'Novi putni nalog\\' s prefilanim poljima (TODO UI)')">✏ Edit</button>`);
|
||||
if (!acts.length) acts.push('<span style="color:var(--text-3);font-size:12px">Bez dostupnih akcija (samo pregled).</span>');
|
||||
$('#pn_actions').innerHTML = acts.join('');
|
||||
|
||||
$('#pn_audit').innerHTML = renderAudit(r.audit);
|
||||
openModal('pnModal');
|
||||
}
|
||||
|
||||
async function submitPn(id) {
|
||||
if (!confirm('Poslati putni nalog #' + id + ' na odobrenje?')) return;
|
||||
const r = await fetch(`${ERP_API}/putni-nalog/${id}/posalji`, {method:'POST', headers: AUTH_HDR_JSON()}).then(r=>r.json()).catch(()=>null);
|
||||
if (r && r.ok) { openPutni(id); loadPutni(); } else alert('Greška: ' + (r && r.detail || ''));
|
||||
}
|
||||
async function approvePn(id) {
|
||||
if (!confirm('Odobriti putni nalog #' + id + '?')) return;
|
||||
const r = await fetch(`${ERP_API}/putni-nalog/${id}/odobriti`, {method:'POST', headers: AUTH_HDR_JSON(), body: '{}'}).then(r=>r.json()).catch(()=>null);
|
||||
if (r && r.ok) { openPutni(id); loadPutni(); } else alert('Greška: ' + (r && r.detail || ''));
|
||||
}
|
||||
function openRejectModal(id) {
|
||||
$('#rejectText').value = '';
|
||||
$('#rejectStatus').textContent = '';
|
||||
openModal('rejectModal');
|
||||
$('#rejectConfirm').onclick = async () => {
|
||||
const reason = $('#rejectText').value.trim();
|
||||
if (!reason) { $('#rejectStatus').textContent = 'Razlog je obavezan'; return; }
|
||||
const r = await fetch(`${ERP_API}/putni-nalog/${id}/odbij`, {method:'POST', headers: AUTH_HDR_JSON(), body: JSON.stringify({razlog: reason})}).then(r=>r.json()).catch(()=>null);
|
||||
if (r && r.ok) { closeModal('rejectModal'); openPutni(id); loadPutni(); }
|
||||
else $('#rejectStatus').textContent = '❌ ' + (r && r.detail || 'Greška');
|
||||
};
|
||||
}
|
||||
function openPayPnModal(id) {
|
||||
const pn = _currentPn && _currentPn.putni_nalog;
|
||||
if (pn) $('#ppn_amount').value = pn.cost_total || '';
|
||||
$('#ppn_date').value = new Date().toISOString().substring(0,10);
|
||||
$('#ppnStatus').textContent = '';
|
||||
openModal('payPnModal');
|
||||
$('#ppnConfirm').onclick = async () => {
|
||||
const body = {
|
||||
iban_to: $('#ppn_iban_to').value.trim(),
|
||||
iban_from: $('#ppn_iban_from').value.trim(),
|
||||
paid_date: $('#ppn_date').value,
|
||||
amount: parseFloat($('#ppn_amount').value) || undefined,
|
||||
reference: $('#ppn_ref').value.trim(),
|
||||
bank_transaction_id: $('#ppn_tx').value.trim(),
|
||||
};
|
||||
$('#ppnStatus').textContent = '⏳';
|
||||
const r = await fetch(`${ERP_API}/putni-nalog/${id}/isplati`, {method:'POST', headers: AUTH_HDR_JSON(), body: JSON.stringify(body)}).then(r=>r.json()).catch(()=>null);
|
||||
if (r && r.ok) {
|
||||
$('#ppnStatus').textContent = '✓ Isplaćeno';
|
||||
$('#ppnStatus').style.color = 'var(--green)';
|
||||
setTimeout(() => { closeModal('payPnModal'); openPutni(id); loadPutni(); }, 700);
|
||||
} else {
|
||||
$('#ppnStatus').textContent = '❌ ' + (r && r.detail || 'Greška');
|
||||
$('#ppnStatus').style.color = 'var(--red)';
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
function activate(name) {
|
||||
$$('.nav-item').forEach(n => n.classList.toggle('active', n.dataset.tab === name));
|
||||
$$('.tab').forEach(t => t.classList.toggle('active', t.id === 'tab-' + name));
|
||||
|
||||
Reference in New Issue
Block a user