@php
    $ticket = $ticket ?? null;
    $preset = $preset ?? ['customer_id' => null, 'vehicle_id' => null, 'device_unit_id' => null];
    $selectedCustomer = old('customer_id', $ticket?->customer_id ?? $preset['customer_id']);
@endphp

<div class="row g-3">
    <div class="col-12"><div class="form-section-title"><i class="fa-solid fa-headset"></i>بيانات التذكرة</div></div>

    <div class="col-md-4">
        <label class="form-label">العميل <span class="req">*</span></label>
        <select name="customer_id" id="ticketCustomer" class="form-select select2" data-placeholder="اختر العميل" required>
            <option value="">— اختر العميل —</option>
            @foreach ($customers as $c)
                <option value="{{ $c->id }}" @selected((int) $selectedCustomer === $c->id)>{{ $c->display_name }} — {{ $c->phone }}</option>
            @endforeach
        </select>
    </div>

    <div class="col-md-4">
        <label class="form-label">المركبة</label>
        <select name="vehicle_id" id="ticketVehicle" class="form-select select2" data-placeholder="اختر المركبة">
            <option value="">— بدون —</option>
            @foreach ($vehicles as $v)
                <option value="{{ $v->id }}" data-customer="{{ $v->customer_id }}"
                    @selected((int) old('vehicle_id', $ticket?->vehicle_id ?? $preset['vehicle_id']) === $v->id)>
                    {{ $v->plate_number }}
                </option>
            @endforeach
        </select>
    </div>

    <div class="col-md-4">
        <label class="form-label">الجهاز</label>
        <select name="device_unit_id" class="form-select select2" data-placeholder="اختر الجهاز">
            <option value="">— بدون —</option>
            @foreach ($devices as $d)
                <option value="{{ $d->id }}" @selected((int) old('device_unit_id', $ticket?->device_unit_id ?? $preset['device_unit_id']) === $d->id)>
                    {{ $d->imei }} — {{ $d->product?->name }}
                </option>
            @endforeach
        </select>
    </div>

    <div class="col-12">
        <label class="form-label">الموضوع <span class="req">*</span></label>
        <input type="text" name="subject" value="{{ old('subject', $ticket?->subject) }}" class="form-control" required
               placeholder="مثال: الجهاز لا يرسل إحداثيات">
    </div>

    <div class="col-md-3">
        <label class="form-label">النوع <span class="req">*</span></label>
        <select name="type" class="form-select" required>
            @foreach ($types as $k => $v)
                <option value="{{ $k }}" @selected(old('type', $ticket?->type ?? 'technical') === $k)>{{ $v }}</option>
            @endforeach
        </select>
    </div>

    <div class="col-md-3">
        <label class="form-label">الأولوية <span class="req">*</span></label>
        <select name="priority" class="form-select" required>
            @foreach ($priorities as $k => $v)
                <option value="{{ $k }}" @selected(old('priority', $ticket?->priority ?? 'medium') === $k)>{{ $v }}</option>
            @endforeach
        </select>
    </div>

    <div class="col-md-3">
        <label class="form-label">الحالة <span class="req">*</span></label>
        <select name="status" class="form-select" required>
            @foreach ($statuses as $k => $v)
                <option value="{{ $k }}" @selected(old('status', $ticket?->status ?? 'open') === $k)>{{ $v }}</option>
            @endforeach
        </select>
    </div>

    <div class="col-md-3">
        <label class="form-label">المسؤول</label>
        <select name="assigned_to" class="form-select select2" data-placeholder="اختر المسؤول">
            <option value="">— لم يُسند —</option>
            @foreach ($users as $k => $v)
                <option value="{{ $k }}" @selected((int) old('assigned_to', $ticket?->assigned_to) === (int) $k)>{{ $v }}</option>
            @endforeach
        </select>
    </div>

    <div class="col-12">
        <label class="form-label">تفاصيل المشكلة</label>
        <textarea name="description" class="form-control" rows="4">{{ old('description', $ticket?->description) }}</textarea>
    </div>

    <div class="col-12">
        <label class="form-label">الحل / الإجراء المتخذ</label>
        <textarea name="resolution" class="form-control" rows="3">{{ old('resolution', $ticket?->resolution) }}</textarea>
    </div>
</div>

<div class="d-flex gap-2 mt-4">
    <button type="submit" class="btn btn-primary"><i class="fa-solid fa-floppy-disk ms-2"></i>حفظ</button>
    <a href="{{ route('tickets.index') }}" class="btn btn-light">إلغاء</a>
</div>

@push('scripts')
<script>
$(function () {
    function filterVehicles() {
        const customerId = String($('#ticketCustomer').val() || '');
        $('#ticketVehicle option').each(function () {
            if (!$(this).val()) return;
            $(this).prop('disabled', customerId && String($(this).data('customer')) !== customerId);
        });
        $('#ticketVehicle').trigger('change.select2');
    }
    $('#ticketCustomer').on('change', filterVehicles);
    filterVehicles();
});
</script>
@endpush