feat: DO-gated manual batch mode (auto default, office-only switches)
ci / smoke (push) Canceled after 0s
ci / smoke (push) Canceled after 0s
This commit is contained in:
andrew committed
1 parent
735e0c7594
commit
0efcfa45b8
20 files changed
+3128
-209
No files matched your search
+469
-66
@@ -224,26 +224,136 @@
|
||||
color: var(--text-primary);
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
/* DO panel */
|
||||
.do-panel {
|
||||
display: none;
|
||||
text-align: left;
|
||||
margin-top: 20px;
|
||||
padding-top: 16px;
|
||||
border-top: 1px solid var(--border-color);
|
||||
}
|
||||
.do-panel.visible { display: block; }
|
||||
.do-panel h4 {
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
margin: 0 0 8px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 8px;
|
||||
}
|
||||
.do-strip {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
overflow-x: auto;
|
||||
padding-bottom: 6px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.do-thumb {
|
||||
flex: 0 0 88px;
|
||||
width: 88px;
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: var(--radius-md);
|
||||
overflow: hidden;
|
||||
background: var(--bg-base);
|
||||
cursor: pointer;
|
||||
}
|
||||
.do-thumb img { width: 100%; height: 64px; object-fit: cover; display: block; }
|
||||
.do-thumb .cap {
|
||||
font-size: 10px;
|
||||
padding: 2px 4px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.do-card {
|
||||
background: var(--bg-base);
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: var(--radius-md);
|
||||
padding: 10px;
|
||||
margin-bottom: 8px;
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 8px;
|
||||
font-size: 12px;
|
||||
}
|
||||
.do-card label { display: block; font-size: 11px; color: var(--text-secondary); }
|
||||
.do-card input {
|
||||
width: 100%;
|
||||
padding: 6px 8px;
|
||||
border-radius: var(--radius-md);
|
||||
border: 1px solid var(--border-color);
|
||||
background: var(--bg-card);
|
||||
color: var(--text-primary);
|
||||
font-size: 13px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.do-card .full { grid-column: 1 / -1; }
|
||||
.do-card .row-actions { display: flex; gap: 8px; grid-column: 1 / -1; }
|
||||
.do-chip {
|
||||
display: inline-block;
|
||||
background: rgba(0,113,227,0.12);
|
||||
color: var(--accent-blue);
|
||||
border-radius: 99px;
|
||||
padding: 2px 8px;
|
||||
font-size: 11px;
|
||||
font-weight: 600;
|
||||
margin: 2px 4px 2px 0;
|
||||
}
|
||||
.do-warn { color: var(--accent-orange); font-size: 12px; margin: 6px 0; }
|
||||
.ocr-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
font-size: 12px;
|
||||
color: var(--text-secondary);
|
||||
margin-top: 8px;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.ocr-row select {
|
||||
padding: 6px 10px;
|
||||
border-radius: var(--radius-md);
|
||||
border: 1px solid var(--border-color);
|
||||
background: var(--bg-base);
|
||||
color: var(--text-primary);
|
||||
font-size: 13px;
|
||||
}
|
||||
.mode-badge {
|
||||
display: inline-block;
|
||||
padding: 4px 12px;
|
||||
border-radius: 99px;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
margin-top: 8px;
|
||||
background: var(--bg-base);
|
||||
border: 1px solid var(--border-color);
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
.mode-badge.do_manual { background: rgba(0,113,227,0.12); color: var(--accent-blue); border-color: var(--accent-blue); }
|
||||
.mode-badge.auto { background: rgba(255,159,10,0.12); color: var(--accent-orange); }
|
||||
.mode-badge.manual { background: rgba(52,199,89,0.12); color: var(--accent-green); }
|
||||
</style>
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<!-- Non-blocking manual-mode prompt: status/counts stay visible below -->
|
||||
<!-- Non-blocking mode info (office owns mode switch) -->
|
||||
<div id="modeBanner" class="mode-banner">
|
||||
<span>🟡 Mode OTOMATIS aktif. Alihkan ke MANUAL untuk kontrol tombol batch?</span>
|
||||
<button class="btn btn-yes" onclick="switchToManual()">Ya, Manual</button>
|
||||
<button class="btn btn-no" onclick="dismissModeBanner()">Tidak, Tetap Otomatis</button>
|
||||
<span id="modeBannerText">Mode diatur dari monitoring/kantor</span>
|
||||
<button class="btn btn-no" onclick="dismissModeBanner()">Tutup</button>
|
||||
</div>
|
||||
<div class="operator-container">
|
||||
<div class="operator-card">
|
||||
<h1 class="operator-title"><i class="fa-solid fa-boxes-packing"></i> Kontrol Pemuatan Karung</h1>
|
||||
<p class="operator-subtitle">Tekan tombol saat proses muat truk dimulai dan selesai</p>
|
||||
<p class="operator-subtitle" id="opSubtitle">Tekan tombol saat proses muat truk dimulai dan selesai</p>
|
||||
|
||||
<!-- Status Indicator -->
|
||||
<div id="statusBadge" class="status-badge-box status-idle">
|
||||
<i id="statusIcon" class="fa-solid fa-circle-pause"></i>
|
||||
<span id="statusText">Status: Standby (Tidak Memuat)</span>
|
||||
</div>
|
||||
<div><span id="modeBadge" class="mode-badge">Mode: --</span></div>
|
||||
|
||||
<!-- Info Detail -->
|
||||
<div class="batch-info-box">
|
||||
@@ -263,6 +373,18 @@
|
||||
<div class="info-label">Box Masuk</div>
|
||||
<div class="info-val" id="opBoxCount">0</div>
|
||||
</div>
|
||||
<div class="info-item" id="opNetSackItem" style="display:none">
|
||||
<div class="info-label">Net Karung / Target</div>
|
||||
<div class="info-val" id="opNetSack">--</div>
|
||||
</div>
|
||||
<div class="info-item" id="opNetBoxItem" style="display:none">
|
||||
<div class="info-label">Net Box / Target</div>
|
||||
<div class="info-val" id="opNetBox">--</div>
|
||||
</div>
|
||||
<div class="info-item" id="opPlateItem" style="display:none; grid-column: 1 / -1;">
|
||||
<div class="info-label">Plat / No. DO</div>
|
||||
<div class="info-val" id="opPlateDos" style="font-size:13px;">--</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Action Button -->
|
||||
@@ -275,15 +397,44 @@
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Model mode -->
|
||||
<!-- DO panel (only do_manual) -->
|
||||
<div id="doPanel" class="do-panel">
|
||||
<h4>
|
||||
<span><i class="fa-solid fa-file-lines"></i> Foto DO (Smartphone)</span>
|
||||
<span id="doEngineBadge" style="font-size:11px;font-weight:600;color:var(--text-secondary);"></span>
|
||||
</h4>
|
||||
<input type="file" id="doPhotoInput" accept="image/*" capture="environment" multiple
|
||||
style="display:none" onchange="uploadDoPhotos(this.files)">
|
||||
<button class="btn btn-primary btn-sm" style="width:100%;margin-bottom:8px;"
|
||||
onclick="document.getElementById('doPhotoInput').click()">
|
||||
<i class="fa-solid fa-camera"></i> Ambil / Pilih Foto DO
|
||||
</button>
|
||||
<div id="doStrip" class="do-strip"></div>
|
||||
<div id="doCards"></div>
|
||||
<div id="doGroupPreview"></div>
|
||||
<div id="doWarn" class="do-warn" style="display:none;"></div>
|
||||
<div class="ocr-row">
|
||||
<span>OCR:</span>
|
||||
<select id="ocrEngineSelect" onchange="setOcrEngine(this.value)">
|
||||
<option value="tesseract">Tesseract</option>
|
||||
<option value="paddle">PaddleOCR</option>
|
||||
<option value="none">Off (manual)</option>
|
||||
</select>
|
||||
<span id="ocrEngineHint"></span>
|
||||
</div>
|
||||
<div id="doRequirePlateRow" class="ocr-row" style="display:none;">
|
||||
<label><input type="checkbox" id="requirePlateChk" onchange="setRequirePlate(this.checked)"> Wajib plat nomor</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Model mode (read-only badge) -->
|
||||
<div class="model-row">
|
||||
<span>Model:</span>
|
||||
<strong id="opModelMode">--</strong>
|
||||
<select id="modelModeSelect" onchange="setModelMode(this.value)">
|
||||
<option value="">Ganti mode…</option>
|
||||
</select>
|
||||
</div>
|
||||
<p class="operator-subtitle" style="margin-top:6px;font-size:12px">Ganti mode model berlaku setelah service direstart.</p>
|
||||
<p class="operator-subtitle" style="margin-top:6px;font-size:12px">
|
||||
Mode batch & model diatur dari monitoring/kantor.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -291,7 +442,8 @@
|
||||
<div id="modalStart" class="modal-overlay">
|
||||
<div class="modal-box">
|
||||
<h3 class="modal-title"><i class="fa-solid fa-play" style="color: var(--accent-green);"></i> Mulai Batch Baru?</h3>
|
||||
<p class="modal-desc">Pastikan truk sudah siap di posisi pemuatan karung.</p>
|
||||
<p class="modal-desc" id="startModalDesc">Pastikan truk sudah siap di posisi pemuatan karung.</p>
|
||||
<div id="startGateList" class="modal-desc" style="display:none;color:var(--accent-red);"></div>
|
||||
<div class="modal-actions">
|
||||
<button class="btn btn-secondary" onclick="closeModal('modalStart')">Batal</button>
|
||||
<button class="btn btn-primary" style="background-color: var(--accent-green);" onclick="executeStartBatch()">Ya, Mulai</button>
|
||||
@@ -303,10 +455,15 @@
|
||||
<div id="modalStop" class="modal-overlay">
|
||||
<div class="modal-box">
|
||||
<h3 class="modal-title"><i class="fa-solid fa-square" style="color: var(--accent-red);"></i> Selesai Batch?</h3>
|
||||
<p class="modal-desc">Pemuatan untuk batch ini akan ditutup dan data akan disimpan.</p>
|
||||
<p class="modal-desc" id="stopModalDesc">Pemuatan untuk batch ini akan ditutup dan data akan disimpan.</p>
|
||||
<div id="zoneBusyWarn" class="modal-desc" style="display:none;color:var(--accent-orange);">
|
||||
Masih ada aktivitas di zona — akhir paksa?
|
||||
</div>
|
||||
<div class="modal-actions">
|
||||
<button class="btn btn-secondary" onclick="closeModal('modalStop')">Batal</button>
|
||||
<button class="btn btn-primary" style="background-color: var(--accent-red);" onclick="executeStopBatch()">Ya, Selesai</button>
|
||||
<button class="btn btn-primary" style="background-color: var(--accent-red);" onclick="executeStopBatch(false)">Ya, Selesai</button>
|
||||
<button id="btnForceStop" class="btn btn-primary" style="background-color: var(--accent-red); display:none;"
|
||||
onclick="executeStopBatch(true)">Akhir Paksa</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -315,18 +472,27 @@
|
||||
{% block extra_js %}
|
||||
<script>
|
||||
let isBatchActive = false;
|
||||
let currentMode = 'auto';
|
||||
let stagedDos = [];
|
||||
let settings = { require_plate: false, require_do: true, ocr_engine: 'tesseract', editable: false };
|
||||
|
||||
function closeModal(id) {
|
||||
document.getElementById(id).style.display = 'none';
|
||||
}
|
||||
|
||||
// --- Non-blocking manual-mode prompt (banner, status stays visible) ---
|
||||
async function loadModeBanner() {
|
||||
try {
|
||||
const res = await fetch('/api/batch/mode');
|
||||
const data = await res.json();
|
||||
if (data.mode === 'auto' && !sessionStorage.getItem('mode_banner_dismissed')) {
|
||||
document.getElementById('modeBanner').style.display = 'flex';
|
||||
updateModeUI(data.mode || 'auto');
|
||||
if (data.mode === 'auto') {
|
||||
document.getElementById('modeBannerText').textContent =
|
||||
'Mode OTOMATIS aktif. Mode diatur dari monitoring/kantor.';
|
||||
if (!sessionStorage.getItem('mode_banner_dismissed')) {
|
||||
document.getElementById('modeBanner').style.display = 'flex';
|
||||
}
|
||||
} else {
|
||||
document.getElementById('modeBanner').style.display = 'none';
|
||||
}
|
||||
} catch (e) {
|
||||
console.error('Mode load error:', e);
|
||||
@@ -338,73 +504,277 @@
|
||||
document.getElementById('modeBanner').style.display = 'none';
|
||||
}
|
||||
|
||||
async function switchToManual() {
|
||||
try {
|
||||
const res = await fetch('/api/batch/mode', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ mode: 'manual' })
|
||||
});
|
||||
const data = await res.json();
|
||||
if (data.success) {
|
||||
dismissModeBanner();
|
||||
} else {
|
||||
alert('Gagal alih mode: ' + (data.error || 'Terjadi kesalahan'));
|
||||
}
|
||||
} catch (e) {
|
||||
alert('Gagal terhubung ke server');
|
||||
function updateModeUI(mode) {
|
||||
currentMode = mode;
|
||||
const badge = document.getElementById('modeBadge');
|
||||
const panel = document.getElementById('doPanel');
|
||||
const sub = document.getElementById('opSubtitle');
|
||||
if (badge) {
|
||||
badge.textContent = 'Mode: ' + mode;
|
||||
badge.className = 'mode-badge ' + mode;
|
||||
}
|
||||
if (panel) panel.classList.toggle('visible', mode === 'do_manual');
|
||||
if (mode === 'do_manual') {
|
||||
if (sub) sub.textContent = 'Foto DO → review → mulai batch';
|
||||
loadStagedDos();
|
||||
loadDoSettings();
|
||||
} else if (mode === 'manual') {
|
||||
if (sub) sub.textContent = 'Tekan tombol saat proses muat truk dimulai dan selesai';
|
||||
} else {
|
||||
if (sub) sub.textContent = 'Mode otomatis — batch dikontrol AI truk';
|
||||
}
|
||||
}
|
||||
|
||||
// --- Model mode selector ---
|
||||
async function loadDoSettings() {
|
||||
try {
|
||||
const res = await fetch('/api/do/settings');
|
||||
const data = await res.json();
|
||||
if (!data.success) return;
|
||||
settings = data;
|
||||
const sel = document.getElementById('ocrEngineSelect');
|
||||
if (sel && data.ocr_engine) sel.value = data.ocr_engine;
|
||||
const hint = document.getElementById('ocrEngineHint');
|
||||
if (hint) hint.textContent = 'engine: ' + (data.ocr_engine || 'tesseract');
|
||||
const badge = document.getElementById('doEngineBadge');
|
||||
if (badge) badge.textContent = (data.ocr_engine || 'tesseract');
|
||||
const chk = document.getElementById('requirePlateChk');
|
||||
const row = document.getElementById('doRequirePlateRow');
|
||||
if (chk) chk.checked = !!data.require_plate;
|
||||
if (row) row.style.display = data.editable ? 'flex' : 'none';
|
||||
} catch (e) { console.error(e); }
|
||||
}
|
||||
|
||||
async function setOcrEngine(eng) {
|
||||
try {
|
||||
const res = await fetch('/api/do/settings', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ ocr_engine: eng })
|
||||
});
|
||||
const data = await res.json();
|
||||
if (!data.success) {
|
||||
alert('Gagal set OCR: ' + (data.error || res.status));
|
||||
loadDoSettings();
|
||||
return;
|
||||
}
|
||||
loadDoSettings();
|
||||
} catch (e) {
|
||||
alert('Gagal terhubung ke server');
|
||||
loadDoSettings();
|
||||
}
|
||||
}
|
||||
|
||||
async function setRequirePlate(val) {
|
||||
try {
|
||||
const res = await fetch('/api/do/settings', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ require_plate: val })
|
||||
});
|
||||
const data = await res.json();
|
||||
if (!data.success) {
|
||||
alert(data.error || 'Gagal (403 = office only)');
|
||||
loadDoSettings();
|
||||
} else {
|
||||
loadDoSettings();
|
||||
loadStagedDos();
|
||||
}
|
||||
} catch (e) { alert('Gagal terhubung ke server'); loadDoSettings(); }
|
||||
}
|
||||
|
||||
async function loadModelModes() {
|
||||
try {
|
||||
const res = await fetch('/api/model-modes');
|
||||
const data = await res.json();
|
||||
if (!data.success) return;
|
||||
const sel = document.getElementById('modelModeSelect');
|
||||
data.modes.forEach(m => {
|
||||
const opt = document.createElement('option');
|
||||
opt.value = m.id;
|
||||
opt.textContent = m.id + ' — ' + m.description;
|
||||
sel.appendChild(opt);
|
||||
});
|
||||
const el = document.getElementById('opModelMode');
|
||||
if (el) el.textContent = data.active || '--';
|
||||
} catch (e) {
|
||||
console.error('Model modes load error:', e);
|
||||
}
|
||||
}
|
||||
|
||||
async function setModelMode(mode) {
|
||||
if (!mode) return;
|
||||
if (!confirm('Ganti mode model ke ' + mode + '? Berlaku setelah service karung-counter direstart.')) {
|
||||
document.getElementById('modelModeSelect').value = '';
|
||||
return;
|
||||
}
|
||||
async function uploadDoPhotos(fileList) {
|
||||
if (!fileList || !fileList.length) return;
|
||||
const fd = new FormData();
|
||||
for (const f of fileList) fd.append('photos', f);
|
||||
try {
|
||||
const res = await fetch('/api/batch/mode', {
|
||||
method: 'POST',
|
||||
const res = await fetch('/api/do/upload', { method: 'POST', body: fd });
|
||||
const data = await res.json();
|
||||
if (!data.success) {
|
||||
alert('Upload gagal: ' + (data.error || res.status));
|
||||
return;
|
||||
}
|
||||
await loadStagedDos();
|
||||
await loadDoSettings();
|
||||
} catch (e) {
|
||||
alert('Upload gagal: tidak terhubung ke server');
|
||||
} finally {
|
||||
document.getElementById('doPhotoInput').value = '';
|
||||
}
|
||||
}
|
||||
|
||||
async function loadStagedDos() {
|
||||
if (currentMode !== 'do_manual') return;
|
||||
try {
|
||||
const res = await fetch('/api/do/staged');
|
||||
const data = await res.json();
|
||||
if (!data.success) return;
|
||||
stagedDos = data.items || [];
|
||||
renderDoPanel();
|
||||
} catch (e) { console.error(e); }
|
||||
}
|
||||
|
||||
function renderDoPanel() {
|
||||
const strip = document.getElementById('doStrip');
|
||||
const cards = document.getElementById('doCards');
|
||||
const group = document.getElementById('doGroupPreview');
|
||||
const warn = document.getElementById('doWarn');
|
||||
if (!strip) return;
|
||||
strip.innerHTML = '';
|
||||
cards.innerHTML = '';
|
||||
stagedDos.forEach(d => {
|
||||
const th = document.createElement('div');
|
||||
th.className = 'do-thumb';
|
||||
th.innerHTML = `<img src="${d.photo_url}" alt=""><div class="cap">${d.no_do || 'DO?'}</div>`;
|
||||
strip.appendChild(th);
|
||||
|
||||
const card = document.createElement('div');
|
||||
card.className = 'do-card';
|
||||
card.innerHTML = `
|
||||
<div class="full"><label>No. DO</label>
|
||||
<input data-id="${d.id}" data-k="no_do" value="${escapeHtml(d.no_do || '')}"></div>
|
||||
<div><label>Plat</label>
|
||||
<input data-id="${d.id}" data-k="plate" value="${escapeHtml(d.plate || '')}"></div>
|
||||
<div><label>Ekspektasi karung</label>
|
||||
<input data-id="${d.id}" data-k="expected_sack" type="number" min="0" value="${d.expected_sack || 0}"></div>
|
||||
<div><label>Ekspektasi box</label>
|
||||
<input data-id="${d.id}" data-k="expected_box" type="number" min="0" value="${d.expected_box || 0}"></div>
|
||||
<div class="row-actions">
|
||||
<button class="btn btn-primary btn-sm" data-act="save" data-id="${d.id}">Simpan</button>
|
||||
<button class="btn btn-secondary btn-sm" data-act="del" data-id="${d.id}">Hapus</button>
|
||||
<span style="font-size:11px;color:${d.ocr_ok ? 'var(--accent-green)' : 'var(--accent-orange)'};">
|
||||
${d.ocr_ok ? 'OCR ok' : ('OCR: ' + (d.ocr_error || 'manual'))}
|
||||
</span>
|
||||
</div>`;
|
||||
cards.appendChild(card);
|
||||
});
|
||||
cards.querySelectorAll('button[data-act="save"]').forEach(btn => {
|
||||
btn.onclick = () => saveDo(parseInt(btn.dataset.id, 10));
|
||||
});
|
||||
cards.querySelectorAll('button[data-act="del"]').forEach(btn => {
|
||||
btn.onclick = () => deleteDo(parseInt(btn.dataset.id, 10));
|
||||
});
|
||||
|
||||
// group preview by plate
|
||||
const byPlate = {};
|
||||
stagedDos.forEach(d => {
|
||||
const p = (d.plate || '').trim().toUpperCase() || 'tanpa plat';
|
||||
if (!byPlate[p]) byPlate[p] = { n: 0, sack: 0, box: 0, nos: [] };
|
||||
byPlate[p].n++;
|
||||
byPlate[p].sack += d.expected_sack || 0;
|
||||
byPlate[p].box += d.expected_box || 0;
|
||||
if (d.no_do) byPlate[p].nos.push(d.no_do);
|
||||
});
|
||||
group.innerHTML = Object.entries(byPlate).map(([p, g]) =>
|
||||
`<span class="do-chip">${escapeHtml(p)} · ${g.n} DO · ${g.sack} karung · ${g.box} box</span>`
|
||||
).join('');
|
||||
|
||||
const plates = Object.keys(byPlate).filter(p => p !== 'tanpa plat');
|
||||
let w = '';
|
||||
if (plates.length > 1) w = 'Plat nomor berbeda — start diblokir.';
|
||||
if (settings.require_do && stagedDos.length === 0 && currentMode === 'do_manual')
|
||||
w = 'Butuh minimal satu foto DO sebelum mulai batch.';
|
||||
if (warn) {
|
||||
warn.textContent = w;
|
||||
warn.style.display = w ? 'block' : 'none';
|
||||
}
|
||||
}
|
||||
|
||||
function escapeHtml(s) {
|
||||
return String(s).replace(/[&<>"']/g, c => ({
|
||||
'&': '&', '<': '<', '>': '>', '"': '"', "'": '''
|
||||
})[c]);
|
||||
}
|
||||
|
||||
async function saveDo(id) {
|
||||
const fields = {};
|
||||
document.querySelectorAll(`.do-card input[data-id="${id}"]`).forEach(inp => {
|
||||
fields[inp.dataset.k] = inp.dataset.k.startsWith('expected')
|
||||
? parseInt(inp.value || '0', 10) : inp.value;
|
||||
});
|
||||
try {
|
||||
const res = await fetch('/api/do/' + id, {
|
||||
method: 'PUT',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ model_mode: mode })
|
||||
body: JSON.stringify(fields)
|
||||
});
|
||||
const data = await res.json();
|
||||
if (data.success) {
|
||||
document.getElementById('opModelMode').textContent = data.model_mode;
|
||||
alert('Mode model tersimpan: ' + data.model_mode + '. Restart service untuk berlaku.');
|
||||
} else {
|
||||
alert('Gagal ganti mode: ' + (data.error || 'Terjadi kesalahan'));
|
||||
}
|
||||
} catch (e) {
|
||||
alert('Gagal terhubung ke server');
|
||||
} finally {
|
||||
document.getElementById('modelModeSelect').value = '';
|
||||
}
|
||||
if (!data.success) alert(data.error || 'Gagal simpan');
|
||||
await loadStagedDos();
|
||||
} catch (e) { alert('Gagal simpan'); }
|
||||
}
|
||||
|
||||
async function deleteDo(id) {
|
||||
if (!confirm('Hapus DO ini?')) return;
|
||||
try {
|
||||
const res = await fetch('/api/do/' + id, { method: 'DELETE' });
|
||||
const data = await res.json();
|
||||
if (!data.success) alert(data.error || 'Gagal hapus');
|
||||
await loadStagedDos();
|
||||
} catch (e) { alert('Gagal hapus'); }
|
||||
}
|
||||
|
||||
async function fetchStagedForStart() {
|
||||
const res = await fetch('/api/do/staged');
|
||||
const data = await res.json();
|
||||
return (data && data.items) || [];
|
||||
}
|
||||
|
||||
function confirmStartBatch() {
|
||||
const gate = document.getElementById('startGateList');
|
||||
const desc = document.getElementById('startModalDesc');
|
||||
if (currentMode === 'do_manual') {
|
||||
fetchStagedForStart().then(items => {
|
||||
stagedDos = items;
|
||||
const problems = [];
|
||||
if (settings.require_do && items.length === 0) problems.push('Butuh foto DO.');
|
||||
if (items.some(d => !(d.no_do || '').trim())) problems.push('Ada DO tanpa No. DO.');
|
||||
if (settings.require_plate && items.some(d => !(d.plate || '').trim()))
|
||||
problems.push('Ada DO tanpa plat.');
|
||||
const plates = new Set(items.map(d => (d.plate || '').trim().toUpperCase()).filter(Boolean));
|
||||
if (plates.size > 1) problems.push('Plat DO berbeda.');
|
||||
if (problems.length) {
|
||||
gate.style.display = 'block';
|
||||
gate.innerHTML = problems.map(p => '• ' + escapeHtml(p)).join('<br>');
|
||||
document.getElementById('modalStart').style.display = 'flex';
|
||||
return;
|
||||
}
|
||||
gate.style.display = 'none';
|
||||
desc.textContent = items.length + ' DO akan disiapkan untuk batch ini.';
|
||||
document.getElementById('modalStart').style.display = 'flex';
|
||||
renderDoPanel();
|
||||
}).catch(() => {
|
||||
document.getElementById('modalStart').style.display = 'flex';
|
||||
});
|
||||
return;
|
||||
}
|
||||
gate.style.display = 'none';
|
||||
desc.textContent = 'Pastikan truk sudah siap di posisi pemuatan karung.';
|
||||
document.getElementById('modalStart').style.display = 'flex';
|
||||
}
|
||||
|
||||
function confirmStopBatch() {
|
||||
async function confirmStopBatch() {
|
||||
document.getElementById('zoneBusyWarn').style.display = 'none';
|
||||
document.getElementById('btnForceStop').style.display = 'none';
|
||||
try {
|
||||
const res = await fetch('/api/batch/stop-preview');
|
||||
const data = await res.json();
|
||||
if (data.success && data.zone_busy) {
|
||||
document.getElementById('zoneBusyWarn').style.display = 'block';
|
||||
document.getElementById('btnForceStop').style.display = 'flex';
|
||||
}
|
||||
} catch (e) { /* soft */ }
|
||||
document.getElementById('modalStop').style.display = 'flex';
|
||||
}
|
||||
|
||||
@@ -413,12 +783,21 @@
|
||||
const btn = document.getElementById('btnStartBatch');
|
||||
btn.classList.add('btn-disabled');
|
||||
btn.innerHTML = '<i class="fa-solid fa-spinner fa-spin"></i> Memulai...';
|
||||
|
||||
try {
|
||||
const res = await fetch('/api/batch/start', { method: 'POST' });
|
||||
let body = null;
|
||||
if (currentMode === 'do_manual') {
|
||||
const items = await fetchStagedForStart();
|
||||
body = JSON.stringify({ do_ids: items.map(d => d.id) });
|
||||
}
|
||||
const res = await fetch('/api/batch/start', {
|
||||
method: 'POST',
|
||||
headers: body ? { 'Content-Type': 'application/json' } : {},
|
||||
body: body
|
||||
});
|
||||
const data = await res.json();
|
||||
if (data.success) {
|
||||
await pollStatus();
|
||||
await loadStagedDos();
|
||||
} else {
|
||||
alert('Gagal memulai batch: ' + (data.error || 'Terjadi kesalahan'));
|
||||
}
|
||||
@@ -430,17 +809,21 @@
|
||||
}
|
||||
}
|
||||
|
||||
async function executeStopBatch() {
|
||||
async function executeStopBatch(force) {
|
||||
closeModal('modalStop');
|
||||
const btn = document.getElementById('btnStopBatch');
|
||||
btn.classList.add('btn-disabled');
|
||||
btn.innerHTML = '<i class="fa-solid fa-spinner fa-spin"></i> Mengakhiri...';
|
||||
|
||||
try {
|
||||
const res = await fetch('/api/batch/stop', { method: 'POST' });
|
||||
const res = await fetch('/api/batch/stop', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ force: !!force })
|
||||
});
|
||||
const data = await res.json();
|
||||
if (data.success) {
|
||||
await pollStatus();
|
||||
await loadStagedDos();
|
||||
} else {
|
||||
alert('Gagal mengakhiri batch: ' + (data.error || 'Terjadi kesalahan'));
|
||||
}
|
||||
@@ -456,7 +839,7 @@
|
||||
try {
|
||||
const res = await fetch('/api/current-batch');
|
||||
const data = await res.json();
|
||||
|
||||
|
||||
const badge = document.getElementById('statusBadge');
|
||||
const icon = document.getElementById('statusIcon');
|
||||
const text = document.getElementById('statusText');
|
||||
@@ -469,9 +852,27 @@
|
||||
const btnStop = document.getElementById('btnStopBatch');
|
||||
|
||||
if (data.model_mode) modelMode.textContent = data.model_mode;
|
||||
if (data.mode) updateModeUI(data.mode);
|
||||
sackCount.textContent = data.count || 0;
|
||||
boxCount.textContent = data.box_count || 0;
|
||||
|
||||
const netSack = document.getElementById('opNetSack');
|
||||
const netBox = document.getElementById('opNetBox');
|
||||
const netSackItem = document.getElementById('opNetSackItem');
|
||||
const netBoxItem = document.getElementById('opNetBoxItem');
|
||||
const plateItem = document.getElementById('opPlateItem');
|
||||
const plateDos = document.getElementById('opPlateDos');
|
||||
const showNet = currentMode === 'do_manual' && data.success && data.batch_number;
|
||||
if (netSackItem) netSackItem.style.display = showNet ? 'block' : 'none';
|
||||
if (netBoxItem) netBoxItem.style.display = showNet ? 'block' : 'none';
|
||||
if (plateItem) plateItem.style.display = showNet ? 'block' : 'none';
|
||||
if (showNet) {
|
||||
netSack.textContent = `${data.net_sack ?? data.count} / ${data.expected_sack ?? '-'}`;
|
||||
netBox.textContent = `${data.net_box ?? data.box_count} / ${data.expected_box ?? '-'}`;
|
||||
plateDos.textContent = (data.plate || 'tanpa plat') +
|
||||
(data.do_numbers && data.do_numbers.length ? ' · ' + data.do_numbers.join(', ') : '');
|
||||
}
|
||||
|
||||
if (data.success && data.batch_number) {
|
||||
isBatchActive = true;
|
||||
badge.className = 'status-badge-box status-active';
|
||||
@@ -506,6 +907,8 @@
|
||||
}
|
||||
|
||||
setInterval(pollStatus, 2000);
|
||||
setInterval(loadModeBanner, 5000);
|
||||
setInterval(() => { if (currentMode === 'do_manual') { loadStagedDos(); loadDoSettings(); } }, 4000);
|
||||
pollStatus();
|
||||
loadModeBanner();
|
||||
loadModelModes();
|
||||
|
||||
Reference in new issue
Block a user