@extends('layouts.app')
@section('titlePage', 'Academics')
@section('content')
    @push('script')
        <script>
            document.getElementById("draz-9").classList.add("is-expanded");
            document.getElementById("dra-9").classList.add("active", "is-expanded");
            document.getElementById("View-9").classList.add("active");
            $(document).ready(function(){
                $('#content_div').removeClass('d-none');
            })
        </script>
    @endpush
    @include('common.delete_modal')
    <div class="page-wrapper d-none" id="content_div">
        <!-- [ breadcrumb ] start -->
        <div class="breadcrumb-header justify-content-between align-items-center">
            <h4 class="text-primary font-weight-bold py-3 mb-0">
                MANAGE ACADEMICS / NOTES
            </h4>
            <div class="justify-content-center mt-2">
                <ol class="breadcrumb breadcrumb-style3">
                    <li class="breadcrumb-item tx-15"><a href="{{ route('master.courses.index') }}"><i
                                class="feather icon-home"></i></a></li>
                    <li class="breadcrumb-item active">View All</li>
                </ol>
            </div>
        </div>
        <!-- [ breadcrumb ] end -->
        <!-- [ Main Content ] start -->
        <div class="panel tabs-style5">
            <div class="panel-head">
                <ul class="nav nav-tabs d-sm-flex d-block" id="myTab">
                    <li class="nav-item"><a class="nav-link active" data-bs-toggle="tab" href="#style5tab1"
                            data-type="slab">ACADEMICS</a></li>
                    <li class="nav-item"><a class="nav-link" data-bs-toggle="tab" href="#style5tab2"
                            data-type="block">NOTES</a></li>
                </ul>
            </div>
            <div class="panel-body my-2">
                <div class="tab-content">
                    <div class="tab-pane fade in active show" id="style5tab1">
                        <div class="row">
                            <div class="col-sm-12">
                                <div class="card">
                                    <div class="card-header d-flex justify-content-between">
                                        <div>
                                            <a href="{{ route('master.courses.create') }}"
                                                class="btn btn-primary">Create</a>
                                            <a href="{{ route('master.courses.categories.index') }}"
                                                class="btn btn-secondary">Categories</a>
                                            <a href="{{ route('master.courses.subcategories.index') }}"
                                                class="btn btn-primary">Sub-Categories</a>
                                        </div>
                                        <button class="btn btn-secondary float-left" data-toggle="modal"
                                            data-target="#modalMedia">Help Desk</button>
                                    </div>
                                    <div class="card-body">
                                        <div class="table-responsive dt-responsive">
                                            <div id="dt-ajax-array_wrapper" class="dataTables_wrapper dt-bootstrap4">
                                                @include('common.alert')
                                                <div class="mb-3">
                                                    <form method="GET" id="form">
                                                        <div class="row">
                                                            <div class="col-4">
                                                                <input type="text" id="title"
                                                                    value="{{ request()->get('title') }}" name="title"
                                                                    class="form-control" placeholder="Title">
                                                            </div>

                                                            <div class="col-4">
                                                                <select name="category_id" id="category_id"
                                                                    class="form-control">
                                                                    <option value="">--select category--</option>
                                                                    @foreach ($course_categories as $key => $value)
                                                                        <option value="{{ $value->id }}"
                                                                            {{ request()->get('category_id') == $value->id ? 'selected' : '' }}>
                                                                            {{ $value->category }}
                                                                        </option>
                                                                    @endforeach
                                                                </select>
                                                            </div>

                                                            <div class="col-4">
                                                                <select name="course_type" id="course_type"
                                                                    class="form-control">
                                                                    <option value="">--select course type--</option>
                                                                    <option value="1"
                                                                        {{ request()->get('course_type') == '1' ? 'selected' : '' }}>
                                                                        Paid</option>
                                                                    <option value="0"
                                                                        {{ request()->get('course_type') == '0' ? 'selected' : '' }}>
                                                                        Free</option>
                                                                </select>
                                                            </div>
                                                            <!-- <input type="hidden" name="page" value="{{ request()->get('page', 1) }}"> -->
                                                            <div class="col-md-4">
                                                                <button class="btn btn-primary float-right search"><i
                                                                        class="fa fa-search"></i> Search</button>
                                                                <button class="btn btn-secondary float-right reset"><i
                                                                        class="fa fa-times"></i> Reset</button>
                                                            </div>
                                                        </div>
                                                    </form>
                                                </div>
                                                <div class="row">
                                                    <div class="col-sm-12">
                                                        <table id="dt-ajax-array"
                                                            class="table table-striped table-bordered nowrap dataTable"
                                                            role="grid" aria-describedby="dt-ajax-array_info">
                                                            <colgroup>
                                                                <col style="width:25%">
                                                                <col style="width:25%">
                                                                <col style="width:25%">
                                                            </colgroup>
                                                            <thead>
                                                                <tr role="row">
                                                                    <th>Course ID</th>
                                                                    <th width="20%">Title</th>
                                                                    <th width="25%">Category</th>
                                                                    <th width="10%">Type</th>
                                                                    <th>Preview</th>
                                                                    <th width="15%">Action</th>
                                                                </tr>
                                                            </thead>
                                                            <tbody>
																@php
																  use Illuminate\Support\Str;
															    @endphp
                                                                @foreach ($data as $value)
                                                                    <tr>
                                                                        <td>{{ $value->id }}</td>
                                                                        <td class="text-capitalize"
                                                                            style="max-width:250px;font-weight: bold !important;">
                                                                            {{ Str::limit(strip_tags($value->title), 30) }}
                                                                        </td>
                                                                        <td>
                                                                           {{ $value->category->category }}
                                                                        </td>
                                                                        {{-- <td><div style="white-space: break-spaces;">{{ str_limit(strip_tags($value->description), 200) }}

																</td> --}}
                                                                        @if ($value->course_type == 0)
                                                                            <td>Free</td>
                                                                        @else
                                                                            <td>Paid</td>
                                                                        @endif
                                                                        <td>
                                                                            <button type="button" class="btn btn-primary"
                                                                                data-toggle="modal"
                                                                                data-target="#modalPreview{{ $value->id }}">
                                                                                Preview
                                                                            </button>
                                                                            <div class="modal fade"
                                                                                id="modalPreview{{ $value->id }}"
                                                                                oncontextmenu="return false;"
                                                                                tabindex="-1" role="dialog"
                                                                                aria-labelledby="modalMediaLabel"
                                                                                aria-hidden="true">
                                                                                <div class="modal-dialog modal-xl"
                                                                                    role="document">
                                                                                    <div class="modal-content">
                                                                                        <div class="modal-header">
                                                                                            <h5 class="modal-title"
                                                                                                id="modalMediaLabel">
                                                                                                {{ $value->title }}</h5>
                                                                                            <button type="button"
                                                                                                class="close"
                                                                                                data-dismiss="modal"
                                                                                                aria-label="Close"
                                                                                                onclick="reload()">
                                                                                                <span
                                                                                                    aria-hidden="true">&times;</span>
                                                                                            </button>
                                                                                        </div>
                                                                                        <div class="modal-body">
                                                                                            <iframe
                                                                                                src="{{ str_replace('http://', 'https://', $value->video_url) }}"
                                                                                                frameborder="0"
                                                                                                width="100%"
                                                                                                height="600px"></iframe>
                                                                                        </div>
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                        </td>
                                                                        <td>
                                                                            <div
                                                                                class="btn-icon-list btn-list justify-content-around align-items-baseline">

                                                                                <a href="{{ route('master.courses.show', $value->id) }}"
                                                                                    class="btn btn-circle-lg btn-primary-light flex-center"><i
                                                                                        class="si si-eye tx-16"></i></a>

                                                                                <a href="{{ route('master.courses.edit', $value->id) }}"
                                                                                    class="btn btn-circle-lg btn-primary-light flex-center"><i
                                                                                        class="fe fe-edit tx-16"></i></a>
                                                                                <div>
                                                                                    <form
                                                                                        action="{{ route('master.courses.destroy', $value->id) }}"
                                                                                        method="POST"
                                                                                        class="btn btn-circle-lg flex-center delete">
                                                                                        @csrf
                                                                                        <button type="submit"
                                                                                            class="btn btn-circle-lg btn-danger flex-center">
                                                                                            <!-- onclick="return confirm('Are you sure?')"-->
                                                                                            <i
                                                                                                class="fe fe-trash tx-16"></i></button>
                                                                                    </form>
                                                                                </div>
                                                                            </div>
                                                                        </td>
                                                                    </tr>
                                                                @endforeach
                                                            </tbody>
                                                        </table>
                                                    </div>
                                                </div>
                                            </div>
                                            {{-- Pagination --}}
                                            <div class="d-flex justify-content-between">
                                                <div class="mt-2">
                                                    Showing {{ $data->firstItem() }} to {{ $data->lastItem() }} of {{ $data->total() }} Entries
                                                </div>
                                                <div aria-label="Page navigation example">
                                                    <ul class="pagination justify-content-center">

                                                        {{-- Previous Page Link --}}
                                                        @if ($data->onFirstPage())
                                                            <li class="page-item disabled"><span class="page-link"><<</span></li>
                                                        @else
                                                            <li class="page-item">
                                                                <a class="page-link bg-light text-dark"
                                                                       href="{{ $data->previousPageUrl() . '&' . http_build_query(request()->only(['title', 'category_id', 'course_type'])) }}"><<</a>

                                                            </li>
                                                        @endif

                                                        {{-- Current Page Number --}}
                                                        <li class="page-item active">
                                                            <span class="page-link">{{ $data->currentPage() }}</span>
                                                        </li>

                                                        {{-- Next Page Link --}}
                                                        @if ($data->hasMorePages())
                                                            <li class="page-item">
                                                                <a class="page-link bg-light text-dark"
                                                                     href="{{ $data->nextPageUrl() . '&' . http_build_query(request()->only(['title', 'category_id', 'course_type'])) }}">>></a>

                                                            </li>
                                                        @else
                                                            <li class="page-item disabled"><span class="page-link">>></span></li>
                                                        @endif

                                                    </ul>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="tab-pane fade" id="style5tab2">
                        <div class="row">
                            <div class="col-sm-12">
                                <div class="card">
                                    <div class="card-header d-flex justify-content-between">
                                        <div>
                                            <a href="{{ route('master.drazam-notes.create') }}"
                                                class="btn btn-primary">Create</a>
                                            <a href="{{ route('master.drazam-notes.notesIndex') }}"
                                                class="btn btn-secondary">Category</a>
                                        </div>
                                        <button class="btn btn-secondary float-left" data-toggle="modal"
                                            data-target="#modalMedia2">Help Desk</button>
                                    </div>
                                    <div class="card-body">
                                        <div class="table-responsive dt-responsive">
                                            <div id="dt-ajax-array_wrapper" class="dataTables_wrapper dt-bootstrap4">
                                                @include('common.alert')
                                                <div class="mb-3">
                                                    <form method="GET" id="form">
                                                        <div class="row">
                                                            <div class="col-4">
                                                                <input type="text" id="notes_title"
                                                                    value="{{ request()->get('title') }}" name="title"
                                                                    class="form-control" placeholder="Title">
                                                            </div>

                                                            <div class="col-4">
                                                                <select name="notes_category_id" id="notes_category_id"
                                                                    class="form-control">
                                                                    <option value="">--select category--</option>
                                                                    @foreach ($notes_categories as $key => $value)
                                                                        <option value="{{ $value->id }}"
                                                                            {{ request()->get('notes_category_id') == $value->id ? 'selected' : '' }}>
                                                                            {{ $value->title }}
                                                                        </option>
                                                                    @endforeach
                                                                </select>
                                                            </div>

                                                            <div class="col-4">
                                                                <select name="notes_type" id="notes_type"
                                                                    class="form-control">
                                                                    <option value="">--select notes type--</option>
                                                                    <option value="1"
                                                                        {{ request()->get('notes_type') == '1' ? 'selected' : '' }}>
                                                                        Paid</option>
                                                                    <option value="0"
                                                                        {{ request()->get('notes_type') == '0' ? 'selected' : '' }}>
                                                                        Free</option>
                                                                </select>
                                                            </div>
                                                            <!-- <input type="hidden" name="page" value="{{ request()->get('page', 1) }}"> -->
                                                            <div class="col-md-4">
                                                                <button class="btn btn-primary float-right search"><i
                                                                        class="fa fa-search"></i> Search</button>
                                                                <button class="btn btn-secondary float-right notesreset"><i
                                                                        class="fa fa-times"></i> Reset</button>
                                                            </div>
                                                        </div>
                                                    </form>
                                                </div>
                                                <div class="row">
                                                    <div class="col-sm-12">
                                                        <table id="dt-ajax-array"
                                                            class="table table-bordered table-striped mg-b-0 text-md-nowrap"
                                                            role="grid" aria-describedby="dt-ajax-array_info">
                                                            <thead>
                                                                <tr role="row">
                                                                    <th>ID</th>
                                                                    <th>Note</th>
                                                                    <th>Note category</th>
                                                                    <th>Type</th>
                                                                    <th>Preview</th>
                                                                    <th>Action</th>
                                                                    <!-- <th>View Notes</th> -->
                                                                </tr>
                                                            </thead>
                                                            <tbody>
                                                                @foreach ($notes as $value)
                                                                    <tr>
                                                                        <td>{{ $value->id }}</td>
                                                                        <td class="text-capitalize"
                                                                            style="max-width:250px;font-weight: bold !important;">
                                                                            {{ $value->title }}</td>
                                                                        <td>
                                                                            {{ $value->category_title }}
                                                                        </td>

                                                                        @if ($value->course_type == 0)
                                                                            <td>Free</td>
                                                                        @else
                                                                            <td>Paid</td>
                                                                        @endif

                                                                        <td>
                                                                            <button type="button" class="btn btn-primary"
                                                                                data-toggle="modal"
                                                                                data-target="#modalPreview{{ $value->id }}">
                                                                                Preview
                                                                            </button>
                                                                            <div class="modal fade"
                                                                                id="modalPreview{{ $value->id }}"
                                                                                oncontextmenu="return false;"
                                                                                tabindex="-1" role="dialog"
                                                                                aria-labelledby="modalMediaLabel"
                                                                                aria-hidden="true">
                                                                                <div class="modal-dialog modal-xl"
                                                                                    role="document">
                                                                                    <div class="modal-content">
                                                                                        <div class="modal-header">
                                                                                            <h5 class="modal-title"
                                                                                                id="modalMediaLabel">
                                                                                                {{ $value->title }}</h5>
                                                                                            <button type="button"
                                                                                                class="close"
                                                                                                data-dismiss="modal"
                                                                                                aria-label="Close"
                                                                                                onclick="reload()">
                                                                                                <span
                                                                                                    aria-hidden="true">&times;</span>
                                                                                            </button>
                                                                                        </div>
                                                                                        <div class="modal-body">
                                                                                            <iframe
                                                                                                src="{{ str_replace('http://', 'https://', $value->pdf_file) }}"
                                                                                                frameborder="0"
                                                                                                width="100%"
                                                                                                height="600px"></iframe>
                                                                                        </div>
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                        </td>
                                                                        <td>
                                                                            <div
                                                                                class="btn-icon-list btn-list justify-content-center align-items-baseline">
                                                                                <a href="{{ route('master.drazam-notes.edit', $value->id) }}"
                                                                                    class="btn btn-circle-lg btn-primary-light flex-center"><i
                                                                                        class="fe fe-edit tx-16"></i></a>
                                                                                <div>
                                                                                    <form
                                                                                        action="{{ route('master.drazam-notes.destroy', $value->id) }}"
                                                                                        method="POST"
                                                                                        class="btn btn-circle-lg flex-center delete">
                                                                                        <!--onclick="return confirm('Are you sure?')"-->
                                                                                        @csrf
                                                                                        <button type="submit"
                                                                                            class="btn btn-circle-lg btn-danger flex-center"><i
                                                                                                class="fe fe-trash tx-16"></i></button>
                                                                                    </form>
                                                                                </div>
                                                                            </div>
                                                                        </td>
                                                                        <!-- <td>
                     <a href="{{ $value->pdf_file }}" target="_blank" class="btn btn-warning btn-sm preview" data-id="{{ $value->id }}">View Notes</a>
                    </td> -->

                                                                    </tr>
                                                                @endforeach
                                                            </tbody>
                                                        </table>
                                                    </div>
                                                </div>
                                                {{-- Pagination --}}
                                                <div class="d-flex justify-content-between">
                                                    <div class="mt-2">
                                                        Showing {{ $data->firstItem() }} to {{ $data->lastItem() }} of {{ $data->total() }} Entries
                                                    </div>
                                                    <div aria-label="Page navigation example">
                                                        <ul class="pagination justify-content-center">

                                                            {{-- Previous Page Link --}}
                                                            @if ($data->onFirstPage())
                                                                <li class="page-item disabled"><span class="page-link"><<</span></li>
                                                            @else
                                                                <li class="page-item">
                                                                    <a class="page-link bg-light text-dark" href="{{ $data->previousPageUrl(). '&' . http_build_query(request()->only(['title', 'category_id', 'notes_type'])) }}"><<</a>
                                                                </li>
                                                            @endif

                                                            {{-- Current Page Number --}}
                                                            <li class="page-item active">
                                                                <span class="page-link">{{ $data->currentPage() }}</span>
                                                            </li>

                                                            {{-- Next Page Link --}}
                                                            @if ($data->hasMorePages())
                                                                <li class="page-item">
                                                                    <a class="page-link bg-light text-dark" href="{{ $data->nextPageUrl(). '&' . http_build_query(request()->only(['title', 'notes_category_id', 'notes_type'])) }}">>></a>
                                                                </li>
                                                            @else
                                                                <li class="page-item disabled"><span class="page-link">>></span></li>
                                                            @endif

                                                        </ul>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- [ Main Content ] end -->

    <div class="modal fade" id="modalMedia" oncontextmenu="return false;" tabindex="-1" role="dialog"
        aria-labelledby="modalMediaLabel" aria-hidden="true">
        <div class="modal-dialog modal-xl" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="modalMediaLabel">Creating Courses</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <iframe
                        src="https://azam-prod-assets.s3.ap-south-1.amazonaws.com/help_desk_videos/HOW+TO+CREATE+ACADEMICS.mp4"
                        frameborder="0" width="100%" height="600px"></iframe>
                </div>
            </div>
        </div>
    </div>
    <div class="modal fade" id="modalMedia2" oncontextmenu="return false;" tabindex="-1" role="dialog"
        aria-labelledby="modalMediaLabel" aria-hidden="true">
        <div class="modal-dialog modal-xl" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="modalMediaLabel">Creating Notes</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <iframe
                        src="https://azam-prod-assets.s3.ap-south-1.amazonaws.com/help_desk_videos/HOW+TO+CREATE+NOTES.mp4"
                        frameborder="0" width="100%" height="600px"></iframe>
                </div>
            </div>
        </div>
    </div>
@endsection
@section('script')
    <script>
        $('.reset').on('click', function(e) {
            // $('#form').trigger("reset");
            $('#title').val('');
            $('#category_id').val('');
            $('#course_type').val('');
            $('#res').val('');
            $('#status').val('');
        });

        $('.notesreset').on('click', function(e) {
            // $('#form').trigger("reset");
            $('#notes_title').val('');
            $('#notes_category_id').val('');
            $('#notes_type').val('');
            $('#res').val('');
            $('#status').val('');
        });

        function reload() {
            location.reload();
        }
    </script>
    <script>
        $(document).ready(function() {
            // Check if there's an active tab stored in localStorage
            var activeTab = localStorage.getItem('activeTab');
            if (activeTab) {
                // Activate the tab from localStorage
                $('#myTab a[href="' + activeTab + '"]').tab('show');
            }

            // Store the active tab in localStorage on click
            $('#myTab a').on('click', function(e) {
                e.preventDefault();
                var tabId = $(this).attr('href');
                localStorage.setItem('activeTab', tabId);
                $(this).tab('show');
            });
        });
    </script>
@endsection