@extends('layouts.app')

@section('content')
<div class="col-12">

</div>
<div class="col-12">
    <div class="card card-chart">
        <div class="card-header">
            <h5 class="title mb-0">Vehicles</h5>
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb"style="background-color: white; padding-left: 2px">
                    <li class="breadcrumb-item"><a href="{{ route('home') }}">Home</a></li>
                    <li class="breadcrumb-item"><a href="{{ route('vehicle') }}">Vehicles</a></li>
                    <li class="breadcrumb-item active" aria-current="page">{{ $vehicle->plate }}</li>
                </ol>
            </nav>
            <div class="dropdown">
              <button type="button" class="btn btn-round btn-outline-default dropdown-toggle btn-simple btn-icon no-caret" data-toggle="dropdown">
                <i class="now-ui-icons loader_gear"></i>
              </button>
              <div class="dropdown-menu dropdown-menu-right">
                <a class="dropdown-item" href="{{ route('vehicle.edit', [ 'id' => $vehicle->id ]) }}">Update</a>
                {{-- <a class="dropdown-item" href="{{ route('vehicle.delete', [ 'id' => $vehicle->id ]) }}">Delete</a> --}}
              </div>
            </div>
        </div>
        <div class="card-body">
            <div class="row">
                <div class="col-4">
                    <small class="text-secondary">Plate</small>
                    <h5 class="ml-3">{{ $vehicle->plate }}</h5>
                </div>
                <div class="col-4">
                    <small class="text-secondary">C.R. No.</small>
                    <p class="ml-3">{{ $vehicle->cr_number }}</p>
                </div>
                <div class="col-4">
                    <small class="text-secondary">Provider</small>
                    <p class="ml-3">{{ $vehicle->provider }}</p>
                </div>
                <div class="col-4">
                    <small class="text-secondary">Category</small>
                    <p class="ml-3">{{ $vehicle->category }}</p>
                </div>
                <div class="col-4">
                    <small class="text-secondary">Product</small>
                    <p class="ml-3">{{ $vehicle->product }}</p>
                </div>
                <div class="col-4">
                    <small class="text-secondary">Effectivity</small>
                    <p class="ml-3">{{ $vehicle->effectivity }}</p>
                </div>
                <div class="col-4">
                    <small class="text-secondary">Expiration</small>
                    <p class="ml-3">{{ $vehicle->expiration }}</p>
                </div>
                <div class="col-4">
                    <small class="text-secondary">Status</small>
                    <p class="ml-3">{{ $vehicle->status }}</p>
                </div>
            </div>
        </div>
        <div class="card-footer">
        </div>
    </div>
</div>

@endsection
@section('script')
  <script>

    let deleteProductId;
    function deleteProduct(id, name) {
        deleteProductId = id
        $('#lblProductName').html(name)
        $('#mdlDelete').modal('show')
    }


    function confirmDeleteBank() {
        $.ajax({
            url : "{{ route('insuranceproduct.delete') }}",
            data: {
                '_token': '{{ csrf_token() }}',
                'id': deleteProductId,
            },
            type: 'post',
            dataType: 'json',
            success: function( result )
            {
                let row = document.getElementById('trp'+ result.deletedID);
                row.parentNode.removeChild(row);
                $('#mdlDelete').modal('hide')
            },
            error: function(error)
            {
                notif.showNotification('top','right', 'danger', 'Something went wrong the record was not updated')
            }
        });
    }

  </script>

@endsection