@extends('layouts.theme1')

@section('title', 'Détails de la réservation')

@section('content')
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="border-bottom title-part-padding">
                    <div class="d-flex justify-content-between align-items-center">
                        <h4 class="card-title mb-0">Détails de la réservation #{{ $reservation['id'] }}</h4>
                        <a href="{{ route('reservations.index') }}" class="btn btn-secondary">Retour</a>

                       
                        <div class="btn-group" role="group">
                            @if(in_array($reservation['status'] ?? '', ['confirmed']))
                                <!-- Bouton pour annulation standard (avec remboursement) -->
                                <button type="button" class="btn btn-danger me-2" onclick="cancelReservation('{{ $reservation['id'] }}')">
                                    <i class="fas fa-ban"></i> Annuler (remboursement)
                                </button>                                
                               
                            @endif

                             @if(in_array($reservation['status'] ?? '', ['pending', 'confirmed']))                               
                                
                                <!-- Bouton pour annulation manuelle (sans remboursement) -->
                                <button type="button" class="btn btn-warning" onclick="cancelManualReservation('{{ $reservation['id'] }}')">
                                    <i class="fas fa-hand-paper"></i> Annulation manuelle
                                </button>
                            @endif
                        </div>
                    </div>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-6">
                            <h5>Informations générales</h5>
                            <table class="table table-bordered">
                                <tr>
                                    <th>Client</th>
                                    <td>{{ $reservation['clientName'] ?? $reservation['clientId'] ?? '-' }}</td>
                                </tr>
                                <tr>
                                    <th>Chauffeur</th>
                                    <td>{{ $reservation['driverName'] ?? $reservation['driverId'] ?? '-' }}</td>
                                </tr>
                                <tr>
                                    <th>Statut</th>
                                    <td>
                                        @php
                                            $status = $reservation['status'] ?? 'unknown';
                                            $badgeColor = match($status) {
                                                'draft' => 'secondary',
                                                'pending' => 'warning',
                                                'confirmed' => 'success',
                                                'cancelled' => 'danger',
                                                'completed' => 'info',
                                                default => 'dark'
                                            };
                                        @endphp
                                        <span class="badge bg-{{ $badgeColor }}">{{ $status }}</span>
                                    </td>
                                </tr>
                                <tr>
                                    <th>Places réservées</th>
                                    <td>{{ $reservation['seatsReserved'] ?? 1 }}</td>
                                </tr>
                                <tr>
                                    <th>Prix total</th>
                                    <td>{{ number_format($reservation['totalPrice'] ?? 0, 0, ',', ' ') }}  {{ $appConfig['currency'] ?? 'FCFA' }}</td>
                                </tr>
                                <tr>
                                    <th>Méthode de paiement</th>
                                    <td>{{ $reservation['paymentMethod'] ?? '-' }}</td>
                                </tr>
                                <tr>
                                    <th>Date de création</th>
                                    <td>{{ $reservation['createdAt'] ?? '-' }}</td>
                                </tr>
                            </table>
                        </div>

                        <div class="col-md-6">
                            <h5>Détails du trajet</h5>
                            @php
                                $trip = $reservation['tripDetails'] ?? [];
                            @endphp
                            <table class="table table-bordered">
                                <tr>
                                    <th>Départ</th>
                                    <td>{{ $trip['departureCity'] ?? 'N/A' }} ({{ $trip['departureCountry'] ?? 'N/A' }})</td>
                                </tr>
                                <tr>
                                    <th>Arrivée</th>
                                    <td>{{ $trip['arrivalCity'] ?? 'N/A' }} ({{ $trip['arrivalCountry'] ?? 'N/A' }})</td>
                                </tr>
                                <tr>
                                    <th>Heure de départ</th>
                                    <td>{{ $trip['departureTime'] ?? '-' }}</td>
                                </tr>
                                <tr>
                                    <th>Compagnie</th>
                                    <td>{{ $trip['driverName'] ?? '-' }}</td>
                                </tr>
                            </table>
                        </div>

                        <div class="col-12 mt-4">
                            <h5>Passagers</h5>
                            {{ $appConfig['applicationName'] ?? 'Ticko' }}
                            @if(!empty($reservation['passengers']))
                                <table class="table table-bordered">
                                    <thead>
                                        <tr>
                                            <th>Nom complet</th>
                                            <th>Téléphone</th>
                                            <th>Principal</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach($reservation['passengers'] as $passenger)
                                        <tr>
                                            <td>{{ $passenger['fullName'] ?? '-' }}</td>
                                            <td>{{ $passenger['phoneNumber'] ?? '-' }}</td>
                                            <td>
                                                @if($passenger['isPrimary'] ?? false)
                                                    <span class="badge bg-success">Oui</span>
                                                @else
                                                    <span class="badge bg-secondary">Non</span>
                                                @endif
                                            </td>
                                        </tr>
                                        @endforeach
                                    </tbody>
                                </table>
                            @else
                                <p>Aucun passager enregistré</p>
                            @endif
                        </div>
                    </div>
                </div>

                <!-- Modal pour l'annulation manuelle -->
                <div class="modal fade" id="cancelManualModal" tabindex="-1">
                    <div class="modal-dialog">
                        <div class="modal-content">
                            <div class="modal-header bg-warning">
                                <h5 class="modal-title">
                                    <i class="fas fa-hand-paper me-2"></i>Confirmer l'annulation manuelle
                                </h5>
                                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                            </div>
                            <div class="modal-body">
                                <div class="alert alert-warning">
                                    <i class="fas fa-exclamation-triangle me-2"></i>
                                    <strong>Attention :</strong> Cette annulation ne générera PAS de remboursement automatique.
                                    Le client devra être remboursé en cash manuellement.
                                </div>
                                
                                <p>Êtes-vous sûr de vouloir annuler manuellement cette réservation ?</p>
                                
                                <div class="mb-3">
                                    <label class="form-label fw-bold">Raison de l'annulation <span class="text-danger">*</span></label>
                                    <textarea class="form-control" id="manualCancelReason" rows="3" required></textarea>
                                </div>
                                
                                <div class="mb-3">
                                    <label class="form-label fw-bold">Informations supplémentaires</label>
                                    <ul class="list-unstyled">
                                        <li><i class="fas fa-user me-2"></i> Client: {{ $reservation['clientName'] ?? $reservation['clientId'] }}</li>
                                        <li><i class="fas fa-ticket-alt me-2"></i> Réservation: {{ $reservation['id'] }}</li>
                                        <li><i class="fas fa-chair me-2"></i> Places: {{ $reservation['seatsReserved'] ?? 1 }}</li>
                                        <li><i class="fas fa-money-bill me-2"></i> Montant: {{ number_format($reservation['totalPrice'] ?? 0, 0, ',', ' ') }} FCFA</li>
                                        <li><i class="fas fa-credit-card me-2"></i> Paiement: {{ $reservation['paymentMethod'] ?? '-' }}</li>
                                    </ul>
                                </div>
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Non, garder</button>
                                <button type="button" class="btn btn-warning" onclick="confirmManualCancel()">Oui, annuler manuellement</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>


<script>

    let currentReservationId = null;

    // Annulation standard (avec remboursement)
    function cancelReservation(reservationId) {
        if (confirm('Êtes-vous sûr de vouloir annuler cette réservation ? Un remboursement sera effectué.')) {
            $.ajax({
                url: '/reservations/' + reservationId + '/cancel',
                type: 'POST',
                data: {
                    _token: '{{ csrf_token() }}',
                    reason: 'Annulation demandée'
                },
                success: function(response) {
                    if (response.success) {
                        alert('Réservation annulée avec succès');
                        window.location.reload();
                    } else {
                        alert('Erreur: ' + response.error);
                    }
                },
                error: function(xhr) {
                    alert('Erreur lors de l\'annulation');
                    console.error(xhr.responseText);
                }
            });
        }
    }

    // Annulation manuelle (sans remboursement)
    function cancelManualReservation(reservationId) {
        currentReservationId = reservationId;
        $('#manualCancelReason').val('');
        $('#cancelManualModal').modal('show');
    }

    function confirmManualCancel() {
        if (!currentReservationId) return;
        
        var reason = $('#manualCancelReason').val().trim();
        
        if (!reason) {
            alert('Veuillez saisir une raison pour l\'annulation manuelle');
            return;
        }
        
        $.ajax({
            url: '/reservations/' + currentReservationId + '/cancel-manual',
            type: 'POST',
            data: {
                _token: '{{ csrf_token() }}',
                reason: reason
            },
            beforeSend: function() {
                $('#confirmManualCancel').prop('disabled', true).html('<i class="fas fa-spinner fa-spin"></i> Traitement...');
            },
            success: function(response) {
                $('#cancelManualModal').modal('hide');
                if (response.success) {
                    alert('Réservation annulée manuellement avec succès');
                    window.location.reload();
                } else {
                    alert('Erreur: ' + response.error);
                }
            },
            error: function(xhr) {
                $('#cancelManualModal').modal('hide');
                alert('Erreur lors de l\'annulation manuelle');
                console.error(xhr.responseText);
            },
            complete: function() {
                $('#confirmManualCancel').prop('disabled', false).html('Oui, annuler manuellement');
            }
        });
    }
    // function cancelReservation(reservationId) {
    //     if (confirm('Êtes-vous sûr de vouloir annuler cette réservation ? Cette action est irréversible.')) {
    //         $.ajax({
    //             url: '{{ route("reservations.cancel", ["reservationId" => "RESERVATION_ID"]) }}'.replace('RESERVATION_ID', reservationId),
    //             type: 'POST',
    //             data: {
    //                 _token: '{{ csrf_token() }}',
    //                 reason: 'Annulation demandée par l\'utilisateur'
    //             },
    //             success: function(response) {
    //                 if (response.success) {
    //                     alert('Réservation annulée avec succès');
    //                     window.location.reload();
    //                 } else {
    //                     alert('Erreur: ' + response.error);
    //                 }
    //             },
    //             error: function(xhr) {
    //                 alert('Erreur lors de l\'annulation');
    //                 console.error(xhr.responseText);
    //             }
    //         });
    //     }
    // }
</script>
@endsection