@extends('layouts.main')

@push('styles')
<link rel="stylesheet" type="text/css" href="{{asset('dataTables/datatables.min.css')}}">
<link rel="stylesheet" type="text/css" href="{{asset('css/dataTables.checkboxes.css')}}"/>
@endpush

@section('content')
<div class="row">
    <div class="col-md-12">
        <div class="card">
            <div class="card-body">
            <div class="card-header">
                <h1 class="card-title">{{__('strings.supervisor_update')}}</h1>
            </div>
                <div class="card-block">

                    <div class="col-md-2"></div>

                    <div class="col-md-8">
                        <form class="form" action="{{route('supervisor_update_post', ['id' => $supervisor])}}" method="post">
                            {{ csrf_field() }}

                            <div class="form-body">

                                <div class="col-md-12">
                                    <div class="form-group">
                                        <label for="name" class="form-control-label">{{__('strings.name')}}</label>
                                        <input id="name" name="name" class="form-control" placeholder="{{__('strings.name')}}" value="{{$supervisor->name ?? ''}}">
                                    </div>
                                </div>

                                <div class="col-md-12">
                                    <div class="form-group">
                                        <label for="last_name" class="form-control-label">{{__('strings.last_name')}}</label>
                                        <input id="last_name" name="last_name" class="form-control" placeholder="{{__('strings.last_name')}}" value="{{$supervisor->last_name ?? ''}}">
                                    </div>
                                </div>

                                <div class="col-md-12">
                                    <div class="form-group">
                                        <label for="email">{{ __('strings.email') }}</label>
                                        <div class="form-group">
                                            <input type="text" id="email" name="email" class="form-control" placeholder="{{ __('strings.email') }}" value="{{$supervisor->email ?? ''}}">
                                        </div>
                                    </div>
                                </div>

                                <div class="col-md-12">
                                    <div class="form-group">
                                        <label for="password">{{ __('strings.password') }}</label>
                                        <div class="form-group">
                                            <input type="text" id="password" name="password" class="form-control" placeholder="{{ __('strings.password') }}" value="{{$supervisor->password ?? ''}}">
                                        </div>
                                    </div>
                                </div>

                            </div>
                            <div class="col-md-6">
                                <button type="submit" class="btn btn-block btn-primary mt-2">
                                    {{ __('strings.update') }}
                                </button>
                            </div>
                        </form>
                        <hr>
                        <div class="col-md-6">
                                <button class="btn btn-block btn-primary mt-2" data-toggle="modal" data-target="#modal-1">{{__('strings.attach_employees')}}</button>
                        </div>
                    </div>
                    <div class="col-md-2"></div>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="modal-1" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">{{ __('strings.not_assigned_employees') }}  </h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>

            <div class="modal-body">
                
            <div class="card">
                <div class="card-block">
                        <div class="col-md-12">
                            <div class="panel panel-default">   
                                <div class="panel-heading">
                                    <div class="col-md-12">
                                        <div class="col-md-8">                                
                                            <h1>
                                                
                                            </h1>
                                        </div>
                                    </div>
                                </div>
                                    
                                <div class="cc-selector panel-body">
                                    <div class="col-md-12 ">
                                        <div class="table-responsive">
                                        <table id="employees-table" class="table hover">
                                            <thead class="thead-ligth">
                                                <tr>
                                                    <th></th>
                                                    <th>{{__('strings.employee_number')}}</th>
                                                    <th>{{__('strings.name')}}</th>
                                                    <th>{{__('strings.department')}}</th>
                                                    <th>{{__('strings.address')}}</th>
                                                    <th>{{__('strings.phone')}}</th>
                                                </tr>
                                            </thead>
                                        </table>
                                    </div>
                                    <form id="form_employee_directory" action="{{route('attach_employees_calendar', [':calendar_id'])}}" method="post">
                                        {{ csrf_field() }}
                                        <input type="hidden" id="user_token" name="user_token" value="{{Auth::user()->SECURE_TOKEN}}" >
                                        <input type="submit" class="btn btn-primary" value="{{ __('strings.attach') }}"/> 

                                        <button type="button" class="btn btn-danger" data-dismiss="modal">{{ __('strings.cancel') }}</button>
                                    </form>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

@endsection

@push('scripts')
<!-- International Telephone Input -->
<script src="{{asset('datatables/datatables.min_1.js')}}" type="text/javascript"></script>
<script src="{{asset('js/dataTables.checkboxes.min.js')}}" type="text/javascript"></script>
<!-- International Telephone Input -->

<script type="text/javascript">
    
    var table;
    $(document).ready(function() {

        //setting language for moment.js
        moment.locale('es');

        //initialize datetable
        table = $('#employees-table').DataTable({
                                responsive: false,
                                paging: false,	
                                searching: true,
                                serverSide: false,
                                ordering: false,
                                scrollY: '40vh',
                                scrollCollapse: true,
                                ajax: {
                                    url: "{{route('company_supervisors_employee')}}",
                                    type: "POST",
                                    data: {
                                        token: "{{$supervisor->token ?? ''}}"
                                    }
                                },
                                columns: [
                                        { data: 'id',  checkboxes: true },
                                        { data: 'employee_number', defaultContent:"---"},
                                        { data: 'name', defaultContent:"---"},
                                        { data: 'department', defaultContent:"---"},
                                        { data: 'address', defaultContent:"---"},
                                        { data: 'phone', defaultContent:"---"},
                                ],
                                buttons: [],
                                dom: 'Bfrtip',
                                "language" : {
                                        url: "{!! asset('datatables/languages/spanish.json') !!}"
                                }
                });
    });

    $("#form_employee_directory").on('submit', function(e) {
        e.preventDefault();
        var form = this;
        form.reset();
        var rowsSelected = table.column(0).checkboxes.selected();
        var emplIds = []; // selected employee ids
        
        if(!rowsSelected.length) {
            $.alert("{{__('strings.no_employees_selected')}}");
            return false;
        }
        
        $.each(rowsSelected, function(index, rowId){
            emplIds.push(rowId);
        });
        
        console.log(emplIds);

        //console.log()
        return false;
    });
</script>
@endpush