@extends('layouts.superadmin')

@section('title', 'Bulk Excel & CSV Data Import')

@section('content')
<!-- Header Banner -->
<div style="display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; margin-bottom: 2rem;">
  <div>
    <h1 style="font-size: 1.6rem; font-family: var(--font-heading); margin: 0 0 0.35rem; color: #fff;">
      <i class="fas fa-file-import" style="color: #F59E0B; margin-right: 0.5rem;"></i> Bulk Excel & CSV Import Desk
    </h1>
    <p style="margin: 0; font-size: 0.9rem; color: #94A3B8;">
      Batch ingest statewide candidates, corporate employer directories, and vacancy requisitions with automatic column mapping, validation checkpoints, and downloadable diagnostic error reports.
    </p>
  </div>
</div>

@if(session('success'))
  <div class="alert alert-success" style="padding: 1rem 1.25rem; border-radius: var(--radius-md); background: rgba(16, 185, 129, 0.15); color: #10B981; border: 1px solid rgba(16, 185, 129, 0.3); margin-bottom: 1.5rem; display: flex; align-items: center; gap: 0.75rem;">
    <i class="fas fa-check-circle" style="font-size: 1.25rem;"></i>
    <div>{{ session('success') }}</div>
  </div>
@endif

@if(session('error'))
  <div class="alert alert-danger" style="padding: 1rem 1.25rem; border-radius: var(--radius-md); background: rgba(239, 68, 68, 0.15); color: #EF4444; border: 1px solid rgba(239, 68, 68, 0.3); margin-bottom: 1.5rem; display: flex; align-items: center; gap: 0.75rem;">
    <i class="fas fa-exclamation-triangle" style="font-size: 1.25rem;"></i>
    <div>{{ session('error') }}</div>
  </div>
@endif

@if($errors->any())
  <div class="alert alert-danger" style="padding: 1rem 1.25rem; border-radius: var(--radius-md); background: rgba(239, 68, 68, 0.15); color: #EF4444; border: 1px solid rgba(239, 68, 68, 0.3); margin-bottom: 1.5rem;">
    <strong style="display: block; margin-bottom: 0.5rem;"><i class="fas fa-exclamation-triangle"></i> Upload could not proceed:</strong>
    <ul style="margin: 0; padding-left: 1.25rem;">
      @foreach($errors->all() as $err)
        <li>{{ $err }}</li>
      @endforeach
    </ul>
  </div>
@endif

<!-- Upload Ingestion Card -->
<div class="superadmin-card" style="margin-bottom: 2rem;">
  <h2 style="font-size: 1.2rem; color: #fff; margin: 0 0 0.5rem; font-family: var(--font-heading);">
    <i class="fas fa-cloud-arrow-up" style="color: #38BDF8; margin-right: 0.5rem;"></i> New Ingestion Stream
  </h2>
  <p style="font-size: 0.88rem; color: #94A3B8; margin: 0 0 1.5rem;">
    Select the target entity type and upload your CSV or Excel exported comma/tab-delimited file.
  </p>

  <form action="{{ route('superadmin.bulk-imports.upload') }}" method="POST" enctype="multipart/form-data">
    @csrf

    <div style="margin-bottom: 1.5rem;">
      <label style="display: block; font-size: 0.85rem; font-weight: 600; color: #CBD5E1; margin-bottom: 0.75rem;">
        1. Select Target Ingestion Entity <span style="color: #EF4444;">*</span>
      </label>
      <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1rem;">
        <label style="display: flex; align-items: flex-start; gap: 0.75rem; padding: 1rem; border-radius: var(--radius-md); border: 1px solid rgba(255, 255, 255, 0.1); background: #0B111E; cursor: pointer; transition: all 0.2s ease;">
          <input type="radio" name="entity_type" value="candidates" checked style="margin-top: 3px; accent-color: #F59E0B;">
          <div>
            <strong style="color: #fff; display: block; font-size: 0.95rem;">
              <i class="fas fa-user-graduate" style="color: #F59E0B; margin-right: 0.35rem;"></i> Candidate Registry
            </strong>
            <span style="font-size: 0.8rem; color: #94A3B8; display: block; margin-top: 2px;">
              Jobseeker profiles, emails, phone numbers, districts, and passwords.
            </span>
          </div>
        </label>

        <label style="display: flex; align-items: flex-start; gap: 0.75rem; padding: 1rem; border-radius: var(--radius-md); border: 1px solid rgba(255, 255, 255, 0.1); background: #0B111E; cursor: pointer; transition: all 0.2s ease;">
          <input type="radio" name="entity_type" value="employers" {{ old('entity_type') === 'employers' ? 'checked' : '' }} style="margin-top: 3px; accent-color: #38BDF8;">
          <div>
            <strong style="color: #fff; display: block; font-size: 0.95rem;">
              <i class="fas fa-building" style="color: #38BDF8; margin-right: 0.35rem;"></i> Enterprise Employers
            </strong>
            <span style="font-size: 0.8rem; color: #94A3B8; display: block; margin-top: 2px;">
              Company names, GSTIN, PAN numbers, contacts, and industry sectors.
            </span>
          </div>
        </label>

        <label style="display: flex; align-items: flex-start; gap: 0.75rem; padding: 1rem; border-radius: var(--radius-md); border: 1px solid rgba(255, 255, 255, 0.1); background: #0B111E; cursor: pointer; transition: all 0.2s ease;">
          <input type="radio" name="entity_type" value="vacancies" {{ old('entity_type') === 'vacancies' ? 'checked' : '' }} style="margin-top: 3px; accent-color: #10B981;">
          <div>
            <strong style="color: #fff; display: block; font-size: 0.95rem;">
              <i class="fas fa-briefcase" style="color: #10B981; margin-right: 0.35rem;"></i> Job Vacancy Requisitions
            </strong>
            <span style="font-size: 0.8rem; color: #94A3B8; display: block; margin-top: 2px;">
              Positions, vacancies count, salary scales, requirements, and job districts.
            </span>
          </div>
        </label>
      </div>
    </div>

    <div style="margin-bottom: 1.5rem;">
      <label style="display: block; font-size: 0.85rem; font-weight: 600; color: #CBD5E1; margin-bottom: 0.5rem;">
        2. Choose Data File (.CSV or .TXT) <span style="color: #EF4444;">*</span>
      </label>
      <input type="file" name="file" accept=".csv,.txt" required 
             style="width: 100%; padding: 0.75rem 1rem; background: #0B111E; border: 1px dashed rgba(255, 255, 255, 0.2); border-radius: var(--radius-md); color: #CBD5E1; font-size: 0.9rem; cursor: pointer;">
      <div style="display: flex; justify-content: space-between; align-items: center; margin-top: 0.5rem; font-size: 0.78rem; color: #94A3B8;">
        <span>Max file size: 10MB. UTF-8 BOM encoding supported.</span>
        <span>Headers should appear on row 1.</span>
      </div>
    </div>

    <!-- Instructions Callout -->
    <div style="padding: 1rem 1.25rem; border-radius: var(--radius-md); background: rgba(56, 189, 248, 0.08); border: 1px solid rgba(56, 189, 248, 0.2); margin-bottom: 1.5rem; font-size: 0.85rem; color: #CBD5E1;">
      <strong style="color: #38BDF8; display: flex; align-items: center; gap: 0.4rem; margin-bottom: 0.35rem;">
        <i class="fas fa-info-circle"></i> High-Throughput Processing Guarantee
      </strong>
      All records are parsed, scrubbed against existing email duplicates, validated, and safely committed in isolated 50-row chunks. Any invalid rows are flagged with line numbers and rejected gracefully without halting valid records.
    </div>

    <button type="submit" class="btn" style="background: #F59E0B; color: #000; font-weight: 700; padding: 0.75rem 1.75rem; font-size: 0.95rem;">
      <i class="fas fa-arrow-right"></i> Upload & Map Columns
    </button>
  </form>
</div>

<!-- Past Imports History -->
<div class="superadmin-card" style="padding: 0; overflow: hidden;">
  <div style="padding: 1.25rem 1.5rem; border-bottom: 1px solid rgba(255, 255, 255, 0.08);">
    <h3 style="font-size: 1.15rem; color: #fff; margin: 0 0 0.25rem; font-family: var(--font-heading);">
      <i class="fas fa-clock-rotate-left" style="color: #F59E0B; margin-right: 0.4rem;"></i> Historical Ingestion Audit Trail
    </h3>
    <p style="margin: 0; font-size: 0.82rem; color: #94A3B8;">
      Audit log of bulk uploads, processed rows, and validation diagnostic reports.
    </p>
  </div>

  <div class="table-responsive">
    <table style="width: 100%; border-collapse: collapse; font-size: 0.88rem; text-align: left;">
      <thead>
        <tr style="border-bottom: 1px solid rgba(255, 255, 255, 0.08); background: rgba(255, 255, 255, 0.02); color: #94A3B8;">
          <th style="padding: 1rem 1.25rem;">ID</th>
          <th style="padding: 1rem 1.25rem;">Target Entity</th>
          <th style="padding: 1rem 1.25rem;">Source File</th>
          <th style="padding: 1rem 1.25rem;">Total</th>
          <th style="padding: 1rem 1.25rem;">Committed</th>
          <th style="padding: 1rem 1.25rem;">Errors</th>
          <th style="padding: 1rem 1.25rem;">Status</th>
          <th style="padding: 1rem 1.25rem;">Initiated By</th>
          <th style="padding: 1rem 1.25rem; text-align: right;">Action</th>
        </tr>
      </thead>
      <tbody>
        @forelse($imports as $import)
          <tr style="border-bottom: 1px solid rgba(255, 255, 255, 0.04);">
            <td style="padding: 1rem 1.25rem; font-family: monospace; color: #94A3B8;">
              #{{ $import->id }}
            </td>

            <td style="padding: 1rem 1.25rem;">
              <span class="badge" style="background: rgba(56, 189, 248, 0.15); color: #38BDF8; font-size: 0.75rem; font-weight: 600;">
                {{ $import->entity_type_label }}
              </span>
            </td>

            <td style="padding: 1rem 1.25rem;">
              <strong style="color: #fff; font-size: 0.88rem; display: block;">{{ $import->filename }}</strong>
              <span style="color: #64748B; font-size: 0.78rem;">{{ $import->created_at->format('d M Y, h:i A') }}</span>
            </td>

            <td style="padding: 1rem 1.25rem; color: #CBD5E1; font-weight: 600;">
              {{ number_format($import->total_rows) }}
            </td>

            <td style="padding: 1rem 1.25rem; color: #10B981; font-weight: 600;">
              {{ number_format($import->valid_rows) }}
            </td>

            <td style="padding: 1rem 1.25rem; color: {{ $import->error_rows > 0 ? '#EF4444' : '#64748B' }}; font-weight: 600;">
              {{ number_format($import->error_rows) }}
            </td>

            <td style="padding: 1rem 1.25rem;">
              @php
                $badgeStyles = [
                  'pending_preview' => 'background: rgba(245, 158, 11, 0.15); color: #F59E0B;',
                  'processing' => 'background: rgba(56, 189, 248, 0.15); color: #38BDF8;',
                  'completed' => 'background: rgba(16, 185, 129, 0.15); color: #10B981;',
                  'failed' => 'background: rgba(239, 68, 68, 0.15); color: #EF4444;',
                ];
              @endphp
              <span class="badge" style="{{ $badgeStyles[$import->status] ?? 'background: rgba(255, 255, 255, 0.1); color: #CBD5E1;' }} font-size: 0.75rem; text-transform: uppercase;">
                {{ $import->status_badge }}
              </span>
            </td>

            <td style="padding: 1rem 1.25rem; color: #94A3B8; font-size: 0.82rem;">
              {{ $import->user->name ?? 'System' }}
            </td>

            <td style="padding: 1rem 1.25rem; text-align: right; white-space: nowrap;">
              @if($import->status === 'pending_preview')
                <a href="{{ route('superadmin.bulk-imports.preview', $import->id) }}" class="btn btn-sm" style="background: #F59E0B; color: #000; font-size: 0.78rem; font-weight: 700;">
                  <i class="fas fa-arrow-right"></i> Map
                </a>
              @else
                <a href="{{ route('superadmin.bulk-imports.report', $import->id) }}" class="btn btn-sm btn-outline" style="font-size: 0.78rem; padding: 0.35rem 0.65rem; margin-right: 0.25rem;">
                  <i class="fas fa-chart-pie"></i> Report
                </a>
                @if($import->error_rows > 0)
                  <a href="{{ route('superadmin.bulk-imports.download-errors', $import->id) }}" class="btn btn-sm" style="background: rgba(239, 68, 68, 0.15); color: #EF4444; border: 1px solid rgba(239, 68, 68, 0.3); font-size: 0.78rem; padding: 0.35rem 0.65rem;">
                    <i class="fas fa-download"></i> Errors
                  </a>
                @endif
              @endif
            </td>
          </tr>
        @empty
          <tr>
            <td colspan="9" style="text-align: center; padding: 3rem; color: #64748B;">
              No bulk import operations have been recorded yet.
            </td>
          </tr>
        @endforelse
      </tbody>
    </table>
  </div>

  @if($imports->hasPages())
    <div style="padding: 1rem 1.5rem; border-top: 1px solid rgba(255, 255, 255, 0.08);">
      {{ $imports->links() }}
    </div>
  @endif
</div>
@endsection