@extends('voyager::master')

@section('page_title', __('voyager::generic.view').' '.$dataType->display_name_singular)

@section('page_header')
  <div class="text-right">
    <a href="{{ route('voyager.'.$dataType->slug.'.index') }}" class="btn btn-warning">
      {{ __('voyager::generic.return_to_list') }}
    </a>
  </div>
  @include('voyager::multilingual.language-selector')
@stop

@section('content')
  <div class="page-content read container-fluid">

    <div class="row">
      <div class="col-md-6">
        <div class="panel">
          <h3>Información personal</h3>
            <form role="form" class="form-horizontal" action="@if(!is_null($dataTypeContent->getKey())){{ route('voyager.'.$dataType->slug.'.update', $dataTypeContent->getKey()) }}@else{{ route('voyager.'.$dataType->slug.'.store') }}@endif" method="POST" enctype="multipart/form-data">
            <div class="form-group">
              <label class="control-label col-sm-3">Nombre</label>
              <div class="col-sm-9">
                <input type="text" class="form-control form-editable" name="firstname" value="{{ $dataTypeContent->firstname }}" disabled>
              </div>
            </div>
            <div class="form-group">
              <label class="control-label col-sm-3">Apellidos Paterno</label>
              <div class="col-sm-9">
                <input type="text" class="form-control form-editable" name="lastname" value="{{ $dataTypeContent->lastname }}" disabled>
              </div>
            </div>
            <div class="form-group">
              <label class="control-label col-sm-3">Apellidos Materno</label>
              <div class="col-sm-9">
                <input type="text" class="form-control form-editable" name="lastname2" value="{{ $dataTypeContent->lastname2 }}" disabled>
              </div>
            </div>
            <div class="form-group">
              <label class="control-label col-sm-3">RUT</label>
              <div class="col-sm-9">
                <input type="text" class="form-control form-editable" name="rut" value="{{ $dataTypeContent->rut }}" disabled>
              </div>
            </div>
            <div class="form-group">
              <label class="control-label col-sm-3">Origen</label>
              <div class="col-sm-9">
                <input type="text" class="form-control form-editable"  name="source" value="{{ $dataTypeContent->source }}" disabled>
              </div>
            </div>
          </form>
        </div>
        <div class="panel">
          <h3>Información de contacto</h3>
          <form class="form-horizontal">
            <div class="form-group">
              <label class="control-label col-sm-3">Correo</label>
              <div class="col-sm-9">
                <input type="text" class="form-control form-editable" name="email" value="{{ $dataTypeContent->email }}" disabled>
              </div>
            </div>
            <div class="form-group">
              <label class="control-label col-sm-3">Teléfono</label>
              <div class="col-sm-9">
                <input type="text" class="form-control form-editable" name="phone" value="{{ $dataTypeContent->phone }}" disabled>
              </div>
            </div>
            <div class="form-group">
              <label class="control-label col-sm-3">Teléfono 2</label>
              <div class="col-sm-9">
                <input type="text" class="form-control form-editable" name="phone2" value="{{ $dataTypeContent->phone2 }}" disabled>
              </div>
            </div>
          </form>
        </div>
        <div class="row text-center">
          @can('edit', $dataTypeContent)
            <a href="#" class="btn btn-info" id="start-edit">
              <span class="glyphicon glyphicon-pencil"></span> Editar</a>
            <a href="{{ route('voyager.'.$dataType->slug.'.edit', $dataTypeContent->getKey()) }}" class="btn btn-info">
              <span class="glyphicon voyager-check"></span> Guardar</a>
          @endcan
        </div>
      </div>
      <div class="col-md-6">
        <div class="panel text-center">
          <h3>Estado</h3>
          @php
            $status_class = strtolower($dataTypeContent->status);
            $status_class = str_replace(" ","-",$status_class);
          @endphp
          <h2>
            <span class="label {{$status_class}}">{{ $dataTypeContent->status }}</span>
          </h2>
          <div class="row text-center">
            <div class="col-md-4">
              <h2>0</h2>
              <p>correos</p>
            </div>
            <div class="col-md-4">
              <h2>0</h2>
              <p>llamadas</p>
            </div>
            <div class="col-md-4">
              <h2>0</h2>
              <p>visitas</p>
            </div>
          </div>
        </div>
        <div class="panel text-center">
          <div class="row">
            <a href="#modalInteraccion" role="button" data-toggle="modal" class="btn btn-info">Agregar interacción</a>
          </div>
        </div>
        <div class="panel-group">

          @php
            use App\Interaction;
            use App\InteractionType;
            use App\ResultType;

            $applicants_interactions=Interaction::where('applicant_id','=',$dataTypeContent->id)->get();
            $interactions = Interaction::get();
            $interaction_types = InteractionType::get();
            $result_types = ResultType::get();
          @endphp
          @foreach($applicants_interactions as $applicant_interaction)

            <div class="panel panel-default">
              <div class="panel-heading">
                <h3 class="panel-title">
                  <a data-toggle="collapse" href="#interaccion-{{$applicant_interaction->id}}">
                    <div class="row">
                      <div class="col-md-4">
                        <span>
                          <strong>{{ $applicant_interaction->type_id }}</strong>
                        </span>
                      </div>
                      <div class="col-md-4 text-center">
                        <span>{{$applicant_interaction->created_at}}</span>
                      </div>
                      <div class="col-md-4 text-right">
                        <span class="voyager-angle-down"></span>
                      </div>
                    </div>
                  </a>
                </h3>
              </div>
              <div id="interaccion-{{$applicant_interaction->id}}" class="panel-collapse collapse">
                <div class="panel-body">
                  <form class="form-horizontal">
                    <div class="form-group">
                      <label class="control-label col-sm-3">Tipo</label>
                      <div class="col-sm-9">
                        <input type="text" class="form-control" value="{{ $applicant_interaction->type()->name }}" disabled>
                      </div>
                    </div>
                    <div class="form-group">
                      <label class="control-label col-sm-3">Resultado</label>
                      <div class="col-sm-9">
                        <input type="text" class="form-control" value="{{ $applicant_interaction->result()->name }}" disabled>
                      </div>
                    </div>
                    <div class="form-group">
                      <label class="control-label col-sm-3">Comentarios adicionales</label>
                      <div class="col-sm-9">
                        <textarea name="name" class="form-control" rows="8" cols="80" disabled>{{ $applicant_interaction->feedback }}</textarea>
                      </div>
                    </div>
                  </form>
                </div>
              </div>
            </div>

            </p>
          @endforeach

        </div>
      </div>

    </div>
  </div>
  <!-- Modal -->
  <div class="modal fade" id="modalInteraccion" tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <h4 class="modal-title in" id="modalInteraccionLabel">Agregar interacción</h4>
        </div>
        <div class="modal-body center-block">
          <form class="form-horizontal" action="{{route('voyager.interactions.store')}}" method="POST" enctype="multipart/form-data">
            {{-- <form role="form"
                    class="form-horizontal"
                    action="{{route('voyager.interactions.store')}}"
                    method="POST" enctype="multipart/form-data"> --}}
            {{ csrf_field() }}
            <div class="form-group">
              <label class="control-label col-sm-3">Tipo</label>
              <div class="col-sm-9">
                <div class="form-group">
                  <select name="interaction_type_id" class="form-control">
                    {{-- <option value="">Seleccione un tipo</option> --}}
                    @foreach($interaction_types as $type)
                    <option value="{{$type->id}}">{{$type->name}}</option>
                    @endforeach
                  </select>
                </div>
              </div>
            </div>
            <div class="form-group">
              <label class="control-label col-sm-3">Resultado</label>
              <div class="col-sm-9">
                <div class="form-group">
                  <select name="result_id" class="form-control">
                    {{-- <option value="">Seleccione un resultado</option> --}}
                    @foreach($result_types as $result)
                    <option value="{{$result->id}}">{{$result->name}}</option>
                    @endforeach
                  </select>
                </div>
              </div>
            </div>
            <div class="form-group">
              <label class="control-label col-sm-3">Comentarios adicionales</label>
              <div class="col-sm-9">
                <textarea name="feedback" class="form-control" rows="8" cols="80"></textarea>
              </div>
            </div>
            <input type="hidden" name="applicant_id" value="{{$dataTypeContent->id}}">

          </div>
          <div class="modal-footer">
            <button type="submit" class="btn btn-info">Agregar</button>
            <button type="button" class="btn btn-default" data-dismiss="modal">Cancelar</button>
          </div>
        </form>
      </div>
    </div>
  </div>
@stop

@section('javascript')
  @if ($isModelTranslatable)
    <script>
    $(document).ready(function () {
      $('.side-body').multilingual();
      $('#modalInteraccion').modal({backdrop: 'static', keyboard: false});
    });
    </script>
    <script src="{{ voyager_asset('js/multilingual.js') }}"></script>
  @endif
  <script type="text/javascript">
  $("#start-edit").click(function() {
    console.log('clicjked');
    $('.form-control.form-editable').prop('disabled', false);
  });
  </script>
@stop