@extends('layout.index')
@section('title','Vehicle Add')
<!-- Dashboard Ecommerce start -->
@section('content')
<section>
   
    <div class="content-body">
        <!-- Bordered table start -->
        <div class="row" id="table-bordered">
           <div class="col-12">
              <div class="card">
                 <div class="card-header w-100" >
                    <div class="content-header-left">
                       <div class="row breadcrumbs-top">
                          <div class="col-sm-12">
                             <h2 class="content-header-title float-left mb-0">Add Vehicle</h2>
                          </div>
                       </div>
                    </div>
                    <div class="d-flex justify-content-end breadcrumb-wrapper">
                       <nav aria-label="breadcrumb">
                          <ol class="breadcrumb mr-1">
                             <li class="breadcrumb-item"><a href="javascript:void(0)">Home</a></li>
                             <li class="breadcrumb-item">Vehicle Master</li>
                             <li class="breadcrumb-item active" aria-current="page">Add</li>
                          </ol>
                       </nav>
                    </div>
                 </div>
              </div>
           </div>
        </div>
        <!-- Bordered table end -->
     </div>

    @if ($message = Session::get('success'))
        <div class="demo-spacing-0 mb-1">
            <div class="alert alert-success alert-dismissible fade show" role="alert">
                <div class="alert-body">
                    {{-- <i class="fa fa-exclamation-triangle" aria-hidden="true"></i> --}}
                        {{ $message }}
                    <button type="button" class="close" data-dismiss="alert" aria-label="Close">

                </div>
                <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
                </button>
            </div>
        </div>
    @endif
   
   <div class="content-body">
        <section id="multiple-column-form">
            <div class="row justify-content-center">
                <div class="col-sm-12">
                    <div class="card">
                        <div class="card-body">
                            <form class="form" action="{{route('vehicle_master.store')}}" method="post">
                                {{csrf_field()}}                        
                                    <div class="row">
                                        
                                        <div class="col-md-6 col-12">
                                            <div class="form-group">
                                                <label for="basicSelect">Pakage <span style="color: red;">*</span></label>
                                                <select class="select2 form-select" id="Pakage_id" name="Pakage_id">
                                                <option value="">Select Pakage</option>
                                                @foreach($Pakages as $val)
                                                    <option value="{{ $val->id }}">{{ $val->Pakage_name }}</option>
                                                @endforeach 
                                                </select>
                                                <h5><small class="text-danger" id="Pakage_id_err"></small></h5>
                                            </div>
                                         </div>

                                        <div class="col-md-6 col-12">
                                            <div class="form-group">
                                                <label for="module_caption">Vehicle Number <span style="color: red;">*</span></label>
                                                <input type="text" id="vehicle_number" class="form-control" placeholder="Enter Vehicle Number" name="vehicle_number" value="{{ old('vehicle_number') }}" autocomplete="off"/>
                                                @error('vehicle_number')<span class="error" style="color: red;">{{ $message }}</span>@enderror
                                                <h4><small class="text-danger" id="vehicle_number_err"></small></h4>
                                            </div>
                                        </div>
                                        <div class="col-md-6 col-12">
                                            <div class="form-group">
                                                <label for="device_number">Device Number <span style="color: red;">*</span></label>
                                                <input type="text" id="device_number" class="form-control" placeholder="Enter Device Number" name="device_number" value="{{ old('device_number') }}" autocomplete="off" onkeypress="return isNumberKey(event)"/>
                                                @error('device_number')<span class="error" style="color: red;">{{ $message }}</span>@enderror
                                                <h5><small class="text-danger" id="device_number_err"></small></h5>
                                            </div>
                                        </div>
                                        <div class="col-md-6 col-12">
                                            <div class="form-group">
                                                <label for="sim_number">Sim Number <span style="color: red;">*</span></label>
                                                <input type="text" id="sim_number" class="form-control" name="sim_number" placeholder="Enter Sim Number" value="{{ old('sim_number') }}" autocomplete="off" onkeypress="return isNumberKey(event)"/>
                                                @error('sim_number')<span class="error" style="color: red;">{{ $message }}</span>@enderror
                                                <h5><small class="text-danger" id="sim_number_err"></small></h5>
                                            </div>
                                        </div>
                                        <div class="col-md-6 col-12">
                                            <div class="form-group">
                                                <label for="rfid_number">RFID Number <span style="color: red;">*</span></label>
                                                <input type="text" id="rfid_number" class="form-control" name="rfid_number" placeholder="Enter RFID Number" value="{{ old('rfid_number') }}" autocomplete="off" />
                                                @error('rfid_number')<span class="error" style="color: red;">{{ $message }}</span>@enderror
                                                <h5><small class="text-danger" id="rfid_number_err"></small></h5>

                                            </div>
                                        </div>
                                        <div class="col-md-6 col-12">
                                            <div class="form-group">
                                                <label for="description">Description </label>
                                                <input type="text" id="description" class="form-control" name="description" placeholder="Enter Description" value="{{ old('description') }}" autocomplete="off" />
                                               
                                            </div>
                                        </div>
                                        <!-- <div class="col-md-6 col-12">
                                            <div class="form-group">
                                                <label for="tank_size">Tank Size (In Liter)</label>
                                                <input type="text" id="tank_size" class="form-control" name="tank_size" placeholder="Enter Tank Size (In Liter)" value="{{ old('tank_size') }}"  />
                                                <h5><small class="text-danger" id="tank_size_err"></small></h5>
                                            </div>
                                        </div>
                                        <div class="col-md-6 col-12">
                                            <div class="form-group">
                                                <label for="max_voltage">Max Voltage</label>
                                                <input type="text" id="max_voltage" class="form-control" name="max_voltage" placeholder="Enter Max Voltage" value="{{ old('max_voltage') }}"  />
                                            </div>
                                        </div> -->
                                        <hr class="m-1">
                                        <div class="col-12 text-center mt-1">
                                            <input type="submit" name="command" class="btn btn-primary mr-1" value="Save" onClick="return validation()">
                                            <a href="{{ route('vehicle_master.index') }}" class="btn btn-outline-secondary">Cancel</a>
                                        </div>
                                    </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </section>
   </div>
</section>
@endsection

<script type="text/javascript">
	function validation() {
      
        if ($('#Pakage_id').val() == ""){
            $('#Pakage_id').parent().addClass('has-error');
            $('#Pakage_id_err').html('Please Select Pakage.');
            $('#Pakage_id').focus();
            $('#Pakage_id').change(function () {
            $('#Pakage_id').parent().removeClass('has-error');
            $('#Pakage_id_err').html('');
            });
            return false;
        }

        if ($('#vehicle_number').val() == ""){
            $('#vehicle_number').parent().addClass('has-error');
            $('#vehicle_number_err').html('Please Enter Vehicle Number.');
            $('#vehicle_number').focus();
            $('#vehicle_number').keyup(function () {
            $('#vehicle_number').parent().removeClass('has-error');
            $('#vehicle_number_err').html('');
            });
            return false;
        }
        
        if ($('#device_number').val() == ""){
            $('#device_number').parent().addClass('has-error');
            $('#device_number_err').html('Please Enter Device Number.');
            $('#device_number').focus();
            $('#device_number').keyup(function () {
            $('#device_number').parent().removeClass('has-error');
            $('#device_number_err').html('');
            });
            return false;
        }

        if ($('#sim_number').val() == ""){
            $('#sim_number').parent().addClass('has-error');
            $('#sim_number_err').html('Please Enter Sim Number.');
            $('#sim_number').focus();
            $('#sim_number').keyup(function () {
            $('#sim_number').parent().removeClass('has-error');
            $('#sim_number_err').html('');
            });
            return false;
        }

        if ($('#rfid_number').val() == ""){
            $('#rfid_number').parent().addClass('has-error');
            $('#rfid_number_err').html('Please Enter RFID Number.');
            $('#rfid_number').focus();
            $('#rfid_number').keyup(function () {
            $('#rfid_number').parent().removeClass('has-error');
            $('#rfid_number_err').html('');
            });
            return false;
        }

        
    }

    function isNumberKey(evt){
        var charCode = (evt.which) ? evt.which : evt.keyCode
        if (charCode > 31 && (charCode < 48 || charCode > 57))
            return false;
        return true;
    }
</script>