@extends('front.layouts.frontlayout')

@section('head')

{!! HTML::style("assets/global/css/components.css") !!}
{!! HTML::style("assets/global/css/plugins.css") !!}
{!! HTML::style("assets/global/plugins/datatables/plugins/bootstrap/dataTables.bootstrap.css") !!}

@stop

@section('mainarea')
            <div class="col-md-9">
                <!--Profile Body-->
                <div class="profile-body">
                    <div class="row margin-bottom-20">
                        <!--Profile Post-->
                        <div class="col-sm-12">


                        {{------------------Error Messages----------}}
						<div id="alert_message">
                                     @if(Session::get('success_leave'))
                                            <div class="alert alert-success"><i class="fa fa-check"></i> {!! Session::get('success_leave') !!}</div>
                                     @endif

                                      @if (Session::get('error_leave'))
                                            <div class="alert alert-danger alert-dismissable ">
                                            <button type="button" class="close" data-dismiss="alert" aria-hidden="true"></button>
                                                 @foreach (Session::get('error_leave') as $error)
                                                     <p><strong><i class="fa fa-warning"></i></strong> {{ $error }}</p>
                                                 @endforeach
                                            </div>
                                      @endif
						</div>
                        {{------------------Error Messages----------}}


                        <div class="row">
                            <div class="col-md-3">
                                <ul class="ver-inline-menu tabbable margin-bottom-10">
                                    @foreach($months as $month)
                                        <li @if($month == $currentMonth) class="active" @endif >
                                            <a data-toggle="tab" href="#{{ $month }}">
                                                <i class="fa fa-calendar"></i> {{ $month }} </a>
                                            <span class="after">
                                                        </span>
                                        </li>
                                    @endforeach
                    
                                </ul>
                            </div>
                            <div class="col-md-9">
                                <div class="tab-content">
                                    @foreach($months as $month)
                                        <div id="{{$month}}" class="tab-pane @if($month == $currentMonth) active @endif">
                                            <div class="portlet box blue">
                                                <div class="portlet-title">
                                                    <div class="caption">
                                                        <i class="fa fa-calendar"></i>{{$month}}
                                                    </div>
                    
                                                </div>
                                                <div class="portlet-body">
                                                    <div class="table-scrollable">
                                                        <table class="table table-hover">
                                                            <thead>
                                                            <tr>
                                                                <th> #</th>
                                                                <th> Date</th>
                                                                <th> Occasion</th>
                                                                <th> Day</th>
                                                            </tr>
                                                            </thead>
                                                            <tbody>
                                                            @if(isset($holidaysArray[$month]))
                                                                @for($i=0;$i<count($holidaysArray[$month]['date']);$i++)
                                                                    <tr id="row{{ $holidaysArray[$month]['id'][$i] }}">
                                                                        <td> {{($i+1)}} </td>
                                                                        <td> {{ $holidaysArray[$month]['date'][$i] }} </td>
                                                                        <td> {{ $holidaysArray[$month]['ocassion'][$i] }} </td>
                                                                        <td> {{ $holidaysArray[$month]['day'][$i] }} </td>
                                                                    </tr>
                                                                @endfor
                                                            @endif
                    
                                                            </tbody>
                                                        </table>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    @endforeach
                    
                    
                                </div>
                            </div>
                        </div>

                    <hr>



                </div>
                <!--End Profile Body-->
            </div>

</div>


{{--------------------------Show Notice MODALS-----------------}}
@stop

@section('footerjs')

<!-- BEGIN PAGE LEVEL PLUGINS -->
<!-- BEGIN PAGE LEVEL PLUGINS -->

	{!!  HTML::script("assets/global/plugins/datatables/media/js/jquery.dataTables.min.js") !!}
	{!!  HTML::script("assets/global/plugins/datatables/plugins/bootstrap/dataTables.bootstrap.js") !!}


<!-- END PAGE LEVEL PLUGINS -->
<!-- END PAGE LEVEL PLUGINS -->





 <script>
     $('#applications').dataTable({
         "cache": true,
         "bProcessing": true,
         "bServerSide": true,
        //  "bDestroy": true,
         "order": [[0, "desc"]],
         "ajax": "{{ route("front.ajaxSalary") }}",
         "aoColumns": [
            //  {'sClass': 'center', 'bSortable': true},
             {'sClass': 'center', 'bSortable': false},
             {'sClass': 'center', 'bSortable': false},
             {'sClass': 'center', 'bSortable': false},
            //  {'sClass': 'center', 'bSortable': true},
             {'sClass': 'center', 'bSortable': false},
            //  {'sClass': 'center', 'bSortable': false}

         ],
         "fnRowCallback": function( nRow, aData, iDisplayIndex ) {
             var row = $(nRow);
             row.attr("id", 'row'+aData['0']);
         },
         "fnDrawCallback": function () {
             $('.highlight').parent('td').parent('tr').addClass('info');
         },
         "sPaginationType": "full_numbers",
         "language": {
             "emptyTable": "No data available"
         }
     });


       function show_application(id)
       {
			$('#modal-data').html('<div class="text-center">{!! HTML::image('front_assets/img/loading-spinner-blue.gif') !!}</div>');
           var url = "{{ route('dashboard.show',[':id']) }}";
           url = url.replace(':id', id);
            $.ajax({
                    type: "GET",
                    url : url

                    }).done(function(response)
                    {
                         $('#modal-data').html(response);
//
				 	});
       }

        @if (Session::get('error_leave'))
        	$("html, body").animate({ scrollTop: $('#applications').height()+600 }, 2000);
       @endif


    </script>


@stop