@extends('dashboard.layouts.master')


@php
    $dataTabel = 'dataTable-initial';
    $type = 'initial';
    if (request()->query('type') && request()->query('type') == 'revision'){
        $dataTabel = 'dataTable-revision';
        $type = 'revision';
    }else if (request()->query('type') && request()->query('type') == 'process'){
        $dataTabel = 'dataTable-process';
        $type = 'process';
    }else if (request()->query('type') && request()->query('type') == 'complete'){
        $dataTabel = 'dataTable-complete';
        $type = 'complete';
    }
@endphp

@section('content')


    <!-- Content Header (Page header) -->
    <section class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1>{{__('admin.All Research')}}</h1>
                </div>
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <li class="breadcrumb-item"><a href="{{route('admin.home')}}">{{__('admin.Home')}}</a></li>
                        <li class="breadcrumb-item active">{{__('admin.All Research')}}</li>
                    </ol>
                </div>
            </div>
        </div><!-- /.container-fluid -->
    </section>

    <!-- Main content -->
    <section class="content">

        <!-- Default box -->

                <div class="card card-primary card-outline card-outline-tabs">
                    <div class="card-header p-0 border-bottom-0">
                        <ul class="nav nav-tabs" id="custom-tabs-four-tab" role="tablist">
                            <li class="nav-item">
                                <a class="nav-link @if($type == 'initial') active @endif" id="custom-tabs-initial-tab"  href="{{url('admin/research-admin/index?type=initial')}}" role="tab" aria-controls="custom-tabs-initial" aria-selected="true">{{__('admin.New Research')}}</a>
                            </li>

                            <li class="nav-item">
                                <a class="nav-link @if($type == 'process') active @endif" id="custom-tabs-process-tab"  href="{{url('admin/research-admin/index?type=process')}}" role="tab" aria-controls="custom-tabs-process" aria-selected="false">{{__('admin.Under Processing')}}</a>
                            </li>


                            <li class="nav-item">
                                <a class="nav-link @if($type == 'revision') active @endif" id="custom-tabs-revision-tab"  href="{{url('admin/research-admin/index?type=revision')}}" role="tab" aria-controls="custom-tabs-revision" aria-selected="false">{{__('admin.Under Revision')}}</a>
                            </li>

                            <li class="nav-item">
                                <a class="nav-link @if($type == 'complete') active @endif" id="custom-tabs-complete-tab"  href="{{url('admin/research-admin/index?type=complete')}}" role="tab" aria-controls="custom-tabs-complete" aria-selected="false">{{__('admin.complete')}}</a>
                            </li>



                        </ul>
                    </div>
                    <div class="card-body">
                        <div class="tab-content" id="custom-tabs-four-tabContent">
                            <div class="tab-pane fade @if($type == 'initial') show active @endif" id="custom-tabs-initial" role="tabpanel" aria-labelledby="custom-tabs-initial-tab">
                                @include('dashboard.research_admin.partial.all_research')
                            </div>

                            <div class="tab-pane fade @if($type == 'process') show active @endif" id="custom-tabs-process" role="tabpanel" aria-labelledby="custom-tabs-process-tab">
                                @include('dashboard.research_admin.partial.under_process')
                            </div>

                            <div class="tab-pane fade @if($type == 'revision') show active @endif" id="custom-tabs-revision" role="tabpanel" aria-labelledby="custom-tabs-revision-tab">
                                @include('dashboard.research_admin.partial.under_revision')
                            </div>

                            <div class="tab-pane fade @if($type == 'complete') show active @endif" id="custom-tabs-complete" role="tabpanel" aria-labelledby="custom-tabs-complete-tab">
                                @include('dashboard.research_admin.partial.complete')
                            </div>

                        </div>
                    </div>

                </div>

        <!-- /.card -->

    </section>
    <!-- /.content -->
@include('dashboard.research_admin.modal')
@endsection


@push('scripts')
    <script type="text/javascript">
        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });


// I did this condition because I wanted to show the editor's field in a certain place and not show it in a place I know in the same table

        @if($type != 'initial')
        $(function () {
            var url = "{{ url('admin/research-admin/index?type='.$type) }}";

            var table = $('#{{$dataTabel}}').DataTable({
                // serverSide: true,
                ajax: url,
                columns: [
                    {data: 'journal', name: 'journal'},
                    {data: 'title', name: 'title'},
                    {data: 'type', name: 'type'},
                    {data: 'editor', name: 'editor'},

                    {
                        data: 'action',
                        name: 'action',
                        orderable: true,
                        searchable: true
                    },
                ]
            });
        });
        @else
        $(function () {
            var url = "{{ url('admin/research-admin/index?type='.$type) }}";

            var table = $('#{{$dataTabel}}').DataTable({
                // serverSide: true,
                ajax: url,
                columns: [
                    {data: 'journal', name: 'journal'},
                    {data: 'title', name: 'title'},
                    {data: 'type', name: 'type'},
                    {
                        data: 'action',
                        name: 'action',
                        orderable: true,
                        searchable: true
                    },
                ]
            });
        });
        @endif


        $("body").on('click', '.chooseAdmin', function () {
            var id = $(this).attr('data-id');
            var type = $(this).attr('data-type');

            $('#research_id').val(id)
            $('#type').val(type)
            $('#exampleModalLabel').html('choose ' + type)
            {{--$.ajax({--}}
                {{--url:'{{route('admin.research.get.admin')}}',--}}
                {{--type:'get',--}}
                {{--data:{id:id,type:type},--}}
                {{--success:function (data){--}}
                    {{--$('#search').empty();--}}
                    {{--if (data.length != 0){--}}
                    {{--} $.each(data, function (i, item) {--}}

                        {{--var newOption = new Option(item.admin['name'], item.admin['id'], true, true);--}}
                        {{--$('#search').append(newOption).trigger('change');--}}

                    {{--});--}}
                {{--}--}}
            {{--});--}}

        })


    </script>
    @endpush