@extends('client/layouts/contentNavbarLayout')

@section('title')
    GARAGE DETAILS
@endsection


@section('page-script')

@endsection

@section('content')
<div class="row">

    <div class="col-md-12">
        <div class="card mb-3" style="min-height: 200px">
            <div class="row g-0">
                <div class="col-md-4">
                    <img class="card-img card-img-left" src="{{ asset('img/garage.jpg') }}" alt="Garage image" style="height: 200px">
                </div>
                <div class="col-md-8">
                    <div class="card-body">
                        <div class="row">
                            <div class="col-10">
                                <h4 class="font-weight-bold" style="color: black; font-weight: 600">{{ $vendor['name'] }}</h4>
                            </div>
                            <div class="col-2 text-color menu-link gap-2">
                                <div>4.5</div>
                                <i class='bx bxs-star'></i>
                            </div>
                        </div>
                        <p class="card-text">
                            {{ $vendor['address'] }}
                        </p>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="col-12">
        <div class="card p-4">
            <div class="form-group">
                <label for="vehicle" class="h5">Véhicules</label>
                <select class="form-select" name="vehicle" id="vehicle">
                    <option selected="">Sélectionner</option>
                    @foreach ($vehicles as $vehicle)
                    <option class="px-2" value="{{ $vehicle['id'] }}">{{ $vehicle->mark . ' ' . $vehicle->model . ' ' . $vehicle->version }}</option>
                    @endforeach
                </select>
            </div>

            <div class="form-group">
                <label for="position" class="h5 mt-3">Point de départ</label>
                <div class="row">
                    <div class="col-md-10">
                        <input type="text" class="form-control" name="position" id="position" disabled>
                    </div>
                    <div class="col-md-2">
                        <button class="btn btn-info" name="position">Changer</button>
                    </div>
                </div>
            </div>

            <hr class="dropdown-divider my-4">

            <div class="form-group">
                <label for="vendor-service" class="h5">Service</label>
                <select class="form-select" name="vendor_service" id="vendor-service">
                    <option selected="">Sélectionner</option>
                    @foreach ($vendor['services'] as $service)
                    <option class="px-2" value="{{ $service['id'] }}">{{ $service['name'] }}</option>
                    @endforeach
                </select>
            </div>

            <hr class="dropdown-divider my-4">

            <div class="form-group">
                <label for="date" class="h5">La date</label>
                <input type="date" class="form-control" name="date" id="date">
            </div>

            <hr class="dropdown-divider my-4">

            <div class="form-group">
                <label for="additional-information" class="h5">Informations complémentaires (facultatif)</label>
                <textarea name="additional_nformation" id="additional-information" rows="6" class="form-control"></textarea>
            </div>

            <hr class="dropdown-divider my-4">

            <div class="form-check gap-2">
                <label for="driver" class="form-check-label">Je veux un chauffeur de DADYCAR</label>
                <input class="form-check-input" type="checkbox" id="driver" name="driver" checked>
            </div>

            <div class="text-center mt-4">
                <button class="btn btn-primary">Confirmer</button>
            </div>
        </div>
    </div>


</div>
@endsection

@section('scripts')

@endsection