@extends('layouts.app')

@section('title', 'Import Schools')

@section('content')
    <div class="d-flex flex-wrap justify-content-between align-items-center mb-4">
        <div>
            <h4 class="mb-1">Import Schools</h4>
            <p class="text-muted mb-0">Download the template, fill your data, and upload to preview before inserting.</p>
        </div>
        <div class="d-flex gap-2">
            <a href="{{ route('schools.import.template') }}" class="btn btn-outline-secondary">
                <i class="icon-base ti tabler-download me-1"></i>
                Download Excel Template (CSV)
            </a>
            <a href="{{ route('schools.index') }}" class="btn btn-outline-secondary">Back</a>
        </div>
    </div>

    @include('partials.alerts')

    <div class="card mb-4">
        <div class="card-body">
            <form action="{{ route('schools.import.upload') }}" method="post" enctype="multipart/form-data" class="row g-3">
                @csrf
                <div class="col-md-6">
                    <label class="form-label">Upload File (CSV)</label>
                    <input type="file" name="file" accept=".csv,text/csv" class="form-control" required>
                    <small class="text-muted">Use the template columns exactly. Max 2MB. CSV (Excel: Save As "CSV UTF-8").</small>
                </div>
                <div class="col-md-6 d-flex align-items-end">
                    <button class="btn btn-primary" type="submit">
                        <i class="icon-base ti tabler-upload me-1"></i>
                        Upload & Preview
                    </button>
                </div>
            </form>
        </div>
    </div>

    @if(!empty($errorsRows))
        <div class="alert alert-warning">
            <strong>Some rows have issues:</strong>
            <ul class="mb-0 ps-3">
                @foreach($errorsRows as $item)
                    <li>Row {{ $item['row'] }}: {{ $item['error'] }}</li>
                @endforeach
            </ul>
        </div>
    @endif

    @if(!empty($preview))
        <div class="card">
            <div class="card-header d-flex justify-content-between align-items-center">
                <h5 class="mb-0">Preview</h5>
                <form method="post" action="{{ route('schools.import.store') }}">
                    @csrf
                    @foreach($preview as $idx => $row)
                        <input type="hidden" name="rows[{{ $idx }}][name]" value="{{ $row['name'] }}">
                        <input type="hidden" name="rows[{{ $idx }}][contact_number]" value="{{ $row['contact_number'] }}">
                        <input type="hidden" name="rows[{{ $idx }}][contact_email]" value="{{ $row['contact_email'] }}">
                    @endforeach
                    <button type="submit" class="btn btn-success">
                        <i class="icon-base ti tabler-check me-1"></i>
                        Submit All
                    </button>
                </form>
            </div>
            <div class="table-responsive">
                <table class="table table-hover mb-0">
                    <thead>
                    <tr>
                        <th>Name</th>
                        <th>Contact</th>
                        <th>Email</th>
                    </tr>
                    </thead>
                    <tbody>
                    @foreach($preview as $row)
                        <tr>
                            <td class="fw-medium">{{ $row['name'] }}</td>
                            <td>{{ $row['contact_number'] }}</td>
                            <td>{{ $row['contact_email'] }}</td>
                        </tr>
                    @endforeach
                    </tbody>
                </table>
            </div>
            <div class="card-footer text-muted">
                {{ count($preview) }} row(s) ready to insert.
            </div>
        </div>
    @endif
@endsection