// Operasional stok — receiving, branch transfer, and stock count workflows
function StokOperasional({ pushToast }) {
  const [tab, setTab] = React.useState('receiving');
  const [completed, setCompleted] = React.useState([]);
  const complete = (id, message) => { setCompleted(previous => [...previous, id]); pushToast({msg:message}); };
  return <div className="stack-6">
    <div className="grid-4">
      <Kpi label="Menunggu Diterima" value="2" hint="1 pengiriman tiba hari ini" icon="package" tone="warn" />
      <Kpi label="Transfer Berjalan" value="1" hint="Pusat → Kalimalang" icon="rotate" />
      <Kpi label="Opname Aktif" value="64%" hint="128 dari 200 SKU" icon="checkCircle" progress={64} />
      <Kpi label="Selisih Terbuka" value="Rp 186 rb" hint="5 SKU perlu ditinjau" icon="alert" tone="danger" />
    </div>
    <Card><div className="card-pad">
      <div className="row between mb-4"><div className="tabs"><button className={'tab '+(tab === 'receiving' ? 'active' : '')} onClick={() => setTab('receiving')}>Penerimaan</button><button className={'tab '+(tab === 'transfer' ? 'active' : '')} onClick={() => setTab('transfer')}>Transfer Cabang</button><button className={'tab '+(tab === 'count' ? 'active' : '')} onClick={() => setTab('count')}>Stock Opname</button></div><Btn tone="primary" size="sm" icon="plus" onClick={() => pushToast({msg: tab === 'receiving' ? 'Penerimaan manual baru dibuka' : tab === 'transfer' ? 'Transfer stok baru dibuka' : 'Sesi opname baru dibuat'})}>Buat Baru</Btn></div>
      {tab === 'receiving' && <ReceivingPanel completed={completed} complete={complete} />}
      {tab === 'transfer' && <TransferPanel completed={completed} complete={complete} />}
      {tab === 'count' && <CountPanel completed={completed} complete={complete} />}
    </div></Card>
    <div className="grid-2">
      <Card><div className="card-pad"><SectionHead title="Aktivitas stok terakhir" hint="Semua perubahan dilabeli cabang, perangkat, dan pelaksana" /><div className="activity-timeline"><Activity icon="package" title="18 SKU diterima" detail="PO-2607-017 · Dewi · Kasir HP Kalimalang" time="10.42" /><Activity icon="rotate" title="Transfer dikirim" detail="TRF-2607-006 · Bambang · Cabang Pusat" time="09.18" /><Activity icon="edit" title="Koreksi stok diajukan" detail="Beras 5kg -2 unit · menunggu persetujuan" time="08.56" /></div></div></Card>
      <Card><div className="card-pad"><SectionHead title="Aturan stok" hint="Kontrol yang mencegah stok berubah tanpa jejak" /><div className="setting-row"><div><b>Wajib alasan untuk koreksi</b><span>Kasir memilih alasan dan menambahkan foto bila perlu.</span></div><Pill tone="success">Aktif</Pill></div><div className="setting-row"><div><b>Persetujuan selisih di atas Rp100 ribu</b><span>Supervisor atau pemilik harus meninjau.</span></div><Pill tone="success">Aktif</Pill></div><div className="setting-row"><div><b>Stok negatif</b><span>Transaksi tetap boleh offline, lalu ditandai saat sinkron.</span></div><Pill tone="warning">Peringatkan</Pill></div></div></Card>
    </div>
  </div>;
}

function ReceivingPanel({ completed, complete }) { const rows = [{id:'RCV-018',ref:'PO-2607-017',from:'CV Berkah Grosir Bekasi',to:'Cabang Kalimalang',items:'18/24 SKU',status:'Perlu dicek'},{id:'RCV-019',ref:'PO-2607-018',from:'PT Sumber Pangan Sejahtera',to:'Cabang Pusat',items:'0/12 SKU',status:'Belum mulai'}]; return <div className="table-wrap"><table className="table"><thead><tr><th>Penerimaan</th><th>Referensi</th><th>Pemasok</th><th>Cabang tujuan</th><th>Progres</th><th>Status</th><th /></tr></thead><tbody>{rows.map(row => <tr key={row.id}><td className="code">{row.id}</td><td className="code">{row.ref}</td><td>{row.from}</td><td>{row.to}</td><td>{row.items}</td><td><Pill tone={completed.includes(row.id) ? 'success' : 'warning'}>{completed.includes(row.id) ? 'Selesai' : row.status}</Pill></td><td className="actions"><Btn size="sm" icon="check" onClick={() => complete(row.id, `${row.id} selesai diterima`)}>{completed.includes(row.id) ? 'Tersimpan' : 'Lanjutkan'}</Btn></td></tr>)}</tbody></table></div>; }
function TransferPanel({ completed, complete }) { return <div className="table-wrap"><table className="table"><thead><tr><th>Transfer</th><th>Asal → tujuan</th><th>Dibuat oleh</th><th>Jumlah</th><th>Status</th><th /></tr></thead><tbody><tr><td className="code">TRF-2607-006</td><td><b>Cabang Pusat → Kalimalang</b><div className="table-sub">Dikirim 09.18 · estimasi 11.30</div></td><td>Bambang Kurniawan</td><td>9 SKU · 36 unit</td><td><Pill tone={completed.includes('TRF-006') ? 'success' : 'accent'}>{completed.includes('TRF-006') ? 'Diterima' : 'Dalam perjalanan'}</Pill></td><td className="actions"><Btn size="sm" icon="check" onClick={() => complete('TRF-006','Transfer diterima di Cabang Kalimalang')}>Konfirmasi Terima</Btn></td></tr><tr><td className="code">TRF-2607-005</td><td><b>Kalimalang → Cabang Pusat</b><div className="table-sub">Selesai 22 Jul · 16.24</div></td><td>Dewi Pratiwi</td><td>3 SKU · 8 unit</td><td><Pill tone="success">Selesai</Pill></td><td /></tr></tbody></table></div>; }
function CountPanel({ completed, complete }) { return <div><div className="count-summary"><div><div className="info-label">OPNAME-2607-PUSAT</div><div className="info-value">128 / 200 SKU</div><span>Dimulai 08.00 oleh Bambang dan Rina</span></div><div className="count-ring">64%</div></div><div className="progress-track"><div style={{width:'64%'}} /></div><div className="table-wrap" style={{marginTop:16}}><table className="table"><thead><tr><th>SKU</th><th>Produk</th><th className="num">Sistem</th><th className="num">Fisik</th><th className="num">Selisih</th><th>Status</th></tr></thead><tbody><tr><td className="code">SMB-001</td><td>Beras Pandan Wangi 5kg</td><td className="num">24</td><td className="num">22</td><td className="num">-2</td><td><Pill tone="warning">Perlu persetujuan</Pill></td></tr><tr><td className="code">RMH-006</td><td>Baterai ABC AA isi 4</td><td className="num">5</td><td className="num">4</td><td className="num">-1</td><td><Pill tone="neutral">Dicatat</Pill></td></tr></tbody></table></div><div className="row" style={{justifyContent:'flex-end',marginTop:14}}><Btn tone="primary" icon="check" onClick={() => complete('COUNT-001','Hasil opname dikirim untuk persetujuan')}>{completed.includes('COUNT-001') ? 'Terkirim' : 'Kirim Hasil Opname'}</Btn></div></div>; }
function Activity({ icon, title, detail, time }) { return <div className="activity-item"><span><Icon name={icon} size={14} /></span><div><b>{title}</b><small>{detail}</small></div><time>{time}</time></div>; }
Object.assign(window, { StokOperasional });