@extends('hr::layouts.master')
@section('content')
<script src="{{ asset('/js/hr/controller/empModules.js')}}"></script> 
<script src="{{ asset('/js/hr/controller/employeeSettingsCtrl.js')}}"></script>
<script src="{{ asset('/js/hr/controller/employeeController.js')}}"></script>     
<script src="{{ asset('/js/hr/controller/leavesController.js')}}"></script> 
<script src="{{ asset('/js/common/controller/countryController.js')}}"></script>  
<script src="{{ asset('/js/hr/controller/tagController.js')}}"></script>
<div  ng-app="employeeApp" ng-controller="leavesCtrl">
    <div ng-controller="employeeSettingsCtrl" ng-init="showSettingsFrom('leaveTypes')">
         <input type="hidden" id='data-leaves' value="{{$leaves or '[]'}}"/>
<input type="hidden" id='data-leavepackage' value="{{$leavepackage or '[]'}}"/>
<input type="hidden" id='data-relations' value="{{$relations or '[]'}}"/>
<input type="hidden" id='data-leavetypes' value="{{$leavetypes or '[]'}}"/>
<input type="hidden" id='data-leavepackagedetails' value="{{$leavepackagedetails or '[]'}}"/>
<input type="hidden" id='data-leavepackage' value="{{$leavepackage or '[]'}}"/>
<input type="hidden" id='data-employees' value="{{$employees or '[]'}}"/>
<input type="hidden" id='data-allleaves' value="{{$allleaves or '[]'}}"/>
        <div class="col s12">
            <div class="card">
                <div class="row">
                    <h1 class="page-title">Leave Settings</h1>
                    <a href="#!" ng-click="GoBack()" class="waves-effect page-button"><i class="material-icons left">arrow_back</i>Back</a>
                </div>                    
            </div>
        </div> 
        <div class="col s4 sticky-side-bar">
            <div class="card">
                <ul class="custom-side-bar">
                      <li class="custom-item" ng-class="{'active': active=='leaveTypes'}"> 
                                <a href="#" ng-click="showSettingsFrom('leaveTypes')">leave Types
                                    <i class="fa fa-sign-in"></i>
                                </a>
                            </li>
                    <li class="custom-item " ng-class="{'active': active=='leavepackagedetails'}"> 
                        <a href="#" ng-click="showSettingsFrom('leavepackagedetails')">leavepackage
                            <i class="fa fa-sign-in"></i>
                        </a>
                    </li>
                  
                </ul>
            </div>                    
        </div>

    <div  class="col s8" id='settingsContent'>
        
    </div>   

    <script>
    $(document).ready(function () {
        $('select').material_select();
        $('.datepicker').pickadate({
            selectMonths: true, // Creates a dropdown to control month
            selectYears: 15 // Creates a dropdown of 15 years to control year
        });

        $('.sticky-side-bar .card').css('width', $('.sticky-side-bar .card').width());


        $(window).scroll(function (event) {
// what the y position of the scroll is
            var y = $(this).scrollTop();
            if (y >= $('.sticky-side-bar').offset().top) {
                if (!$('.sticky-side-bar .card').hasClass('sticky'))
                    $('.sticky-side-bar .card').addClass('sticky');
            } else {
                if ($('.sticky-side-bar .card').hasClass('sticky'))
                    $('.sticky-side-bar .card').removeClass('sticky');
            }

        });

    });
    </script>
</div> 
</div>
@stop