@extends('layouts.app')

@section('content')
    <!-- Customer Migration Section -->
    <div class="section">
        <h2>👥 Customer Migration</h2>
        <div class="info-box" style="margin-bottom: 20px;">
            <h3 style="margin-bottom: 10px; color: #1976D2; font-size: 1.1em;">What happens when you click "Start Customer Migration"?</h3>
            <p style="margin: 5px 0; color: #1976D2;">The customer migration process will:</p>
            <ul style="margin: 10px 0 0 20px; color: #1976D2; line-height: 1.8;">
                <li><strong>Create new customers:</strong> If a customer with the same email doesn't exist in Magento 2, it will be created with all its attributes</li>
                <li><strong>Update existing customers:</strong> If a customer with the same email already exists in Magento 2, it will be updated with the latest data from Magento 1</li>
                <li><strong>Migrate customer attributes:</strong> All customer attributes including email, firstname, lastname, and other custom attributes will be migrated</li>
                <li><strong>Preserve customer data:</strong> Website ID, group ID, and timestamps will be preserved</li>
                <li><strong>Generate logs:</strong> Detailed migration logs showing which customers were added, updated, or encountered errors</li>
            </ul>
            <p style="margin: 10px 0 0 0; color: #d32f2f; font-weight: 600;">⚠️ <strong>Warning:</strong> This will modify your Magento 2 database. Make sure you have a backup before proceeding.</p>
        </div>
        
        <div style="margin-top: 20px; display: flex; gap: 15px; flex-wrap: wrap;">
            <button id="dryRunCustomerMigrationBtn" class="btn btn-secondary" onclick="startCustomerMigration(true)">
                Run Dry Run (Check for Errors)
            </button>
            <button id="startCustomerMigrationBtn" class="btn btn-primary" onclick="startCustomerMigration(false)">
                Start Customer Migration
            </button>
        </div>
    </div>

    <!-- Migration Logs Section -->
    <div class="section" style="margin-top: 30px;">
        <h2>📋 Customer Migration Logs</h2>
        <p style="margin-bottom: 15px; color: #666;">Detailed logs showing which customers were added, updated, or encountered errors during migration:</p>
        <div class="log-container" id="customerMigrationLogContainer" style="display: block;">
            <div id="customerMigrationLogContent">
                <div class="log-entry" style="color: #999; font-style: italic;">
                    No customer migration logs yet. Click "Run Dry Run" or "Start Customer Migration" to begin.
                </div>
            </div>
        </div>
    </div>

    <!-- Customer Statistics -->
    <div class="section" style="margin-top: 30px;">
        <h2>📊 Customer Statistics</h2>
        <div class="stats">
            <div class="stat-card">
                <div class="number">{{ $m1Customers->count() }}</div>
                <div class="label">Magento 1 Customers</div>
            </div>
            <div class="stat-card">
                <div class="number">{{ $m2Customers->count() }}</div>
                <div class="label">Magento 2 Customers</div>
            </div>
            <div class="stat-card">
                <div class="number">{{ $m1CustomersNotInM2->count() }}</div>
                <div class="label">M1 Customers Not in M2</div>
            </div>
            <div class="stat-card">
                <div class="number">{{ $m2CustomersNotInM1->count() }}</div>
                <div class="label">M2 Customers Not in M1</div>
            </div>
        </div>
    </div>

    <!-- Customers Not in M2 Section -->
    @if($m1CustomersNotInM2->count() > 0)
    <div class="section" style="margin-top: 30px;">
        <h2>⚠️ Magento 1 Customers Not in Magento 2</h2>
        <p>These customers exist in Magento 1 but are missing in Magento 2:</p>
        <div style="background: white; border: 1px solid #ddd; border-radius: 6px; padding: 20px; max-height: 400px; overflow-y: auto; margin-top: 15px;">
            <table class="products-table">
                <thead>
                    <tr>
                        <th>ID</th>
                        <th>Email</th>
                        <th>First Name</th>
                        <th>Last Name</th>
                        <th>Website ID</th>
                        <th>Group ID</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($m1CustomersNotInM2->take(50) as $customer)
                        <tr>
                            <td>{{ $customer->entity_id }}</td>
                            <td>{{ $customer->email ?? 'N/A' }}</td>
                            <td>{{ $customer->firstname ?? 'N/A' }}</td>
                            <td>{{ $customer->lastname ?? 'N/A' }}</td>
                            <td>{{ $customer->website_id ?? 'N/A' }}</td>
                            <td>{{ $customer->group_id ?? 'N/A' }}</td>
                        </tr>
                    @endforeach
                </tbody>
            </table>
            @if($m1CustomersNotInM2->count() > 50)
                <p style="margin-top: 15px; color: #666;">Showing first 50 of {{ $m1CustomersNotInM2->count() }} customers.</p>
            @endif
        </div>
    </div>
    @endif

    <!-- Customers Not in M1 Section -->
    @if($m2CustomersNotInM1->count() > 0)
    <div class="section" style="margin-top: 30px;">
        <h2>⚠️ Magento 2 Customers Not in Magento 1</h2>
        <p>These customers exist in Magento 2 but are missing in Magento 1:</p>
        <div style="background: white; border: 1px solid #ddd; border-radius: 6px; padding: 20px; max-height: 400px; overflow-y: auto; margin-top: 15px;">
            <table class="products-table">
                <thead>
                    <tr>
                        <th>ID</th>
                        <th>Email</th>
                        <th>First Name</th>
                        <th>Last Name</th>
                        <th>Website ID</th>
                        <th>Group ID</th>
                        <th>Actions</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($m2CustomersNotInM1->take(50) as $customer)
                        <tr>
                            <td>{{ $customer->entity_id }}</td>
                            <td>{{ $customer->email ?? 'N/A' }}</td>
                            <td>{{ $customer->firstname ?? 'N/A' }}</td>
                            <td>{{ $customer->lastname ?? 'N/A' }}</td>
                            <td>{{ $customer->website_id ?? 'N/A' }}</td>
                            <td>{{ $customer->group_id ?? 'N/A' }}</td>
                            <td>
                                <button 
                                    class="btn btn-danger" 
                                    onclick="deleteM2Customer({{ $customer->entity_id }}, '{{ addslashes($customer->email ?? 'N/A') }}', '{{ addslashes($customer->firstname ?? 'N/A') }}', '{{ addslashes($customer->lastname ?? 'N/A') }}')"
                                    style="padding: 6px 12px; font-size: 0.85em;">
                                    Delete
                                </button>
                            </td>
                        </tr>
                    @endforeach
                </tbody>
            </table>
            @if($m2CustomersNotInM1->count() > 50)
                <p style="margin-top: 15px; color: #666;">Showing first 50 of {{ $m2CustomersNotInM1->count() }} customers.</p>
            @endif
        </div>
    </div>
    @endif
@endsection

{{-- CSS is loaded globally via app.css --}}

@push('scripts')
    @vite(['resources/js/customers.js'])
    <script>
        window.customerRoutes = {
            migrateCustomers: '{{ route("customers.migrate-customers") }}',
            deleteCustomer: '{{ route("customers.delete-customer", ["customerId" => ":id"]) }}'
        };
    </script>
@endpush