@extends('layouts.'.env('THEME'))

@section('moreStyle')
<style>
.change-item {
    font-size: 0.9em;
}

.badge {
    font-size: 0.75em;
}

.update-row:hover {
    background-color: #f8f9fa;
}

.changes-summary {
    max-width: 400px;
}

.changes-detail {
    margin-top: 10px;
    padding: 10px;
    background-color: #f8f9fa;
    border-radius: 4px;
    border-left: 4px solid #007bff;
}

.card {
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}

.table th {
    border-top: none;
}

.form-check-input {
    margin-top: 0.25rem;
}
</style>
@endsection

@section('content')
<div class="container-fluid">
    <div class="row my-3">
        <div class="col-12">
            <h3><i class="fas fa-clipboard-check"></i> Review Voucher State Updates</h3>
            <p class="text-muted">
                Please review the proposed changes below before confirming. Only selected updates will be applied to the database.
            </p>
        </div>
    </div>

    <!-- Summary Statistics -->
    <div class="row mb-4">
        <div class="col-md-3">
            <div class="card border-primary">
                <div class="card-body text-center">
                    <h4 class="text-primary">{{ count($pending_updates) }}</h4>
                    <small class="text-muted">Updates Ready</small>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card border-warning">
                <div class="card-body text-center">
                    <h4 class="text-warning">{{ $skipped_count }}</h4>
                    <small class="text-muted">Rows Skipped</small>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card border-info">
                <div class="card-body text-center">
                    <h4 class="text-info">{{ $total_processed }}</h4>
                    <small class="text-muted">Total Processed</small>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card border-success">
                <div class="card-body text-center">
                    <h4 class="text-success" id="selected-count">0</h4>
                    <small class="text-muted">Selected for Update</small>
                </div>
            </div>
        </div>
    </div>

    @if(count($pending_updates) > 0)
        {!! Form::open([
            'url' => 'voucher/voucher_state_csv_execute',
            'id' => 'confirm_updates_form',
            'method' => 'POST'
        ]) !!}

        <!-- Bulk Actions -->
        <div class="row mb-3">
            <div class="col-12">
                <div class="card">
                    <div class="card-body">
                        <div class="d-flex justify-content-between align-items-center">
                            <div>
                                <button type="button" class="btn btn-outline-primary btn-sm" id="select-all">
                                    <i class="fas fa-check-square"></i> Select All
                                </button>
                                <button type="button" class="btn btn-outline-secondary btn-sm" id="deselect-all">
                                    <i class="fas fa-square"></i> Deselect All
                                </button>
                                <button type="button" class="btn btn-outline-info btn-sm" id="toggle-details">
                                    <i class="fas fa-eye"></i> Toggle Details
                                </button>
                            </div>
                            <div>
                                <button type="submit" class="btn btn-success" id="confirm-updates" disabled>
                                    <i class="fas fa-check"></i> Confirm Selected Updates
                                </button>
                                <a href="/voucher" class="btn btn-secondary">
                                    <i class="fas fa-times"></i> Cancel
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- Updates Table -->
        <div class="row">
            <div class="col-12">
                <div class="card">
                    <div class="card-header">
                        <h5 class="mb-0">Pending Updates</h5>
                    </div>
                    <div class="card-body p-0">
                        <div class="table-responsive">
                            <table class="table table-striped table-hover mb-0">
                                <thead class="table-primary">
                                    <tr>
                                        <th width="50">
                                            <input type="checkbox" id="master-checkbox" class="form-check-input">
                                        </th>
                                        <th>Lead ID</th>
                                        <th>Customer Email</th>
                                        <th>Order #</th>
                                        <th>Match Method</th>
                                        <th>Changes</th>
                                        <th width="100">Actions</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach($pending_updates as $index => $update)
                                        <tr class="update-row" data-index="{{ $index }}">
                                            <td>
                                                <input type="checkbox" 
                                                       name="selected_updates[]" 
                                                       value="{{ $index }}" 
                                                       class="form-check-input update-checkbox">
                                            </td>
                                            <td>
                                                <strong>{{ $update['lead_id'] }}</strong>
                                            </td>
                                            <td>
                                                <span class="text-primary">{{ $update['customer_email'] }}</span>
                                            </td>
                                            <td>
                                                {{ $update['order_number'] ?? 'N/A' }}
                                            </td>
                                            <td>
                                                {{ $update['match_method'] ?? 'N/A' }}
                                            </td>
                                            <td>
                                                <div class="changes-summary">
                                                    @foreach($update['changes'] as $field => $change)
                                                        <div class="change-item mb-1">
                                                            <strong>{{ ucfirst(str_replace('_', ' ', $field)) }}:</strong>
                                                            <span class="badge badge-danger">{{ $change['current'] ?? 'NULL' }}</span>
                                                            <i class="fas fa-arrow-right mx-1"></i>
                                                            <span class="badge badge-success">{{ $change['new'] }}</span>
                                                        </div>
                                                    @endforeach
                                                </div>
                                                
                                                <!-- Detailed view (hidden by default) -->
                                                <div class="changes-detail" style="display: none;">
                                                    <small class="text-muted">
                                                        <strong>Current Values:</strong><br>
                                                        @foreach($update['changes'] as $field => $change)
                                                            • {{ ucfirst(str_replace('_', ' ', $field)) }}: {{ $change['current'] ?? 'NULL' }}<br>
                                                        @endforeach
                                                        <br>
                                                        <strong>New Values:</strong><br>
                                                        @foreach($update['changes'] as $field => $change)
                                                            • {{ ucfirst(str_replace('_', ' ', $field)) }}: {{ $change['new'] }}<br>
                                                        @endforeach
                                                    </small>
                                                </div>
                                            </td>
                                            <td>
                                                <button type="button" 
                                                        class="btn btn-sm btn-outline-info toggle-row-details"
                                                        data-index="{{ $index }}">
                                                    <i class="fas fa-eye"></i>
                                                </button>
                                            </td>
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        {!! Form::close() !!}
    @else
        <div class="row">
            <div class="col-12">
                <div class="alert alert-info">
                    <h4><i class="fas fa-info-circle"></i> No Updates Required</h4>
                    <p>No lead updates are needed based on the uploaded CSV file. All data is already up to date.</p>
                    <a href="/voucher" class="btn btn-primary">Return to Voucher Management</a>
                </div>
            </div>
        </div>
    @endif

    <!-- Skipped Rows Information -->
    @if($skipped_count > 0)
        <div class="row mt-4">
            <div class="col-12">
                <div class="card border-warning">
                    <div class="card-header">
                        <h5 class="mb-0 text-warning">
                            <i class="fas fa-exclamation-triangle"></i> Skipped Rows ({{ $skipped_count }})
                        </h5>
                        <small class="text-muted">Detailed debugging information for troubleshooting CSV data issues</small>
                    </div>
                    <div class="card-body">
                        <div class="alert alert-warning" role="alert">
                            <a href="#" class="alert-link" id="toggle-skipped-report">
                                Click to see detailed debugging information for skipped rows <i class="fas fa-angle-down"></i>
                            </a>
                        </div>
                        <div id="skipped-report" style="display: none;">
                            <div class="table-responsive">
                                <table class="table table-sm table-bordered">
                                    <thead class="table-warning">
                                        <tr>
                                            <th>Row #</th>
                                            <th>Error Type</th>
                                            <th>Customer Email</th>
                                            <th>Order Number</th>
                                            <th>Voucher Name</th>
                                            <th>Voucher Status</th>
                                            <th>Voucher Created</th>
                                            <th>Error Details</th>
                                            <th>Raw CSV Data</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach($skip_reasons as $key => $val)
                                            @if(!empty($val['error']))
                                                @php
                                                    // Parse error message to determine error type
                                                    $error_type = 'Unknown';
                                                    $error_details = $val['info'];
                                                    
                                                    if (strpos($error_details, 'User not found') !== false) {
                                                        $error_type = 'User Not Found';
                                                    } elseif (strpos($error_details, 'No lead found') !== false) {
                                                        $error_type = 'Lead Not Found';
                                                    } elseif (strpos($error_details, 'Invalid voucher creation date') !== false) {
                                                        $error_type = 'Invalid Date Format';
                                                    } elseif (strpos($error_details, 'Older voucher entry') !== false) {
                                                        $error_type = 'Older Entry';
                                                    } elseif (strpos($error_details, 'multiple leads') !== false) {
                                                        $error_type = 'Multiple Leads';
                                                    } elseif (strpos($error_details, 'Missing') !== false) {
                                                        $error_type = 'Missing Data';
                                                    }
                                                    
                                                    // Extract CSV row data if available
                                                    $csv_data = $val['csv_row'] ?? null;
                                                @endphp
                                                <tr>
                                                    <td>
                                                        <span class="badge badge-warning">{{ $key }}</span>
                                                    </td>
                                                    <td>
                                                        <span class="badge badge-danger">{{ $error_type }}</span>
                                                    </td>
                                                    <td>
                                                        @if($csv_data && isset($csv_data['customer_email']))
                                                            <code>{{ $csv_data['customer_email'] }}</code>
                                                        @else
                                                            <span class="text-muted">N/A</span>
                                                        @endif
                                                    </td>
                                                    <td>
                                                        @if($csv_data && isset($csv_data['order_number']))
                                                            <code>{{ $csv_data['order_number'] }}</code>
                                                        @else
                                                            <span class="text-muted">N/A</span>
                                                        @endif
                                                    </td>
                                                    <td>
                                                        @if($csv_data && isset($csv_data['voucher_name']))
                                                            <code>{{ $csv_data['voucher_name'] }}</code>
                                                        @else
                                                            <span class="text-muted">N/A</span>
                                                        @endif
                                                    </td>
                                                    <td>
                                                        @if($csv_data && isset($csv_data['voucher_status']))
                                                            <span class="badge badge-info">{{ $csv_data['voucher_status'] }}</span>
                                                        @else
                                                            <span class="text-muted">N/A</span>
                                                        @endif
                                                    </td>
                                                    <td>
                                                        @if($csv_data && isset($csv_data['voucher_created']))
                                                            <small>{{ $csv_data['voucher_created'] }}</small>
                                                        @else
                                                            <span class="text-muted">N/A</span>
                                                        @endif
                                                    </td>
                                                    <td>
                                                        <div class="text-wrap" style="max-width: 250px;">
                                                            <small class="text-danger">{!! $error_details !!}</small>
                                                        </div>
                                                    </td>
                                                    <td>
                                                        @if($csv_data)
                                                            <button class="btn btn-sm btn-outline-secondary" 
                                                                    type="button" 
                                                                    data-toggle="collapse" 
                                                                    data-target="#raw-data-{{ $key }}" 
                                                                    aria-expanded="false">
                                                                <i class="fas fa-code"></i> View Raw
                                                            </button>
                                                            <div class="collapse mt-2" id="raw-data-{{ $key }}">
                                                                <div class="card card-body bg-light">
                                                                    <pre class="mb-0"><code>{{ json_encode($csv_data, JSON_PRETTY_PRINT) }}</code></pre>
                                                                </div>
                                                            </div>
                                                        @else
                                                            <span class="text-muted">No data</span>
                                                        @endif
                                                    </td>
                                                </tr>
                                            @endif
                                        @endforeach
                                    </tbody>
                                </table>
                            </div>
                            
                            <!-- Summary Statistics -->
                            <div class="row mt-3">
                                <div class="col-md-6">
                                    <div class="card bg-light">
                                        <div class="card-body">
                                            <h6 class="card-title">Error Summary</h6>
                                            @php
                                                $error_counts = [];
                                                foreach($skip_reasons as $key => $val) {
                                                    if(!empty($val['error'])) {
                                                        $error_details = $val['info'];
                                                        $error_type = 'Unknown';
                                                        
                                                        if (strpos($error_details, 'User not found') !== false) {
                                                            $error_type = 'User Not Found';
                                                        } elseif (strpos($error_details, 'No lead found') !== false) {
                                                            $error_type = 'Lead Not Found';
                                                        } elseif (strpos($error_details, 'Invalid voucher creation date') !== false) {
                                                            $error_type = 'Invalid Date Format';
                                                        } elseif (strpos($error_details, 'Older voucher entry') !== false) {
                                                            $error_type = 'Older Entry';
                                                        } elseif (strpos($error_details, 'multiple leads') !== false) {
                                                            $error_type = 'Multiple Leads';
                                                        } elseif (strpos($error_details, 'Missing') !== false) {
                                                            $error_type = 'Missing Data';
                                                        }
                                                        
                                                        $error_counts[$error_type] = ($error_counts[$error_type] ?? 0) + 1;
                                                    }
                                                }
                                            @endphp
                                            @foreach($error_counts as $type => $count)
                                                <div class="d-flex justify-content-between">
                                                    <span>{{ $type }}:</span>
                                                    <span class="badge badge-secondary">{{ $count }}</span>
                                                </div>
                                            @endforeach
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="card bg-light">
                                        <div class="card-body">
                                            <h6 class="card-title">Debugging Tips</h6>
                                            <ul class="list-unstyled mb-0">
                                                <li><small><strong>User Not Found:</strong> Check email addresses match your database</small></li>
                                                <li><small><strong>Lead Not Found:</strong> Verify order numbers exist and match user emails</small></li>
                                                <li><small><strong>Invalid Date Format:</strong> Use 'd-M-Y' format (e.g., 15-Jan-2024)</small></li>
                                                <li><small><strong>Multiple Leads:</strong> Provide order numbers to identify specific leads</small></li>
                                                <li><small><strong>Older Entry:</strong> Only the latest voucher per lead is processed</small></li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    @endif
</div>
@endsection

@section('script')
<script>
$(document).ready(function() {
    // Update selected count
    function updateSelectedCount() {
        const count = $('.update-checkbox:checked').length;
        $('#selected-count').text(count);
        $('#confirm-updates').prop('disabled', count === 0);
    }

    // Master checkbox functionality
    $('#master-checkbox').change(function() {
        $('.update-checkbox').prop('checked', this.checked);
        updateSelectedCount();
    });

    // Individual checkbox functionality
    $('.update-checkbox').change(function() {
        const total = $('.update-checkbox').length;
        const checked = $('.update-checkbox:checked').length;
        $('#master-checkbox').prop('checked', checked === total);
        updateSelectedCount();
    });

    // Select all button
    $('#select-all').click(function() {
        $('.update-checkbox').prop('checked', true);
        $('#master-checkbox').prop('checked', true);
        updateSelectedCount();
    });

    // Deselect all button
    $('#deselect-all').click(function() {
        $('.update-checkbox').prop('checked', false);
        $('#master-checkbox').prop('checked', false);
        updateSelectedCount();
    });

    // Toggle all details
    $('#toggle-details').click(function() {
        $('.changes-detail').toggle();
        const icon = $(this).find('i');
        icon.toggleClass('fa-eye fa-eye-slash');
    });

    // Toggle individual row details
    $('.toggle-row-details').click(function() {
        const index = $(this).data('index');
        const row = $(`.update-row[data-index="${index}"]`);
        row.find('.changes-detail').toggle();
        const icon = $(this).find('i');
        icon.toggleClass('fa-eye fa-eye-slash');
    });

    // Toggle skipped report
    $('#toggle-skipped-report').click(function(e) {
        e.preventDefault();
        $('#skipped-report').toggle();
        const icon = $(this).find('i');
        icon.toggleClass('fa-angle-down fa-angle-up');
    });

    // Confirmation dialog
    $('#confirm_updates_form').submit(function(e) {
        const selectedCount = $('.update-checkbox:checked').length;
        if (selectedCount === 0) {
            e.preventDefault();
            alert('Please select at least one update to confirm.');
            return false;
        }

        const confirmed = confirm(`Are you sure you want to update ${selectedCount} lead record(s)? This action cannot be undone.`);
        if (!confirmed) {
            e.preventDefault();
            return false;
        }
    });

    // Initialize count
    updateSelectedCount();
});
</script>
@endsection