@extends('layouts.app')
@section('title', 'بيانات المركبة')
@section('page_title', $vehicle->plate_number)
@section('breadcrumb')
    <li class="breadcrumb-item"><a href="{{ route('vehicles.index') }}">المركبات</a></li>
    <li class="breadcrumb-item active">{{ $vehicle->plate_number }}</li>
@endsection

@section('page_actions')
    @can('vehicles.edit')
        <a href="{{ route('vehicles.edit', $vehicle) }}" class="btn btn-light"><i class="fa-solid fa-pen ms-2"></i>تعديل</a>
    @endcan
    @can('installations.create')
        <a href="{{ route('installations.create', ['customer_id' => $vehicle->customer_id, 'vehicle_id' => $vehicle->id]) }}" class="btn btn-primary">
            <i class="fa-solid fa-screwdriver-wrench ms-2"></i>أمر تركيب
        </a>
    @endcan
    @can('tickets.create')
        <a href="{{ route('tickets.create', ['customer_id' => $vehicle->customer_id, 'vehicle_id' => $vehicle->id]) }}" class="btn btn-light">
            <i class="fa-solid fa-headset ms-2"></i>فتح تذكرة
        </a>
    @endcan
@endsection

@section('content')
<div class="row g-3">
    <div class="col-xl-4">
        <div class="card">
            <div class="card-body">
                <div class="profile-head mb-3">
                    <div class="profile-avatar"><i class="fa-solid fa-car"></i></div>
                    <div>
                        <h2 class="h5 fw-bold mb-1">{{ trim($vehicle->make . ' ' . $vehicle->model) ?: $vehicle->plate_number }}</h2>
                        <div class="text-muted small">{{ $vehicle->year }} · {{ $vehicle->color }}</div>
                        <div class="mt-2">{!! badge($vehicle->type_label, 'primary') !!}</div>
                    </div>
                </div>

                <ul class="detail-list">
                    <li><span class="dl-label">رقم اللوحة</span><span class="dl-value fw-bold">{{ $vehicle->plate_number }}</span></li>
                    <li><span class="dl-label">العميل</span>
                        <span class="dl-value">
                            <a href="{{ route('customers.show', $vehicle->customer) }}">{{ $vehicle->customer?->display_name ?? '—' }}</a>
                        </span>
                    </li>
                    <li><span class="dl-label">رقم الهيكل</span><span class="dl-value font-monospace small">{{ $vehicle->chassis_number ?: '—' }}</span></li>
                    <li><span class="dl-label">السائق</span><span class="dl-value">{{ $vehicle->driver_name ?: '—' }}</span></li>
                    <li><span class="dl-label">جوال السائق</span><span class="dl-value">{{ $vehicle->driver_phone ?: '—' }}</span></li>
                    <li><span class="dl-label">تاريخ الإضافة</span><span class="dl-value">{{ arabicDate($vehicle->created_at) }}</span></li>
                </ul>

                @if ($vehicle->notes)
                    <div class="alert alert-light border small mt-3 mb-0" style="white-space: pre-line">{{ $vehicle->notes }}</div>
                @endif
            </div>
        </div>
    </div>

    <div class="col-xl-8">
        <div class="card mb-3">
            <div class="card-header"><span><i class="fa-solid fa-microchip text-info ms-2"></i>الأجهزة المركّبة</span></div>
            <div class="card-body p-0 table-responsive">
                <table class="table table-hover mb-0 align-middle">
                    <thead class="table-light"><tr><th>IMEI</th><th>الجهاز</th><th>الشريحة</th><th>انتهاء الضمان</th><th class="text-center">الحالة</th></tr></thead>
                    <tbody>
                    @forelse ($vehicle->deviceUnits as $device)
                        <tr>
                            <td><a href="{{ route('devices.show', $device) }}" class="fw-bold text-decoration-none font-monospace">{{ $device->imei }}</a></td>
                            <td>{{ $device->product?->name ?? '—' }}</td>
                            <td>{{ $device->sim_number ?: '—' }}</td>
                            <td>{{ arabicDate($device->warranty_end) }}</td>
                            <td class="text-center">{!! badge($device->status_label, $device->status_color) !!}</td>
                        </tr>
                    @empty
                        <tr><td colspan="5" class="text-center text-muted py-4">لا توجد أجهزة مركّبة على هذه المركبة</td></tr>
                    @endforelse
                    </tbody>
                </table>
            </div>
        </div>

        <div class="card mb-3">
            <div class="card-header"><span><i class="fa-solid fa-satellite-dish text-success ms-2"></i>الاشتراكات</span></div>
            <div class="card-body p-0 table-responsive">
                <table class="table table-hover mb-0 align-middle">
                    <thead class="table-light"><tr><th>الكود</th><th>الباقة</th><th>البداية</th><th>الانتهاء</th><th class="text-center">الحالة</th></tr></thead>
                    <tbody>
                    @forelse ($vehicle->subscriptions as $sub)
                        <tr>
                            <td><a href="{{ route('subscriptions.show', $sub) }}" class="fw-bold text-decoration-none">{{ $sub->code }}</a></td>
                            <td>{{ $sub->product?->name ?? '—' }}</td>
                            <td>{{ arabicDate($sub->start_date) }}</td>
                            <td class="{{ $sub->days_remaining < 0 ? 'text-danger fw-bold' : '' }}">{{ arabicDate($sub->end_date) }}</td>
                            <td class="text-center">{!! badge($sub->status_label, $sub->status_color) !!}</td>
                        </tr>
                    @empty
                        <tr><td colspan="5" class="text-center text-muted py-4">لا توجد اشتراكات</td></tr>
                    @endforelse
                    </tbody>
                </table>
            </div>
        </div>

        <div class="row g-3">
            <div class="col-lg-6">
                <div class="card h-100">
                    <div class="card-header"><span><i class="fa-solid fa-screwdriver-wrench text-primary ms-2"></i>سجل التركيبات</span></div>
                    <div class="card-body p-0 table-responsive">
                        <table class="table table-hover mb-0 align-middle">
                            <thead class="table-light"><tr><th>الرقم</th><th>الفني</th><th class="text-center">الحالة</th></tr></thead>
                            <tbody>
                            @forelse ($vehicle->installations as $inst)
                                <tr>
                                    <td><a href="{{ route('installations.show', $inst) }}" class="text-decoration-none">{{ $inst->code }}</a></td>
                                    <td class="small">{{ $inst->technician?->name ?? '—' }}</td>
                                    <td class="text-center">{!! badge($inst->status_label, $inst->status_color) !!}</td>
                                </tr>
                            @empty
                                <tr><td colspan="3" class="text-center text-muted py-4">لا يوجد سجل</td></tr>
                            @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>

            <div class="col-lg-6">
                <div class="card h-100">
                    <div class="card-header"><span><i class="fa-solid fa-headset text-danger ms-2"></i>تذاكر الدعم</span></div>
                    <div class="card-body p-0 table-responsive">
                        <table class="table table-hover mb-0 align-middle">
                            <thead class="table-light"><tr><th>الرقم</th><th>الموضوع</th><th class="text-center">الحالة</th></tr></thead>
                            <tbody>
                            @forelse ($vehicle->tickets as $ticket)
                                <tr>
                                    <td><a href="{{ route('tickets.show', $ticket) }}" class="text-decoration-none">{{ $ticket->code }}</a></td>
                                    <td class="small">{{ \Illuminate\Support\Str::limit($ticket->subject, 30) }}</td>
                                    <td class="text-center">{!! badge($ticket->status_label, $ticket->status_color) !!}</td>
                                </tr>
                            @empty
                                <tr><td colspan="3" class="text-center text-muted py-4">لا توجد تذاكر</td></tr>
                            @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection