@extends('adminlte::page')

@section('title', 'Reports by month')

@section('content_header')


@section('content')
<script type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="/bower_components/datatables/media/css/jquery.dataTables.css">
<div class="modal fade" id="import">
    <div class="modal-dialog">
      <div class="modal-content">
          <form action="/import" method="post" enctype="multipart/form-data">
          @csrf
        <div class="modal-header">
          <h4 class="modal-title">Import</h4>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">×</span>
          </button>
        </div>
        <div class="modal-body">
                        <select name="company" class="form-control">
                <option value="Coool">Coool</option>
                <option value="Fulger Inc Brokers" selected="">Fulger Inc Brokers</option>
                <option value="Fulger INC Company">Fulger INC Company</option>
                <option value="Fulger USA">Fulger USA</option>
                <option value="Fulger Transport INC">Fulger Transport INC</option>
            </select><br/>
                    <input type="file" id="report" name="reports[]" multiple="multiple" class="form-control"/> <br/>
                    <input type="submit" value="Import" class="btn btn-success">
        </div>
          </form>

        </div>
      </div>
      <!-- /.modal-content -->
</div>

<div class="modal fade" id="import-totals">
    <div class="modal-dialog">
      <div class="modal-content">
          <form action="/import-totals" method="post" enctype="multipart/form-data">
          @csrf
        <div class="modal-header">
          <h4 class="modal-title">Import totals</h4>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">×</span>
          </button>
        </div>
        <div class="modal-body">
            <select name="company" class="form-control">
                <option value="Coool">Coool</option>
                <option value="Fulger Inc Brokers">Fulger Inc Brokers</option>
                <option value="Fulger INC Company">Fulger INC Company</option>
                <option value="Fulger USA">Fulger USA</option>
                                <option value="Fulger Transport INC">Fulger Transport INC</option>

            </select>
            <input type="date" name="date" class="form-control"><br/>
                    <input type="file" id="report" name="reports[]" multiple="multiple" class="form-control"/> <br/>
                    <input type="submit" value="Import" class="btn btn-success">
        </div>
          </form>

        </div>
      </div>
      <!-- /.modal-content -->
</div>


<div class="modal fade" id="import-statements-totals">
    <div class="modal-dialog">
      <div class="modal-content">
          <form action="/import-statements-totals" method="post" enctype="multipart/form-data">
          @csrf
        <div class="modal-header">
          <h4 class="modal-title">Import statement totals</h4>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">×</span>
          </button>
        </div>
        <div class="modal-body">
            <select name="company" class="form-control">
                <option value="Coool">Coool</option>
                <option value="Fulger Inc Brokers">Fulger Inc Brokers</option>
                <option value="Fulger INC Company">Fulger INC Company</option>
                <option value="Fulger USA">Fulger USA</option>
                                <option value="Fulger Transport INC">Fulger Transport INC</option>

            </select>
                    <input type="file" id="report" name="reports[]" multiple="multiple" class="form-control"/> <br/>
                    <input type="submit" value="Import" class="btn btn-success">
        </div>
          </form>

        </div>
      </div>
      <!-- /.modal-content -->
</div>


<div class="card" style="margin-top:40px">
    <div class="card-header">
        <h3 class="card-title">Reports
        </h3>
      
    </div>

    <!-- /.card-header -->
    <div class="card-body">


        @if($reports->count()>0)
        <table class="table table-bordered table-hover table-striped">
            <thead>
                <th>Card #</th>
                <th>Group</th>
                <th>Date</th>
                <th>Site name</th>
                <th>Site #</th>
                <th>Tractor</th>
                <th>Fuel qty</th>
                <th>Price</th>
                <th>DEF</th>
                
                <th>Final amount</th>
                <th>Unit #</th>
                <th>Site city</th>
                <th>Prov state</th>
                <th>Reefer</th>
                <th>Fuel cost</th>
                <th>Total amount</th>
                <th>Currency</th>
            </thead>

            <tbody>
            @foreach($reports as $import)
                <tr>
                    <td>{{$import->card_no}}</td>
                    <td>{{$import->group}}</td>
                    <td>{{$import->date}}</td>
                    <td>{{$import->site_name}}</td>
                    <td>{{$import->site_no}}</td>
                    <td>{{$import->tractor}}</td>
                    <td>{{$import->fuel_qty}}</td>
                    <td>{{$import->price}}</td>
                    <td>{{$import->def}}</td>
                    <td>{{$import->final_amount}}</td>
                    <td>{{$import->unit_no}}</td>
                    <td>{{$import->site_city}}</td>
                    <td>{{$import->prov_state}}</td>
                    <td>{{$import->reefer}}</td>
                    <td>{{$import->fuel_cost}}</td>
                    <td>{{$import->total_amount}}</td>
                    <td>{{$import->currency}}</td>
                </tr>
            @endforeach

            </tbody>


        </table>
        @else
            <div class="callout callout-info">No reports has been imported yet!</div>
        @endif

{{$reports->links()}}


    </div>
    <!-- /.card-body -->
</div>
<script type="text/javascript" src="/bower_components/datatables/media/js/jquery.dataTables.min.js"></script>

<script
  src="https://code.jquery.com/jquery-3.4.1.min.js"
  integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
  crossorigin="anonymous"></script>

      <script type="text/javascript">
          $(document).ready( function () {
            $('#report_by_month').DataTable();
        } );
      </script>        
@stop