@extends('layouts.master')

@section('title', __("tr.Grades Recheck"))
@section('subtitle', __("tr.Show Your Appeals" ) )
@section('titleicon', "icon-files-empty")

@if($student->canRequestGradesRecheck())
	@section('actiontitle', __('tr.Grades Recheck Request'))
	@section('actionlink', route('std_apply_control_appeal'))
	@section('actionicon', "icon-plus")
@endif


@section('content')

    <!-- BEGIN .main-content -->
    <div class="main-content">

        <!--SEARCH-->
        <div class="card">
            <div class="card-body pb-0">
				<div class="row filter-box">
				
					{{--Last Study Term--}}
					<div class="form-group col-md-2">
						{!! Form::select('search_term_id', array(""=>__("tr.SelectTerm")) + $terms, $controlTermID, array('id'=> 'search_term_id','class' => 'form-control', 'data-placement'=>'top', 'title'=> __('tr.Term'))); !!}
					</div>

					{{--Text search[en_name, ar_name, code]--}}
					<div class="col-md-4">
						<input data-placement="top" type="text" name="text_search" id="text_search" class="typeahead" autocomplete="off" placeholder="@lang('tr.TextSearch')" class="form-control">
					</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>

        <!--TABLE-->
        <div class="card">
            <div class="card-header">
                @lang('tr.Grades Recheck')
            </div>
            <div class="card-body">
                <table id="data_table" class="display" style="width:100%">
                    <thead>
                    <tr>
                        <th width="5%">#</th>
                        <th width="40%">@lang('tr.Course')</th>
                        <th width="10%">@lang('tr.Term')</th>
                        <th width="15%">@lang('tr.Date')</th>
                        <th width="30%">@lang('tr.Status')</th>
                    </tr>
                    </thead>
                </table>
            </div>
        </div>

    </div>
    <!-- END: .main-content -->
@endsection

@section('pagejs')
    <script src="https://cdn.jsdelivr.net/npm/select2@4.0.13/dist/js/select2.min.js"></script>
    <script type="text/javascript">

        $(document).ready(function () {

            var showCommitteeURL = '{{ route('show_course', ['course'=>'#course']) }}';

            var controlDecisionList = {
                @foreach($controlDecisionList as $key=>$value)
                '{{$key}}': '{{$value}}',
                @endforeach
            };


            var table = $('#data_table').DataTable({
                processing: true,
                serverSide: true,
                scrollX: true,
                stateSave: false,
                language: dataTableLanguage,
                rowId: 'id',
                "ajax": {
                    "url": '{{ route('my_grades_recheck') }}',
                    "dataSrc": "data.data"
                },
                "columns": [
                    {"data": "id", "name": "id"},
                    {"data": "course_code", "name": "course_code",
                        fnCreatedCell: function (nTd, sData, oData, iRow, iCol) {

                            var url = showCommitteeURL.replace('#course', oData.course_id);

                            var type = "";
                           
                            var html = oData.course_code + " (" + oData.bylaw + "): ";
                            html += "<a href='" + url + "?committee_id="+oData.committee_id+"' target='_blank'>" + oData.course_name + " (" + oData.committee_id + ") </a>";                            
                            
                            $(nTd).html(html);
                        }
                    },
                    {"data": "term_name", "name": "term_name",
                        fnCreatedCell: function (nTd, sData, oData, iRow, iCol) {

                            var html = "";
                            if(oData.term_name!==null) {
                                html += oData.term_name ;
                            }
                                        
                            $(nTd).html(html);
                        }
                    },
                    {"data": "created_at", "name": "created_at"},
                    {"data": "control_decision", "name": "control_decision",
                        fnCreatedCell: function (nTd, sData, oData, iRow, iCol) {
                           
                            var html = controlDecisionList[oData.control_decision];
                            
                            $(nTd).html(html);
                        }
                    },
                   
                   
                ]
            });

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


            $('#search_button').on('click', function () {
                
                table.search($("#text_search").val());
                table.columns(0).search($("#search_term_id").val());
                
                table.draw();
            });

            $('#text_search').keyup(function (e) {
                if (e.keyCode == 13)
                    $('#search_button').trigger('click');
            });

            $('#reset_button').on('click', function () {
                
                $("#text_search").val("");
                $("#search_term_id").val("");

                $('#search_button').trigger('click');
            });

            $('#search_button').trigger('click');

            
            
        });
    </script>
@endsection