// js/components/widgets/gastos/ReceiptListModal.jsx
// [Wave Gastos FULL 2026-05-18 v223.22] Extraído de Gastos.jsx L996-1017 (modal lista recibos múltiplos).
// Props (5): receiptListModal, setReceiptListModal, gerarRecibo, fmt, fmtDate.
// Padrão: IIFE + window.ZNX.widgets.gastos.ReceiptListModal.
(function() {
  'use strict';

  function ReceiptListModal({receiptListModal, setReceiptListModal, gerarRecibo, fmt, fmtDate}) {
    return (
      <Modal title={`Recibos · ${receiptListModal.gasto.description}`} onClose={()=>setReceiptListModal(null)}>
        <div style={{maxHeight:400,overflowY:'auto'}}>
          {receiptListModal.payments.map((p,i)=>(
            <div key={p.id} style={{display:'flex',justifyContent:'space-between',alignItems:'center',padding:'12px 0',borderBottom:i<receiptListModal.payments.length-1?'1px solid #E5E7EB':'none'}}>
              <div style={{flex:1}}>
                <div style={{fontSize:14,fontWeight:700,color:'#1F2937'}}>{p.receipt_number}</div>
                <div style={{fontSize:11,color:'#6B7280',marginTop:2}}>{fmtDate(p.paid_at)} · {p.payment_method} · {fmt(Number(p.value||0))}</div>
                {p.notes && <div style={{fontSize:10,color:'#9CA3AF',marginTop:2}}>{p.notes}</div>}
              </div>
              <div style={{display:'flex',gap:6}}>
                <button onClick={()=>{ setReceiptListModal(null); gerarRecibo(receiptListModal.gasto, p, 'print'); }} style={{padding:'6px 14px',background:'#2563EB',color:'#fff',border:'none',borderRadius:5,fontSize:12,fontWeight:700,cursor:'pointer'}} title="Abrir e imprimir">🖨️ Imprimir</button>
                <button onClick={()=>{ setReceiptListModal(null); gerarRecibo(receiptListModal.gasto, p, 'download'); }} style={{padding:'6px 14px',background:'#10B981',color:'#fff',border:'none',borderRadius:5,fontSize:12,fontWeight:700,cursor:'pointer'}} title="Baixar PDF">📥 Baixar</button>
              </div>
            </div>
          ))}
        </div>
        <div style={{display:'flex',justifyContent:'flex-end',marginTop:14}}>
          <button className="btn-outline" onClick={()=>setReceiptListModal(null)}>Fechar</button>
        </div>
      </Modal>
    );
  }

  window.ZNX = window.ZNX || {};
  window.ZNX.widgets = window.ZNX.widgets || {};
  window.ZNX.widgets.gastos = window.ZNX.widgets.gastos || {};
  window.ZNX.widgets.gastos.ReceiptListModal = ReceiptListModal;
})();
