@extends('layouts.welcome')

@section('content')
    <!--App-Content-->
    <div class="app-content my-3 my-md-5">
        <div class="side-app">
            <section class="sptb">

                <div class="container">
                <div class="section-title d-md-flex">
                                <div>
                                    <h2>Current Offered Courses</h2>
                                    <p class="fs-18 lead"></p>
                                </div>

                            </div>
                    <!-- Search Section -->
                    <form action="{{ route('site.course.search') }}" method="get">
                        <div class="mb-5">
                            <div class="">
                                <div class="p-5 bg-white">
                                    <div class="item2-gl-nav">
                                        <div class="d-block ">
                                            <h5 class="mb-0 mt-0">@lang('student.search by course name')</h5>
                                            <div class="input-group me-2 mt-6 mb-sm-1">
                                                <input type="text" name="search" id="search"
                                                    value="{{ request()->get('search') }}" class="form-control br-ts-7 br-bs-7"
                                                    placeholder="Search">
                                                <div class="input-group-text ">
                                                    <button type="submit" class="btn btn-primary br-te-7 br-be-7">
                                                        @lang('student.search')
                                                    </button>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="mt-3 item2-gl-nav">
                                        <div class="d-block ">
                                            <h5 class="mb-2 mt-0">@lang('student.filter by')</h5>
                                            <div class="row">
                                                <div class="col-md-2">
                                                    <label class=" mt-3 mb-sm-1"> Education System: </label>
                                                    <select class="form-control select2-show-search" id="education_system" name="education_system">
                                                       <option value="0" disabled selected>Select</option>
                                                       @foreach ($education_systems as $item)
                                                          <option value="{{$item->esid}}">{{$item->esname}}</option>
                                                       @endforeach
                                                    </select>
                                                </div>
                                                <div class="col-md-3">
                                                    <label class=" mt-3 mb-sm-1"> Board: </label>
                                                    <select class="form-control select2-show-search" id="board" name="board">

                                                    </select>
                                                </div>
                                                <div class="col-md-3">
                                                    <label class=" mt-3 mb-sm-1"> Level: </label>
                                                    <select class="form-control select2-show-search" name="level" id="level">
                                                    </select>
                                                </div>
                                                <div class="col-md-4">
                                                    <label class=" mt-3 mb-sm-1"> Course: </label>
                                                    <select class="form-control select2-show-search" id="course" name="course">
                                                    </select>
                                                </div>
                                                <div class="col-md-2 mt-6 mx-auto">
                                                    <input type="submit" id="submit" class="btn btn-primary br-te-7 br-be-7 "
                                                        value="@lang('student.apply filter')">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </form>
                    <!--End Search Section -->
                    <!-- Courses Section -->
                    <div class="row" id="courses">
                        <!--Left Side Content-->
                        <div class="col-xl-3 col-lg-3 col-md-3 nav card nav-pills mb-3 mt-5 h-50">
                            @foreach ($sessions as $session => $item)
                            <form action="{{route('home.offeredCourses')}}" method="get">
                                <input type="hidden" name="sessionId" value="{{$item->acysid}}">
                                <input type="hidden" name="sessionName" value="{{$item->sname}}">
                                <input type="hidden" name="search" value="{{request()->search}}">
                                <input type="hidden" name="search" value="{{request()->search}}">
                                <button id="session" class="nav-link {{request()->sessionId == $item->acysid ? 'active':''}} my-2 py-2 w-100"
                                    type="submit">
                                    <span class="">
                                        {{ $item->sname }}
                                        {{ $item->year }}
                                        <small>{{ $item->is_current == 1 ? '(Current)' : '(Next)' }} </small>
                                    </span>
                                    <span class="badge ms-4 fs-10" style="background: #1f6984; color:#eee"> {{ $item->bname }}</span>
                                </button>
                            </form>
                            @endforeach
                        </div>
                        <!--End Left Side Content-->
                        <!-- Right Side Content -->
                        <div class="col-xl-9 col-lg-9 col-md-9 mt-0">

                            <!--Coursed lists-->

                            <div class="border-0 mb-5 course-details">
                                <div
                                    class="border-0 p-5 bg-white details-tab-content">
                                    <!-- listed courses -->
                                    {{-- @forelse ($sessions as $session => $item) --}}
                                            <div class=""
                                                id="">
                                                <table class="course_table">
                                                    <thead>
                                                        <tr>
                                                            <th></th>
                                                        </tr>
                                                    </thead>
                                                    <tbody>
                                                        @foreach ($offered_courses as $offer)
                                                            <tr>
                                                                <td>
                                                                    <div class="card overflow-hidden">
                                                                        <div class="ribbon ribbon-top-left ">
                                                                            <span
                                                                                class="bg-secondary">{{ $offer->esname }}</span>
                                                                        </div>
                                                                        <div class="d-md-flex">
                                                                            <!-- Single Course -->
                                                                            <!-- Course image -->
                                                                            <div class="item-card9-img w-60">
                                                                                <div class="item-card9-imgs">
                                                                                    <a
                                                                                        href="{{route('homePage.courseDetails',$offer->coffid)}}"></a>
                                                                                    <img src="{{env('SECURE_ASSETS').'/images/course.png'}}"
                                                                                        alt="{{ $offer->cname }}"
                                                                                        class="cover-image ">
                                                                                </div>
                                                                                @if ($offer->has_label)
                                                                                    <div class="item-overly-trans">
                                                                                    <a href="" class="bg-danger">{{ $offer->label }}</a>
                                                                                    </div>
                                                                                @endif
                                                                            </div>
                                                                            <!-- Course Info -->
                                                                            <div class="card border-0 mb-0">
                                                                                <div class="card-body p-0">
                                                                                    <div
                                                                                        class="item-card9 ps-5 pt-5">
                                                                                        <a href="{{route('homePage.courseDetails',$offer->coffid)}}"
                                                                                            class="text-default-dark">
                                                                                            <h3
                                                                                                class="">
                                                                                                {{ $offer->cname }}
                                                                                            </h3>
                                                                                        </a>
                                                                                        <div
                                                                                            class="font-weight-semibold  mt-4 mb-4">
                                                                                            <div class="row">
                                                                                                <div class="col-md-5">

                                                                                                    <h4
                                                                                                        class="badge badge-light mb-3">
                                                                                                        {{ $offer->lname }}
                                                                                                    </h4>
                                                                                                    <br>
                                                                                                    <h4
                                                                                                        class="badge badge-light" >
                                                                                                        {{ $offer->sname }}
                                                                                                        {{ $offer->year }}

                                                                                                    </h4>
                                                                                                </div>

                                                                                                <div class="col-md-6" style="float: right">
                                                                                                    <h4 class="badge badge-light mb-3" >{{ $offer->bname }}</h4>
                                                                                                    {{-- <h4>
                                                                                                    <i class="fa fa-user "></i>
                                                                                                            <label style="color: #437183">{{ $teamCoach->firstWhere('ttid', $offer->ttid)->user->first_name }}{{' '}}

                                                                                                            {{ $teamCoach->firstWhere('ttid', $offer->ttid)->user->last_name }}
                                                                                                        </label>
                                                                                                        </span>

                                                                                                    </h4> --}}
                                                                                                </div>
                                                                                            </div>
                                                                                        </div>
                                                                                        <p
                                                                                            class="mb-0 mt-1 lead w-90">
                                                                                            {{ Str::limit($offer->cdescription, 100, '....') }}
                                                                                        </p>
                                                                                        <div
                                                                                            class="mt-2 mb-2 float-end ">
                                                                                            <ul
                                                                                                class="icon-card-1">
                                                                                                <a data-bs-effect="effect-flip-horizontal"
                                                                                                    data-bs-toggle="modal"
                                                                                                    data-ttid="{{ $offer->ttid }}"
                                                                                                    id="showTeachingTeamInfo"
                                                                                                    href="#">
                                                                                                    <li
                                                                                                        class="me-3">
                                                                                                        <span
                                                                                                            class="fs-14"><i
                                                                                                                class="fa fa-users "></i>
                                                                                                            {{ $offer->ttname }}
                                                                                                        </span>
                                                                                                    </li>
                                                                                                </a>

                                                                                                <li
                                                                                                    class="me-3">

                                                                                                    {{-- <a data-bs-effect="effect-flip-horizontal"
                                                                                                        data-bs-toggle="modal"
                                                                                                        data-coffid="{{ $offer->coffid }}"
                                                                                                        id="schedule"
                                                                                                        href="#modalschedule"
                                                                                                        class="badge badge-light mx-1">@lang('student.schedule-btn')</a> --}}
                                                                                                    <a href="{{route('homePage.courseDetails',$offer->coffid)}}"
                                                                                                        class="badge badge-primary">@lang('student.course details')</a>
                                                                                                </li>
                                                                                            </ul>
                                                                                        </div>
                                                                                    </div>
                                                                                    <div class="border-top ps-5 mt-2" style="clear:both">
                                                                                        @php
                                                                                            if($offer->currency == 2){
                                                                                                $currency = 'EGP';
                                                                                            }else{
                                                                                                $currency = 'AED';
                                                                                            }
                                                                                        @endphp
                                                                                        <div class="d-flex">
                                                                                            @if ($offer->fee_per_lesson_total > 0)

                                                                                            <h4
                                                                                                class="font-weight-semibold fs-12 text-dark mt-4 mb-4 me-4">
                                                                                                <i
                                                                                                    class="fa fa-money mt-0 fs-18 me-2"></i>
                                                                                                {{ $offer->fee_per_lesson_total }}
                                                                                                {{ $currency }} / @lang('student.lesson')
                                                                                            </h4>
                                                                                            @endif
                                                                                            @if ($offer->fee_per_course_total > 0)
                                                                                            <h4
                                                                                                class="font-weight-semibold fs-12 text-dark mt-4 mb-4 me-4">
                                                                                                <i
                                                                                                    class="fa fa-money mt-0 fs-18 me-2"></i>
                                                                                                    @if ($offer->by_month)
                                                                                                        {{$offer->fee_course_per_month}}
                                                                                                        {{ $currency }} / @lang('student.month')
                                                                                                    @elseif ($offer->course_discount > 0 )
                                                                                                    <span class="strike-text text-default">{{$offer->fee_per_course_total}}</span>
                                                                                                    {{ $offer->fee_per_course_total - ($offer->fee_per_course_total * ($offer->course_discount / 100)) }}
                                                                                                        {{ $currency }} / @lang('student.course')
                                                                                                    @else
                                                                                                        {{$offer->fee_per_course_total}}
                                                                                                        {{ $currency }} / @lang('student.course')
                                                                                                    @endif
                                                                                            </h4>
                                                                                            @endif
                                                                                            @if($offer->allow_enrollment)
                                                                                            <h4
                                                                                                class="font-weight-semibold fs-12 text-dark mt-4 mb-4 ms-6">
                                                                                                <i
                                                                                                    class="fa fa-check-square text-success mt-0 fs-18 me-2"></i>

                                                                                                @lang('student.enrollment-opened')
                                                                                            </h4>
                                                                                            @else
                                                                                            <h4
                                                                                                class="font-weight-semibold fs-12 text-dark mt-4 mb-4 ms-6">
                                                                                                <i
                                                                                                    class="fa fa-window-close text-danger mt-0 fs-18 me-2"></i>

                                                                                                @lang('student.enrollment-closed')
                                                                                            </h4>
                                                                                            @endif
                                                                                        </div>
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                </td>
                                                            </tr>
                                                        @endforeach
                                                    </tbody>
                                                </table>
                                            </div>
                                        {{-- @empty
                                            <img class="d-block mx-auto" width="500"
                                                src="{{ secure_asset('/images/svg/noCourses.svg') }}">
                                            <p class="text-center pt-3"><strong
                                                    class="text-primary">Looks like
                                                    There Is
                                                    No
                                                    Courses Been Found</strong></p>
                                        @endforelse --}}
                                </div>
                            </div>
                            <!--/Coursed lists-->
                        </div>
                            <!--End Right Side Content -->
                        </div>
                    </div>
                </div>
            </section>
        </div>
    </div>


@endsection
@section('welcome-js')
<script>
    $(document).ready(function() {
        // Board, Level and offered courses depend on boards (dependent select)
        $('#education_system').on('change', function() {
            var $board = $('#board');
            var $level = $('#level');
            var $course = $('#course');
            $('#board').empty();
            $('#board').append(`<option value="0" disabled selected>Processing...</option>`);
            $('#level').empty();
            $('#level').append(`<option value="0" disabled selected>Processing...</option>`);
            $('#course').empty();
            $('#course').append(`<option value="0" disabled selected>Processing...</option>`);
            $.ajax({
                url: "{{ route('educationSystemFilter') }}",
                type: 'GET',
                data: {
                    esid: $(this).val()
                },
                success: function(data) {
                    $('#board').empty();
                    $('#board').append(
                        `<option value="0" disabled selected>Select Board*</option>`);
                    $('#level').empty();
                    $('#level').append(
                        `<option value="0" disabled selected>Select Level*</option>`);
                    $('#course').empty();
                    $('#course').append(
                        `<option value="0" disabled selected>Select Course*</option>`);
                    //  Board
                    $.each(data.board, function(id, value) {
                        $board.append('<option value="' + id + '">' + value +
                            '</option>');
                    });
                    //  level
                    $.each(data.level, function(id, value) {
                        $level.append('<option value="' + value.lid + '">' + value
                            .lname +
                            '</option>');
                    });
                    // offered course
                    $.each(data.course, function(id, value) {
                        value.teaching_team.coaching_teachers.map((teacher)=>{
                                    $course.append('<option value="' + value.coffid + '">' +
                                    (value.has_label ? '( '+value.label+' ) ' : '') +  value.course.cname + ' ( '+ value.course.level.lshort_name+' ) '
                                    +'_ '+ teacher.first_name+' '+ teacher.middle_name+' '+ teacher.last_name
                                    +'_ '+value.academic_year_session.sessions.sname+'_'+value.academic_year_session.year
                                    +'</option>');
                                })
                    });
                }
            });
        });

        // Level and offered courses depend on boards (dependent select)
        $('#board').on('change', function() {
            var $level = $('#level');
            var $course = $('#course');
            $('#level').empty();
            $('#level').append(`<option value="0" disabled selected>Processing...</option>`);
            $('#course').empty();
            $('#course').append(`<option value="0" disabled selected>Processing...</option>`);
            $.ajax({
                url: "{{ route('boardFilter') }}",
                type: 'GET',
                data: {
                    bid: $(this).val()
                },
                success: function(data) {
                    $('#level').empty();
                    $('#level').append(
                        `<option value="0" disabled selected>Select Level*</option>`);
                    $('#course').empty();
                    $('#course').append(
                        `<option value="0" disabled selected>Select Course*</option>`);
                    //  level
                    $.each(data.level, function(id, value) {
                        $level.append('<option value="' + value.lid + '">' + value
                            .lname +
                            '</option>');
                    });
                    // offered course
                    $.each(data.course, function(id, value) {
                        value.teaching_team.coaching_teachers.map((teacher)=>{
                                    $course.append('<option value="' + value.coffid + '">' +
                                    (value.has_label ? '( '+value.label+' ) ' : '') +  value.course.cname + ' ( '+ value.course.level.lshort_name+' ) '
                                    +'_ '+ teacher.first_name+' '+ teacher.middle_name+' '+ teacher.last_name
                                    +'_ '+value.academic_year_session.sessions.sname+'_'+value.academic_year_session.year
                                    +'</option>');
                                })
                    });
                }
            });
        });
        // offered courses and level dependent select
        $('#level').on('change', function() {
            var $course = $('#course');
            $('#course').empty();
            $('#course').append(`<option value="0" disabled selected>Processing...</option>`);
            $.ajax({
                url: "{{ route('levelFilter') }}",
                type: 'GET',
                data: {
                    lid: $(this).val()
                },
                success: function(data) {
                    $('#course').empty();
                    $('#course').append(
                        `<option value="0" disabled selected>Select Course*</option>`);
                        $.each(data, function(id, value) {
                            value.teaching_team.coaching_teachers.map((teacher)=>{
                                    $course.append('<option value="' + value.coffid + '">' +
                                    (value.has_label ? '( '+value.label+' ) ' : '') +  value.course.cname + ' ( '+ value.course.level.lshort_name+' ) '
                                    +'_ '+ teacher.first_name+' '+ teacher.middle_name+' '+ teacher.last_name
                                    +'_ '+value.academic_year_session.sessions.sname+'_'+value.academic_year_session.year
                                    +'</option>');
                                })
                    });
                }
            });
        });

     });

      // DataTable
    $(document).ready(function() {
        $('.course_table').DataTable({
            "pagin": true,
            "pageLength": 10,
            "searching": true,
            "ordering": false,
            "info": false,
            'dom': 'Bfrtip',
        });
    });

</script>

@endsection