@extends('layouts.app')
@section('title', 'بيانات الجهاز')
@section('page_title', 'الجهاز ' . $device->imei)
@section('breadcrumb')
    <li class="breadcrumb-item"><a href="{{ route('devices.index') }}">مخزون الأجهزة</a></li>
    <li class="breadcrumb-item active">{{ $device->imei }}</li>
@endsection

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

@section('content')
<div class="row g-3">
    <div class="col-xl-5">
        <div class="card">
            <div class="card-body">
                <div class="profile-head mb-3">
                    <div class="profile-avatar"><i class="fa-solid fa-microchip"></i></div>
                    <div>
                        <h2 class="h5 fw-bold mb-1 font-monospace">{{ $device->imei }}</h2>
                        <div class="text-muted small">{{ $device->product?->name ?? '—' }}</div>
                        <div class="mt-2">{!! badge($device->status_label, $device->status_color) !!}</div>
                    </div>
                </div>

                <ul class="detail-list">
                    <li><span class="dl-label">الرقم التسلسلي</span><span class="dl-value font-monospace small">{{ $device->serial_number ?: '—' }}</span></li>
                    <li><span class="dl-label">رقم الشريحة</span><span class="dl-value">{{ $device->sim_number ?: '—' }}</span></li>
                    <li><span class="dl-label">مشغّل الشبكة</span><span class="dl-value">{{ $device->sim_operator ?: '—' }}</span></li>
                    <li><span class="dl-label">العميل</span>
                        <span class="dl-value">
                            @if ($device->customer)
                                <a href="{{ route('customers.show', $device->customer) }}">{{ $device->customer->display_name }}</a>
                            @else — @endif
                        </span>
                    </li>
                    <li><span class="dl-label">المركبة</span>
                        <span class="dl-value">
                            @if ($device->vehicle)
                                <a href="{{ route('vehicles.show', $device->vehicle) }}">{{ $device->vehicle->plate_number }}</a>
                            @else — @endif
                        </span>
                    </li>
                    <li><span class="dl-label">أمر الشراء</span>
                        <span class="dl-value">
                            @if ($device->purchase)
                                <a href="{{ route('purchases.show', $device->purchase) }}">{{ $device->purchase->code }}</a>
                                <span class="text-muted small">({{ $device->purchase->supplier?->name }})</span>
                            @else — @endif
                        </span>
                    </li>
                    <li><span class="dl-label">انتهاء الضمان</span>
                        <span class="dl-value {{ $device->warranty_end && $device->warranty_end->isPast() ? 'text-danger' : '' }}">
                            {{ arabicDate($device->warranty_end) }}
                        </span>
                    </li>
                    <li><span class="dl-label">تاريخ الإضافة</span><span class="dl-value">{{ arabicDate($device->created_at) }}</span></li>
                </ul>

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

    <div class="col-xl-7">
        <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 ($device->subscriptions as $sub)
                        <tr>
                            <td><a href="{{ route('subscriptions.show', $sub) }}" class="fw-bold text-decoration-none">{{ $sub->code }}</a></td>
                            <td>{{ $sub->customer?->display_name ?? '—' }}</td>
                            <td>{{ arabicDate($sub->start_date) }}</td>
                            <td>{{ 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="card mb-3">
            <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>الموعد</th><th class="text-center">الحالة</th></tr></thead>
                    <tbody>
                    @forelse ($device->installationItems as $item)
                        @php $inst = $item->installation; @endphp
                        @if ($inst)
                            <tr>
                                <td><a href="{{ route('installations.show', $inst) }}" class="text-decoration-none">{{ $inst->code }}</a></td>
                                <td>{{ $inst->type_label }}</td>
                                <td>{{ arabicDate($inst->scheduled_at, true) }}</td>
                                <td class="text-center">{!! badge($inst->status_label, $inst->status_color) !!}</td>
                            </tr>
                        @endif
                    @empty
                        <tr><td colspan="4" class="text-center text-muted py-4">لا يوجد سجل تركيبات</td></tr>
                    @endforelse
                    </tbody>
                </table>
            </div>
        </div>

        <div class="card">
            <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>الأولوية</th><th class="text-center">الحالة</th></tr></thead>
                    <tbody>
                    @forelse ($device->tickets as $ticket)
                        <tr>
                            <td><a href="{{ route('tickets.show', $ticket) }}" class="text-decoration-none">{{ $ticket->code }}</a></td>
                            <td class="small">{{ $ticket->subject }}</td>
                            <td>{!! badge($ticket->priority_label, $ticket->priority_color) !!}</td>
                            <td class="text-center">{!! badge($ticket->status_label, $ticket->status_color) !!}</td>
                        </tr>
                    @empty
                        <tr><td colspan="4" class="text-center text-muted py-4">لا توجد تذاكر</td></tr>
                    @endforelse
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
@endsection