@extends('admin.layout.app')

@section('body')
<div class="d-flex flex-column flex-md-row justify-content-between align-items-md-center gap-3 mb-4">
    <div>
        <h3 class="fw-bold mb-1">Import Center</h3>
        <p class="text-muted mb-0">Download the correct Excel template, fill it offline, then upload it for validated bulk import.</p>
    </div>
</div>

@if(session('success'))
    <div class="alert alert-success">{{ session('success') }}</div>
@endif
@if(session('error'))
    <div class="alert alert-danger">{{ session('error') }}</div>
@endif
@if($errors->any())
    <div class="alert alert-danger">
        <strong>Import could not start.</strong>
        <ul class="mb-0 mt-2">
            @foreach($errors->all() as $error)
                <li>{{ $error }}</li>
            @endforeach
        </ul>
    </div>
@endif

@if($result)
    <div class="card border-0 shadow-sm rounded-4 mb-4">
        <div class="card-body p-4">
            <div class="d-flex flex-wrap justify-content-between gap-3 align-items-start">
                <div>
                    <h5 class="fw-bold mb-1">Last Import Result: {{ $result['table'] ?? 'Table' }}</h5>
                    <p class="text-muted mb-0">Review created, skipped, and failed rows before importing another file.</p>
                </div>
                <div class="d-flex flex-wrap gap-2">
                    <span class="badge bg-success px-3 py-2">Created: {{ $result['created'] ?? 0 }}</span>
                    <span class="badge bg-warning text-dark px-3 py-2">Skipped: {{ $result['skipped'] ?? 0 }}</span>
                    <span class="badge bg-danger px-3 py-2">Failed: {{ $result['failed'] ?? 0 }}</span>
                </div>
            </div>

            @if(!empty($result['errors']))
                <div class="table-responsive mt-4">
                    <table class="table table-sm align-middle">
                        <thead class="table-light">
                            <tr>
                                <th style="width:120px">Excel Row</th>
                                <th>Message</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($result['errors'] as $error)
                                <tr>
                                    <td>{{ $error['row'] }}</td>
                                    <td>
                                        @foreach($error['messages'] as $message)
                                            <div>{{ $message }}</div>
                                        @endforeach
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            @endif
        </div>
    </div>
@endif

<div class="row g-4">
    @foreach($tables as $key => $definition)
        <div class="col-xl-6">
            <div class="card border-0 shadow-sm rounded-4 h-100">
                <div class="card-body p-4">
                    <div class="d-flex justify-content-between gap-3 mb-3">
                        <div>
                            <h5 class="fw-bold mb-1">{{ $definition['label'] }}</h5>
                            <p class="text-muted small mb-0">{{ $definition['description'] }}</p>
                        </div>
                        <span class="badge bg-primary-subtle text-primary border border-primary-subtle align-self-start">
                            {{ count($definition['fields']) }} columns
                        </span>
                    </div>

                    <div class="d-flex flex-wrap gap-2 mb-3">
                        @foreach($definition['fields'] as $name => $field)
                            <span class="badge {{ !empty($field['required']) ? 'bg-danger' : 'bg-light text-dark border' }}">
                                {{ $name }}{{ !empty($field['required']) ? ' *' : '' }}
                            </span>
                        @endforeach
                    </div>

                    <div class="d-flex flex-column flex-lg-row gap-2">
                        <a href="{{ route('admin.imports.template', $key) }}" class="btn btn-outline-success">
                            <i class="fas fa-file-excel me-1"></i> Download Template
                        </a>
                        <form method="POST" action="{{ route('admin.imports.store') }}" enctype="multipart/form-data" class="d-flex flex-column flex-sm-row gap-2 flex-grow-1">
                            @csrf
                            <input type="hidden" name="table" value="{{ $key }}">
                            <input type="file" name="file" class="form-control" accept=".xlsx,.csv,.txt" required>
                            <button class="btn btn-primary">
                                <i class="fas fa-upload me-1"></i> Import
                            </button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    @endforeach
</div>
@endsection