@extends('layouts.app')
@section("breadcrumb")
<li class="active">@lang('fleet.expense')</li>
@endsection
@section('content')

    <div class="row">
        <div class="col-md-12">
            <div class="box box-success">
                <div class="box-header with-border">
                <h3 class="box-title">@lang('fleet.addRecord')
                </h3>
                </div>

                <div class="box-body">
                  <div class="row">
                @if (count($errors) > 0)
<div class="alert alert-danger">
<ul>
@foreach ($errors->all() as $error)
<li>{{ $error }}</li>
@endforeach
</ul>
</div>
@endif
{!! Form::open(['route' => 'expense.store','method'=>'post','class'=>'form-inline','id'=>'exp_form']) !!}

<div class="col-md-2">
  <select id="vehicle_id" name="vehicle_id" class="form-control vehicles" style="width: 170px" required>
  <option value="" >@lang('fleet.selectVehicle')</option>
    @foreach($vehicels as $vehicle)
    <option value="{{ $vehicle->id }}">{{$vehicle->make}}-{{$vehicle->model}}-{{$vehicle->license_plate}}</option>
    @endforeach
  </select>
</div>
<div class="col-md-2">
  <select id="expense_type" name="expense_type" class="form-control vehicles" style="width: 160px" required>
  <option value="" >@lang('fleet.expenseType')</option>
    @foreach($types as $type)
    <option value="{{ $type->id }}">{{$type->name}}</option>
    @endforeach
    <optgroup label="@lang('fleet.serviceItems')">
    @foreach($service_items as $item)
    <option value="{{ $item->id }}">{{$item->description}}</option>
    @endforeach
  </optgroup>
  </select>
</div>
<div class="col-md-2">
    <div class="input-group mb-2 mr-sm-2 mb-sm-0">
    <div class="input-group-addon">{{Hyvikk::get('currency')}}</div>
  <input required="required" name="revenue" type="number" step="0.01" id="revenue" class="form-control">
  </div>
</div>
<div class="col-md-3">
 <div class="input-group mb-2 mr-sm-2 mb-sm-0">
  <input  name="comment" type="text" id="comment" class="form-control" placeholder=" @lang('fleet.note')" style="width: 250px">
</div>
</div>
<div class="col-md-2">
<div class="input-group date">
  <div class="input-group-addon"><i class="fa fa-calendar"></i></div>
 <input  name="date" type="text"  id="date" value="{{ date('Y-m-d')}}" class="form-control">
</div>
</div>
<div class="col-md-1">
  <button type="submit" class="btn btn-success">@lang('fleet.add')</button>
</div>
{!! Form::close() !!}
                  </div>
                </div>
            </div>
        </div>
    </div>

<!--                      TABLE             -->

    <div class="row">
        <div class="col-md-12">
            <div class="box box-primary">
                <div class="box-header with-border">

                  <div class="row">
                  <div class="col-md-3">
                    <h3 class="box-title"> @lang('fleet.todayExpense') : <strong>{{ $total}}</strong> </h3>
                  </div>
                 <div class="col-md-8 pull-right">

                  {!! Form::open(['url'=>'/expense_records','class'=>'form-inline']) !!}

                  <div class="form-group">
                    {!! Form::label('date1','From',['class'=>'control-label']) !!}
                    <div class="input-group date">
                      <div class="input-group-addon"><i class="fa fa-calendar"></i></div>
                     {!! Form::text('date1', null,['class' => 'form-control','placeholder'=> __('fleet.start_date')]) !!}
                    </div>

                  </div>


                  <div class="form-group">
                    {!! Form::label('date2','To') !!}
                     <div class="input-group date">
                      <div class="input-group-addon"><i class="fa fa-calendar"></i></div>
                     {!! Form::text('date2', null,['class' => 'form-control','placeholder'=>__('fleet.end_date')]) !!}
                    </div>

                   </div>


                  <div class="form-group ">
                     <button type="submit" class="btn btn-primary">
                       <i class="fa fa-search"></i>
                     </button>
                   </div>

                  {!! Form::close() !!}

                 </div>
                </div>


                </div>

                <div class="box-body table-responsive" id="expenses">
<table class="table" id="data_table">
  <thead class="thead-inverse">
    <tr>

      <th>@lang('fleet.make')</th>
      <th>@lang('fleet.model')</th>
      <th>@lang('fleet.licensePlate')</th>
      <th>@lang('fleet.expenseType')</th>
      <th>@lang('fleet.date')</th>
      <th>@lang('fleet.amount')</th>
      <th>@lang('fleet.note')</th>
      <th>@lang('fleet.delete')</th>
    </tr>
  </thead>
  <tbody>
  @foreach($today as $row)
     <tr>

      <td>{{$row->vehicle->make}}</td>

      <td>{{$row->vehicle->model}}</td>
      <td>{{$row->vehicle->license_plate}}</td>
      <td>{{$row->category->name}}</td>
      <td>{{$row->date}}</td>
      <td>
        {{Hyvikk::get('currency')}}
        {{$row->amount}}</td>

      <td>{{$row->comment}}</td>
      <td>
        {!! Form::open(['url' => 'expense/'.$row->id,'method'=>'DELETE','class'=>'form-horizontal del_form','id'=>'form_'.$row->id]) !!}

          {!! Form::hidden("id",$row->id) !!}

        <button type="button" class="btn btn-danger delete" id="btn_delete" data-id="{{$row->id}}" title="@lang('fleet.delete')">
          <span class="glyphicon glyphicon-remove" aria-hidden="true"></span></button>


        {!! Form::close() !!}
      </td>

    </tr>
  @endforeach

  </tbody>
  </table>


                </div>

            </div>
        </div>
    </div>



<!-- Modal -->
          <div id="myModal" class="modal fade" role="dialog">
            <div class="modal-dialog">

              <!-- Modal content-->
              <div class="modal-content">
                <div class="modal-header">
                  <button type="button" class="close" data-dismiss="modal">&times;</button>
                  <h4 class="modal-title">@lang('fleet.delete')</h4>
                </div>
                <div class="modal-body">
                  <p>@lang('fleet.confirm_delete')</p>
                </div>
                <div class="modal-footer">
                  <button id="del_btn" class="btn btn-danger" type="button" data-submit="">@lang('fleet.delete')</button>
                  <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>

                </div>
              </div>

            </div>
          </div>

<!-- Modal -->
@endsection


@section("script")

<script src="{{ asset('js/moment.js') }}"></script>
<script src="{{ asset('js/datetimepicker.js') }}"></script>
<script src="{{ asset('js/select2.min.js') }}"></script>
<script type="text/javascript">
$(document).ready(function() {
  $(".vehicles").select2();

  $('#date').datetimepicker({format: 'YYYY-MM-DD'});
  $('#date1').datetimepicker({format: 'YYYY-MM-DD'});
  $('#date2').datetimepicker({format: 'YYYY-MM-DD'});
   $('#expense_type').change(function() {

    $("#revenue").val($(this).find(':selected').data('amount'));

    });

   $("#del_btn").on("click",function(){
    var id=$(this).data("submit");
    $("#form_"+id).submit();
  });
   $('#myModal').on('show.bs.modal', function(e) {
  var id = e.relatedTarget.dataset.id;
  $("#del_btn").attr("data-submit",id);
    });


   $(document).on("click",".delete",function(e){
    var hvk=confirm("Are you sure?");
    if(hvk==true){
    var id=$(this).data("id");

    var action="{{ url('expense')}}"+"/" +id;

        $.ajax({
        type: "POST",
        url: action,
        data: "_method=DELETE&_token="+window.Laravel.csrfToken+"&id="+id,
        success: function(data){
          $("#expenses").empty();
          $("#expenses").html(data);
        new PNotify({
              title: 'Deleted!',
              text: '@lang("fleet.deleted")',
              type: 'wanring'
          })
        }
      ,
      dataType: "HTML",
});
   }
  });

});
</script>
@endsection