@extends('layouts.master')

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


@if($student != null && $student->isPostgraduate())
    @section('actiontitle', __('tr.Submit Request'))
@section('actionlink',  route("irb_request_manage"))
@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">
                @include('system.components.notifications')

                @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="col-lg-12 col-md-12 col-xs-12 col-sm-12">
                        <div class="card-body">
                            <table id="irbs_table" class="display" style="width:100%">
                                <thead>
                                <tr>
                                    <th width="5%">@lang('tr.#')</th>
                                    <th width="40%">@lang('tr.Title')</th>
                                    <th width="30%">@lang('tr.Information')</th>
                                    <th width="20%">@lang('tr.Status')</th>
                                    <th width="5%"></th>
                                </tr>
                                </thead>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Row end -->

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

    <script type="text/javascript">

        var statusesBadges = [];

        @foreach(App\IrbRequest::irbsStatusBadges() as $key => $value)
            statusesBadges['{{$key}}'] = '{{$value}}';
        @endforeach

        var statuses = [];

        @foreach(App\IrbRequest::irbsStatus() as $key => $value)
            statuses['{{$key}}'] = '{{$value}}';
        @endforeach

        var editURL = '{{ route('irb_request_manage', ['irbRequest'=>'#id']) }}';
        var showURL = '{{ route('show_irb_request', ['irbRequest'=>'#id']) }}';
        var downloadURL = "{{route('download_file', ['archive'=>'#id'])}}";

        $(document).ready(function () {

            table = $('#irbs_table').DataTable({
                processing: true,
                serverSide: true,
                scrollX: true,
                stateSave: false,
                rowId: 'id',
                "ajax": {
                    "url": '{{ route('irb_requests') }}',
                    "dataSrc": "data.data"
                },
                "columns": [
                    {"data": "id", "name": "id"},
                    {"data": "title", "name": "title"},
                    { "data": "id", "name": "id" ,
                        fnCreatedCell: function (nTd, sData, oData, iRow, iCol) {
                            let html = '';

                            if(oData.approvedByName)
                                html += '<span class="badge-course">Approved By</span>: <small>'+ oData.approvedByName + "</small><br/>"

                            $(nTd).html(html);
                        }
                    },
                    {"data": "status", "name": "status",
                        fnCreatedCell: function (nTd, sData, oData, iRow, iCol) {
                            let html = '';

                            html = "<span class='badge badge-"+statusesBadges[oData.status]+"'>" + statuses[oData.status] +"</span>";
                            if(oData.comment && oData.status == {{App\IrbRequest::REVISED}})
                                html += '<br/><span class="badge-course">'+'@lang('tr.comment')'+'</span>: <small>'+'@lang("'+oData.comment+'")' + "</small>"

                            $(nTd).html(html);
                        }
                    },
                    {"data": "id", "name": "id", "orderable":false,
                        fnCreatedCell: function (nTd, sData, oData, iRow, iCol) {
                            var html = "";

                            if (oData.canUpdate) {
                                html += "<a title='@lang('tr.Edit')' target='_blank' href='" + editURL.replace('#id', oData.id) + "'><i class='icon-eye'></i></a>&nbsp;";
                            }else{
                                html += "<a title='@lang('tr.View')' target='_blank' href='" + showURL.replace('#id', oData.id) + "'><i class='icon-eye'></i></a>&nbsp;";
                            }

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

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

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

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

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

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