@extends('layout.administrator.layout')

@section('css')
<style>
  .imgLogoDomiciliary {
    width: 50px;
    height: 50px;
    border-radius: 5px;
  }
</style>
@endsection

@section('sideBody')
<div class="card shadow">
  <div class="">
    <div class="tab-content" id="myTabContent">
      <div class="tab-pane fade  show active p-0 m-0" id="tabs-icons-text-1" role="tabpanel" aria-labelledby="tabs-icons-text-1-tab">
        <button type="button" class="list-group-item list-group-item-action p-1">
          <div class="row ml-2 mr-2">
            <div class="col">
              <h6 class="card-title text-uppercase text-muted mb-0">
                Domiciliarios</h6>
              <span class="h5 font-weight-bold mb-0">{{$activos}} | <strong class="text-success text-uppercase">Activos</strong></span>
            </div>

            <div class="col-auto">
              <div class="icon-sm icon-shape bg-gradient-success text-white rounded-circle shadow">
                <i class="fas fa-user"></i>
              </div>
            </div>
          </div>
        </button>
        <button type="button" class="list-group-item list-group-item-action p-1">
          <div class="row ml-2 mr-2">
            <div class="col">
              <h6 class="card-title text-uppercase text-muted mb-0">
                Domiciliarios</h6>
              <span class="h5 font-weight-bold mb-0">{{$inactivos}} | <strong class="text-muted text-uppercase">INACTIVOS</strong></span>
            </div>
            <div class="col-auto">
              <div class="icon-sm icon-shape bg-gradient-dark text-white rounded-circle shadow">
                <i class="fas fa-user"></i>
              </div>
            </div>
          </div>
        </button>
        <button type="button" class="list-group-item list-group-item-action p-1">
          <div class="row ml-2 mr-2">
            <div class="col">
              <h6 class="card-title text-uppercase text-muted mb-0">
                Domiciliarios</h6>
              <span class="h5 font-weight-bold mb-0">{{$papelera}} | <strong class="text-danger text-uppercase">Vetados</strong></span>
            </div>
            <div class="col-auto">
              <div class="icon-sm icon-shape bg-gradient-danger text-white rounded-circle shadow">
                <i class="fas fa-user"></i>
              </div>
            </div>
          </div>
        </button>
      </div>
    </div>
  </div>
</div>
<div class="card ml-2 mt-2" style="width: 18rem; display: contents;">
  <ul class="list-group list-group-flush">
    <li class="list-group-item">
      <a href="/administrator/domiciliary/create" class="btn btn-success btn-icon ml-sm-3 d-none d-md-block">
        <span class="btn-inner--icon">
          <i class="fas fa-plus-circle"></i>
        </span>
        <span class="nav-link-inner--text">Nuevo domiciliario</span>
      </a>
    </li>
    <li class="list-group-item">
      <a href="/administrator/domiciliary" class="btn btn-success btn-icon ml-sm-3 d-none d-md-block">
        <span class="btn-inner--icon">
          <i class="fas fa-list-ul"></i>
        </span>
        <span class="nav-link-inner--text">Listado de domiciliarios</span>
      </a>
    </li>
  </ul>
</div>
@endsection

@section('content')
<div class="row mt-2 mr-3 ml-3">
  <div class="col p-0">
    @if(session('success'))
    <div class="alert alert-success alert-dismissible fade show" role="alert">
      {{session('success')}}
      <button type="button" class="close" data-dismiss="alert" aria-label="Close">
        <span aria-hidden="true">&times;</span>
      </button>
    </div>
    @endif
    @if(session('danger'))
    <div class="alert alert-danger alert-dismissible fade show" role="alert">
      {{session('danger')}}
      <button type="button" class="close" data-dismiss="alert" aria-label="Close">
        <span aria-hidden="true">&times;</span>
      </button>
    </div>
    @endif
    <div class="card shadow">
      <div class="card-header border-0">
        <div class="row align-items-center mb-3">
          <div class="col-8">
            <h3 class="mb-0">Domiciliarios</h3>
          </div>
          <div class="col-4 text-right">
            <a href="{{route('administrator.domiciliary.create')}}" class="btn btn-sm btn_admin"><i class="fas fa-plus"></i> Agregar</a>
          </div>
        </div>
        <form action="/administrator/domiciliary" method="get">
          <div class="row align-items-center">
            <div class="col">
              <div class="form-group">
                <label>Domiciliario</label>
                <input type="text" class="form-control" value="{{request()->delivery_man}}" placeholder="Nombre del cliente" name="delivery_man">
              </div>
              <div class="form-group">
                <label>Celular</label>
                <input type="text" class="form-control" value="{{request()->cellphone}}" placeholder="Teléfono celular" name="cellphone">
              </div>
            </div>
            <div class="col">
              <div class="form-group">
                <label>Estado</label>
                <select name="state" class="form-control">
                  <option value="">Todos</option>
                  <option value="1" {{request()->state == "1" ? 'selected' : ''}}>Activos</option>
                  <option value="2" {{request()->state == "2" ? 'selected' : ''}}>Inactivos</option>
                </select>
              </div>
              <div class="form-group">
                <label>Estado del domiciliario</label>
                <select name="state_delivery" class="form-control">
                  <option value="">Todos</option>
                  @foreach(Config::get('const.state_delivery') as $key => $value)
                  <option value="{{$key}}" {{request()->state_delivery == $key ? 'selected' : ''}}>{{$value['name']}}</option>
                  @endforeach
                </select>
              </div>
            </div>
            <div class="col">
              <button class="btn btn-warning btn-block">Filtrar</button>
              <a href="/administrator/domiciliary" class="btn btn-warning btn-block">Restaurar</a>
            </div>
          </div>
        </form>
      </div>

      <div class="table-responsive">
        <table class="table align-items-center table-flush">
          <thead class="thead-light text-center">
            <tr>
              <th class="text-center">Foto</th>
              <th class="text-center">Nombre</th>
              <th class="text-center">Identificación</th>
              <th class="text-center">Celular</th>
              <th class="text-center">Correo</th>
              <th class="text-center">Estado domiciliario</th>
              <th class="text-center">Opciones</th>
            </tr>
          </thead>
          <tbody class="text-center">

            @if (count($domiciliary)>0)
            @foreach ($domiciliary as $domiciliaryData)
            <tr>
              <td style="vertical-align:middle;">

                @if(!empty($domiciliaryData->photo) && Storage::disk('public')->exists('domiciliary/photo/'.$domiciliaryData->photo))
                <img id="logoTheme" class="imgLogoDomiciliary" src="{{ asset('storage/domiciliary/photo/'.$domiciliaryData->photo) }}">
                @else
                <img id="logoTheme" class="imgLogoDomiciliary" src="https://d1nhio0ox7pgb.cloudfront.net/_img/g_collection_png/standard/512x512/delivery_man.png">
                @endif

              </td>
              <td style="vertical-align:middle;" class="font-weight-bold">
                <a href="{{route('administrator.domiciliary.show', [$domiciliaryData->id])}}">
                  {{$domiciliaryData->name}} {{$domiciliaryData->last_name}}
                </a>
              </td>
              <td>
                {{$domiciliaryData->id_number}}
              </td>
              <td style="vertical-align:middle;">
                {{$domiciliaryData->cellphone}}
              </td>
              <td>
                {{$domiciliaryData->email}}
              </td>
              <td style="vertical-align:middle;">
                <span class="badge badge-{{Config::get('const.states')[$domiciliaryData->domiciliaryData->state]['type']}}">{{Config::get('const.states')[$domiciliaryData->domiciliaryData->state]['name']}}</span>
                <br>
                <span class="badge badge-{{Config::get('const.state_delivery')[$domiciliaryData->domiciliaryData->state_delivery]['type']}}">{{Config::get('const.state_delivery')[$domiciliaryData->domiciliaryData->state_delivery]['name']}}</span>
              </td>
              <td style="vertical-align:middle;">
                <a href="{{route('administrator.domiciliary.edit', [$domiciliaryData->id])}}" class="btn btn_admin btn-sm"><i class="fas fa-edit"></i></a>
              </td>
            </tr>

            <div class="modal" id="modalHistorial_{{$domiciliaryData->id}}" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
              <div class="modal-dialog modal-dialog-centered" role="document">
                <div class="modal-content">
                  <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Historial de Domicilios</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                      <span aria-hidden="true">&times;</span>
                    </button>
                  </div>
                  <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
                  </div>
                </div>
              </div>
            </div>
            @endforeach
            @else
            <tr>
              <td colspan="6">No se encontraron domiciliarios</td>
            </tr>
            @endif
          </tbody>
        </table>
      </div>
      <div class="card-footer py-4">
        <nav class="d-flex justify-content-end" aria-label="...">
          {!! $domiciliary->appends(Request::all())->render() !!}
        </nav>
      </div>
    </div>
  </div>
</div>

@endsection

@section('modals')
<div class="modal" id="modalHistorial" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Historial de Domicilio</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <div class="card card-stats">
          <div class="card-body">
            <div class="row">
              <div class="col">
                <h5 class="card-title text-uppercase text-muted mb-0">Domicilio</h5>
                <span class="h2 font-weight-bold mb-0">Dinora Pineda Valdés</span>
              </div>
              <div class="col-auto">
                <div class="icon icon-shape bg-orange text-white rounded-circle shadow">
                  <i class="fas fa-file-medical-alt"></i>
                </div>
              </div>
            </div>
            <p class="mt-3 mb-0 text-sm">
              <span class="text-success mr-2"><i class="fa fa-calendar-alt"></i> 01/03/2020</span>
              <button class="btn btn-info btn-sm float-right">Detalles</button>
            </p>
          </div>
        </div>
        <div class="card card-stats mt-2">
          <div class="card-body">
            <div class="row">
              <div class="col">
                <h5 class="card-title text-uppercase text-muted mb-0">Domicilio</h5>
                <span class="h2 font-weight-bold mb-0">Dinora Pineda Valdés</span>
              </div>
              <div class="col-auto">
                <div class="icon icon-shape bg-orange text-white rounded-circle shadow">
                  <i class="fas fa-file-medical-alt"></i>
                </div>
              </div>
            </div>
            <p class="mt-3 mb-0 text-sm">
              <span class="text-success mr-2"><i class="fa fa-calendar-alt"></i> 16/01/2020</span>
              <button class="btn btn-info btn-sm float-right">Detalles</button>
            </p>
          </div>
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
      </div>
    </div>
  </div>
</div>
@endsection