// js/components/widgets/compras/PurchaseViewModal.jsx
// [Wave 32 v224.13 NUCLEAR EXTRACT 2026-05-24] Modal View Compra (Compras.jsx L222-248 LITERAL)
//
// Props:
//   - viewPurchase (purchase obj | null) — null = modal fechado
//   - suppliers, products (arrays) — pra lookup nomes
//   - receivingId (id|null) — inflight pra disabled botão Receber
//   - onReceive(purchase) — callback receive RPC (vem do main)
//   - onClose — callback fecha modal
//
// Deps lazy: window.Modal, window.fmt, window.fmtDate, window.StatusBadge,
//            window.ZNX.lib.compras.calcs.{calcSubtotal, lookupSupplierName}
(function(){
  'use strict';
  function PurchaseViewModal(props){
    const Modal = window.Modal;
    const StatusBadge = window.StatusBadge;
    const fmt = window.fmt;
    const fmtDate = window.fmtDate;
    const calcs = window.ZNX && window.ZNX.lib && window.ZNX.lib.compras && window.ZNX.lib.compras.calcs;
    const { viewPurchase, suppliers, products, receivingId, onReceive, onClose } = props;
    if(!viewPurchase || !Modal || !calcs) return null;

    return (
      <Modal title={'Compra '+viewPurchase.number} onClose={onClose} large>
        <div style={{display:'grid',gridTemplateColumns:'1fr 1fr 1fr',gap:12,marginBottom:16,fontSize:13}}>
          <div><span className="dim">Fornecedor: </span>{calcs.lookupSupplierName(suppliers, viewPurchase.supplierId)}</div>
          <div><span className="dim">Data: </span>{fmtDate(viewPurchase.date)}</div>
          <div><span className="dim">Prev. Entrega: </span>{viewPurchase.deliveryDate?fmtDate(viewPurchase.deliveryDate):'—'}</div>
          <div><span className="dim">Moeda: </span><span style={{color:'#2563EB'}}>{viewPurchase.currency||'BRL'}</span></div>
          {viewPurchase.currency&&viewPurchase.currency!=='BRL'&&<div><span className="dim">Câmbio: </span>{viewPurchase.exchangeRate||1}</div>}
          <div><span className="dim">Status: </span><StatusBadge status={viewPurchase.status}/></div>
          {viewPurchase.obs&&<div style={{gridColumn:'1/-1'}}><span className="dim">Obs: </span>{viewPurchase.obs}</div>}
        </div>
        <table>
          <thead><tr><th>Produto</th><th>Qtd</th><th>Custo Unit.</th><th>Subtotal</th></tr></thead>
          <tbody>
            {(viewPurchase.items||[]).map(function(it,i){
              const prodName = it.name || (products.find(function(p){return p.id===it.productId;}) || {}).name || '—';
              return (
                <tr key={i}><td>{prodName}</td><td>{it.qty}</td><td>{fmt(it.cost)}</td><td className="gold">{fmt(calcs.calcSubtotal(it))}</td></tr>
              );
            })}
            <tr><td colSpan={3} style={{textAlign:'right',fontWeight:600}}>Total (R$):</td><td className="gold" style={{fontWeight:700}}>{fmt(viewPurchase.total||0)}</td></tr>
          </tbody>
        </table>
        {viewPurchase.status!=='Entregue'&&(
          <div style={{display:'flex',justifyContent:'flex-end',marginTop:14}}>
            <button className="btn-gold" disabled={receivingId===viewPurchase.id} style={{opacity:receivingId===viewPurchase.id?0.6:1,cursor:receivingId===viewPurchase.id?'not-allowed':'pointer'}} onClick={function(){onReceive(viewPurchase);}}>{receivingId===viewPurchase.id?'⏳ Recebendo…':'Receber → Estoque'}</button>
          </div>
        )}
      </Modal>
    );
  }
  window.ZNX = window.ZNX || {};
  window.ZNX.widgets = window.ZNX.widgets || {};
  window.ZNX.widgets.compras = window.ZNX.widgets.compras || {};
  window.ZNX.widgets.compras.PurchaseViewModal = PurchaseViewModal;
  // [Wave 32 marker v224.13] confirma PurchaseViewModal executado
  window.PurchaseViewModal_v224_13_wave32 = true;
})();