@extends('layouts.app')

@php
  $esEdicion = $cotizacion->exists;
  $moneda = old('moneda', $cotizacion->moneda?->value ?? 'PEN');
  $num = fn ($v) => rtrim(rtrim(number_format((float) $v, 2, '.', ''), '0'), '.') ?: '0';

  // Filas a mostrar: lo enviado (si volvió con errores), las de la cotización o una vacía.
  if (is_array(old('descripcion'))) {
      $filas = collect(old('descripcion'))->map(fn ($d, $i) => [
          'pn' => old("pn.$i"), 'descripcion' => $d, 'detalle' => old("detalle.$i"),
          'cantidad' => old("cantidad.$i", 1), 'costo_unitario' => old("costo_unitario.$i", 0),
          'margen_porcentaje' => old("margen_porcentaje.$i", $margenDefecto),
      ])->values()->all();
  } elseif ($lineas) {
      $filas = $lineas;
  } else {
      $filas = [['pn' => null, 'descripcion' => '', 'detalle' => null, 'cantidad' => 1, 'costo_unitario' => 0, 'margen_porcentaje' => $margenDefecto]];
  }
@endphp

@section('titulo', $esEdicion ? "Editar {$folio}" : 'Nueva cotización')

@section('contenido')
  <form method="post" action="{{ $esEdicion ? route('cotizaciones.update', $cotizacion) : route('cotizaciones.store') }}"
        id="formCotizacion" data-igv="{{ $igvPorcentaje }}" data-margen="{{ $margenDefecto }}"
        data-url-clientes="{{ route('buscar.clientes') }}" data-url-crear-cliente="{{ route('buscar.clientes.crear') }}"
        data-url-productos="{{ route('buscar.productos') }}">
    @csrf
    @if ($esEdicion) @method('PUT') @endif

    <div class="topbar">
      <div>
        <div class="eyebrow">Cotizaciones · {{ $esEdicion ? 'edición' : 'nueva' }}</div>
        <h2>{{ $esEdicion ? "Editar cotización" : 'Nueva cotización' }}</h2>
      </div>
      <span class="fol" style="font-size:13px;">{{ $esEdicion ? 'Folio' : 'Folio asignado' }}: <b style="color:var(--ink); font-weight:700;">{{ $folio }}</b></span>
    </div>

    @if ($esDuplicado)
      <div class="alert-success">Cotización duplicada. Selecciona el cliente al que se enviará y revisa los datos antes de guardar.</div>
    @endif
    @include('partials.alertas')

    <div class="form-grid">
      {{-- Columna principal --}}
      <div>
        <div class="card-block">
          <h3><span class="idx">1</span>Datos del cliente</h3>
          <div class="grid-2">
            <div class="field-sm" style="position:relative;">
              <label for="clienteInput">Cliente</label>
              <input type="text" id="clienteInput" name="cliente_nombre" autocomplete="off" placeholder="Escribe el nombre del cliente…"
                     value="{{ old('cliente_nombre', $cotizacion->cliente?->nombre) }}" required>
              <input type="hidden" name="cliente_id" id="clienteId" value="{{ old('cliente_id', $cotizacion->cliente_id) }}">
              <div id="clienteResultados" class="autocomplete-list"></div>
            </div>
            <div class="field-sm">
              <label for="rucInput">RUC</label>
              <input type="text" id="rucInput" name="cliente_ruc" placeholder="—" value="{{ old('cliente_ruc', $cotizacion->cliente?->ruc) }}" readonly>
            </div>
          </div>
          <div class="grid-4">
            <div class="field-sm">
              <label>Fecha de emisión</label>
              <input type="date" name="fecha_emision" value="{{ old('fecha_emision', $cotizacion->fecha_emision?->toDateString()) }}" required>
            </div>
            <div class="field-sm">
              <label>Vigencia (días)</label>
              <input type="number" name="vigencia_dias" value="{{ old('vigencia_dias', $cotizacion->vigencia_dias) }}" min="1" required>
            </div>
            <div class="field-sm">
              <label>Forma de pago</label>
              <select name="forma_pago">
                @foreach ($formasPago as $forma)
                <option @selected(old('forma_pago', $cotizacion->forma_pago) === $forma)>{{ $forma }}</option>
                @endforeach
              </select>
            </div>
            <div class="field-sm">
              <label>Moneda</label>
              <div class="toggle-group" id="monedaToggle">
                @foreach (\App\Support\Moneda::cases() as $opcion)
                <button type="button" class="{{ $moneda === $opcion->value ? 'sel' : '' }}" data-moneda="{{ $opcion->value }}">{{ $opcion->simbolo() }} {{ $opcion->nombre() }}</button>
                @endforeach
              </div>
              <input type="hidden" name="moneda" id="monedaInput" value="{{ $moneda }}">
            </div>
          </div>
        </div>

        <div class="card-block">
          <h3><span class="idx">2</span>Detalle de productos / servicios</h3>
          <table class="items-table" id="itemsTable">
            <thead>
              <tr><th>P/N</th><th>Descripción</th><th>Cant.</th><th>Costo</th><th>% Gan.</th><th>Precio unit.</th><th>Subtotal</th><th>Ganancia c/IGV</th><th></th></tr>
            </thead>
            <tbody id="itemsBody">
              @foreach ($filas as $fila)
              @php($conDetalle = trim((string) ($fila['detalle'] ?? '')) !== '')
              <tr class="item-row">
                <td class="pn"><input type="text" name="pn[]" class="pn-input" value="{{ $fila['pn'] }}" placeholder="—" autocomplete="off"></td>
                <td class="desc">
                  <input type="text" name="descripcion[]" value="{{ $fila['descripcion'] }}" placeholder="Busca en el catálogo o escribe libre…" autocomplete="off" required>
                  <textarea name="detalle[]" class="detalle-input" rows="2" placeholder="Detalle adicional (opcional): especificaciones, garantía, modelo…" @if (! $conDetalle) hidden @endif>{{ $fila['detalle'] }}</textarea>
                </td>
                <td class="qty"><input type="text" name="cantidad[]" class="cantidad" value="{{ $num($fila['cantidad']) }}" required></td>
                <td class="costo"><input type="text" name="costo_unitario[]" class="costo-input" value="{{ number_format((float) $fila['costo_unitario'], 2, '.', '') }}"></td>
                <td class="margen"><input type="text" name="margen_porcentaje[]" class="margen-input" value="{{ $num($fila['margen_porcentaje']) }}"></td>
                <td class="price"><input type="text" class="precio" value="0.00" readonly tabindex="-1"></td>
                <td class="sub"><span class="sub-val">—</span></td>
                <td class="ganancia"><span class="ganancia-val">—</span></td>
                <td class="acciones">
                  <button type="button" class="detalle-toggle {{ $conDetalle ? 'abierto' : '' }}"
                          title="{{ $conDetalle ? 'Quitar el detalle adicional' : 'Agregar un detalle adicional a esta línea' }}"
                          aria-label="{{ $conDetalle ? 'Quitar detalle' : 'Agregar detalle' }}">{{ $conDetalle ? '−' : '+' }}</button>
                  <button type="button" class="row-del" title="Eliminar línea">✕</button>
                </td>
              </tr>
              @endforeach
            </tbody>
          </table>
          <button type="button" class="add-row" id="btnAgregarLinea">＋ Agregar línea</button>
        </div>

        <div class="card-block">
          <h3><span class="idx">3</span>Notas y condiciones</h3>
          <div class="field-sm" style="margin-bottom:0;">
            <textarea name="notas" rows="3" placeholder="Ej. Precios sujetos a cambio sin previo aviso.">{{ old('notas', $cotizacion->notas) }}</textarea>
          </div>
        </div>
      </div>

      {{-- Columna lateral: resumen --}}
      <div>
        <div class="card-block">
          <h3>Resumen</h3>
          <div class="field-sm">
            <label for="descuentoInput">Descuento</label>
            <input type="text" name="descuento" id="descuentoInput" value="{{ number_format((float) old('descuento', $cotizacion->descuento ?? 0), 2, '.', '') }}">
          </div>
          <div class="totales">
            <div class="tot-row"><span>Subtotal</span><span class="v" id="totSubtotal">—</span></div>
            <div class="tot-row"><span>IGV ({{ $num($igvPorcentaje) }}%)</span><span class="v" id="totIgv">—</span></div>
            <div class="tot-row final"><span>Total</span><span class="v" id="totTotal">—</span></div>
          </div>
          <div class="field-sm">
            <label>Vendedor responsable</label>
            @if (auth()->user()->esAdministrador())
              <select name="vendedor_id">
                @foreach ($vendedores as $vendedor)
                <option value="{{ $vendedor->id }}" @selected((int) old('vendedor_id', $cotizacion->vendedor_id) === $vendedor->id)>{{ $vendedor->nombre }}</option>
                @endforeach
              </select>
            @else
              <input type="text" value="{{ auth()->user()->nombre }}" disabled>
            @endif
          </div>
          <div class="field-sm" style="margin-bottom:0;">
            <label>{{ $esEdicion ? 'Estado' : 'Estado inicial' }}</label>
            <select name="estado">
              @foreach (\App\Models\Cotizacion::ESTADOS as $valor => $etiqueta)
                @if ($esEdicion || in_array($valor, ['pendiente', 'enviada'], true))
                <option value="{{ $valor }}" @selected(old('estado', $cotizacion->estado) === $valor)>{{ $valor === 'enviada' ? 'Enviada al cliente' : $etiqueta }}</option>
                @endif
              @endforeach
            </select>
          </div>
          <div class="sidenote">
            ⓘ {{ $esEdicion ? 'Al guardar, los totales se recalculan con la tasa de IGV vigente en Configuración.' : 'Este total se recalcula automáticamente al modificar cantidades, precios o el descuento.' }}
          </div>
        </div>

        <div class="card-block">
          <h3>Rentabilidad</h3>
          <div class="totales">
            <div class="tot-row"><span>Costo total (inc. IGV)</span><span class="v" id="totCostoTotal">—</span></div>
            <div class="tot-row final"><span>Ganancia total (inc. IGV)</span><span class="v" id="totGananciaTotal">—</span></div>
          </div>
        </div>
      </div>
    </div>

    <div class="form-actions">
      <a href="{{ $esEdicion ? route('cotizaciones.show', $cotizacion) : route('panel') }}" class="btn-ghost">Cancelar</a>
      <button type="submit" class="btn-gold">{{ $esEdicion ? 'Guardar cambios' : 'Guardar cotización' }}</button>
    </div>
    <div style="height:30px;"></div>
  </form>
@endsection

@push('scripts')
<script src="{{ asset('js/confirmar.js') }}"></script>
<script src="{{ asset('js/cotizacion.js') }}"></script>
@endpush