@extends('layouts.app')

@section('breadcrumb')
	<ul class="breadcrumb">
		<li><a href="/home">{!! trans('messages.home') !!}</a></li>
		<li class="active">{!! trans('messages.relief').' '.trans('messages.payroll') !!}</li>
</ul>
@stop


@section('content')
	<div class="row">
		<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>

		{{-- Payroll filter --}}
		{{-- <div class="col-sm-12 collapse" id="box-detail-filter">
			<div class="box-info">
				<h2><b>{!! trans('messages.filter') !!}</b> {!! trans('messages.payroll') !!}</h2>
				<div class="additional-icon">
					<button class="btn btn-sm btn-primary" data-toggle="collapse" data-target="#box-detail-filter"><i class="fa fa-minus icon"></i> {!! trans('messages.hide') !!}</button>
				</div>
				{!! Form::open(['url'=>'filter', 'id'=>'payroll-filter-form', 'data-no-form-clear' => 1]) !!}
				<div class="row">
					<div class="col-sm-2">
						<div class="form-group">
							{!! Form::label('month',trans('messages.month'),[]) !!}
							{!! Form::select('month',$months,'',['class'=>'form-control show-tick','title' => trans('messages.select_one')]) !!}
						</div>
					</div>
					<div class="col-sm-2">
						<div class="form-group">
							{!! Form::label('year',trans('messages.year'),[]) !!}
							{!! Form::select('year',$years,Carbon\Carbon::now()->year,['class'=>'form-control show-tick','title' => trans('messages.select_one')]) !!}
						</div>
					</div>
					<div class="col-sm-2">
						<div class="form-group">
							{!! Form::label('status',trans('messages.status'),[]) !!}
							{!! Form::select('status',$status,'',['class'=>'form-control show-tick','title' => trans('messages.select_one')]) !!}
						</div>
					</div>
				</div>
				{!! Form::submit(trans('messages.filter'),['class' => 'btn btn-default btn-success pull-right','name' => 'submit']) !!}
				{!! Form::close() !!}
			</div>
		</div> --}}

		<div class="col-md-12">
			<div class="box-info full">
				<h2><b>{!! trans('messages.list_all') !!}</b> {!! trans('messages.relief').' '.trans('messages.payroll') !!}</h2>
				<div class="additional-btn">
					{{-- <a href="#" data-toggle="collapse" data-target="#box-detail-filter"><button class="btn btn-sm btn-primary"><i class="fa fa-filter icon"></i> {!! trans('messages.filter') !!}</button></a> --}}
					@if(Laratrust::isAbleTo('create-payroll'))
						<a href="/payroll/create/daily"><button class="btn btn-sm btn-primary"><i class="fa fa-users icon"></i> {!! trans('messages.create').' '.trans('messages.relief').' '.trans('messages.payroll') !!}</button></a>
					@endif
				</div>
				<div class="row" style="margin:10px">
					@if(Laratrust::isAbleTo('verify-payroll'))
						<button class="btn btn-xs btn-warning"id="change_selected_status"><i class="fa fa-check icon" style="margin-right:4px"></i>Change Selected Status</button>
					@endif
					@if(Laratrust::isAbleTo('delete-payroll'))
						<button class="btn btn-xs btn-danger" id="delete_selected"><i class="fa fa-trash icon" style="margin-right:4px"></i>Delete Selected</button>
					@endif
				</div>
				@include('global.datatable',['table' => $table_data['daily-payroll-table']])
			</div>
		</div>

		{{-- @if(defaultRole())
      <div class="col-md-12">
        <div class="box-info custom-scrollbar">
          <div id="payroll-monthly-report-graph"></div>
        </div>
      </div>
    @endif --}}

	</div>


@stop

@section('js')
	<script type="text/javascript">
		$(document).ready(function() {
			var table = $('#daily_payroll_table').DataTable();
			var table_data;
			var id_array;
			$('#daily_payroll_table tbody').on( 'click', 'tr', function () {
				$(this).toggleClass('selected');
			});

			$('#delete_selected').click( function() {
				id_array = [];
				table_data = table.rows('.selected').data().toArray();
				table_data.forEach(function(data){ //only loop when user press action button (delete, etc...)
					item = data[0].split('/payroll/').pop().split('"')[0];
					id_array.push(item);
				});
				if (confirm("Delete payroll(s)?")) {
				  $.ajax({
						type: 'DELETE',
						url:'/payroll/'+id_array,
						success: function(response){
							alert('Payrolls deleted!');
							window.location = "/daily-payroll";
						},
						error: function(response){
							alert('Error deleting');
						}
					});
				} else {
				  console.log("Delete Cancelled");
				}
			})

			$('#change_selected_status').click( function() {
				id_array = [];
				table_data = table.rows('.selected').data().toArray();
				table_data.forEach(function(data){ //only loop when user press action button (delete, etc...)
					item = data[0].split('/payroll/').pop().split('"')[0];
					id_array.push(item);
				});
				if (confirm("Change status of payroll(s)?")) {
				  $.ajax({
						type: 'GET',
						url:'/payroll/'+id_array+'/verify',
						success: function(response){
							alert('Payroll(s) status changed!');
							window.location = "/daily-payroll";
						},
						error: function(response){
							alert('Error changing status');
						}
					});
				} else {
				  console.log("Status Changing Cancelled");
				}
			})
		});
	</script>
	@stop