@extends('layout.app')


<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
@section('left-menu')
    @parent
    <ul>
        <a href="sprzet/add"><li>Dodaj<img src="../img/left_menu_icon/add.png"></li></a>
        <li>Edytuj<img src="../img/left_menu_icon/edit.png"></li>
        <li>Usuń<img src="../img/left_menu_icon/delete.png"></li>
    </ul>
@stop

@section('center-area')
    @parent

    @if( auth()->check())
        @if( auth()->user()->fireStationID == NULL)
            Jednostka nie istnieje
        @else
            <form method="POST" action="/szkolenia" id="dynamic_form">
                {{ csrf_field() }}

                <div class=form-group">
                    <div id="fireFightersTrainings">

                    </div>
                </div>

                <div class="form-group">
                    <button style="cursor:pointer" type="submit" class="btn btn-primary">Zapisz badania</button>
                </div>

                @include('inc.formerrors')
            </form>
        @endif
    @else
        Brak autoryzacji
    @endif

@stop


<script>
    $(document).ready(function(){

        var count = 1;

        dynamic_field(count);

        function dynamic_field(number)
        {

            html =  '<div id="singleFireFighter"><label for="location">Strażak:</label>';
            html += '<select name="fireFighterTraining[]" class="form-control">';
            html += '<option value="">--- Wybierz strażaka ---</option>';
            html += '@foreach ($fireFighters as $fireFighter)';
            html += '<option value="{{$fireFighter->id}}">{{ $fireFighter->name }} {{$fireFighter->surname }}</option>';
            html += '@endforeach';
            html += '</select>';
            html += '<label>Data ukończenia: </label><input type="date" name="dateOfComplete[]">'
            html += '<label> Koniec ważności: </label><input type="date" id="dateOfExpiry">'
            html += 'Bezterminowo: <input type="checkbox" id="lifeless">'
            if(number > 1)
            {
                html += '<button type="button" name="remove" id="" class="btn btn-danger remove">Usuń</button></br></div>';
                $('#fireFightersTrainings').append(html);
            }
            else
            {
                html += '<button type="button" name="add" id="add" class="btn btn-success">Dodaj</button></br></div>';
                $('#fireFightersTrainings').html(html);
            }
        }

        $(document).on('click', '#add', function(){
            count++;
            dynamic_field(count);
        });

        $(document).on('click', '.remove', function(){
            count--;
            $(this).closest("#singleFireFighter").remove();
        });

        $('#lifeless').change(function(){
            if($(this).is(':checked'))
                $('#dateOfExpiry').prop('disabled', true)
            else
                $('#dateOfExpiry').prop('disabled', false)
        })

    });




</script>