@extends('layouts.app')

@section('content')

<div class="row justify-content-center">
    <div class="col-md-10">

        @include('includes.message')
        <div class="card">
            <form method="POST" action="{{route('controlestacion.update', ['sector'=> '' ])}}"
                enctype="multipart/form-data" aria-label="{{ __('Sector') }}" id="update_sector"
                onsubmit="return comprobar_estaciones()">
                @csrf



                <!--encabezado-->
                <div class="card-header">
                    <div class="form-group row">
                        <div class="col-md-10">
                            {{$sector->sector}}
                        </div>

                    </div>
                </div>


                <div class="card-body">

                    <input type='hidden' name='servicio_id'
                        value="{{$sector->servicio_id ? $sector->servicio_id : ''}}">
                    <input type='hidden' name='id' value="{{$sector->id ? $sector->id : ''}}">

                    <div class="form-group row">


                        <label for="sector" class="col-md-4 col-form-label text-md-right">
                            {{ __('Nombre del sector') }}
                        </label>

                        <div class="col-md-6">
                            <input id="sector" type="text" {{$edit}}
                                class="form-control{{ $errors->has('sector') ? ' is-invalid' : '' }}" name="sector"
                                value="{{$sector->sector}}" required autofocus>

                            @if ($errors->has('sector'))
                            <span class="invalid-feedback" role="alert">
                                <strong>{{ $errors->first('sector') }}</strong>
                            </span>
                            @endif
                            <br>
                        </div>

                        <label for="estaciond" class="col-md-4 col-form-label text-md-right">
                            {{ __('Estaciones desde') }}
                        </label>

                        <div class="col-md-1">
                            <input id="estaciond" type="number" {{$edit}}
                                class="form-control{{ $errors->has('estaciond') ? ' is-invalid' : '' }}"
                                name="estaciond" value="{{$sector->estacion_d}}" min="1" required
                                onchange="sumar_estaciones(); estaciones_faltantes();">

                            @if ($errors->has('estaciond'))
                            <span class="invalid-feedback" role="alert">
                                <strong>{{ $errors->first('estaciond') }}</strong>
                            </span>
                            @endif
                            <br>
                        </div>

                        <label for="estacionh" class="col-md-1 col-form-label text-md-right">
                            {{ __('hasta') }}
                        </label>

                        <div class="col-md-1">
                            <input id="estacionh" type="number" {{$edit}}
                                class="form-control{{ $errors->has('estacionh') ? ' is-invalid' : '' }}"
                                name="estacionh" value="{{$sector->estacion_h}}" min="1" required
                                onchange="sumar_estaciones(); estaciones_faltantes();">

                            @if ($errors->has('estacionh'))
                            <span class="invalid-feedback" role="alert">
                                <strong>{{ $errors->first('estacionh') }}</strong>
                            </span>
                            @endif
                            <br>
                        </div>

                        <div class="col-md-3">
                            <span>(Cantidad de estaciones: </span> <span id="estaciones"></span><span>)</span>
                        </div>

                    </div>



                    <div class="card">

                        <div class="card-header">
                            <div class="form-group row">
                                <div class="col-md-12 text-md-center">
                                    Venenos con o sin actividad de roedores
                                </div>

                            </div>
                        </div>


                        <div class="card-body">

                            <table class="table borderless">
                                <thead>
                                    <tr>
                                        <td scope="col" style="color: black;" class="text-md-center">Cebos con actividad
                                        </td>
                                        <td scope="col" style="color: black;" class="text-md-center">Cebos sin actividad
                                        </td>
                                        <td scope="col" style="color: black;" class="text-md-center">Cebos
                                            faltantes/rotos</td>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td scope='col'>
                                            <input id="ceboa" type="number" {{$edit}}
                                                class="form-control{{ $errors->has('ceboa') ? ' is-invalid' : '' }}"
                                                name="ceboa" value="{{$sector->cebo_actividad}}" min="0"
                                                onchange="estaciones_faltantes();">

                                            @if ($errors->has('ceboa'))
                                            <span class="invalid-feedback" role="alert">
                                                <strong>{{ $errors->first('ceboa') }}</strong>
                                            </span>
                                            @endif

                                        </td>
                                        <td scope='col'>
                                            <input id="cebos" type="number" {{$edit}}
                                                class="form-control{{ $errors->has('cebos') ? ' is-invalid' : '' }}"
                                                name="cebos" value="{{$sector->cebo_sin_actividad}}" min="0"
                                                onchange="estaciones_faltantes();">

                                            @if ($errors->has('cebos'))
                                            <span class="invalid-feedback" role="alert">
                                                <strong>{{ $errors->first('cebos') }}</strong>
                                            </span>
                                            @endif
                                        </td>
                                        <td scope='col'>
                                            <input id="cebor" type="number" {{$edit}}
                                                class="form-control{{ $errors->has('cebor') ? ' is-invalid' : '' }}"
                                                name="cebor" value="{{$sector->cebo_roto}}" min="0"
                                                onchange="estaciones_faltantes();">

                                            @if ($errors->has('cebor'))
                                            <span class="invalid-feedback" role="alert">
                                                <strong>{{ $errors->first('cebor') }}</strong>
                                            </span>
                                            @endif
                                        </td>


                                    </tr>
                                </tbody>
                            </table>


                            <table class="table borderless">
                                <thead>
                                    <tr>
                                        <td scope="col" style="color: black;" class="text-md-center">Liquidos con
                                            actividad</td>
                                        <td scope="col" style="color: black;" class="text-md-center">Liquidos sin
                                            actividad</td>
                                        <td scope="col" style="color: black;" class="text-md-center">Liquidos
                                            faltantes/rotos</td>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td scope='col'>
                                            <input id="liquidoa" type="number" {{$edit}}
                                                class="form-control{{ $errors->has('liquidoa') ? ' is-invalid' : '' }}"
                                                name="liquidoa" value="{{$sector->liquido_actividad}}" min="0"
                                                onchange="estaciones_faltantes();">

                                            @if ($errors->has('liquidoa'))
                                            <span class="invalid-feedback" role="alert">
                                                <strong>{{ $errors->first('liquidoa') }}</strong>
                                            </span>
                                            @endif

                                        </td>
                                        <td scope='col'>
                                            <input id="liquidos" type="number" {{$edit}}
                                                class="form-control{{ $errors->has('liquidos') ? ' is-invalid' : '' }}"
                                                name="liquidos" value="{{$sector->liquido_sin_actividad}}" min="0"
                                                onchange="estaciones_faltantes();">

                                            @if ($errors->has('liquidos'))
                                            <span class="invalid-feedback" role="alert">
                                                <strong>{{ $errors->first('liquidos') }}</strong>
                                            </span>
                                            @endif
                                        </td>
                                        <td scope='col'>
                                            <input id="liquidor" type="number" {{$edit}}
                                                class="form-control{{ $errors->has('liquidor') ? ' is-invalid' : '' }}"
                                                name="liquidor" value="{{$sector->liquido_roto}}" min="0"
                                                onchange="estaciones_faltantes();">

                                            @if ($errors->has('liquidor'))
                                            <span class="invalid-feedback" role="alert">
                                                <strong>{{ $errors->first('liquidor') }}</strong>
                                            </span>
                                            @endif
                                        </td>

                                    </tr>
                                </tbody>
                            </table>

                        </div>

                        <div class="col-md-12">
                            <span>(Cantidad de estaciones faltantes: </span>
                            <span id="estaciones_faltantes"></span><span>)</span>
                        </div><br />
                    </div>
                    <br />

                    <div class="form-group row">


                        <label for="muertos" class="col-md-4 col-form-label text-md-right">
                            {{ __('Roedores muertos encontrados en el lugar') }}
                        </label>

                        <div class="col-md-2">
                            <input id="muertos" type="number" {{$edit}}
                                class="form-control{{ $errors->has('muertos') ? ' is-invalid' : '' }}" name="muertos"
                                value="{{$sector->muertos}}" min="0">

                            @if ($errors->has('muertos'))
                            <span class="invalid-feedback" role="alert">
                                <strong>{{ $errors->first('muertos') }}</strong>
                            </span>
                            @endif
                            <br>
                        </div>

                    </div>

                    <div class="card">
                        <div class="data-cliente text-center">
                            <div class="card-header">Fotos tomadas</div>
                        </div>

                        <div class="card-body">

                            @if($edit)
                            <section>
                                <div id="containerFotos">
                                    @if($sector->foto1)
                                    <div>
                                        <img src="{{ route('controlestacion.fotos', 
                                                    ['filename'=>$sector->foto1])}}" alt="{{$sector->foto1}}" />
                                        <span>{{$sector->foto1}}</span>
                                    </div>
                                    @endif
                                    @if($sector->foto2)
                                    <div>
                                        <img src="{{ route('controlestacion.fotos', 
                                                    ['filename'=>$sector->foto2])}}" alt="{{$sector->foto2}}" />
                                        <span>{{$sector->foto2}}</span>
                                    </div>
                                    @endif
                                    @if($sector->foto3)
                                    <div>
                                        <img src="{{ route('controlestacion.fotos', 
                                                    ['filename'=>$sector->foto3])}}" alt="{{$sector->foto3}}" />
                                        <span>{{$sector->foto3}}</span>
                                    </div>
                                    @endif
                                    @if($sector->foto4)
                                    <div>
                                        <img src="{{ route('controlestacion.fotos', 
                                                    ['filename'=>$sector->foto4])}}" alt="{{$sector->foto4}}" />
                                        <span>{{$sector->foto4}}</span>
                                    </div>
                                    @endif
                                    @if($sector->foto5)
                                    <div>
                                        <img src="{{ route('controlestacion.fotos', 
                                                    ['filename'=>$sector->foto5])}}" alt="{{$sector->foto5}}" />
                                        <span>{{$sector->foto5}}</span>
                                    </div>
                                    @endif
                                    @if($sector->foto6)
                                    <div>
                                        <img src="{{ route('controlestacion.fotos', 
                                                    ['filename'=>$sector->foto6])}}" alt="{{$sector->foto6}}" />
                                        <span>{{$sector->foto6}}</span>
                                    </div>
                                    @endif
                                    @if($sector->foto7)
                                    <div>
                                        <img src="{{ route('controlestacion.fotos', 
                                                    ['filename'=>$sector->foto7])}}" alt="{{$sector->foto7}}" />
                                        <span>{{$sector->foto7}}</span>
                                    </div>
                                    @endif
                                    @if($sector->foto8)
                                    <div>
                                        <img src="{{ route('controlestacion.fotos', 
                                                    ['filename'=>$sector->foto8])}}" alt="{{$sector->foto8}}" />
                                        <span>{{$sector->foto8}}</span>
                                    </div>
                                    @endif
                                    @if($sector->foto9)
                                    <div>
                                        <img src="{{ route('controlestacion.fotos', 
                                                    ['filename'=>$sector->foto9])}}" alt="{{$sector->foto9}}" />
                                        <span>{{$sector->foto9}}</span>
                                    </div>
                                    @endif
                                    @if($sector->foto10)
                                    <div>
                                        <img src="{{ route('controlestacion.fotos', 
                                                    ['filename'=>$sector->foto10])}}" alt="{{$sector->foto10}}" />
                                        <span>{{$sector->foto10}}</span>
                                    </div>
                                    @endif
                                </div>
                            </section>

                            @else

                            <div class="form-group row">
                                <div class="col-md-1 mt-3">
                                    @if($sector->foto1)
                                    <img src="{{ route('controlestacion.fotos', 
                                        ['filename'=>$sector->foto1]) }}" alt="{{$sector->foto1}}" class="avatar" />
                                    @endif
                                </div>
                                <div class="col-md-5">
                                    @if($sector->foto1)
                                    <label><input type="checkbox" id="cbox1" name="cbox1"> Eliminar foto</label>
                                    @endif
                                    <input id="image_path01" type="file"
                                        class="form-control{{ $errors->has('image_path01') ? ' is-invalid' : '' }}"
                                        name="image_path01">
                                    @if ($errors->has('image_path01'))
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $errors->first('image_path01') }}</strong>
                                    </span>
                                    @endif
                                </div>


                                <div class="col-md-1">
                                    @if($sector->foto2)
                                    <img src="{{ route('controlestacion.fotos', 
                                        ['filename'=>$sector->foto2]) }}" alt="{{$sector->foto2}}" class="avatar" />
                                    @endif
                                </div>
                                <div class="col-md-5">
                                    @if($sector->foto2)
                                    <label><input type="checkbox" id="cbox2" name="cbox2"> Eliminar foto</label>
                                    @endif
                                    <input id="image_path02" type="file"
                                        class="form-control{{ $errors->has('image_path02') ? ' is-invalid' : '' }}"
                                        name="image_path02">
                                    @if ($errors->has('image_path02'))
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $errors->first('image_path02') }}</strong>
                                    </span>
                                    @endif
                                </div>
                            </div>

                            <div class="form-group row">
                                <div class="col-md-1">
                                    @if($sector->foto3)
                                    <img src="{{ route('controlestacion.fotos', 
                                        ['filename'=>$sector->foto3]) }}" alt="{{$sector->foto3}}" class="avatar" />
                                    @endif
                                </div>
                                <div class="col-md-5">
                                    @if($sector->foto3)
                                    <label><input type="checkbox" id="cbox3" name="cbox3"> Eliminar foto</label>
                                    @endif
                                    <input id="image_path03" type="file"
                                        class="form-control{{ $errors->has('image_path03') ? ' is-invalid' : '' }}"
                                        name="image_path03">
                                    @if ($errors->has('image_path03'))
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $errors->first('image_path03') }}</strong>
                                    </span>
                                    @endif
                                </div>


                                <div class="col-md-1">
                                    @if($sector->foto4)
                                    <img src="{{ route('controlestacion.fotos', 
                                        ['filename'=>$sector->foto4]) }}" alt="{{$sector->foto4}}" class="avatar" />
                                    @endif
                                </div>
                                <div class="col-md-5">
                                    @if($sector->foto4)
                                    <label><input type="checkbox" id="cbox4" name="cbox4"> Eliminar foto</label>
                                    @endif
                                    <input id="image_path04" type="file"
                                        class="form-control{{ $errors->has('image_path04') ? ' is-invalid' : '' }}"
                                        name="image_path04">
                                    @if ($errors->has('image_path04'))
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $errors->first('image_path04') }}</strong>
                                    </span>
                                    @endif
                                </div>
                            </div>

                            <div class="form-group row">
                                <div class="col-md-1">
                                    @if($sector->foto5)
                                    <img src="{{ route('controlestacion.fotos', 
                                        ['filename'=>$sector->foto5]) }}" alt="{{$sector->foto5}}" class="avatar" />
                                    @endif
                                </div>
                                <div class="col-md-5">
                                    @if($sector->foto5)
                                    <label><input type="checkbox" id="cbox5" name="cbox5"> Eliminar foto</label>
                                    @endif
                                    <input id="image_path05" type="file"
                                        class="form-control{{ $errors->has('image_path05') ? ' is-invalid' : '' }}"
                                        name="image_path05">
                                    @if ($errors->has('image_path05'))
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $errors->first('image_path05') }}</strong>
                                    </span>
                                    @endif
                                </div>


                                <div class="col-md-1">
                                    @if($sector->foto6)
                                    <img src="{{ route('controlestacion.fotos', 
                                        ['filename'=>$sector->foto6]) }}" alt="{{$sector->foto6}}" class="avatar" />
                                    @endif
                                </div>
                                <div class="col-md-5">
                                    @if($sector->foto6)
                                    <label><input type="checkbox" id="cbox6" name="cbox6"> Eliminar foto</label>
                                    @endif
                                    <input id="image_path06" type="file"
                                        class="form-control{{ $errors->has('image_path06') ? ' is-invalid' : '' }}"
                                        name="image_path06">
                                    @if ($errors->has('image_path06'))
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $errors->first('image_path06') }}</strong>
                                    </span>
                                    @endif
                                </div>
                            </div>

                            <div class="form-group row">
                                <div class="col-md-1">
                                    @if($sector->foto7)
                                    <img src="{{ route('controlestacion.fotos', 
                                        ['filename'=>$sector->foto7]) }}" alt="{{$sector->foto7}}" class="avatar" />
                                    @endif
                                </div>
                                <div class="col-md-5">
                                    @if($sector->foto7)
                                    <label><input type="checkbox" id="cbox7" name="cbox7"> Eliminar foto</label>
                                    @endif
                                    <input id="image_path07" type="file"
                                        class="form-control{{ $errors->has('image_path07') ? ' is-invalid' : '' }}"
                                        name="image_path07">
                                    @if ($errors->has('image_path07'))
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $errors->first('image_path07') }}</strong>
                                    </span>
                                    @endif
                                </div>


                                <div class="col-md-1">
                                    @if($sector->foto8)
                                    <img src="{{ route('controlestacion.fotos', 
                                        ['filename'=>$sector->foto8]) }}" alt="{{$sector->foto8}}" class="avatar" />
                                    @endif
                                </div>
                                <div class="col-md-5">
                                    @if($sector->foto8)
                                    <label><input type="checkbox" id="cbox8" name="cbox8"> Eliminar foto</label>
                                    @endif
                                    <input id="image_path08" type="file"
                                        class="form-control{{ $errors->has('image_path08') ? ' is-invalid' : '' }}"
                                        name="image_path08">
                                    @if ($errors->has('image_path08'))
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $errors->first('image_path08') }}</strong>
                                    </span>
                                    @endif
                                </div>
                            </div>

                            <div class="form-group row">
                                <div class="col-md-1">
                                    @if($sector->foto9)
                                    <img src="{{ route('controlestacion.fotos', 
                                        ['filename'=>$sector->foto9]) }}" alt="{{$sector->foto9}}" class="avatar" />
                                    @endif
                                </div>
                                <div class="col-md-5">
                                    @if($sector->foto9)
                                    <label><input type="checkbox" id="cbox9" name="cbox9"> Eliminar foto</label>
                                    @endif
                                    <input id="image_path09" type="file"
                                        class="form-control{{ $errors->has('image_path09') ? ' is-invalid' : '' }}"
                                        name="image_path09">
                                    @if ($errors->has('image_path09'))
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $errors->first('image_path09') }}</strong>
                                    </span>
                                    @endif
                                </div>


                                <div class="col-md-1">
                                    @if($sector->foto10)
                                    <img src="{{ route('controlestacion.fotos', 
                                        ['filename'=>$sector->foto10]) }}" alt="{{$sector->foto10}}" class="avatar" />
                                    @endif
                                </div>
                                <div class="col-md-5">
                                    @if($sector->foto10)
                                    <label><input type="checkbox" id="cbox10" name="cbox10"> Eliminar foto</label>
                                    @endif
                                    <input id="image_path10" type="file"
                                        class="form-control{{ $errors->has('image_path10') ? ' is-invalid' : '' }}"
                                        name="image_path10">
                                    @if ($errors->has('image_path10'))
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $errors->first('image_path10') }}</strong>
                                    </span>
                                    @endif
                                </div>
                            </div>

                            @endif

                        </div>
                    </div>

                    <br />
                    <div class="form-group row">
                        <label for="observaciones" class="col-md-2 col-form-label text-md-right">
                            {{ __('Observaciones') }}</label>
                        <div class="col-md-8 text-area">
                            <textarea class="form-control" name="observaciones" rows="4"
                                {{$edit}}>{{$sector->observaciones}}</textarea>
                        </div>
                    </div>


                </div>


            </form>

            <div class="clearfix"></div>


            <div class="col-md-6 offset-md-4">
                @if(!$edit)
                <!--si se está editando se muestra el boón para grabar-->
                <div class="btn-nuevo">
                    <button type="submit" class="btn btn-outline-primary" name="b-modificar" form="update_sector"
                    onclick="flag_borrar(false);">
                        Grabar
                    </button>
                </div>
                @else
                <div class="btn-nuevo">
                    <!--si se está visualizando se muestra el botón para modificar-->
                    <a href="{{ route('controlestacion.sector', array(
                                        'sector' => $sector))}}" class="btn btn-outline-primary">
                        Modificar
                    </a>
                </div>
                <div class="btn-nuevo">
                    <button type="submit" onclick="return flag_borrar(true);" class="btn btn-outline-danger" name="b-borrar"
                        form="update_sector">
                        Borrar
                    </button>
                </div>

                @endif


                <!--vuelve a la pantalla de control de estación del servicio-->
                <a href="{{ route('controlestacion', ['servicio'=>$sector->servicio_id])}}"
                    class="btn btn-outline-primary">
                    @if(!$edit)
                    Cancelar
                    @else
                    Volver
                    @endif
                </a>


            </div>

        </div>
    </div>
</div>



@endsection


@section('script')
<script src="{{ asset('js/funciones.js') }}"></script>
<script language="javascript">
var flagBorrar = false;

function estaciones_faltantes() {

    var total = parseInt(document.getElementById('estaciones').innerHTML);
    var valor1 = parseInt(document.getElementById('ceboa').value);
    var valor2 = parseInt(document.getElementById('cebos').value);
    var valor3 = parseInt(document.getElementById('cebor').value);
    var valor4 = parseInt(document.getElementById('liquidoa').value);
    var valor5 = parseInt(document.getElementById('liquidos').value);
    var valor6 = parseInt(document.getElementById('liquidor').value);
    if (!valor1) {
        valor1 = 0;
    }
    if (!valor2) {
        valor2 = 0;
    }
    if (!valor3) {
        valor3 = 0;
    }
    if (!valor4) {
        valor4 = 0;
    }
    if (!valor5) {
        valor5 = 0;
    }
    if (!valor6) {
        valor6 = 0;
    }

    total = total - valor2 - valor1 - valor3 - valor4 - valor5 - valor6;
    document.getElementById('estaciones_faltantes').innerHTML = total;
    if (total == 0) {
        document.getElementById("estaciones_faltantes").style.color = "black";
    } else {
        document.getElementById("estaciones_faltantes").style.color = "red";
    }
}


    function flag_borrar($flag) {
        flagBorrar = $flag;
        if($flag)
        return confirm('¿Seguro que desea eliminar el sector {{$sector->sector}}?')
    }


$(document).ready(function(e) {
    sumar_estaciones();
    estaciones_faltantes();


});
</script>
@endsection