@extends('layouts.theme_selector')

@section('content')

  <div class="container">
    <div class="row justify-content-center">
      <div class="col-md-12 text-center">

        <h2 class="mb-5 {{session('theme')=='dark' ? 'text-white' : ''}}">Inspección
          @if ($estado == 'pendiente') a Auditar
          @else
            {{ ucfirst($estado) }}
          @endif
          Nº {{ $inspeccion->id }}
        </h2>

        @include('layouts.alerts.success')

        <form id="formInspeccion" action="{{ Route('GuardarInspeccion') }}" method="post" enctype="multipart/form-data">
          @csrf

          <input type="hidden" value="{{ $inspeccion->id }}" name="inspeccion_id" />

          <div class="row justify-content-center">

            <div class="col-8">
              <div class="card {{ session('theme_card') }} my-3">
                <div class="card-header text-center">
                  <b class="lead">DATOS GENERALES</b class="lead">
                </div>
                <div class="card-body {{ session('theme_bg_black') }}">
                  <div class="row row-cols-2">
                    <div class="form-group col">
                      <label for="fechaInspeccion">Fecha: </label>
                      <input type="date" name="fechaInspeccion" id="iFechaInspeccion" class="form form-control {{ session('theme_bg_dark') }}" value="{{ $inspeccion->fecha }}" form="formInspeccion" readonly>
                    </div>
                    <div class="form-group col">
                      <label for="dni">Socio Documento Nº: </label>
                      <input type="number" name="dni" id="idni" class="form form-control {{ session('theme_bg_dark') }}" value="{{ $inspeccion->documento }}" form="formInspeccion" readonly>
                    </div>
                    <div class="form-group col">
                      <label for="propuesta">Propuesta Nº: </label>
                      <input type="number" name="propuesta" id="iPropuesta" class="form form-control {{ session('theme_bg_dark') }}" value="{{ $inspeccion->propuesta }}" form="formInspeccion" readonly>
                    </div>
                    <div class="form-group col">
                      <label for="poliza">Póliza Nº: </label>
                      <input type="number" name="poliza" id="iPoliza" class="form form-control {{ session('theme_bg_dark') }}" value="{{ $inspeccion->poliza }}" form="formInspeccion" readonly>
                    </div>
                    <div class="form-group col">
                      <label for="patente">Patente: </label>
                      <input type="text" name="patente" id="iPatente" class="form form-control {{ session('theme_bg_dark') }}" value="{{ $inspeccion->patente }}" form="formInspeccion" readonly>
                    </div>
                    <div class="form-group col">
                      <label for="kilometraje">Kilometraje: </label>
                      <input type="number" name="kilometraje" id="iKilometraje" class="form form-control {{ session('theme_bg_dark') }}" value="{{ $inspeccion->km }}" form="formInspeccion" @if($estado == 'pendiente' || $estado == 'rechazada') readonly @endif>
                    </div>
                    <div class="form-group col">
                      <label for="patente">Chasis: </label>
                      <input type="text" name="chasis" class="form form-control {{ session('theme_bg_dark') }}" value="{{ $inspeccion->chasis }}" form="formInspeccion" readonly>
                    </div>
                    <div class="form-group col">
                      <label for="kilometraje">Motor: </label>
                      <input type="text" name="motor" class="form form-control {{ session('theme_bg_dark') }}" value="{{ $inspeccion->motor }}" form="formInspeccion"  readonly>
                    </div>
                  </div>
                </div>
              </div>
            </div>

            <div class="col-8">
              <div class="card {{ session('theme_card') }} my-3">
                <div class="card-header text-center">
                  <b class="lead">ESTADO DEL VEHÍCULO</b>
                </div>
                <div class="card-body {{ session('theme_bg_black') }}">
                  <div class="row row-cols-2">

                    @if ($estado != 'aprobada')
                      <div class="form-group col">
                        <label for="estadoGeneral">Estado General: </label>
                        <select name="estadoGeneral" id="iEstadoGeneral" class="form form-control {{ session('theme_select_dark') }} " form="formInspeccion" required>
                          <option value="" selected disabled>Seleccione...</option>
                          {{-- <option value="{{ $inspeccion->estado_general ?? 0 }}" selected>{{ $inspeccion->estado_general ?? 'Seleccione...'}}</option> --}}
                          @foreach($estados as $estado)
                            <option value="{{ $estado }}">{{ $estado }}</option>
                          @endforeach
                        </select>
                      </div>
                      <div class="form-group col">
                        <label for="estadoNeumaticoDelantero">Estado Neumático Delantero: </label>
                        <select name="estadoNeumaticoDelantero" id="iEstadoNeumaticoDelantero" class="form form-control {{ session('theme_select_dark') }} " required>
                          <option value="" selected disabled>Seleccione...</option>
                          {{-- <option value="{{ $inspeccion->estado_neumatico_delantero ?? 0 }}" selected>{{ $inspeccion->estado_neumatico_delantero ?? 'Seleccione...'}}</option> --}}
                          @foreach($estados as $estado)
                            <option value="{{ $estado }}">{{ $estado }}</option>
                          @endforeach
                        </select>
                      </div>
                      <div class="form-group col">
                        <label for="estadoNeumaticoTrasero">Estado Neumático Trasero: </label>
                        <select name="estadoNeumaticoTrasero" id="iEstadoNeumaticoTrasero" class="form form-control {{ session('theme_select_dark') }} " required>
                          <option value="" selected disabled>Seleccione...</option>
                          {{-- <option value="{{ $inspeccion->estado_neumatico_trasero ?? 0}}" selected>{{ $inspeccion->estado_neumatico_trasero ?? 'Seleccione...'}}</option> --}}
                          @foreach($estados as $estado)
                            <option value="{{ $estado }}">{{ $estado }}</option>
                          @endforeach
                        </select>
                      </div>
                      <div class="form-group col">
                        <label for="estadoMotor">Estado Motor: </label>
                        <select name="estadoMotor" id="iEstadoMotor" class="form form-control {{ session('theme_select_dark') }} " required>
                          <option value="" selected disabled>Seleccione...</option>
                          {{-- <option value="{{ $inspeccion->estado_motor ?? 0}}" selected>{{ $inspeccion->estado_motor ?? 'Seleccione...' }} </option> --}}
                          @foreach($estados as $estado)
                            <option value="{{ $estado }}">{{ $estado }}</option>
                          @endforeach
                        </select>
                      </div>
                      <div class="form-group col">
                        <label for="estadoCarroceria">Estado Carroceria: </label>
                        <select name="estadoCarroceria" id="iEstadoCarroceria" class="form form-control {{ session('theme_select_dark') }} " required>
                          <option value="" selected disabled>Seleccione...</option>
                          {{-- <option value="{{ $inspeccion->estado_carroceria ?? 0}}" selected>{{ $inspeccion->estado_carroceria ?? 'Seleccione...'}}  </option> --}}
                          @foreach($estados as $estado)
                            <option value="{{ $estado }}">{{ $estado }}</option>
                          @endforeach
                        </select>
                      </div>
                      <div class="form-group col">
                        <label for="estadoLuces">Estado Luces: </label>
                        <select name="estadoLuces" id="iEstadoLuces" class="form form-control {{ session('theme_select_dark') }} " required>
                          <option value="" selected disabled>Seleccione...</option>
                          {{-- <option value="{{ $inspeccion->estado_luces ?? 0}}" selected>{{ $inspeccion->estado_luces ?? 'Seleccione...' }}</option> --}}
                          @foreach($estados as $estado)
                            <option value="{{ $estado }}">{{ $estado }}</option>
                          @endforeach
                        </select>
                      </div>

                    @else
                      <div class="form-group col">
                        <label for="estadoGeneral">Estado General: </label>
                        <input type="text" name="estadoGeneral" id="iEstadoGeneral" class="form form-control" form="formInspeccion" value="{{ $inspeccion->estado_general }}">
                      </div>
                      <div class="form-group col">
                        <label for="estadoNeumaticoDelantero">Estado Neumático Delantero: </label>
                        <input type="text" name="estadoNeumaticoDelantero" id="iEstadoNeumaticoDelantero" class="form form-control" value="{{ $inspeccion->estado_neumatico_delantero }}">
                      </div>
                      <div class="form-group col">
                        <label for="estadoNeumaticoTrasero">Estado Neumático Trasero: </label>
                        <input type="text" name="estadoNeumaticoTrasero" id="iEstadoNeumaticoTrasero" class="form form-control" value="{{ $inspeccion->estado_neumatico_trasero }}">
                      </div>
                      <div class="form-group col">
                        <label for="estadoMotor">Estado Motor: </label>
                        <input type="text" name="estadoMotor" id="iEstadoMotor" class="form form-control" value="{{ $inspeccion->estado_motor }}">
                      </div>
                      <div class="form-group col">
                        <label for="estadoCarroceria">Estado Carroceria: </label>
                        <input type="text" name="estadoCarroceria" id="iEstadoCarroceria" class="form form-control" value="{{ $inspeccion->estado_carroceria }}">
                      </div>
                      <div class="form-group col">
                        <label for="estadoLuces">Estado Luces: </label>
                        <input type="text" name="estadoLuces" id="iEstadoLuces" class="form form-control"  value="{{ $inspeccion->estado_luces }}">
                      </div>
                    @endif
                  </div>
                </div>
              </div>
            </div>


            <!-- INICIO CARGA DE IMAGENES -->
            @if (!empty($imagenes))
              {{-- {{dd($imagenes)}} --}}
              <div class="col-md-8">
                <div class="card {{ session('theme_card') }} my-3">
                  <div class="card-header text-center">
                    <b>IMAGENES DEL VEHÍCULO</b>
                  </div>
                  <div class="card-body {{ session('theme_bg_black') }}">
                    <div class="row row-cols-1 justify-content-center text-center">
                      <br>
                      <div class="my-3 row">
                        <label for="imagenLateralIzquierdo">Imagen del lateral izquierdo: </label>
                        <br>
                        @if ($imagenes['left-front'] != null)
                          <a class="btn btn-outline-primary col-4 mx-auto align-middle" target="popup" href="{{$imagenes['left-front']}}"
                          onclick="window.open('{{$imagenes['left-front']}}', 'popup', 'width=780, height=700, top=200, scrollbars=no, resizable=no'); return false;">
                          Ver Imagen</a>
                          {{-- <span id="latI" class="zoom mx-auto">
                            <img style="max-width:350px; max-height:300px;" id="imgLatI" src="{{ $imagenes['lateralIzquierdo'] }}" alt="Lateral Izquierdo">
                          </span> --}}
                        @endif
                        @if ($estado == 'rechazada' || $estado == 'pendiente')
                          <br>
                          <input type="file" name="left-front" class="form form-group {{ session('theme_select_dark') }}" form="formInspeccion" @if($inspeccion->directorio == '' || $inspeccion->directorio == null) required @endif>
                        @endif
                      </div>
                      <br>
                      <div class="my-3 row">
                        <label for="imagenLateralDerecho">Imagen del lateral Derecho: </label>
                        <br>
                        @if ($imagenes['right-side'] != null)
                          <a class="btn btn-outline-primary col-4 mx-auto align-middle" target="popup" href="{{$imagenes['right-side']}}"
                          onclick="window.open('{{$imagenes['right-side']}}', 'popup', 'width=780, height=700, top=200, scrollbars=no, resizable=no'); return false;">
                          Ver Imagen</a>
                          {{-- <span id="latD" class="zoom mx-auto">
                            <img style="max-width:350px; max-height:300px;" id="imgLatD" src="{{ $imagenes['lateralDerecho'] }}"  alt="Lateral Derecho">
                          </span> --}}
                        @endif
                        @if ($estado == 'rechazada' || $estado == 'pendiente')
                          <br>
                          <input type="file" name="imagenLateralDerecho" class="form form-group {{ session('theme_select_dark') }}" form="formInspeccion" @if($inspeccion->directorio == '' || $inspeccion->directorio == null) required @endif>
                        @endif
                      </div>
                      <br>
                      <div class="my-3 row">
                        <label for="imagenChasis">Imagen del Nº de Chasis: </label>
                        <br>
                        @if ($imagenes['chasis'] != null)
                          <a class="btn btn-outline-primary col-4 mx-auto align-middle" target="popup" href="{{$imagenes['chasis']}}"
                          onclick="window.open('{{$imagenes['chasis']}}', 'popup', 'width=780, height=700, top=200, scrollbars=no, resizable=no'); return false;">
                          Ver Imagen</a>
                          {{-- <span id="chasis" class="zoom mx-auto">
                            <img style="max-width:350px; max-height:300px;" id="imgChasis" src="{{ $imagenes['chasis'] }}" alt="Chasis">
                          </span> --}}
                        @endif
                        @if ($estado == 'rechazada' || $estado == 'pendiente')
                          <br>
                          <input type="file" name="imagenChasis" class="form form-group {{ session('theme_select_dark') }}" form="formInspeccion" @if($inspeccion->directorio == '' || $inspeccion->directorio == null) required @endif>
                        @endif
                      </div>
                      <br>
                      <div class="my-3 row">
                        <label for="imagenMotor">Imagen del Nº de Motor: </label>
                        <br>
                        @if ($imagenes['motor'] != null)
                          <a class="btn btn-outline-primary col-4 mx-auto align-middle" target="popup" href="{{$imagenes['motor']}}"
                          onclick="window.open('{{$imagenes['motor']}}', 'popup', 'width=780, height=700, top=200, scrollbars=no, resizable=no'); return false;">
                          Ver Imagen</a>
                          {{-- <span id="motor" class="zoom mx-auto">
                            <img style="max-width:350px; max-height:300px;" id="imgMotor" src="{{ $imagenes['motor'] }}" alt="Motor">
                          </span> --}}
                        @endif
                        @if ($estado == 'rechazada' || $estado == 'pendiente')
                          <br>
                          <input type="file" name="imagenMotor" class="form form-group {{ session('theme_select_dark') }}" form="formInspeccion" @if($inspeccion->directorio == '' || $inspeccion->directorio == null) required @endif>
                        @endif
                      </div>

                  </div>
                </div>
              </div>
            </div>
          @endif

            <div class="row justify-content-center">
              <div class="col-8 text-center">
                <label for="observaciones" value="{{ $inspeccion->observaciones }}">Observaciones</label>
                <textarea name="observaciones" id="iObservaciones" class="form form-control mx-auto col-10 {{ session('theme_bg_dark') }} my-2" @if($estado == 'aprobada') readonly @endif form="formInspeccion"></textarea>
                <br>
                @if ($estado == 'pendiente' or $inspeccion->aprobada == 0)
                  <input type="submit" class="mx-2 btn btn-outline-success" id="submit" value="Aprobar"  name="accion" form="formInspeccion">
                  <input type="submit" class="mx-2 btn btn-outline-danger"  id="submit" value="Rechazar" name="accion" form="formInspeccion">
                  <br>
                @endif
              </div>
            </div>

            @if ($estado == 'rechazada' or $inspeccion->aprobada == 2)
              <input type="hidden" name="reinspeccionar" id="oReinspeccionar" value="1" form="formInspeccion">
              <input type="submit" class="btn btn-block btn-success col-2" id="submit" value="Reinspeccionar" form="formInspeccion">
            @endif

          </div>

        </form>

      </div>
    </div>
  </div>
@endsection