@extends('layouts.master')

@section('title', __("tr.Takaful and Grants"))
@section('subtitle', __("tr.Takaful and Grants Requests List" ) )
@section('titleicon', "icon-file-text")


@if($student->canApplyTakafulRequest())
@section('actiontitle', __('tr.Submit Request'))
@section('actionlink',  route("add_takaful"))
@section('actionicon', "icon-plus")
@endif

@section('content')
<style>
hr {
    margin-top: 0;
    margin-bottom: 0;
    border-top: 1px solid #000;
}
</style>
	<!-- BEGIN .main-content -->
	<div class="main-content">
		<div class="row gutters">
			<div class="col-lg-12 col-xs-12 col-md-12 col-sm-12">

				@if ($errors->any())
				<div class="card">
					<div class="card-body pb-0">
						<div class="filter-box">
							<div class="row">
								@foreach ($errors->all() as $error)
									<div class="col-md-12">
										<div class="alert alert-danger" role="alert">
											{{$error}}
										</div>
									</div>
								@endforeach
							</div>
						</div>
					</div>
				</div>
				@endif
				 
				<div class="card">
					<div class="card-body pb-0">
						<div class="filter-box">
							<div class="row">
                                 
                                <div class="col-md-3">
									{!! Form::select('term_id', array(""=>__("tr.Select Term")) + $terms, null, array('id'=> 'term_id', 'class'=>'form-control', 'data-placement'=>'top', 'title'=> __('tr.Term'))) !!}
								</div>

							 
                                <div class="col-md-3">
                                    <select name="status" id="status" class="form-control">
                                        <option value=''>@lang("tr.Select Status")</option>
                                        @foreach(App\TakafulRequest::statusLabels() as $key => $labe)
                                            <option value='{{$key}}'>{{$labe}}</option>
                                        @endforeach
                                    </select>
								</div>
                              
								{{--Button--}}
								<div class="col-md-2 float">
									<button class="btn btn-primary" type="button" id="search_button">@lang('tr.Search')</button>
								</div>

								{{--Button--}}
								<div class="col-md-2 float">
									<button class="btn btn-danger" type="button" id="reset_button">@lang('tr.Reset')</button>
                                </div>
                                
							</div>
						</div>

					</div>
				</div>

				<div class="card">
					<div class="col-lg-12 col-md-12 col-xs-12 col-sm-12">
						<div class="card-body">
							<table id="data_table" class="display" style="width:100%">
								<thead>
                                    <tr>
                                        <th>@lang('tr.Term')</th>
                                        <th>@lang('tr.Status')</th>
                                        <th>@lang('tr.Discount Amount')</th>
                                        <th>@lang('tr.Discount Type')</th>
                                        <th>@lang('tr.Date')</th>
                                        <th></th>
                                    </tr>
								</thead>
							</table>
						</div>
					</div>
				</div>
			</div>
		</div>
		<!-- Row end -->
       
	</div>
	<!-- END: .main-content -->

	<script type="text/javascript">
		
        var statusLabels = [];
		var statusBadges = [];

        @foreach(\App\TakafulRequest::statusLabels() as $key => $label)
				statusLabels[{{ $key }}] = '{{ str_replace('_', ' ', ucfirst($label)) }}';
		@endforeach

		@foreach(\App\TakafulRequest::statusBadges() as $key => $badge)
			statusBadges[{{ $key }}] = '{{ $badge }}';
		@endforeach
		 
		var editTakafulURL = '{{ route('edit_takaful', ['takafulRequest'=>'#id']) }}';

		$(document).ready(function() {

			var table = $('#data_table').DataTable({
				processing: true,
				serverSide: true,
				scrollX: true,
				stateSave: false,
				rowId: 'id',
				order: [
					[ 0, "desc" ]
				],
				"ajax": {
					"url": '{{ route('takaful') }}',
					"dataSrc": "data.data"

				},
				"columns": [
					{ "data": "term_name", "name": "term_name"},
					{ "data": "status", "name": "status",
						fnCreatedCell: function (nTd, sData, oData, iRow, iCol) {

							var html = '';

							html += "<span class='badge badge-" + statusBadges[oData.status] + "'>" + statusLabels[oData.status] + "</span>";

							$(nTd).html(html);
						}
					},
					{ "data": "discount_amount", "name": "discount_amount"},
					{ "data": "discount_type", "name": "discount_type"},
					{ "data": "date", "name": "date"},
					{ "data": "id", "name": "id",
                        fnCreatedCell: function (nTd, sData, oData, iRow, iCol) {

                            var html = "";

                            if(oData.status == {{App\TakafulRequest::STATUS_IN_PROGRESS}})
                            	html += "<a title='@lang('tr.Edit')' target='_blank' href='" + editTakafulURL.replace('#id', oData.id) + "'><i class='icon-edit'></i></a>&nbsp;";

							$(nTd).html("<span class='action-column'>" + html + "</span>");
                        }
                    }
				]
			});

			$(".dataTables_filter").hide();

			$('#search_button').on( 'click', function () {

				table.columns(0).search($("#term_id").val());
				table.columns(1).search($("#status").val()); 
				table.draw();
			});

			$('#reset_button').on( 'click', function () {

				$("#term_id").val("");
				$("#status").val("");
				$('#search_button').trigger('click');
			});
		});
	</script>
@stop