@extends('admin.layouts.app')

@section('title', 'تفاصيل الرحلة')

@section('page-title', 'تفاصيل الرحلة #' . $trip->id)

@section('content')
<div class="container-fluid">
    <!-- أزرار التنقل -->
    <div class="row mb-4">
        <div class="col-12">
            <a href="{{ route('admin.trips') }}" class="btn btn-secondary">
                <i class="fas fa-arrow-right"></i> العودة للرحلات
            </a>
            <button type="button" class="btn btn-primary" onclick="window.print()">
                <i class="fas fa-print"></i> طباعة
            </button>
        </div>
    </div>

    <div class="row">
        <!-- معلومات الرحلة الأساسية -->
        <div class="col-md-8">
            <div class="card mb-4">
                <div class="card-header">
                    <h5 class="mb-0">
                        <i class="fas fa-info-circle"></i> معلومات الرحلة
                    </h5>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-6">
                            <table class="table table-borderless">
                                <tr>
                                    <td class="fw-bold">رقم الرحلة:</td>
                                    <td>#{{ $trip->id }}</td>
                                </tr>
                                <tr>
                                    <td class="fw-bold">الحالة:</td>
                                    <td>
                                        @switch($trip->status)
                                            @case('pending')
                                                <span class="badge bg-warning">في الانتظار</span>
                                                @break
                                            @case('accepted')
                                                <span class="badge bg-info">مقبولة</span>
                                                @break
                                            @case('started')
                                                <span class="badge bg-primary">قيد التنفيذ</span>
                                                @break
                                            @case('completed')
                                                <span class="badge bg-success">مكتملة</span>
                                                @break
                                            @case('cancelled')
                                                <span class="badge bg-danger">ملغية</span>
                                                @break
                                            @default
                                                <span class="badge bg-secondary">{{ $trip->status }}</span>
                                        @endswitch
                                    </td>
                                </tr>
                                <tr>
                                    <td class="fw-bold">المسافة:</td>
                                    <td>
                                        @if($trip->distance)
                                            <span class="badge bg-info">{{ $trip->distance }} كم</span>
                                        @else
                                            <span class="text-muted">غير محدد</span>
                                        @endif
                                    </td>
                                </tr>
                                <tr>
                                    <td class="fw-bold">السعر:</td>
                                    <td>
                                        @if($trip->fare)
                                            <span class="badge bg-success fs-6">{{ $trip->fare }} ريال</span>
                                        @else
                                            <span class="text-muted">غير محدد</span>
                                        @endif
                                    </td>
                                </tr>
                            </table>
                        </div>
                        <div class="col-md-6">
                            <table class="table table-borderless">
                                <tr>
                                    <td class="fw-bold">تاريخ الإنشاء:</td>
                                    <td>{{ $trip->created_at->format('Y-m-d H:i') }}</td>
                                </tr>
                                <tr>
                                    <td class="fw-bold">وقت الانطلاق:</td>
                                    <td>
                                        @if($trip->pickup_time)
                                            {{ $trip->pickup_time->format('Y-m-d H:i') }}
                                        @else
                                            <span class="text-muted">لم يتم تحديده</span>
                                        @endif
                                    </td>
                                </tr>
                                <tr>
                                    <td class="fw-bold">وقت الوصول:</td>
                                    <td>
                                        @if($trip->dropoff_time)
                                            {{ $trip->dropoff_time->format('Y-m-d H:i') }}
                                        @else
                                            <span class="text-muted">لم يتم تحديده</span>
                                        @endif
                                    </td>
                                </tr>
                                <tr>
                                    <td class="fw-bold">المدة:</td>
                                    <td>
                                        @if($trip->pickup_time && $trip->dropoff_time)
                                            @php
                                                $duration = $trip->pickup_time->diffInMinutes($trip->dropoff_time);
                                                $hours = intval($duration / 60);
                                                $minutes = $duration % 60;
                                            @endphp
                                            @if($hours > 0)
                                                {{ $hours }} ساعة {{ $minutes }} دقيقة
                                            @else
                                                {{ $minutes }} دقيقة
                                            @endif
                                        @else
                                            <span class="text-muted">غير محدد</span>
                                        @endif
                                    </td>
                                </tr>
                            </table>
                        </div>
                    </div>

                    <!-- المواقع -->
                    <div class="row mt-4">
                        <div class="col-md-6">
                            <div class="card border-primary">
                                <div class="card-header bg-primary text-white">
                                    <h6 class="mb-0">
                                        <i class="fas fa-map-marker-alt"></i> نقطة الانطلاق
                                    </h6>
                                </div>
                                <div class="card-body">
                                    <p class="mb-2"><strong>{{ $trip->pickup_location }}</strong></p>
                                    @if($trip->pickup_latitude && $trip->pickup_longitude)
                                        <small class="text-muted">
                                            {{ number_format($trip->pickup_latitude, 6) }}, {{ number_format($trip->pickup_longitude, 6) }}
                                        </small>
                                        <br>
                                        <a href="https://maps.google.com/?q={{ $trip->pickup_latitude }},{{ $trip->pickup_longitude }}"
                                           target="_blank" class="btn btn-sm btn-outline-primary mt-2">
                                            <i class="fas fa-external-link-alt"></i> عرض على الخريطة
                                        </a>
                                    @endif
                                </div>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="card border-success">
                                <div class="card-header bg-success text-white">
                                    <h6 class="mb-0">
                                        <i class="fas fa-flag-checkered"></i> نقطة الوصول
                                    </h6>
                                </div>
                                <div class="card-body">
                                    <p class="mb-2"><strong>{{ $trip->dropoff_location }}</strong></p>
                                    @if($trip->dropoff_latitude && $trip->dropoff_longitude)
                                        <small class="text-muted">
                                            {{ number_format($trip->dropoff_latitude, 6) }}, {{ number_format($trip->dropoff_longitude, 6) }}
                                        </small>
                                        <br>
                                        <a href="https://maps.google.com/?q={{ $trip->dropoff_latitude }},{{ $trip->dropoff_longitude }}"
                                           target="_blank" class="btn btn-sm btn-outline-success mt-2">
                                            <i class="fas fa-external-link-alt"></i> عرض على الخريطة
                                        </a>
                                    @endif
                                </div>
                            </div>
                        </div>
                    </div>

                    <!-- الملاحظات -->
                    @if($trip->notes)
                        <div class="row mt-4">
                            <div class="col-12">
                                <div class="card border-info">
                                    <div class="card-header bg-info text-white">
                                        <h6 class="mb-0">
                                            <i class="fas fa-sticky-note"></i> الملاحظات
                                        </h6>
                                    </div>
                                    <div class="card-body">
                                        <p class="mb-0">{{ $trip->notes }}</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    @endif
                </div>
            </div>
        </div>

        <!-- معلومات السائق والراكب -->
        <div class="col-md-4">
            <!-- معلومات السائق -->
            <div class="card mb-4">
                <div class="card-header bg-primary text-white">
                    <h6 class="mb-0">
                        <i class="fas fa-user-tie"></i> معلومات السائق
                    </h6>
                </div>
                <div class="card-body text-center">
                    @if($trip->driver)
                        @if($trip->driver->profile_photo)
                            <img src="{{ asset('storage/' . $trip->driver->profile_photo) }}"
                                 alt="صورة السائق" class="rounded-circle mb-3" width="80">
                        @else
                            <div class="bg-secondary rounded-circle d-flex align-items-center justify-content-center mx-auto mb-3"
                                 style="width: 80px; height: 80px;">
                                <i class="fas fa-user fa-2x text-white"></i>
                            </div>
                        @endif
                        <h6 class="fw-bold">{{ $trip->driver->name }}</h6>
                        <p class="text-muted mb-2">{{ $trip->driver->phone }}</p>
                        <p class="text-muted mb-2">{{ $trip->driver->email }}</p>

                        @if($trip->driver_rating)
                            <div class="mb-2">
                                <span class="text-warning">
                                    @for($i = 1; $i <= 5; $i++)
                                        @if($i <= $trip->driver_rating)
                                            <i class="fas fa-star"></i>
                                        @else
                                            <i class="far fa-star"></i>
                                        @endif
                                    @endfor
                                </span>
                                <span class="ms-2">{{ $trip->driver_rating }}/5</span>
                            </div>
                        @endif

                        @if($trip->driver_feedback)
                            <div class="alert alert-info">
                                <small><strong>التقييم:</strong> {{ $trip->driver_feedback }}</small>
                            </div>
                        @endif

                        <a href="{{ route('admin.drivers.show', $trip->driver->id) }}"
                           class="btn btn-sm btn-outline-primary">
                            <i class="fas fa-eye"></i> عرض الملف الشخصي
                        </a>
                    @else
                        <div class="text-center py-3">
                            <i class="fas fa-user-slash fa-2x text-muted mb-2"></i>
                            <p class="text-muted mb-0">لم يتم تحديد سائق</p>
                        </div>
                    @endif
                </div>
            </div>

            <!-- معلومات الراكب -->
            <div class="card mb-4">
                <div class="card-header bg-success text-white">
                    <h6 class="mb-0">
                        <i class="fas fa-user"></i> معلومات الراكب
                    </h6>
                </div>
                <div class="card-body text-center">
                    @if($trip->passenger)
                        @if($trip->passenger->profile_photo)
                            <img src="{{ asset('storage/' . $trip->passenger->profile_photo) }}"
                                 alt="صورة الراكب" class="rounded-circle mb-3" width="80">
                        @else
                            <div class="bg-secondary rounded-circle d-flex align-items-center justify-content-center mx-auto mb-3"
                                 style="width: 80px; height: 80px;">
                                <i class="fas fa-user fa-2x text-white"></i>
                            </div>
                        @endif
                        <h6 class="fw-bold">{{ $trip->passenger->name }}</h6>
                        <p class="text-muted mb-2">{{ $trip->passenger->phone }}</p>
                        <p class="text-muted mb-2">{{ $trip->passenger->email }}</p>

                        @if($trip->passenger_rating)
                            <div class="mb-2">
                                <span class="text-warning">
                                    @for($i = 1; $i <= 5; $i++)
                                        @if($i <= $trip->passenger_rating)
                                            <i class="fas fa-star"></i>
                                        @else
                                            <i class="far fa-star"></i>
                                        @endif
                                    @endfor
                                </span>
                                <span class="ms-2">{{ $trip->passenger_rating }}/5</span>
                            </div>
                        @endif

                        @if($trip->passenger_feedback)
                            <div class="alert alert-info">
                                <small><strong>التقييم:</strong> {{ $trip->passenger_feedback }}</small>
                            </div>
                        @endif

                        <a href="{{ route('admin.passengers.show', $trip->passenger->id) }}"
                           class="btn btn-sm btn-outline-success">
                            <i class="fas fa-eye"></i> عرض الملف الشخصي
                        </a>
                    @else
                        <div class="text-center py-3">
                            <i class="fas fa-user-slash fa-2x text-muted mb-2"></i>
                            <p class="text-muted mb-0">لم يتم تحديد راكب</p>
                        </div>
                    @endif
                </div>
            </div>

            <!-- معلومات المركبة -->
            @if($trip->vehicle)
                <div class="card mb-4">
                    <div class="card-header bg-info text-white">
                        <h6 class="mb-0">
                            <i class="fas fa-car"></i> معلومات المركبة
                        </h6>
                    </div>
                    <div class="card-body text-center">
                        <h6 class="fw-bold">{{ $trip->vehicle->model }}</h6>
                        <p class="text-muted mb-2">{{ $trip->vehicle->plate_number }}</p>
                        <p class="text-muted mb-2">{{ $trip->vehicle->color }}</p>
                        <p class="text-muted mb-2">{{ $trip->vehicle->year }}</p>

                        <a href="{{ route('admin.vehicles.show', $trip->vehicle->id) }}"
                           class="btn btn-sm btn-outline-info">
                            <i class="fas fa-eye"></i> عرض المركبة
                        </a>
                    </div>
                </div>
            @endif
        </div>
    </div>

    <!-- معلومات الدفع -->
    @if($trip->payment)
        <div class="row mt-4">
            <div class="col-12">
                <div class="card border-warning">
                    <div class="card-header bg-warning text-dark">
                        <h6 class="mb-0">
                            <i class="fas fa-credit-card"></i> معلومات الدفع
                        </h6>
                    </div>
                    <div class="card-body">
                        <div class="row">
                            <div class="col-md-3">
                                <strong>المبلغ:</strong> {{ $trip->payment->amount }} ريال
                            </div>
                            <div class="col-md-3">
                                <strong>طريقة الدفع:</strong> {{ $trip->payment->payment_method }}
                            </div>
                            <div class="col-md-3">
                                <strong>حالة الدفع:</strong>
                                @if($trip->payment->status == 'completed')
                                    <span class="badge bg-success">مكتمل</span>
                                @elseif($trip->payment->status == 'pending')
                                    <span class="badge bg-warning">في الانتظار</span>
                                @else
                                    <span class="badge bg-danger">{{ $trip->payment->status }}</span>
                                @endif
                            </div>
                            <div class="col-md-3">
                                <strong>تاريخ الدفع:</strong> {{ $trip->payment->created_at->format('Y-m-d H:i') }}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    @endif

    <!-- أزرار الإجراءات -->
    <div class="row mt-4">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <h6 class="mb-0">
                        <i class="fas fa-cogs"></i> الإجراءات
                    </h6>
                </div>
                <div class="card-body">
                    <div class="btn-group" role="group">
                        @if($trip->status == 'pending')
                            <button type="button" class="btn btn-success"
                                    onclick="updateTripStatus({{ $trip->id }}, 'accepted')">
                                <i class="fas fa-check"></i> قبول الرحلة
                            </button>
                        @endif

                        @if(in_array($trip->status, ['pending', 'accepted']))
                            <button type="button" class="btn btn-danger"
                                    onclick="updateTripStatus({{ $trip->id }}, 'cancelled')">
                                <i class="fas fa-times"></i> إلغاء الرحلة
                            </button>
                        @endif

                        @if($trip->status == 'accepted')
                            <button type="button" class="btn btn-primary"
                                    onclick="updateTripStatus({{ $trip->id }}, 'started')">
                                <i class="fas fa-play"></i> بدء الرحلة
                            </button>
                        @endif

                        @if($trip->status == 'started')
                            <button type="button" class="btn btn-success"
                                    onclick="updateTripStatus({{ $trip->id }}, 'completed')">
                                <i class="fas fa-flag-checkered"></i> إنهاء الرحلة
                            </button>
                        @endif

                        <button type="button" class="btn btn-info"
                                onclick="showTripHistory({{ $trip->id }})">
                            <i class="fas fa-history"></i> سجل التغييرات
                        </button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- Modal لعرض سجل التغييرات -->
<div class="modal fade" id="tripHistoryModal" tabindex="-1">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">سجل تغييرات الرحلة</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body" id="tripHistoryContent">
                <!-- سيتم تحميل المحتوى هنا -->
            </div>
        </div>
    </div>
</div>
@endsection

@section('scripts')
<script>
// تحديث حالة الرحلة
function updateTripStatus(tripId, status) {
    if (confirm('هل أنت متأكد من تحديث حالة الرحلة؟')) {
        fetch(`/admin/trips/${tripId}/status`, {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
                'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').getAttribute('content')
            },
            body: JSON.stringify({ status: status })
        })
        .then(response => response.json())
        .then(data => {
            if (data.success) {
                location.reload();
            } else {
                alert('حدث خطأ أثناء تحديث حالة الرحلة');
            }
        })
        .catch(error => {
            console.error('Error:', error);
            alert('حدث خطأ أثناء تحديث حالة الرحلة');
        });
    }
}

// عرض سجل التغييرات
function showTripHistory(tripId) {
    fetch(`/admin/trips/${tripId}/history`)
        .then(response => response.json())
        .then(data => {
            if (data.success) {
                document.getElementById('tripHistoryContent').innerHTML = data.html;
                new bootstrap.Modal(document.getElementById('tripHistoryModal')).show();
            }
        })
        .catch(error => {
            console.error('Error:', error);
            alert('حدث خطأ أثناء تحميل سجل التغييرات');
        });
}
</script>

<style>
.card-header {
    border-bottom: none;
}

.table-borderless td {
    padding: 0.5rem 0;
}

.alert {
    margin-bottom: 0;
}

.btn-group .btn {
    margin: 0 2px;
}

@media print {
    .btn, .btn-group {
        display: none !important;
    }

    .card {
        border: 1px solid #ddd !important;
        box-shadow: none !important;
    }
}
</style>
@endsection