// js/components/widgets/orcamentos/QuoteEditHeader.jsx
// [Backlog #579 split 2026-05-15] Extraído de QuoteEditModalShell L871-911 — refactor zero-lógica.
// Padrão: IIFE + window.ZNX.widgets.orcamentos.X namespace + props injection.
//
// Header do form de criação/edição de orçamento. Logo ZAYNEX + título + preview total com
// crédito do cliente (FEAT credit-preview 20260504-v17).
//
// Props (validados FASE 1.5 = 6 props):
//   modal: string ('new' | 'edit')
//   activeQuote: object | null — só edit tem quote (mostra número)
//   pendingNumber: string | null — número pré-alocado pra novo orçamento
//   form: object — usado em saleFinalTotal(form) pra preview total
//   clients: array — usado pra lookup credit do cliente em form.clientId
//   onExit: fn — confirmExit handler do pai (botão Voltar)
//
// Deps runtime globals: saleFinalTotal (window.saleFinalTotal), fmt (window.fmt).
(function() {
  'use strict';

  function QuoteEditHeader({modal, activeQuote, pendingNumber, form, clients, onExit}){
    return (
      <div style={{display:'flex',alignItems:'flex-start',justifyContent:'space-between',marginBottom:24,flexWrap:'wrap',gap:12}}>
        <div>
          <button className="btn-outline" onClick={onExit}
            style={{padding:'6px 14px',fontSize:12,display:'flex',alignItems:'center',gap:4,marginBottom:10}}>
            ← Voltar
          </button>
          <div>
            <span style={{color:'#B89840',fontWeight:800,fontSize:22}}>ZAYNEX</span>
            <span style={{color:'#1B2A4A',fontWeight:700,fontSize:20}}>{modal==='edit'&&activeQuote?` • Editar ${activeQuote.number}`:` • ${pendingNumber||'Novo Orçamento'}`}</span>
          </div>
          <div style={{fontSize:13,color:'#9CA3AF',marginTop:3}}>Orçamento para revendedor</div>
        </div>
        <div style={{textAlign:'right'}}>
          {/* [FEAT credit-preview 20260504-v17] Mostra subtotal + credit + liquido se cliente tem credito */}
          {(()=>{
            const subtotal=saleFinalTotal(form);
            const cli=clients.find(c=>c.id===form.clientId);
            const credit=Number(cli?.creditBalance||cli?.credit_balance||0);
            const willApply=credit>0&&subtotal>0?Math.min(credit,subtotal):0;
            if(willApply>0){
              const liquido=subtotal-willApply;
              return(
                <>
                  <div style={{fontSize:11,color:'#9CA3AF',textTransform:'uppercase',letterSpacing:1}}>Subtotal</div>
                  <div style={{color:'#6B7280',fontWeight:600,fontSize:18,textDecoration:'line-through',opacity:.7}}>{fmt(subtotal)}</div>
                  <div style={{fontSize:12,color:'#10B981',fontWeight:600,marginTop:4}}>− Crédito aplicado: {fmt(willApply)}</div>
                  <div style={{fontSize:11,color:'#9CA3AF',textTransform:'uppercase',letterSpacing:1,marginTop:6}}>Total líquido (na conversão)</div>
                  <div style={{color:'#B89840',fontWeight:800,fontSize:28,lineHeight:1.1}}>{fmt(liquido)}</div>
                </>
              );
            }
            return(
              <>
                <div style={{fontSize:11,color:'#9CA3AF',textTransform:'uppercase',letterSpacing:1}}>Total do orçamento</div>
                <div style={{color:'#B89840',fontWeight:800,fontSize:28,lineHeight:1.1}}>{fmt(subtotal)}</div>
              </>
            );
          })()}
        </div>
      </div>
    );
  }

  window.ZNX = window.ZNX || {};
  window.ZNX.widgets = window.ZNX.widgets || {};
  window.ZNX.widgets.orcamentos = window.ZNX.widgets.orcamentos || {};
  window.ZNX.widgets.orcamentos.QuoteEditHeader = QuoteEditHeader;
})();