@extends('_layout')

@section('content')
  <!-- Page Heading -->
  <h1 class="h6 mb-2 text-gray-800">Fiscalização</h1>

  <h2 class="h3 mb-4">RMO</h2>

  <div class="card shadow mb-4">
    <div class="card-body">
      <div class="table-responsive">
        <div id="dataTable_wrapper" class="dataTables_wrapper dt-bootstrap4">
          <div class="row">
            <div class="col-md-6">
              <div class="dataTables_length" id="dataTable_length">
                <label>Mostrar
                  <select name="dataTable_length" aria-controls="dataTable"
                          class="custom-select custom-select-sm form-control form-control-sm">
                    <option value="10">10</option>
                    <option value="25">25</option>
                    <option value="50">50</option>
                    <option value="100">100</option>
                  </select>
                  registros
                </label>
              </div>
            </div>
            <div class="col-md-6">
              <div id="dataTable_filter" class="dataTables_filter">
                <label>Buscar:
                  <input type="search" class="form-control form-control-sm" aria-controls="dataTable">
                </label>
              </div>
            </div>
          </div>
          <div class="row">
            <div class="col-sm-12">
              <table class="table table-bordered dataTable" id="dataTable" role="grid" aria-describedby="dataTable_info"
                     style="width: 100%;" width="100%" cellspacing="0">
                <thead>
                <tr role="row">
                  <th class="sorting_asc" tabindex="0" aria-controls="dataTable" rowspan="1" colspan="1"
                      style="width: 255px;" aria-sort="ascending" aria-label="Name: activate to sort column descending">
                    Documento
                  </th>
                  <th class="sorting" tabindex="0" aria-controls="dataTable" rowspan="1" colspan="1"
                      style="width: 382px;" aria-label="Position: activate to sort column ascending">
                    Resumo
                  </th>
                  <th class="sorting" tabindex="0" aria-controls="dataTable" rowspan="1" colspan="1"
                      style="width: 187px;" aria-label="Office: activate to sort column ascending">
                    Entrada
                  </th>
                  <th class="sorting" tabindex="0" aria-controls="dataTable" rowspan="1" colspan="1"
                      style="width: 178px;" aria-label="Start date: activate to sort column ascending">
                    Dias Aqui
                  </th>
                </tr>
                </thead>
                <tbody>


                @foreach($documentos as $documento)
                <tr role="row" class="{{ $loop->odd ? 'odd' : 'even' }}">
                  <td class="sorting_1">
                    <a href="{{ route('documento.edit', 1) }}" type="button" class="btn btn-outline-primary">
                      {{ $documento['documento'] }}
                    </a>
                  </td>
                  <td>{{ $documento['resumo'] }}</td>
                  <td>{{ $documento['início'] }}</td>
                  <td class="heat-{{ $documento['heat'] }}">{{ $documento['dias_aqui'] }}</td>
                </tr>
                @endforeach

                </tbody>
              </table>
            </div>
          </div>
          <div class="row">
            <div class="col-md-5">
              <div class="dataTables_info" id="dataTable_info" role="status" aria-live="polite">Mostrando 1 a 10 de 57
                registros
              </div>
            </div>
            <div class="col-md-7">
              <div class="dataTables_paginate paging_simple_numbers" id="dataTable_paginate">
                <ul class="pagination">
                  <li class="paginate_button page-item previous disabled" id="dataTable_previous">
                    <a href="#" aria-controls="dataTable" data-dt-idx="0" tabindex="0" class="page-link">Anteriores</a>
                  </li>
                  <li class="paginate_button page-item active">
                    <a href="#" aria-controls="dataTable" data-dt-idx="1" tabindex="0" class="page-link">1</a>
                  </li>
                  <li class="paginate_button page-item ">
                    <a href="#" aria-controls="dataTable" data-dt-idx="2" tabindex="0" class="page-link">2</a>
                  </li>
                  <li class="paginate_button page-item ">
                    <a href="#" aria-controls="dataTable" data-dt-idx="3" tabindex="0" class="page-link">3</a>
                  </li>
                  <li class="paginate_button page-item ">
                    <a href="#" aria-controls="dataTable" data-dt-idx="4" tabindex="0" class="page-link">4</a>
                  </li>
                  <li class="paginate_button page-item ">
                    <a href="#" aria-controls="dataTable" data-dt-idx="5" tabindex="0" class="page-link">5</a>
                  </li>
                  <li class="paginate_button page-item ">
                    <a href="#" aria-controls="dataTable" data-dt-idx="6" tabindex="0" class="page-link">6</a>
                  </li>
                  <li class="paginate_button page-item next" id="dataTable_next">
                    <a href="#" aria-controls="dataTable" data-dt-idx="7" tabindex="0" class="page-link">Próximos</a>
                  </li>
                </ul>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
@endsection