@extends('layouts.main')
@section('content')
<div class="row">
	 <div class="col-md-12">
            <div class="card">
                <div class="card-body">
                <div class="card-block">   
                        <div class="form-body">    
                            <div class="col-md-6">       
                                    <label for="imei">IMEI</label>
                                    <p class="form-control-plaintext">{{$device->IMEI}}</p>
                            </div> 
                            <div class="col-md-6"> 
                                <div class="form-group">
                                    <label for="alias">Alias</label>
                                    <p class="form-control-plaintext">{{$device->ALIAS}}</p>
                                </div>   
                            </div>
                        </div> 
                </div>
            </div>
        </div>
    </div>
</div>
@if(!isset($alert))
<div class="row">
    <div class="col-md-12">        
        <div class="card">            
            <div class="card-header">
                <h1>{{__('strings.cmd_configuratuon')}}</h1>
            </div>
            <div class="card-body">
                <form class="form" action="{{route('updates_other_alerts_post')}}" method="post">
                    {{ csrf_field() }}
                    <input type="hidden" name="imei" value="{{$device->IMEI}}">
                    <div class="form-body"> 
                        <div class="table-responsive" style="height: 450px; overflow: auto;">
                            <table id="table-cmds" class="table table-striped hover">
                                <thead>
                                    <tr>
                                        <th>{{__('strings.enable')}}</th>
                                        <th>{{__('strings.cmd')}}</th>
                                        <th>{{__('strings.tanslate')}}</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @for($i=1;$i <= 30;$i++)
                                    <tr>
                                        <td><input type="checkbox" name="cmds[]" value="{{$i}}"></td>
                                        <td>{{__('strings.tanslate')}} {{__('strings.cmd')}}&nbsp;{{$i}}</td>
                                        <td><input id="row-1-position" name="{{$i}}" value="" type="text"></td>
                                    </tr>
                                    @endfor    
                                    <tr>
                                        <td><input type="checkbox" name="cmds[]" value="44"></td>
                                        <td>{{__('strings.tanslate')}} {{__('strings.cmd')}}&nbsp;44</td>
                                        <td><input id="row-1-position" name="44" value="" type="text"></td>
                                    </tr>
                                    <tr>
                                        <td><input type="checkbox" name="cmds[]" value="63"></td>
                                        <td>{{__('strings.tanslate')}} {{__('strings.cmd')}}&nbsp;63</td>
                                        <td><input id="row-1-position" name="63" value="" type="text"></td>
                                    </tr>                            
                                </tbody>
                            </table>
                        </div>
                    </div>
                <hr>
                    <div class="form-body">                         
                        <div class="input-group">
                            <div class="ln_solid"></div>
                            <div class="input-group mb-3">
                                <div class="input-group-prepend">
                                    <span class="input-group-text">{{__('strings.max_speed')}}</span>
                                </div>
                                <input type="number" min="0" max="240" value="120" id="max_speed" name="max_speed" class="form-control" required="required" >
                            </div>
                        </div>
                        <div id="emails" class="form-group">                
                            <div class="input-group mb-3">
                                <div class="input-group-prepend">
                                    <span class="input-group-text"><li class="fa fa-envelope"></li>&nbsp;</span>
                                </div>
                                <input type="email" id="emails[]" name="emails[]" placeholder="mail@ejemplo.com" required="required" class="form-control col-md-12" >
                            </div>
                        </div>
                        <div class="form-group">
                            <span class="float-sm-right">
                                <button  type="button" class="btn btn-success" onclick="addEmailField()"><i class="fa fa-plus"></i></button>
                            </span>                    
                        </div>
                        <div class="clearfix"></div>
                        <hr>
                        <div class="card-header">
                            <h1>{{__('strings.fuel_sensors_configuration')}}</h1>
                        </div>
                                                           
                        <div class="col-md-4">
                            <div class="input-group mb-3">
                                <div class="input-group-prepend">
                                    <span class="input-group-text"><i class="fas fa-gas-pump"></i>&nbsp;-1 V.MIN</span>
                                </div>
                                <input type="number" min="0" max="1024" value="0" id="min_sensor1" name="min_sensor1" class="form-control"  placeholder="{{__('strings.min_sensor_fuel')}}">
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="input-group mb-3">
                                <div class="input-group-prepend">
                                    <span class="input-group-text"><i class="fas fa-gas-pump"></i>&nbsp;-1 V.MAX</span>
                                </div>
                                <input type="number" min="0" max="1024" value="699" id="max_sensor1" name="max_sensor1" class="form-control" placeholder="{{__('strings.max_sensor_fuel')}}" >
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="input-group mb-3">
                                <div class="input-group-prepend">
                                    <span class="input-group-text"><i class="fas fa-gas-pump"></i>&nbsp;-1 LTRS</span>
                                </div>
                                <input type="number" min="0" max="1024" value="0" id="liters_sensor1" name="liters_sensor1" class="form-control" placeholder="{{__('strings.sensor_liters')}}" >
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="input-group mb-3">
                                <div class="input-group-prepend">
                                    <span class="input-group-text"><i class="fas fa-gas-pump"></i>&nbsp;-2 V.MIN</span>
                                </div>
                                <input type="number" min="0" max="1024" value="0" id="min_sensor2" name="min_sensor2" class="form-control"  placeholder="{{__('strings.min_sensor_fuel')}}">
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="input-group mb-3">
                                <div class="input-group-prepend">
                                    <span class="input-group-text"><i class="fas fa-gas-pump"></i>&nbsp;-2 V.MAX</span>
                                </div>
                                <input type="number" min="0" max="1024" value="699" id="max_sensor2" name="max_sensor2" class="form-control" placeholder="{{__('strings.max_sensor_fuel')}}" >
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="input-group mb-3">
                                <div class="input-group-prepend">
                                    <span class="input-group-text"><i class="fas fa-gas-pump"></i>&nbsp;-2 LTRS</span>
                                </div>
                                <input type="number" min="0" max="1024" value="0" id="liters_sensor2" name="liters_sensor2" class="form-control" placeholder="{{__('strings.sensor_liters')}}" >
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="input-group mb-3">
                                <div class="input-group-prepend">
                                    <span class="input-group-text"><i class="fas fa-gas-pump"></i>&nbsp;-3 V.MIN</span>
                                </div>
                                <input type="number" min="0" max="1024" value="0" id="min_sensor3" name="min_sensor3" class="form-control"  placeholder="{{__('strings.min_sensor_fuel')}}">
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="input-group mb-3">
                                <div class="input-group-prepend">
                                    <span class="input-group-text"><i class="fas fa-gas-pump"></i>&nbsp;-3 V.MAX</span>
                                </div>
                                <input type="number" min="0" max="1024" value="699" id="max_sensor3" name="max_sensor3" class="form-control" placeholder="{{__('strings.max_sensor_fuel')}}" >
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="input-group mb-3">
                                <div class="input-group-prepend">
                                    <span class="input-group-text"><i class="fas fa-gas-pump"></i>&nbsp;-3 LTRS</span>
                                </div>
                                <input type="number" min="0" max="1024" value="0" id="liters_sensor3" name="liters_sensor3" class="form-control" placeholder="{{__('strings.sensor_liters')}}" >
                            </div>
                        </div>
                        <div class="clearfix"></div>                            
                        <div class="col-md-6"> 
                            <div class="form-group">
                                <a href="#" onclick="window.history.back();" class="btn btn-secondary">  {{__('strings.submit_cancel')}} </a>    
                                <button type="submit" class="btn btn-primary">{{ __('strings.submit_update') }}</button>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
@else
<div class="row">
    <div class="col-md-12">        
        <div class="card">            
            <div class="card-header">
                <h1>{{__('strings.cmd_configuratuon')}}</h1>
            </div>
            <div class="card-body">
                <form class="form" action="{{route('updates_other_alerts_post')}}" method="post">
                    {{ csrf_field() }}
                    <input type="hidden" name="imei" value="{{$device->IMEI}}">
                    <div class="form-body">
                        <div class="table-responsive" style="height: 450px; overflow: auto;">
                            <table id="table-cmds" class="table table-striped hover">
                            <thead>
                                <tr>
                                    <th>{{__('strings.enable')}}</th>
                                    <th>{{__('strings.cmd')}}</th>
                                    <th>{{__('strings.tanslate')}}</th>
                                </tr>
                            </thead>
                            <tbody>
                                @for($i=1;$i <= 30;$i++)
                                    @if($alert->cmds->contains('cmd', $i))      
                                    <tr>
                                        <td><input type="checkbox" name="cmds[]" value="{{$i}}" checked="checked"></td>
                                        <td>{{__('strings.tanslate')}} {{__('strings.cmd')}}&nbsp;{{$i}}</td>
                                        <td><input id="row-1-position" name="{{$i}}" value="{{$alert->cmds->firstWhere('cmd', $i)['translate']}}" type="text"></td>
                                    </tr>
                                    @else                                    
                                    <tr>
                                        <td><input type="checkbox" name="cmds[]" value="{{$i}}"></td>
                                        <td>{{__('strings.tanslate')}} {{__('strings.cmd')}}&nbsp;{{$i}}</td>
                                        <td><input id="row-1-position" name="{{$i}}" value="" type="text"></td>
                                    </tr>
                                    @endif
                                @endfor   
                                    
                                    @if($alert->cmds->contains('cmd', 44))      
                                    <tr>
                                        <td><input type="checkbox" name="cmds[]" value="44" checked="checked"></td>
                                        <td>{{__('strings.tanslate')}} {{__('strings.cmd')}}&nbsp;44</td>
                                        <td><input id="row-1-position" name="44" value="{{$alert->cmds->firstWhere('cmd', 44)['translate']}}" type="text"></td>
                                    </tr>
                                    @else                                    
                                    <tr>
                                        <td><input type="checkbox" name="cmds[]" value="44"></td>
                                        <td>{{__('strings.tanslate')}} {{__('strings.cmd')}}&nbsp;44</td>
                                        <td><input id="row-1-position" name="44" value="" type="text"></td>
                                    </tr>
                                    @endif
                                    
                                    @if($alert->cmds->contains('cmd', 63))      
                                    <tr>
                                        <td><input type="checkbox" name="cmds[]" value="63" checked="checked"></td>
                                        <td>{{__('strings.tanslate')}} {{__('strings.cmd')}}&nbsp;63</td>
                                        <td><input id="row-1-position" name="63" value="{{$alert->cmds->firstWhere('cmd', 63)['translate']}}" type="text"></td>
                                    </tr>
                                    @else                                    
                                    <tr>
                                        <td><input type="checkbox" name="cmds[]" value="63"></td>
                                        <td>{{__('strings.tanslate')}} {{__('strings.cmd')}}&nbsp;63</td>
                                        <td><input id="row-1-position" name="63" value="" type="text"></td>
                                    </tr>
                                    @endif
                            </tbody>
                        </table>
                        </div>
                    </div>
                <hr>
                    <div class="form-body">                                                 
                        <div class="input-group">
                            <div class="input-group mb-3">
                                <div class="input-group-prepend">
                                    <span class="input-group-text">{{__('strings.max_speed')}}</span>
                                </div>
                                <input type="number" min="0" max="240" value="{{$alert->max_speed}}" id="max_speed" name="max_speed" class="form-control" required="required" >
                            </div>
                        </div>
                        <div id="emails" class="form-group">                                        
                            @foreach($alert->emails as $email)
                            <div class="input-group mb-3">
                                <div class="input-group-prepend">
                                    <span class="input-group-text"><li class="fa fa-envelope"></li>&nbsp;</span>
                                </div>
                                <input type="email" id="emails[]" name="emails[]" placeholder="mail@ejemplo.com" required="required" class="form-control col-md-12" value="{{$email}}" >
                            </div>
                            @endforeach
                        </div>
                        <div class="form-group">
                            <span class="float-sm-right">
                                <button  type="button" class="btn btn-success" onclick="addEmailField()"><i class="fa fa-plus"></i></button>
                            </span>                    
                        </div>                      
                        <div class="clearfix"></div>
                        <hr>
                        <div class="card-header">
                            <h1>{{__('strings.fuel_sensors_configuration')}}</h1>
                        </div>
                                                           
                        <div class="col-md-4">
                            <div class="input-group mb-3">
                                <div class="input-group-prepend">
                                    <span class="input-group-text"><i class="fas fa-gas-pump"></i>&nbsp;-1 V.MIN</span>
                                </div>
                                <input type="number" min="0" max="1024" value="{{$alert->min_sensor1}}" id="min_sensor1" name="min_sensor1" class="form-control"  placeholder="{{__('strings.min_sensor_fuel')}}">
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="input-group mb-3">
                                <div class="input-group-prepend">
                                    <span class="input-group-text"><i class="fas fa-gas-pump"></i>&nbsp;-1 V.MAX</span>
                                </div>
                                <input type="number" min="0" max="1024" value="{{$alert->max_sensor1}}" id="max_sensor1" name="max_sensor1" class="form-control" placeholder="{{__('strings.max_sensor_fuel')}}" >
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="input-group mb-3">
                                <div class="input-group-prepend">
                                    <span class="input-group-text"><i class="fas fa-gas-pump"></i>&nbsp;-1 LTRS</span>
                                </div>
                                <input type="number" min="0" max="1024" value="{{$alert->liters_sensor1}}" id="liters_sensor1" name="liters_sensor1" class="form-control" placeholder="{{__('strings.sensor_liters')}}" >
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="input-group mb-3">
                                <div class="input-group-prepend">
                                    <span class="input-group-text"><i class="fas fa-gas-pump"></i>&nbsp;-2 V.MIN</span>
                                </div>
                                <input type="number" min="0" max="1024" value="{{$alert->min_sensor2}}" id="min_sensor2" name="min_sensor2" class="form-control"  placeholder="{{__('strings.min_sensor_fuel')}}">
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="input-group mb-3">
                                <div class="input-group-prepend">
                                    <span class="input-group-text"><i class="fas fa-gas-pump"></i>&nbsp;-2 V.MAX</span>
                                </div>
                                <input type="number" min="0" max="1024" value="{{$alert->max_sensor2}}" id="max_sensor2" name="max_sensor2" class="form-control" placeholder="{{__('strings.max_sensor_fuel')}}" >
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="input-group mb-3">
                                <div class="input-group-prepend">
                                    <span class="input-group-text"><i class="fas fa-gas-pump"></i>&nbsp;-2 LTRS</span>
                                </div>
                                <input type="number" min="0" max="1024" value="{{$alert->liters_sensor2}}" id="liters_sensor2" name="liters_sensor2" class="form-control" placeholder="{{__('strings.sensor_liters')}}" >
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="input-group mb-3">
                                <div class="input-group-prepend">
                                    <span class="input-group-text"><i class="fas fa-gas-pump"></i>&nbsp;-3 V.MIN</span>
                                </div>
                                <input type="number" min="0" max="1024" value="{{$alert->min_sensor3}}" id="min_sensor3" name="min_sensor3" class="form-control"  placeholder="{{__('strings.min_sensor_fuel')}}">
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="input-group mb-3">
                                <div class="input-group-prepend">
                                    <span class="input-group-text"><i class="fas fa-gas-pump"></i>&nbsp;-3 V.MAX</span>
                                </div>
                                <input type="number" min="0" max="1024" value="{{$alert->max_sensor3}}" id="max_sensor3" name="max_sensor3" class="form-control" placeholder="{{__('strings.max_sensor_fuel')}}" >
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="input-group mb-3">
                                <div class="input-group-prepend">
                                    <span class="input-group-text"><i class="fas fa-gas-pump"></i>&nbsp;-3 LTRS</span>
                                </div>
                                <input type="number" min="0" max="1024" value="{{$alert->liters_sensor3}}" id="liters_sensor3" name="liters_sensor3" class="form-control" placeholder="{{__('strings.sensor_liters')}}" >
                            </div>
                        </div>
                        <div class="clearfix"></div>                            
                        <div class="col-md-6"> 
                            <div class="form-group">
                                <a href="#" onclick="window.history.back();" class="btn btn-secondary">  {{__('strings.submit_cancel')}} </a>    
                                <button type="submit" class="btn btn-primary">{{ __('strings.submit_update') }}</button>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
@endif

<div class="row">
    <div class="col-md-12">        
        <div class="card">            
            <div class="card-header">
                <h1>{{__('strings.fuel_sensors_configuration')}}</h1>
            </div>
            <div class="card-body" style="min-height: 450px;">
                <div class="col-md-6">
                <div class="form-group">
                    <label for="tank-type">Tipo de tanque</label>
                    <select id="tank-type" class="form-control">
                        <option value="rectangle">Rectangular</option>
                        <option value="cylinder">Cilíndrico</option>
                        <option value="backpack">Backpack</option>
                    </select>
                </div>
                </div>
                <div class="col-md-6">
                    <img id="tank-image"  class="img-fluid mx-auto d-block p-4" src="{{asset('images/rectangle-tank.png')}}">                        		
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script>
    /**
     * Add email field to documente
     * @returns {undefined}
     */
    function addEmailField() {
        $("#emails").append('<div class="input-group mb-3"> <div class="input-group-prepend"> <span class="input-group-text"><li class="fa fa-envelope"></li>&nbsp;</span> </div> <input type="email" id="emails[]" name="emails[]" placeholder="mail@ejemplo.com" required="required" class="form-control col-md-12" ></div>');
    }

    $("#tank-type").change(function(){
        if($(this).val() == "rectangle") {
            $("#tank-image").attr("src","{{asset('images/rectangle-tank.png')}}");
        } else if($(this).val() == "cylinder") {
            $("#tank-image").attr("src","{{asset('images/cylinder-tank.png')}}");
        } else if($(this).val() == "backpack") {
            $("#tank-image").attr("src","{{asset('images/backpack-tank.png')}}");
        }
    });
    $(function(){
        $( "#tank-type" ).trigger( "change" );
    });
    
</script>
@endpush