@extends('application.layouts.master')
@section('content')
        <section class="bg-half-170 d-table w-100" style="background-color: #efefef; height: 100vh;">
            <div class="container mt-5 pt-4" style="padding: 10px 20px 0px 20px;">
                <div class="col-md-12">

                    @if(\Auth::user()->email_verification==0)
                        <div class="col md-4 mt-1">
                            <div class="col-md-12">
                                <span class="alert mt-3" role="alert" style="font-size: 12px !important; border-radius: .55rem; padding: 8px 12px; margin-top: 6px; background: #fff0d6; color: #fdad2a; border-color: #ffebca; border-width: 3px; border-style: double;"> <i class="fa fa-warning" style="font-size: 11px; margin-right: 5px; color: #fdad2a !important; top: 0px; position: relative;"></i> Your email is not verified. Pleace check your email .</span>
                            </div>
                        </div>
                    @endif

                    <div class="card p-2 rounded border-0" style="background-color: #ffffff; color: #141639c4;">
                            <div class="col-md-12">
                                <div class="row p-2 mb-1">
                                    <h6 style="font-weight:bold !important;">There are two methods for submitting your proposal :</h6>
                                    <div class="col-md-5 mt-3 ms-3 method-box">
                                        <h6 class="method"> Option 1:</h6>
                                        <p style="font-size: 13px;"> Contact your supervisor and request their Account Reference Number (ARN). With this number, you can search for the supervisor's account and submit your proposal.</p>
                                    </div>
                                    <div class="col-md-5 mt-3 ms-3 method-box">
                                        <h6 class="method"> Option 2:</h6>
                                        <p style="font-size: 13px;">Request your supervisor to invite you through Q apply. Once you receive the email invitation, click on the link provided in the email. This will automatically link your application with the supervisor's account, and you only need to click the Submit button.</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    <div class="row">
                        <div class="col-md-8 mt-4">
                            <div class="card p-3 rounded border-0" style="background-color: white; height: 350px;">
                                <div class="col-md-12">
                                    <div class="container-fluid" style="padding:0px !important;">
                                        <div class="row">
                                            <h6 style="font-weight:bold !important; margin: 0px; color: #141639c4;">Submit your proposals with ease</h6>
                                            <p style="font-size: 13px; color: #141639c4;">Simplify the process and contact with potential supervisors effortlessly!</p>
                                            <p class="mt-1" style="font-size: 13px; color: #141639c4;">Please input the Supervisor's Account Reference Number (ARN) in the search bar below. After verifying that the Supervisor Name, Department and University Name are accurate, click on the <strong>"Apply"</strong> button to complete your submission.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-12">
                                    <div class="row" style="display:flex;">
                                        <div class="mb-1">
                                            <div class="form-icon position-relative" style="display:flex;">
                                                <input type="text" class="form-control search-box" id="teacher_ref_no" placeholder="Please type your Supervisor's ARN here" name="teacher_ref_no" required="">
                                                <span class="search_button hand search-btn" style="margin-left: -8.8rem; "><span style="display:block; margin-left:11px; margin-top:4px; cursor: pointer;">Search</span></span>
                                                <span class="ref_button hand search-btn ms-2" style="width: 5%; background-color: #ffbd59 !important; border: 2px solid #ffbd59;"><span style="display:block; margin-left:9px; margin-top:4px; cursor: pointer;"><i class="fa fa-refresh" style="color:#ffff !important;"></i></span></span>
                                                <!-- <button class="btn btncl"></button>  -->
                                            </div>
                                            <div id="load_data"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div><!--end col-->
                        <div class="col-md-3 mt-4" style="background-color:white; border-radius: 6px; width: 31.5%; margin-left: 8px; height: 350px;">
                            <div class="row p-2">
                                <div class="col-md-12">
                                    <div class="mt-2 mb-2">
                                        <div class="container-fluid" style="padding:0px !important;">
                                            <div class="row">
                                                <p class="mb-1" style="font-size:14px; font-weight:bold !important; color: #141639c4;">Refer a Friend</p>
                                                <p  style="font-size: 13px;">Earn points by referring your friends or colleagues to register and submit their first application. Once they submit their application, you will receive the points.</p>
                                                    <div class="col-md-12">
                                                        <div class="row">
                                                            <div class="col-md-12">
                                                                <div class="mb-3">
                                                                    <label class="form-label"></label>
                                                                    <div class="form-icon position-relative">
                                                                        <input type="text" class="form-control" id="ref_name" placeholder="Full Name" name="name" required="">
                                                                    </div>
                                                                </div>
                                                            </div>
                                                            <div class="col-lg-12" style="margin-top:-18px;">
                                                                <div class="mb-3">
                                                                    <label class="form-label"></label>
                                                                    <div class="form-icon position-relative">
                                                                        <input type="email" class="form-control" id="ref_email" placeholder="Email Address" name="email" required="">
                                                                    </div>
                                                                </div>
                                                            </div><!--end col-->

                                                            <div class="col-md-12">
                                                                <div class="mt-2 mb-4 text-center">
                                                                    <button type="submit" class="btn btn1 refer_btn" style="padding: 3px 18px;">
                                                                        {{ __('Invite Now') }}
                                                                    </button>
                                                                </div>
                                                            </div>
                                                        </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div><!--end row-->
                    @if(count($student_proposal) > 0 )
                    <div class="card p-2 mt-4 rounded border-0" style="background-color: white;">
                        <div class="col-md-12">
                            <div class="container">
                                <div class="row mt-2">
                                    <div class="col-md-12">
                                            <h6 style="font-weight:bold !important; color: #141639c4;">Application you have submitted that are currently awaiting decisions</h6>
                                        <div class="table-responsive">
                                            <table class="table table-bordered list_table">
                                                <thead>
                                                    <tr>
                                                        <th>Sl</th>
                                                        <th>Apply Ref.</th>
                                                        <th>Supervisor Name</th>
                                                        <th>University Name</th>
                                                        <th style="text-align:center;">Proposal Ref.</th>
                                                        <th style="text-align:center;">Applied On</th>
                                                        <th style="text-align:center;">Status</th>
                                                        <th style="text-align:center;">action</th>
                                                    </tr>
                                                </thead>
                                                <tbody>
                                                    @foreach($student_proposal as $key=>$row)
                                                    <tr>
                                                        <td style="font-size: 12px;">{{++$key}}</td>
                                                        <td style="font-size: 12px;">{{$row->student_apply_ref}}</td>
                                                        <td style="font-size: 12px;">
                                                            <div class="d-flex">
                                                                @if($row->teacher_details->university)
                                                                    <img class="img-responsive listFlag mt-2" style="border-radius: 2px; padding: 0px;height: 35px; width: 35px;" src="{{ asset('/assets/img/flags/4x3').'/'.strtolower(cn($row,'teacher_details.university.country.iso_3166_2','')).'.svg' }}" alt="Flag" data-toggle="tooltip" title="" data-placement="top">
                                                                @endif
                                                                <div class="alert" style="background-color:white; padding: 3px 7px; margin-bottom: 0px;">
                                                                <strong class="ml-2">{{ cn($row,'teacher_details.first_name','')}} {{ cn($row,'teacher_details.last_name','')}}</strong><br>
                                                                <span class="ml-2" style="font-weight: 300;">{{cn($row,'teacher_details.designation','')}}</span>
                                                                </div>
                                                            </div>

                                                        </td>
                                                        <td style="font-size: 12px;">
                                                            @if($row->teacher_details->university_name)
                                                               {{cn($row,'teacher_details.university_name','')}}
                                                            @else
                                                              {{cn($row,'teacher_details.university.name','')}}
                                                            @endif
                                                        </br>
                                                        <span>
                                                            @if($row->teacher_details->others_department)
                                                                <span style="font-size: 12px; color: #868e96;">{{cn($row,'teacher_details.others_department','')}}</span>
                                                            @else
                                                            <span style="font-size: 12px; color: #868e96;"> {{cn($row,'teacher_details.department_name.name','')}} </span>
                                                            @endif

                                                        </span></td>
                                                        <td style="font-size: 12px; text-align:center;">
                                                            @php
                                                               $proposal =\DB::table('proposal')->where('id',$row->proposal_id)->where('student_id',$row->student_id)->first();
                                                            @endphp
                                                            @if($proposal)
                                                            <strong>{{ $proposal->proposal_ref}}</strong>
                                                            @endif
                                                        </td>
                                                        <td style="font-size: 12px; text-align:center;">@if(!empty($row->submitted_date)){{date('d M Y', strtotime($row->submitted_date))}} @else @endif</td>
                                                        <td style="text-align:center; font-size: 12px;"><span class="label_badge_radius" style="background-color: #d8fdd8; color: green;">Applied</span></td>
                                                        <td style="text-align:center; font-size: 12px;">
                                                           <span class="open_modal_page hand" data-toogle="tooltips" title="View" data-title="Apply Reference - {{$row->student_apply_ref}} " data-url="{{route('modal-get',['name'=>'view_apply_proposal','id'=>$row->id])}}"><i class="fa fa-eye change_pass_btn"></i></span>
                                                        </td>
                                                    </tr>
                                                    @endforeach
                                                </tbody>
                                            </table>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    @endif
                    <div class="w3-container mt-5">
                    </div>
                </div><!--end container-->
            </div>
        </section>
@endsection

@push('js')

<script>
    function fetch_sub_content(selector, url, args=null){

        var config={
        spinner: true
        }

        if(typeof args=='object'){
        config=Object.assign(config, args);
        }

        if(config.spinner){

        $(selector).waitMe({
            effect: 'facebook',
            text: 'Please! Wait ...'
        });

        }

        $(selector).load(url, null, function(){
        $(selector).waitMe('hide');
        if(typeof args=='function') args();
        });

        }

        function wait_me(selector, config=null){

        if(config){

            selector.waitMe(config);

        }else{

            selector.waitMe({
                effect: 'facebook',
                //color: '#000',
                text: 'Please! Wait ...'
            });
        }
    }

    function pop_up_msg(msg='No message specified', type='success', callback=null){
        new Noty({
        theme:'sunset',
        text: msg,
        type: type,
        timeout:1500,
        callbacks:{
            afterClose: callback
        }
        }).show();
    }

    function err_msg(err){

        var msg="Request failed to process, try again later.";

        if(err.responseJSON && err.responseJSON.msg){
        msg=err.responseJSON.msg;
        }

        return msg;

    }

    $(function(){
        $('.search_button').on('click', function(){
           // get_data();
            var teacher_ref_no = $('#teacher_ref_no').val();
            if(teacher_ref_no){
                fetch_sub_content(
                    '#load_data',
                    "{!! route('sub-content', ['name'=>'load_ref_no_available_info']) !!}" +"?teacher_ref_no=" +teacher_ref_no
                );
            }else{
                pop_up_error_msg('Please type a vaild Reference No.');
            }
        });

        $('.ref_button').on('click', function(){
            $('#teacher_ref_no').val("");
        });

        // function get_data(){
        //     var base = '{{url('/')}}';
        //     var teacher_ref_no = $('#teacher_ref_no').val();
        //     if(teacher_ref_no){
        //         $.ajax({
        //             method: 'GET',
        //             url: base+'/home/search',
        //             data: {'teacher_ref_no' : teacher_ref_no},
        //             success: function(response){ // What to do if we succeed
        //                 //console.log(response);
        //                 $('#load_data').html(response);
        //             },
        //             error: function(jqXHR, textStatus, errorThrown) { // What to do if we fail
        //                 console.log(JSON.stringify(jqXHR));
        //                 console.log("AJAX error: " + textStatus + ' : ' + errorThrown);
        //             }
        //         });
        //     }else{
        //         pop_up_error_msg('Please type a Teacher Reference No.');
        //     }

        // }


        $('.refer_btn').on('click', function(){

                var name =$('#ref_name').val();
                var email =$('#ref_email').val();

                var form_data={
                    _token: "{{ csrf_token() }}",
                    name: name,
                    email: email,
                }

                $.post("{{ route('ajax-post', ['name'=>'save_student_refer_friend']) }}", form_data, function(res){
                    $('#ref_name').val('');
                    $('#ref_email').val('');
                    pop_up_msg(res.msg);

                }).fail(function(err){

                    pop_up_msg(err_msg(err), 'error');

                });
            });

    });
</script>


@endpush
