@extends('layouts.main')
@push('styles')
<link href="{{asset('css/daterangepicker.css')}}" rel='stylesheet' />
@endpush
@section('content')
<div class="row">
  <div class="col-md-12">
    <form class="card" method="post" action="{{route('vehicles_post_new')}}">
      {{csrf_field()}}
      <div class="card-body">
      <h3 class="card-title">{{__('strings.vehicles_create_header')}}</h3>

        <div class="row">
          <div class="col-md-6">
            <div class="form-group">
              <label class="form-label">{{__('strings.alias')}}</label>
              <input type="text" name="alias" class="form-control" placeholder="{{__('strings.alias')}}">
            </div>
          </div>
          <div class="col-md-6">
            <div class="form-group">
              <label class="form-label">{{__('strings.plates')}}</label>
              <input type="text" name="plates" class="form-control" placeholder="{{__('strings.plates')}}" required/>
            </div>
          </div>
          <div class="col-md-6">
            <div class="form-group">
              <label class="form-label">{{__('strings.brand')}}</label>
              <input type="text" name="brand" class="form-control" placeholder="{{__('strings.brand')}}" maxlength="255" required />
            </div>
          </div>
          <div class="col-md-6">
            <div class='form-group'>
              <label class="form-label">{{__('strings.model')}}</label>
              <input type="text" name='model' class="form-control" placeholder="{{__('strings.model')}}" maxlength="255" required />
            </div>
          </div>
          <div class="col-md-6">
            <div class="form-group">
              <label class="form-label">{{__('strings.year')}}</label>
              <input type="text" name="year" class="form-control" placeholder="{{__('strings.year')}}" maxlength="255" required />
            </div>
          </div>
          <div class="col-md-6">
            <div class="form-group">
              <label class="form-label">{{__('strings.color')}}</label>
              <div class="input-group">
                <input type="text" name="color_name" class="form-control" placeholder="{{__('strings.color')}}" />
                <span class="input-group-append">
                  <input type="color" name="color_hex" class="btn btn-icon form-control" value="#303F9F"/>
                </span>
              </div>
            </div>
          </div>
          <div class="col-md-6">
            <div class="form-group">
              <label class="form-label">{{__('strings.vehicle_type')}} [{{__('strings.max_passengers')}}]</label>
              <select name="vehicle_type_id" class="form-control custom-select">
                @php $vehicleTypes = \App\Models\VehicleType::all(); @endphp
                @foreach($vehicleTypes as $vehicle)
                <option value="{{$vehicle->id}}">{{$vehicle->name ?? ''}} [{{$vehicle->number_of_passengers}}]</option>
                @endforeach
              </select>
            </div>
          </div>
        </div>

        <div class="card-footer text-right">
          <button type="submit" class="btn btn-primary">{{__('strings.submit_store')}}</button>
        </div>
    </form>
  </div>
</div>
@endsection('content')

@push('scripts')
<script src="{{asset('js/daterangepicker.js')}}" type="text/javascript"></script>
@endpush('scripts')