@extends('layouts.app')

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

@section('content')
<div class="text-center mb-8">
    @if($result['status'] === 'success')
        <!-- Success Icon -->
        <div class="mx-auto flex items-center justify-center h-20 w-20 rounded-full bg-green-100 dark:bg-green-900 mb-4">
            <svg class="h-12 w-12 text-green-600 dark:text-green-400" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
            </svg>
        </div>
        <h1 class="text-2xl font-bold text-gray-900 dark:text-white">Import Completed Successfully</h1>
        <p class="mt-2 text-gray-600 dark:text-gray-400">Your file was imported into the system.</p>
    @else
        <!-- Error Icon -->
        <div class="mx-auto flex items-center justify-center h-20 w-20 rounded-full bg-red-100 dark:bg-red-900 mb-4">
            <svg class="h-12 w-12 text-red-600 dark:text-red-400" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z" />
            </svg>
        </div>
        <h1 class="text-2xl font-bold text-gray-900 dark:text-white">Import Failed</h1>
        <p class="mt-2 text-gray-600 dark:text-gray-400">There was an issue importing your file.</p>
    @endif
</div>

<div class="card mb-8">
    <h2 class="text-lg font-medium text-gray-900 dark:text-white mb-4">Import Summary</h2>

    <dl class="divide-y divide-gray-200 dark:divide-gray-700">
        <div class="py-3 grid grid-cols-3">
            <dt class="text-sm font-medium text-gray-500 dark:text-gray-400">File Name</dt>
            <dd class="text-sm text-gray-900 dark:text-white col-span-2">{{ $filename }}</dd>
        </div>

        <div class="py-3 grid grid-cols-3">
            <dt class="text-sm font-medium text-gray-500 dark:text-gray-400">Status</dt>
            <dd class="text-sm col-span-2">
                @if($result['status'] === 'success')
                    <span class="text-green-600 dark:text-green-400 font-medium">Success</span>
                @else
                    <span class="text-red-600 dark:text-red-400 font-medium">Failed</span>
                @endif
            </dd>
        </div>

        <div class="py-3 grid grid-cols-3">
            <dt class="text-sm font-medium text-gray-500 dark:text-gray-400">Rows Processed</dt>
            <dd class="text-sm text-gray-900 dark:text-white col-span-2">{{ $result['rows_processed'] }}</dd>
        </div>

        <div class="py-3 grid grid-cols-3">
            <dt class="text-sm font-medium text-gray-500 dark:text-gray-400">Message</dt>
            <dd class="text-sm text-gray-900 dark:text-white col-span-2">{{ $result['message'] }}</dd>
        </div>

        <div class="py-3 grid grid-cols-3">
            <dt class="text-sm font-medium text-gray-500 dark:text-gray-400">Date & Time</dt>
            <dd class="text-sm text-gray-900 dark:text-white col-span-2">{{ now()->format('F j, Y \a\t g:i a') }}</dd>
        </div>
    </dl>
</div>

@if($result['status'] === 'success')
    <!-- Success Tips -->
    <div class="bg-green-50 dark:bg-green-900 rounded-lg p-4 border border-green-200 dark:border-green-800 mb-6">
        <h3 class="text-sm font-medium text-green-800 dark:text-green-200 mb-2">Next Steps</h3>
        <ul class="text-sm text-green-700 dark:text-green-300 space-y-1 ml-5 list-disc">
            <li>Your data has been successfully imported into the system.</li>
            <li>You can now use this data for reporting and analysis.</li>
            <li>If you need to make changes, you can edit the records directly in the system.</li>
        </ul>
    </div>
@else
    <!-- Error Tips -->
    <div class="bg-red-50 dark:bg-red-900 rounded-lg p-4 border border-red-200 dark:border-red-800 mb-6">
        <h3 class="text-sm font-medium text-red-800 dark:text-red-200 mb-2">Troubleshooting</h3>
        <ul class="text-sm text-red-700 dark:text-red-300 space-y-1 ml-5 list-disc">
            <li>Check that your Excel file is properly formatted.</li>
            <li>Make sure the column names match the headers in your Excel file.</li>
            <li>Try uploading a smaller file if the current one is too large.</li>
            <li>Contact support if you continue to experience issues.</li>
        </ul>
    </div>
@endif

<div class="flex justify-center">
    <a href="{{ route('excel.import.index') }}" class="btn btn-primary">
        <svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 mr-1" fill="none" viewBox="0 0 24 24" stroke="currentColor">
            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 17l-5-5m0 0l5-5m-5 5h12" />
        </svg>
        Back to Import
    </a>
</div>
@endsection