<div class="row">
    <div class="col-xs-12">
        <div class="box box-danger">
            <?php echo $this->Form->create(null, ['templates' => ['submitContainer' => '{{content}}',], 'id' => 'pOcena', 'name' => 'pOcena', 'class' => 'form-horizontal', 'type' => 'file']); ?>
            <div class="box-body">
                <div class="form-group">
                    <label class="col-xs-12 col-md-2 control-label">Data Od</label>
                    <div class="col-xs-12 col-md-2 ">
                        <?php echo $this->Form->input('pOcena.dat:DataOd', array('autocomplete' => 'off', 'class' => 'form-control datepicker-from input-125', 'div' => false, 'label' => false, 'required' => 'required')); ?>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-xs-12 col-md-2 control-label">Data Do</label>
                    <div class="col-xs-12 col-md-2">
                        <?php echo $this->Form->input('pOcena.dat:DataDo', array('autocomplete' => 'off', 'class' => 'form-control datepicker-to input-125', 'div' => false, 'label' => false, 'required' => 'required')); ?>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-xs-12 col-md-2 control-label">Data następnej oceny</label>
                    <div class="col-xs-12 col-md-2">
                        <?php echo $this->Form->input('pOcena.dat:DataNastepnej', array('autocomplete' => 'off', 'class' => 'form-control datepicker input-125', 'div' => false, 'label' => false)); ?>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-xs-12 col-md-2 control-label">Ocena</label>
                    <div class="col-xs-12 col-md-10">
                        <?php echo $this->Form->input('pOcena.dat:Kod.dat2:NumerIGid', array('class' => 'form-control width-33', 'div' => false, 'id' => 'codeList', 'label' => false, 'type' => 'select', 'options' => $codes)); ?>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-xs-12 col-md-2 control-label">Ilość punktów</label>
                    <div class="col-xs-12 col-md-2">
                        <?php echo $this->Form->input('pOcena.dat:Punktow1', array('autocomplete' => 'off', 'step' => 1, 'min' => 0, 'type' => 'number', 'class' => 'form-control input-125', 'div' => false, 'label' => false)); ?>
                    </div>
                </div>

                <div class="form-group">
                    <label class="col-xs-12 col-md-2 control-label">&nbsp;</label>
                    <div class="col-xs-12 col-md-10">
                        <div id="SprawdzWniosekResponse">

                        </div>
                        <a style="margin-right: 10px;" class="btn btn-default btn-flat pull-left" data-menu-action="pracownicy_kadry?a=daj_oceny">Anuluj</a>
                        <?php echo $this->Form->submit('Zapisz', array('class' => 'btn btn-success btn-flat pull-left')); ?>
                    </div>
                    <div class="clearfix"></div>
                </div>

            </div>
            <?php echo $this->Form->end(); ?>
        </div>
    </div>
</div>

<script>
    $(function () {
        datepickerInit();
        datepickerFromToInit();

        jQuery.validator.addMethod("datefrom", function(value, element) {
            if($('[name="data[pOcena][dat:DataDo]"]').val() == undefined || $('[name="data[pOcena][dat:DataDo]"]').val().length == 0) {
                return true;
            } else {
                return  ($('[name="data[pOcena][dat:DataOd]"]').val() > $('[name="data[pOcena][dat:DataDo]"]').val()) ? false : true;
            }
        }, "'Data od' nie może być większa od 'Data do'");

        jQuery.validator.addMethod("datenext", function(value, element) {
            if($('[name="data[pOcena][dat:DataDo]"]').val() == undefined || $('[name="data[pOcena][dat:DataDo]"]').val().length == 0 || $('[name="data[pOcena][dat:DataNastepnej]"]').val().length == 0) {
                return true;
            } else {
                return  ($('[name="data[pOcena][dat:DataNastepnej]"]').val() < $('[name="data[pOcena][dat:DataDo]"]').val()) ? false : true;
            }
        }, "'Data następnej oceny' nie może być mniejsza od 'Data do'");

        $('#pOcena').validate({
            rules: {
                'data[pOcena][dat:DataOd]': {
                    datefrom: true
                },
                'data[pOcena][dat:DataNastepnej]': {
                    datenext: true
                },
            },
            submitHandler: function (form) {
                $('#table-loading2[data-main-loader]').css('visibility', 'visible');
                $('#table-loading2[data-main-loader]').css('opacity', '1');
                $('#table-loading2[data-main-loader]').css('display', 'block');

                var formData = $(form).serializeArray();
                var formAction = $(form).attr('action');

                $('#pOcena').ajaxSubmit({
                    success: function (response) {
                        $('#table-loading2[data-main-loader]').css('visibility', 'hidden');
                        $('#table-loading2[data-main-loader]').css('opacity', '0');
                        $('#table-loading2[data-main-loader]').css('display', 'none');

                        response = JSON.parse(response);
                        console.log(response);
                        if(response['error'] != undefined) {
                            showError(response['error']);
                        } else {
                            hideMessages();
                            showSuccess(response['message']);
                            loadAjaxView('pracownicy_kadry?a=daj_oceny');
                        }
                    },
                    complete: function (xhr) {
                        console.log(xhr);
                    }
                });
            }
        });
    });
</script>

<script>
    $(function(){
        const elemsData = document.querySelectorAll('[data-menu-action]');
        elemsData.forEach(elem => elem.onclick = testFun);
    });

    function testFun(e) {
        e.preventDefault();

        $(this).parents('.sidebar').find('li.active:not(.treeview)').removeClass('active');
        $(this).parents('li').addClass('active');

        var url = $(this).data('menu-action');
        localStorage.setItem('menu_action', url);

        loadAjaxView(url);
    }

    <?php if($this->request->getSession()->read('licencja') !== 'UMC') { ?>
        const oceniany = document.getElementsByClassName("oceniany");

        Array.prototype.forEach.call(oceniany, function(el) {
            // Do stuff here
            el.innerHTML = 'podsumowanie realizacji celu (perspektywa pracownika)';
        });

        const oceniajacy = document.getElementsByClassName("oceniajacy");

        Array.prototype.forEach.call(oceniajacy, function(el) {
            // Do stuff here
            el.innerHTML = 'podsumowanie realizacji celu (perspektywa przełożonego)';
        });

        const informacjaZwrotna = document.getElementsByClassName("informacja_zwrotna");

        Array.prototype.forEach.call(informacjaZwrotna, function(el) {
            // Do stuff here
            el.innerHTML = 'podsumowanie realizacji celu (perspektywa współpracownika)';
        });
    <?php } ?>
</script>

<?php echo $this->element('alert_close'); ?>
