@extends('layouts.master')
@section('title', 'Page accueil')
@section('titlePageHeading', '')

    @section('content')
    @if($course->courses_statuts_id>1)
        @include('partials.course_info')
    @else
        <fieldset >     
            <legend>Liste des commandes
            <a style="font-size: 80%;padding: 0;" class="btn btn-link" data-toggle="collapse" href="#bloc_1" role="button" aria-expanded="false" aria-controls="bloc_1">
                <i class="fa fa-plus-square" aria-hidden="true" onclick="$('#m_bloc_1').show();$('#p_bloc_1').hide()" style="display: none" id="p_bloc_1"></i>
                <i class="fa fa-minus-square" aria-hidden="true" onclick="$('#p_bloc_1').show();$('#m_bloc_1').hide()" id="m_bloc_1" ></i>
            </a>     
            </legend>    
            <div class="collapse show" id="bloc_1">
                <div class="quote">{!! $liste_commandes_courses !!}</div> 
            </div> 
        </fieldset>
    @endif
        <fieldset >     
            <legend>Liste des commandes selectionnés
            <a style="font-size: 80%;padding: 0;" class="btn btn-link" data-toggle="collapse" href="#bloc_2" role="button" aria-expanded="false" aria-controls="bloc_2">
                <i class="fa fa-plus-square" aria-hidden="true" onclick="$('#m_bloc_2').show();$('#p_bloc_2').hide()" style="display: none" id="p_bloc_2"></i>
                <i class="fa fa-minus-square" aria-hidden="true" onclick="$('#p_bloc_2').show();$('#m_bloc_2').hide()" id="m_bloc_2" ></i>
            </a>     
            </legend>    
            <div class="collapse show" id="bloc_2">
                <div class="quote">{!! $liste_courses_details !!}</div> 
            </div> 
        </fieldset>

    @if($course->courses_statuts_id<=1)  
        <fieldset >     
            <legend>Validation du course
            <a style="font-size: 80%;padding: 0;" class="btn btn-link" data-toggle="collapse" href="#bloc_3" role="button" aria-expanded="false" aria-controls="bloc_3">
                <i class="fa fa-plus-square" aria-hidden="true" onclick="$('#m_bloc_3').show();$('#p_bloc_3').hide()" style="display: none" id="p_bloc_3"></i>
                <i class="fa fa-minus-square" aria-hidden="true" onclick="$('#p_bloc_3').show();$('#m_bloc_3').hide()" id="m_bloc_3" ></i>
            </a>     
            </legend>           
            <div class="panel panel-default">
            <div class="panel-body">  
                <div class="collapse show" id="bloc_3">
                    
                    <form id="formConfirmcourse"  action="{{ url('commandes/courses_save/') }}" method="post" >
                        {{	csrf_field() }}
                        <div class="form-group row">
                            <label for="colFormLabelSm" class="col-sm-2 col-form-label col-form-label-sm font-weight-bold">N° course</label>
                            <div class="col-sm-4">
                            <input readonly type="text" class="form-control form-control-sm" value="{{ $course->n_course }}" >
                            </div>

                            <label for="colFormLabelSm" class="col-sm-2 col-form-label col-form-label-sm font-weight-bold">Date course</label>
                            <div class="col-sm-4">
                            <input readonly type="text" class="form-control form-control-sm" value="{{ $course->date_course->format('d/m/Y H:i') }}">
                            </div>
                        </div>
                        <div class="form-group row">
                            <label for="colFormLabelSm" class="col-sm-2 col-form-label col-form-label-sm font-weight-bold">Chauffeur </label>
                            <div class="col-sm-10">
                                <select class="form-control form-control-sm class_multi_select" id="chauffeurs_id" name="chauffeurs_id" >
                                    <option value="" ></option>
                                    @if($course->courses_statuts_id==1)
                                        @foreach ($chauffeurs as $chauffeur)
                                        <option {{ ($chauffeur->id == $course->chauffeurs_id) ? 'selected' : '' }} value="{{ $chauffeur->id }}" >
                                            {{ $chauffeur->libelle }}
                                        </option>
                                        @endforeach
                                    @endif
                                </select>
                            </div>
                        </div> 
                        <div class="form-group row">
                            <label for="colFormLabelSm" class="col-sm-2 col-form-label col-form-label-sm font-weight-bold">Dépot de ramassage</label>
                            <div class="col-sm-4"> 
                                <select class="form-control form-control-sm class_multi_select" id="depots_id" name="depots_id" required >
                                    <option value="" ></option>
                                    @foreach ($depots as $depot)
                                    <option {{ ($depot->id == $course->depots_id) ? 'selected' : '' }} value="{{ $depot->id }}" >
                                        {{ $depot->libelle }}
                                    </option>
                                    @endforeach
                                </select>
                            </div>

                            <label for="colFormLabelSm" class="col-sm-2 col-form-label col-form-label-sm font-weight-bold">Date heure ramassage </label>
                            <div class="col-sm-2">                            
                            <input type="text" class="form-control form-control-sm"  id="date_ramassage" name="date_ramassage"  value="{{ $date_ramassage }}">
                            <script>
                                $('#date_ramassage').datepicker({
                                    autoclose: true,
                                    dateFormat: 'dd/mm/yy',
                                    format: 'dd/mm/yy'
                                    /*,startDate:  new Date(),                                            
                                    endDate: new Date(new Date().setDate(new Date().getDate() + 42)),
                                    minDate:  new Date(),                                            
                                    maxDate: new Date(new Date().setDate(new Date().getDate() + 42))*/
                                });
                            </script>
                            </div>
                            <div class="col-sm-2">
                                <select class="form-control form-control-sm class_multi_select" id="heure_ramassage" name="heure_ramassage" required >
                                    @for($i=0;$i<=23;$i++)
                                        <option  {{ ($heure_ramassage*1 == $i*1) ? 'selected' : '' }} value="{{ ($i <10) ? '0'.$i : $i }}:00"  >{{ ($i <10) ? '0'.$i : $i }}:00</option>
                                    @endfor
                                </select>
                            </div> 
                        </div>
                        <div class="form-group row">
                            <label for="colFormLabelSm" class="col-sm-2 col-form-label col-form-label-sm font-weight-bold">Commentaire</label>
                            <div class="col-sm-4">
                                <textarea class="form-control form-control-sm" id="commentaire" name="commentaire" rows="1">{{ $course->commentaire }}</textarea>
                            </div>

                            <label for="colFormLabelSm" class="col-sm-2 col-form-label col-form-label-sm font-weight-bold">Statut course </label>
                            <div class="col-sm-4">                            
                                @if($course->courses_statuts_id>0)                           
                                <input readonly type="text" class="form-control form-control-sm" value="{{ $course->course_statut->libelle }}" >
                                @else
                                <input readonly type="text" class="form-control form-control-sm" value="Non Enregistrée" >
                                @endif
                            </div>
                        </div>
                        <div class="form-row">
                            <div class="form-group col-md-3">                            
                            </div>
                            <div class="form-group col-md-3"></div>
                            <div class="form-group col-md-3">
                                @if($course->courses_statuts_id<=1 && session('action_editable'))                      
                                <input type="submit" class="btn btn-primary btn-sm btn-block" formaction="{{ url('commandes/courses_save/1') }}"  value="Enregistrer">
                                @endif
                            </div>
                            <div class="form-group col-md-3">
                                <input id="courses_id" name="courses_id" readonly type="hidden" class="form-control form-control-sm" value="{{ $course->id }}">
                                @if($course->courses_statuts_id<=1 && session('action_editable'))
                                <input type="submit" class="btn btn-primary btn-sm btn-block" formaction="{{ url('commandes/courses_save/2') }}"  value="Valider">
                                @endif
                            </div>
                        </div>
                    </form>

                </div>
            </div>
            </div>
        </fieldset>
    @endif
    
    <div class="form-row">
        <a class="col-md-3 btn btn-primary btn-sm btn-block" href="{{ url('/commandes/dispatching_tabs') }}" class="btn btn-default">Retour</a>
        <div class="col-md-6">
        </div>
        <div class="col-md-3">
        @if($course->courses_statuts_id==2)  
        <input type="button" onclick="regression({{ $course->id }})" class="btn btn-warning  btn-sm btn-block" value="Régression">
        @endif
        </div>
    </div>

    <script>
        
        function regression(id){
                Swal.fire({
                title: 'Info régression',
                type: 'question',
                html:   '<div class="form-group row">'+
                        '<input disabled placeholder="Date régression" id="regression_date" value="{{ $regression_date->format('d/m/Y H:i') }}" class="form-control swal2-input" readonly>'+
                        '<textarea placeholder="Commentaire" id="regression_commentaire" class="form-control swal2-input" rows="2"></textarea>'+
                        '</div>',
                customClass: 'swal2-overflow',
                onOpen:function(){
                },
                confirmButtonText: 'Valider',
                cancelButtonText: 'Retour',
                showCancelButton: true,
                showCloseButton: true
                }).then(function(result) {
                    if(result.value){
                        var regression_date = $('#regression_date').val();
                        var regression_commentaire = $('#regression_commentaire').val();
                        if(regression_date==""){
                            alert('Date regression obligatoire');
                            regression(id);                        
                            return false;
                        }

                        var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
                        $.ajax({
                            type: 'POST',
                            url: "/commandes/courses_regression/"+id,
                            data: {_token: CSRF_TOKEN,regression_date: regression_date+"",regression_commentaire: regression_commentaire+""},
                            dataType: 'JSON',
                            success: function (results) {
                                window.location.href="/commandes/dispatching_tabs/" ; 
                            }
                        });
                    }
                });

                }

        function grid_onload_courses_details(){

            var option = {
            /*style: 'percent',*/
            minimumFractionDigits: 2,
            maximumFractionDigits: 2
            };
            var option_percent = {
            style: 'percent',
            minimumFractionDigits: 2,
            maximumFractionDigits: 2
            };

            var formatter = new Intl.NumberFormat("de-DE",option);
            var formatter_percent = new Intl.NumberFormat("de-DE",option_percent);
            var grid 		= 	$("#liste_courses_details");         
            prix_ttc_total 	= 	grid.jqGrid('getCol', 'prix_ttc_total')[0]*1; 
            poids_total 	= 	grid.jqGrid('getCol', 'poids_total')[0]*1; 
            volume_total 	= 	grid.jqGrid('getCol', 'volume_total')[0]*1; 
            grid.jqGrid('footerData','set', { 
                prix_total: '' + formatter.format(prix_ttc_total*1.0)
                ,poids: '' + formatter.format(poids_total*1.0)
                ,volume: '' + formatter.format(volume_total*1.0)
            }, false);

        }

        
        
        
        function do_onselect_commandes(ids){ 
        var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
        $.ajax({
            type: 'POST',
            url: "/commandes/add_commandes_details/"+ids,
            data: {_token: CSRF_TOKEN},
            dataType: 'JSON',
            success: function (results) {
                var grid = jQuery("#liste_courses_details"); 
                grid.trigger("reloadGrid",[{jqgrid_page:1,current:true}]);
                
                var grid_commandes = jQuery("#liste_commandes"); 
                grid_commandes.trigger("reloadGrid",[{jqgrid_page:1,current:true}]);

                reload_select_courses(results);
            }
        });
        }

        function reload_select_courses(results){ 
            //console.log(results);
            $('#chauffeurs_id').empty();                
            $.each(results.chauffeurs, function(index, chauffeur){
                $('#chauffeurs_id').append('<option value="'+ chauffeur.id +'">'+ chauffeur.libelle +'</option>');
            });
            //$('#chauffeurs_id').append('<option value="" disable="true" selected="true">=== Select chauffeur ===</option>');

            $('#depots_id').empty();                
            $.each(results.depots, function(index, depot){
                $('#depots_id').append('<option value="'+ depot.id +'">'+ depot.libelle +'</option>');
            });
            //$('#depots_id').append('<option value="" disable="true" selected="true">=== Select depot ===</option>');
        }
        
        function do_deselect_commandes(ids){ 
        var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
        $.ajax({
            type: 'POST',
            url: "/commandes/del_commandes_details/"+ids,
            data: {_token: CSRF_TOKEN},
            dataType: 'JSON',
            success: function (results) {
                var grid = jQuery("#liste_courses_details"); 
                grid.trigger("reloadGrid",[{jqgrid_page:1,current:true}]);

                
                var grid_commandes = jQuery("#liste_commandes"); 
                grid_commandes.trigger("reloadGrid",[{jqgrid_page:1,current:true}]);

                reload_select_courses(results);

                 
            }
        });
        }

        function load_select_chaufeur(ids){ 
            var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
            $.ajax({
                type: 'POST',
                url: "/commandes/load_select_chaufeur/"+ids,
                data: {_token: CSRF_TOKEN},
                dataType: 'JSON',
                success: function (results) {
                    results.success  
                }
            });
        }
    </script>

@endsection