<div class="row">
    <div class="col-xs-12">
        <div class="box box-danger">
            <?php echo $this->Form->create(null, ['templates' => ['submitContainer' => '{{content}}',], 'id' => 'pPlanUrlopu', 'name' => 'pPlanUrlopu', 'class' => 'form-horizontal', 'type' => 'file']); ?>
            <div class="box-body">
                <div class="form-group">
                    <label class="col-xs-12 col-md-2 control-label">Rodzaj wniosku</label>
                    <div class="col-xs-12 col-md-10">
                        <?php echo $this->Form->input('pPlanUrlopu.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">Data Od</label>
                    <div class="col-xs-12 col-md-2 ">
                        <?php echo $this->Form->input('pPlanUrlopu.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('pPlanUrlopu.dat:DataDo', array('autocomplete' => 'off', 'class' => 'form-control datepicker-to input-125', 'div' => false, 'label' => false, 'required' => 'required')); ?>
                    </div>
                </div>
                <?php if(isset($saldo5['bInformacjeOSaldach']['bInformacjaOSaldach']) && !empty($saldo5['bInformacjeOSaldach']['bInformacjaOSaldach'])) : ?>
                    <div class="CounterFreeDaysHolder">
                        <h4 class="">Do <?php echo $this->request->getSession()->read('licencja') == 'UMC' ? 'zaplanowania' : 'wykorzystania' ?> pozostało:</h4>
                        <div class="progress-circle red">
                            <span class="progress-left">
                                <span class="progress-bar"></span>
                            </span>
                            <span class="progress-right">
                                <span class="progress-bar"></span>
                            </span>
                            <?php
							if (isset($saldo5['bInformacjeOSaldach']['bInformacjaOSaldach']['bLimitOgolemDni'])) {
								$tmp = $saldo5['bInformacjeOSaldach']['bInformacjaOSaldach'];
								$saldo5['bInformacjeOSaldach']['bInformacjaOSaldach'] = array();
								$saldo5['bInformacjeOSaldach']['bInformacjaOSaldach'][] = $tmp;
							}

							if($saldo5['bInformacjeOSaldach']['bInformacjaOSaldach'][0]['bCzyDoKolaPobieracZPlanuUrlopu'] == 'true') {
								$maksimum = $saldo5['bInformacjeOSaldach']['bInformacjaOSaldach'][0]['bLimitOgolemDoPlanuUrlopu'];
								$pozostalo = $saldo5['bInformacjeOSaldach']['bInformacjaOSaldach'][0]['bPozostaloOgolemDoPlanuUrlopu'];
							} else {
								$maksimum = $saldo5['bInformacjeOSaldach']['bInformacjaOSaldach'][0]['bLimitOgolemDni'];
								$pozostalo = $saldo5['bInformacjeOSaldach']['bInformacjaOSaldach'][0]['bPozostaloOgolemDni'];
							}

                            $percentage = $pozostalo * 100 / $maksimum;
                            $percentage = 100 - $percentage;
                            $deg = $percentage * 360 / 100;
                            ?>
                            <style>
                                @keyframes loading-general-right{
                                    0%{
                                        -webkit-transform: rotate(0deg);
                                        transform: rotate(0deg);
                                    }
                                    100%{
                                        -webkit-transform: rotate(<?php echo $deg > 180 ? 180 : $deg; ?>deg);
                                        transform: rotate(<?php echo $deg > 180 ? 180 : $deg; ?>deg);
                                    }
                                }
                                <?php
                                if($deg == 360) {
                                    $deg = 180;
                                } elseif($deg > 180) {
                                    $deg = 360 - $deg;
                                } else {
                                    $deg = 0;
                                }
                                ?>
                                @keyframes loading-general-left{
                                    0%{
                                        -webkit-transform: rotate(0deg);
                                        transform: rotate(0deg);
                                    }
                                    100%{
                                        -webkit-transform: rotate(<?php echo $deg; ?>deg);
                                        transform: rotate(<?php echo $deg; ?>deg);
                                    }
                                }
                            </style>
                            <div class="progress-value-visible">
                                <span>
                                    <?php
									if($saldo5['bInformacjeOSaldach']['bInformacjaOSaldach'][0]['bCzyDoKolaPobieracZPlanuUrlopu'] == 'true') {
										echo $saldo5['bInformacjeOSaldach']['bInformacjaOSaldach'][0]['bPozostaloOgolemDoPlanuUrlopu'];
									} else {
										echo $saldo5['bInformacjeOSaldach']['bInformacjaOSaldach'][0]['bPozostaloOgolemDni'];
									}
									?>
                                </span>
                                <span>dni</span>
                            </div>
                        </div>
                    </div>
                <?php endif; ?>
                <div class="form-group">
                    <label class="col-xs-12 col-md-2 control-label">Komentarz</label>
                    <div class="col-xs-12 col-md-10">
                        <?php echo $this->Form->input('dat:Opis', array('class' => 'form-control width-33', '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="kadry?a=plan_urlopu">Anuluj</a>
                        <a class="btn btn-primary btn-flat pull-left" id="SprawdzWniosek">Sprawdź</a>
                        <?php
						$name = $this->request->getSession()->read('licencja') == 'UMC' ? 'Wyślij do akceptacji' : 'Zapisz';
						echo $this->Form->submit($name, array('class' => 'btn btn-success btn-flat pull-left hidden', 'disabled' => 'disabled'));
					    ?>
                        <a id="PokazWspolpracownikowBtn" class="btn btn-flat btn-primary pull-right"><i class="fa fa-users"></i> Pokaż współpracowników</a>
                    </div>
                    <div class="clearfix"></div>
                </div>

                <?php
                if(!isset($saldo)) {
                    $saldo = $saldo5;
                }
                $freeDaysCurrent = (int)$saldo['bInformacjeOSaldach']['bInformacjaOSaldach']['bUrlopWykorzystanieDni'];
                $freeHoursCurrent = (int)$saldo['bInformacjeOSaldach']['bInformacjaOSaldach']['bUrlopWykorzystanieGodzin'];
                $freeDaysMax = (int)$saldo['bInformacjeOSaldach']['bInformacjaOSaldach']['bUrlopWypoczynkowySaldoDni'];
                $freeHoursMax = (int)$saldo['bInformacjeOSaldach']['bInformacjaOSaldach']['bUrlopWypoczynkowySaldoGodzin'];
                $previousFreeDays = (int)$saldo['bInformacjeOSaldach']['bInformacjaOSaldach']['bUrlopZalegly1goStyczniaDni'];
                $previousFreeHours = (int)$saldo['bInformacjeOSaldach']['bInformacjaOSaldach']['bUrlopZalegly1goStyczniaGodzin'];
                $freeHoursPercent = 0;
                if($freeHoursMax > 0) {
                    $freeHoursPercent = ($freeHoursCurrent / $freeHoursMax) * 100;
                }
                ?>
                <?php
                /**
                <div class="progress">
                <div class="progress-bar progress-bar-danger" role="progressbar"
                style="width: <?php echo $freeHoursPercent; ?>%">
                Wykorzystano
                </div>
                <div class="progress-bar progress-bar-success"
                style="width: <?php echo 100 - $freeHoursPercent; ?>%">
                Wymiar
                </div>
                </div>

                <div class="row">
                <div class="col-xs-12 col-md-9">
                <div class="progress-legend progress-legend-danger">
                <span>Wykorzystano <?php echo $freeDaysCurrent . ' dni (' . $freeHoursCurrent . ' godzin)'; ?></span>
                </div>
                <div class="progress-legend progress-legend-success">
                <span>Wymiar urlopu: <?php echo $freeDaysMax . ' dni (' . $freeHoursMax . ' godzin)'; ?>, w tym zaległy na 1-go stycznia: <?php echo $previousFreeDays . ' dni (' . $previousFreeDays . ' godzin)'; ?></span>
                </div>
                </div>
                <div class="col-xs-12 col-md-3 text-right">
                <a id="PokazWspolpracownikowBtn" class="btn btn-flat btn-primary"><i class="fa fa-users"></i> Pokaż współpracowników</a>
                </div>
                </div>
                 */
                ?>
            </div>
            <?php echo $this->Form->end(); ?>
        </div>
    </div>
</div>

<?php echo $this->element('saldo', array('saldo' => $saldo5, 'showBack' => false, 'showHeader' => true)); ?>

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

<?php echo $this->Html->script('appliactions'); ?>

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

    $(document).ready(function () {
        datepickerFromToInit();


        $("#pPlanUrlopu").validate({
            rules: {
                'data[pPlanUrlopu][dat:DataOd]': {
                    datefrom: 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 counter = 0;
                $('[data-file-multiple] input[type="file"]').each(function () {
                    if($(this).val().length == 0 || $(this).val().length == null || $(this).val().length == undefined) {
                        $(this).parents('[data-file-multiple]').remove();
                    }
                });

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

                $('#pPlanUrlopu').ajaxSubmit({
                    success: function (response) {
                        response = JSON.parse(response);
                        console.log(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');

                        if(response['error'] != undefined) {
                            showError(response['error']);
                        } else {
                            hideMessages();
                            showSuccess(response['message']);
                            loadAjaxView('/kadry?a=plan_urlopu');
                        }
                    },
                    complete: function (xhr) {
                        console.log(xhr);
                    }
                });
            }
        });

        $('[name="data[pPlanUrlopu][dat:DataOd]"], [name="data[pPlanUrlopu][dat:DataDo]"]').on('blur', function () {
            $('#SprawdzWniosek').removeClass('hidden');
            $('form input[type="submit"]').attr("disabled", "disabled").addClass('hidden');
        });
        $('[name="data[pPlanUrlopu][dat:Kod][dat2:NumerIGid]"]').on('change', function () {
            $('#SprawdzWniosek').removeClass('hidden');
            $('form input[type="submit"]').attr("disabled", "disabled").addClass('hidden');
        });
        $('#SprawdzWniosek').click(function () {
			$('#table-loading2[data-main-loader]').css('visibility', 'visible');
			$('#table-loading2[data-main-loader]').css('opacity', '1');
			$('#table-loading2[data-main-loader]').css('display', 'block');
            $('#SprawdzWniosekResponse').html('<b style="padding-bottom: 15px; display: block;">Proszę czekać...</b>');
            $.ajax({
                method: 'POST',
                data: $('#pPlanUrlopu').serializeArray(),
                url: local_url + 'ajax/api/sprawdz_urlop'
            }).done(function (response) {
                var response = JSON.parse(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');
                if((response['login'] != undefined && response['login'] == true)) {
                    window.location = local_url + 'login';
                } else {
                    var r = response['bKomunikaty']['bKomunikat'];
                    if(r['bGid'] !== undefined) {
                        var content = '<div style="margin-bottom: 10px;">';
                        content += '<div class="pull-left"><svg style="margin-right: 10px; position: relative; top: 3px;" width="16px" height="16px"><g transform="scale(0.5)"><path fill="'+r['bKolorWypelnieniaObrazkaHTML']+'" d="'+r['bObrazekSVG']+'" /></g></svg></div>';
                        content += '<div class="pull-left"><b>'+r['bTytul']+'</b><br />'+r['bOpis']+'</div>';
                        content += '<div class="clearfix"></div>';
                        content += '</div>';
                        $('#SprawdzWniosekResponse').html(content);
                        if(r['bStatus'] > 0) {
                            $('#SprawdzWniosek').addClass('hidden');
                            $('form input[type="submit"][disabled="disabled"]').removeAttr('disabled').removeClass('hidden');
                        }
                    } else {
                        var content = '';
                        for(var rr in r) {
                            var _r = r[rr];
                            content += '<div style="margin-bottom: 10px;">';
                            content += '<div class="pull-left"><svg style="margin-right: 10px; position: relative; top: 3px;" width="16px" height="16px"><g transform="scale(0.5)"><path fill="'+_r['bKolorWypelnieniaObrazkaHTML']+'" d="'+_r['bObrazekSVG']+'" /></g></svg></div>';
                            content += '<div class="pull-left"><b>'+_r['bTytul']+'</b><br />'+_r['bOpis']+'</div>';
                            content += '<div class="clearfix"></div>';
                            content += '</div>';
                        }
                        $('#SprawdzWniosekResponse').html(content);
                        if(r[0]['bStatus'] > 0) {
                            $('#SprawdzWniosek').addClass('hidden');
                            $('form input[type="submit"][disabled="disabled"]').removeAttr('disabled').removeClass('hidden');
                        }
                    }
                }
            }).error(function (err) {
                if(err.status == 403) {
                    window.location = local_url + 'login';
                }
            });;
        });
    })
</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);
    }
</script>

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