@extends('layouts.enterprise')

@section('title', 'Subir factura')

@section('content')
  @php
    $isComplementUploadBlocked = (bool) ($isComplementUploadBlocked ?? false);
    $pendingComplementInvoice = $pendingComplementInvoice ?? null;
    $pendingComplementStatus = strtolower((string) ($pendingComplementInvoice?->payment_complement_status ?? ''));
    $pendingComplementStatusLabel = match ($pendingComplementStatus) {
      'approved' => 'Aprobado',
      'rejected' => 'Rechazado',
      'pending' => 'En revisión',
      default => 'Sin cargar',
    };
    $pendingComplementUploadedAt = $pendingComplementInvoice?->payment_complement_uploaded_at;
  @endphp

  <div class="card">
    <h1 class="page-title">Subir factura</h1>
    <p class="subtle">El sistema revisa la información de la factura con la solicitud registrada en el RC.</p>

    @if($isComplementUploadBlocked)
      <div class="error complement-block-alert">
        <strong>No puedes subir nuevas facturas.</strong>
        @if($pendingComplementUploadedAt)
          <p style="margin:6px 0 10px;">
            Tienes una factura PPD/99 con complemento de pago <strong>{{ strtolower($pendingComplementStatusLabel) }}</strong>.
            Hasta que se apruebe, no podrás subir nuevas facturas.
          </p>
        @else
          <p style="margin:6px 0 10px;">
            Tienes una factura PPD/99 sin complemento de pago.
            No podrás subir nuevas facturas hasta subir el complemento de pago.
          </p>
        @endif
        @if($pendingComplementInvoice)
          <small style="display:block; margin-bottom:10px;">
            Factura #{{ $pendingComplementInvoice->id }} · RC {{ $pendingComplementInvoice->rc_number ?: '-' }} · Estado complemento: {{ $pendingComplementStatusLabel }}
          </small>
        @endif
        <br>
        <a class="btn btn-secondary" href="{{ route('supplier.invoices.index') }}">Ir a Ver facturas</a>
        <br>
      </div>
    @endif

    @if($errors->any())
      <div class="error">
        <strong>No pudimos registrar la factura.</strong>
        <p style="margin:6px 0 10px;">Revisa los campos marcados y corrige lo siguiente:</p>
        <ul>
          @foreach($errors->all() as $e)
            <li>{{ $e }}</li>
          @endforeach
        </ul>
      </div>
    @endif

    <form method="POST" action="{{ route('supplier.invoices.store') }}" enctype="multipart/form-data">
      @csrf
      <fieldset class="{{ $isComplementUploadBlocked ? 'form-disabled' : '' }}" {{ $isComplementUploadBlocked ? 'disabled' : '' }}>

      <h3 class="section-title">Datos fiscales</h3>
      <div class="grid grid-2">
        <div class="field">
          <label>Razón social</label>
          <input value="{{ $company?->legal_name }}" readonly >
        </div>
        <div class="field">
          <label>RFC</label>
          <input value="{{ $company?->rfc }}" readonly >
        </div>
      </div>

      <h3 class="section-title">Factura</h3>
      <div class="grid grid-2">
        <div class="field">
          <label>RC</label>
          <div class="rc-lookup">
            <input id="rc_number" name="rc_number" value="{{ old('rc_number') }}" required>
            <button id="lookup-rc-btn" class="btn btn-secondary" type="button">Consultar</button>
          </div>
          <small id="request-summary-message" style="display:block; margin-top:6px;"></small>
          @error('rc_number') <small style="display:block; color:#b91c1c; margin-top:6px;">{{ $message }}</small> @enderror
        </div>
      </div>

      <div id="request-summary-box" class="request-summary-box" style="display:none;">
        <h3 class="section-title" style="margin-top:0;">Resumen de solicitud</h3>
        <div id="request-summary-partial-badge" style="display:none; margin-bottom:10px;">
          <sl-badge variant="warning" pill>Solicitud parcial habilitada</sl-badge>
          <small style="display:block; margin-top:6px; color:#92400e;">Puedes subir la factura por piezas; el sistema validará el remanente disponible.</small>
        </div>
        <div class="grid grid-2">
          <div class="field">
            <label>PROYECTO</label>
            <input id="summary_project_name" readonly>
          </div>
          <div class="field">
            <label>Job Number</label>
            <input id="summary_title" readonly>
          </div>
          <div class="field">
            <label>Subtotal de tu proveedor</label>
            <input id="summary_provider_subtotal" readonly>
          </div>
          <div class="field">
            <label>Subtotal de tu proveedor + IVA (16%)</label>
            <input id="summary_provider_subtotal_iva" readonly>
          </div>
        </div>
      </div>

      <h3 class="section-title">Archivos</h3>
      <div class="grid grid-2">
        <div class="field">
          <label>PDF Factura</label>
          <input type="file" name="invoice_pdf" accept="application/pdf" required>
          @error('invoice_pdf') <small style="display:block; color:#b91c1c; margin-top:6px;">{{ $message }}</small> @enderror
        </div>
        <div class="field">
          <label>XML Factura</label>
          <input type="file" name="invoice_xml" accept="application/xml,text/xml" required>
          @error('invoice_xml') <small style="display:block; color:#b91c1c; margin-top:6px;">{{ $message }}</small> @enderror
        </div>
        <div class="field">
          <label>Orden de compra (PDF)</label>
          <input type="file" name="purchase_order" accept="application/pdf" required>
          @error('purchase_order') <small style="display:block; color:#b91c1c; margin-top:6px;">{{ $message }}</small> @enderror
        </div>
      </div>
      </fieldset>

      <div style="margin-top:16px;">
        @if($isComplementUploadBlocked)
          <button type="button" class="btn" disabled>Envío bloqueado por complemento pendiente</button>
        @else
          <button type="submit" class="btn">Enviar factura</button>
        @endif
      </div>
    </form>
  </div>
@endsection

@push('styles')
  <style>
    .rc-lookup {
      display: flex;
      gap: 8px;
      align-items: center;
    }
    .rc-lookup input {
      flex: 1;
    }
    .request-summary-box {
      margin-top: 14px;
      border: 1px solid var(--border);
      border-radius: 12px;
      padding: 14px;
      background: #f8fafc;
    }
    .complement-block-alert {
      margin-bottom: 14px;
    }
    .form-disabled {
      opacity: 0.55;
      pointer-events: none;
    }
    @media (max-width: 860px) {
      .rc-lookup {
        flex-direction: column;
        align-items: stretch;
      }
    }
  </style>
@endpush

@push('scripts')
  <script>
    (() => {
      const endpoint = @json(route('supplier.invoices.request_summary'));
      const rcInput = document.getElementById('rc_number');
      const lookupBtn = document.getElementById('lookup-rc-btn');
      const message = document.getElementById('request-summary-message');
      const box = document.getElementById('request-summary-box');

      const projectField = document.getElementById('summary_project_name');
      const titleField = document.getElementById('summary_title');
      const providerSubtotalField = document.getElementById('summary_provider_subtotal');
      const providerSubtotalIvaField = document.getElementById('summary_provider_subtotal_iva');
      const partialBadgeBox = document.getElementById('request-summary-partial-badge');

      const money = (value) => {
        if (value === null || value === undefined || value === '') return 'Sin subtotal';
        const n = Number(value);
        if (Number.isNaN(n)) return 'Sin subtotal';
        return `$${n.toLocaleString('es-MX', { minimumFractionDigits: 2, maximumFractionDigits: 2 })}`;
      };

      const clearSummary = () => {
        box.style.display = 'none';
        projectField.value = '';
        titleField.value = '';
        providerSubtotalField.value = '';
        providerSubtotalIvaField.value = '';
        partialBadgeBox.style.display = 'none';
      };

      const setMessage = (text, isError = false) => {
        message.textContent = text || '';
        message.style.color = isError ? '#b91c1c' : '#0f766e';
      };

      const loadSummary = async () => {
        const rc = (rcInput?.value || '').trim();
        if (!rc) {
          clearSummary();
          setMessage('Captura un RC para consultar los montos del proveedor.', true);
          return;
        }

        lookupBtn.disabled = true;
        setMessage('Consultando solicitud...');

        try {
          const url = new URL(endpoint, window.location.origin);
          url.searchParams.set('rc_number', rc);
          const res = await fetch(url.toString(), { headers: { 'Accept': 'application/json' } });
          const payload = await res.json().catch(() => ({}));

          if (!res.ok || !payload.ok) {
            clearSummary();
            const remaining = Number.isFinite(Number(payload.remaining_attempts))
              ? Number(payload.remaining_attempts)
              : null;
            const max = Number.isFinite(Number(payload.max_attempts))
              ? Number(payload.max_attempts)
              : null;
            const retryAfter = Number.isFinite(Number(payload.retry_after_seconds))
              ? Number(payload.retry_after_seconds)
              : null;

            let extra = '';
            if (remaining !== null && max !== null) {
              extra += ` Intentos restantes: ${remaining}/${max}.`;
            }
            if (retryAfter !== null && retryAfter > 0) {
              extra += ` Reintenta en ${Math.ceil(retryAfter / 60)} min.`;
            }

            setMessage((payload.message || 'No se pudo consultar la solicitud.') + extra, true);
            return;
          }

          projectField.value = payload.project_name || '-';
          titleField.value = payload.title || '-';
          providerSubtotalField.value = money(payload.provider_subtotal);
          providerSubtotalIvaField.value = money(payload.provider_subtotal_with_iva);
          partialBadgeBox.style.display = payload.allows_partial_invoicing ? 'block' : 'none';
          box.style.display = 'block';
          setMessage('Solicitud encontrada. Verifica los montos de tu proveedor antes de enviar la factura.');
        } catch (error) {
          clearSummary();
          setMessage('No se pudo consultar la solicitud en este momento.', true);
        } finally {
          lookupBtn.disabled = false;
        }
      };

      lookupBtn?.addEventListener('click', loadSummary);
      rcInput?.addEventListener('blur', () => {
        if ((rcInput.value || '').trim() !== '') {
          loadSummary();
        }
      });

      if ((rcInput?.value || '').trim() !== '') {
        loadSummary();
      }
    })();
  </script>
@endpush