@extends('theme.layout')
@section('content-layout')




<style>
    div.dataTables_wrapper {
        width: 95vw;
        margin: 0 auto;
    }

</style>


<div class="tab-content">
    <div class="tab-pane tabs-animation fade show active" id="tab-content-0" role="tabpanel">
        <div class="row">
            <div class="col-md-12">
                <div class="main-card mb-3 card">
                    <div class="card-header"> <i class="header-icon pe-7s-news-paper icon-gradient bg-love-kiss"></i>Listado de prog
                        <div class="col-auto btn-actions-pane-right">
                            <a href="{{route('formwork')}}" class="btn-icon btn btn-success"><i class="pe-7s-add-user btn-icon-wrapper"></i>Agregar nuevo registro</a>
                        </div>
                    </div>

                    <form method="post" autocomplete="off" id="formid" action="{{route('listwork')}}">
                        @csrf
                        <div class='row mb-3 mb-3 justify-content-center row g-3 align-items-end'>

                            @if(session('mensaje'))
                            <div class='alert alert-success error-validation-form-backend'>
                                {{ session('mensaje') }}
                            </div>
                            @endif


                            <div class="col-md-2">
                                <div class="form-group">
                                    <label>
                                        <h6>Zona de trabajo
                                        </h6>
                                    </label>
                                    <select class="form-select
                                         select2" style="width: 100%;" id="zone_work_id" name="zone_work_id">


                                        <option value=""> Todos</option>

                                        @foreach($ZoneWork as $row)
                                        <option value="{{ $row->id}}" @if(isset($zone_work_id)) @if($zone_work_id==$row->id) selected @endif @endif>{{ $row->name}}</option>


                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="form-group">
                                    <label>
                                        <h6>Turno
                                        </h6>
                                    </label>
                                    <select class="form-select
                                         select2" style="width: 100%;" id="shift_id" name="shift_id">


                                        <option value=""> Todos</option>

                                        @foreach($Shift as $row)
                                        <option value="{{ $row->id}}" @if(isset($shift_id)) @if($shift_id==$row->id) selected @endif @endif>{{ $row->name}}</option>


                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="form-group">
                                    <label>
                                        <h6>Fecha
                                        </h6>
                                    </label>
                                    <div class="input-group">
                                        <input type="text" class="form-control btn-sm" id="date_work" name="date_work" @if(isset($date_work)) value="{{$date_work}}" @endif />
                                        <button class="btn btn-outline-primary mt-0" id="date_work_trig" type="button"><i class="fa fa-calendar-alt"></i></button>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="form-group">
                                    <label>
                                        <h6>estado trabajo
                                        </h6>
                                    </label>
                                    <select class="form-select
                                         select2" style="width: 100%;" id="status_work_id" name="status_work_id">


                                        <option value=""> Todos</option>

                                        @foreach($StatusWork as $row)
                                        <option value="{{ $row->id}}" @if(isset($status_work_id)) @if($status_work_id==$row->id) selected @endif @endif>{{ $row->name}}</option>


                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="form-group">
                                    <label>
                                        <h6>supervisor
                                        </h6>
                                    </label>
                                    <select class="form-select
                                         select2" style="width: 100%;" id="supervisor_id" name="supervisor_id">


                                        <option value=""> Todos</option>

                                        @foreach($Supervisor as $row)
                                        <option value="{{ $row->id}}" @if(isset($supervisor_id)) @if($supervisor_id==$row->id) selected @endif @endif>{{ $row->name}}</option>


                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-1  flex-column justify-content-end">
                                <button class="btn-icon btn btn-warning" type="submit"><i class="pe-7s-filter btn-icon-wrapper"></i> Filtrar</button>
                            </div>

                        </div>

                    </form>

                    <hr>

                    <div class="row">
                        <div class="col-md-12 ">
                            <div class="form-group mb3">


                                <table style="width: 100%;" id="listwork" class="table nowrap table-hover table-striped table-bordered">
                                    <thead>
                                        <tr>
                                            <th style='width:0px'>#</th>
                                            <th>Zona de trabajo</th>
                                            <th>Fecha</th>
                                            <th>Turno</th>
                                            <th>estado trabajo</th>
                                            <th>supervisor</th>







                                            <th style='width:0px'>Estado</th>
                                            <th style='width:0px'>Editar</th>

                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach ($Work as $row )
                                        <tr>
                                            <td>{{$row->id}}</td>
                                            <td>{{$row->zone_work_name}}</td>
                                            <td>{{$row->date_work}}</td>
                                            <td>{{$row->shift_name}}</td>
                                            <td>{{$row->status_work_name}}</td>
                                            <td>{{$row->supervisor_name}}</td>










                                            <td> <input type="checkbox" id="idstatus{{$row->id}}" value="{{$row->id}}" onchange="javascript:update_status('{{route('updatework')}}',this.id)" data-toggle="toggle" data-onstyle="success" data-offstyle="default" data-size="mini" data-on="Activo" data-off="Inactivo" @if($row->status==1) checked @endif> </td>

                                            <td>
                                                <a href="{{route('formwork',['id'=>$row->id])}}" class="btn mb-2 me-2 btn-icon btn-pill btn btn-outline-focus btn-sm" role="button"><i class="pe-7s-upload btn-icon-wrapper"></i>Editar</a>

                                            </td>
                                        </tr>

                                        @endforeach



                                    </tbody>

                                </table>
                            </div>

                        </div>

                    </div>
                </div>




            </div>

        </div>

    </div>

</div>

</div>

<script>
    $(function() {
        var table_work = $('#listwork').DataTable({
            dom: 'Bfrtip'
            , buttons: [{
                extend: 'excel'
                , filename: 'lista'
                , title: 'Lista'
                , className: 'btn-icon btn btn-export'
                , text: '<i class="fa fa-fw" aria-hidden="true" title="Copy to use file-excel-o"></i> Exportar a Excel'
                , exportOptions: {
                    columns: [0, 1, 2, 3, 4, 5, 6]
                    , customizeData: function(excelData) {
                        excelData.body.forEach(function(row) {
                            row[2] = row[2];
                        });
                    }
                }
            }]
            , columnDefs: [{
                    "width": "5px"
                    , "targets": -1
                }, // Define el ancho de la primera columna como 200px
                {
                    "width": "5px"
                    , "targets": -2
                },

            ]
            , scrollX: true, // Activar el scroll horizontal


            autoWidth: true

        });

        table_work.on('page.dt', function() {
            var paginaActualwork = table_work.page.info().page;
            //console.log(paginaActualwork);
            sessionStorage.setItem('paginaActualwork', paginaActualwork);
        });
        table_work.on('search.dt', function() {
            var valorBusquedawork = table_work.search();
            sessionStorage.setItem('valorBusquedawork', valorBusquedawork);
        });


        var paginaGuardada = sessionStorage.getItem('paginaActualwork');
        var valorBusquedaworkGuardado = sessionStorage.getItem('valorBusquedawork');
        if (paginaGuardada) {
            table_work.page(parseInt(paginaGuardada)).draw(false);
        }
        if (valorBusquedaworkGuardado) {
            table_work.search(valorBusquedaworkGuardado).draw();
        }




        $('.dt-button').removeClass('dt-button');




        $.validate({
            form: '#formid'
            , lang: 'es'
        , });




    });

</script>

@endsection