@extends('admin.layouts.master')

@section('title', 'إضافة مقطورة')

@section('css')
<link rel="stylesheet" href="{{ asset('dash/assets/css/plugins/select2.min.css') }}">
<link rel="stylesheet" href="{{ asset('dash/assets/css/plugins/select2-bootstrap-5-theme.min.css') }}">
@endsection

@section('content')
<div class="pc-container">
    <div class="pc-content">
        <div class="page-header d-flex justify-content-between align-items-center mb-3">
            <h4 class="mb-0">إضافة مقطورة</h4>
            <a href="{{ route('admin.trailers.index') }}" class="btn btn-light">رجوع</a>
        </div>

        @if($errors->any())
            <div class="alert alert-danger">
                <ul class="mb-0">@foreach($errors->all() as $e)<li>{{ $e }}</li>@endforeach</ul>
            </div>
        @endif

        <div class="card">
            <div class="card-body">
                <form action="{{ route('admin.trailers.store') }}" method="POST">
                    @csrf
                    @include('admin.trailers._form')
                    <hr>
                    <div class="text-end">
                        <a href="{{ route('admin.trailers.index') }}" class="btn btn-light me-2">إلغاء</a>
                        <button type="submit" class="btn btn-primary">حفظ</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
@endsection

@section('js')
<script src="{{ asset('dash/assets/js/plugins/select2.min.js') }}"></script>
<script>
$(function () {
    var $customerSelect = $('.js-customer-select2');

    if (!$.fn.select2 || !$customerSelect.length) {
        return;
    }

    $customerSelect.each(function () {
        var $el = $(this);

        if ($el.hasClass('select2-hidden-accessible')) {
            return;
        }

        $el.select2({
            theme: 'bootstrap-5',
            width: '100%',
            dir: 'rtl',
            language: 'ar',
            placeholder: $el.data('placeholder') || 'اختر العميل',
            allowClear: true
        });
    });
});
</script>
@endsection