@extends('layouts.app')
@section('header-title', __('Customers'))

@section('content')
    <div>
        <h4>{{ __('All Customers') }}</h4>
    </div>

    <div class="container-fluid mt-3">
        <div class="mb-3 card">
            <div class="card-body">
                <div class="table-responsive">
                    <table class="table border-left-right table-responsive-lg">
                        <thead>
                            <tr>
                                <th class="text-center">{{ __('SL') }}.</th>
                                <th>{{ __('Profile') }}</th>
                                <th style="min-width: 150px">{{ __('Name') }}</th>
                                <th style="min-width: 100px">{{ __('Phone') }}</th>
                                <th>{{ __('Email') }}</th>
                                <th class="text-center">{{ __('Date of Birth') }}</th>
                            </tr>
                        </thead>
                        @forelse($customers as $key => $customer)
                            <tr>
                                <td class="text-center">{{ ++$key }}</td>
                                <td>
                                    <img src="{{ $customer->thumbnail }}" width="50">
                                </td>
                                <td>{{ Str::limit($customer->fullName, 50, '...') }}</td>
                                <td>{{ $customer->phone ?? 'N/A' }}</td>
                                <td>{{ $customer->email ?? 'N/A' }}</td>
                                <td class="text-center">{{ $customer->date_of_birth ?? 'N/A' }}</td>
                               
                            </tr>
                        @empty
                            <tr>
                                <td class="text-center" colspan="100%">{{ __('No Data Found') }}</td>
                            </tr>
                        @endforelse
                    </table>
                </div>
            </div>
        </div>

        <div class="my-3">
            {{ $customers->withQueryString()->links() }}
        </div>
        
        <!-- Form nascosto per l'eliminazione -->
        <form id="deleteCustomerForm" method="POST" action="">
            @csrf
            @method('DELETE')
        </form>
    </div>
@endsection

@push('scripts')
    <script>
        function confirmDelete(customerId) {
            const form = document.getElementById('deleteCustomerForm');
            // Assicurati che la route sia corretta (es. 'admin.customers.destroy')
            form.action = `{{ route('admin.customer.destroy', '') }}/${customerId}`;
            
            Swal.fire({
                title: "{{ __('Sei sicuro?') }}",
                text: "{{ __('Vuoi eliminare questo cliente? Questa azione è irreversibile.') }}",
                icon: "warning",
                showCancelButton: true,
                confirmButtonColor: "#ef4444",
                cancelButtonColor: "#64748b",
                confirmButtonText: "{{ __('Sì, elimina!') }}",
                cancelButtonText: "{{ __('Annulla') }}",
            }).then((result) => {
                if (result.isConfirmed) {
                    form.submit();
                }
            });
        }
    </script>
@endpush