@extends('layouts.app')

@section('title')
    Course Marking
@endsection

@push('custom-css')
    <style>
        #example1_info,
        .pagination {
            display: none !important;
        }

        th {
            font-weight: normal !important;
        }
    </style>
@endpush

@section('content')
    <div class="page-content-wrapper">
        <div class="page-content">
            @if ($grading_scheme_implementation == null)
                <div class="alert alert-warning alert-dismissible show" role="alert">
                    Please implement the grading shceme for the program here first : <strong>Institution Setup > Use Grading System</strong>
                </div>
            @else
                <div id="upload" class="modal">
                    <!-- Modal content -->
                    <div style="width:60%" class="modal-content">
                        <span class="close">X</span>

                        <form method="post" action="{{ url('upload-student-marks') }}" enctype="multipart/form-data"
                            id="form_sample_1" class="form-horizontal">
                            @csrf
                            <div style="display: flex; justify-content:center" class="row">

                                <div class="col-md-3 col-sm-7">
                                    <label>Course</label>
                                    <select class="form-select form-control" name="course_id">
                                        @foreach ($courses as $course)
                                            <option value="{{ $course->id }}">{{ $course->course_name }}</option>
                                        @endforeach
                                    </select><br>
                                </div>

                                <div class="col-md-3 col-sm-7">
                                    <label>Academic Year</label>
                                    <select class="form-select form-control" name="academic_year_id">
                                        @foreach ($years as $year)
                                            <option value="{{ $year->id }}">{{ $year->academic_year_name }}</option>
                                        @endforeach
                                    </select><br>
                                </div>

                                <div class="col-md-3 col-sm-7">
                                    <label>Academic Session</label>
                                    <select class="form-select form-control" name="academic_session_id">
                                        @foreach ($sessions as $session)
                                            <option value="{{ $session->id }}">{{ $session->academic_session_name }}
                                            </option>
                                        @endforeach
                                    </select><br>
                                </div>



                                <div class="col-md-3 col-sm-7">
                                    <label>Upload File</label>
                                    <input type="file" class="form-select select2 form-control" name="file"><br>
                                </div>

                            </div>
                            <br>

                            <div style="text-align:center" class="row">
                                <div class="col-md-3 col-sm-5">
                                    <a href="{{ asset('../file_uploads/student_marking.xlsx') }}"><i
                                            style="margin-right:10px; font-size:25px" class="fa fa-file-pdf-o"></i> Download
                                        SAMPLE FILE here...</a>
                                </div>
                            </div>
                            <br>

                            <div style="display:flex; justify-content:center; height:auto" id="personalDet" class="row">
                                <div style="" class="col-md-3 col-sm-6">
                                    <div style="display: flex;justify-content: center;" class="col-md-12 col-sm-6">
                                        <button type="submit" class="btn btn-info m-r-20">UPLOAD</button>
                                        <span onclick="clsupload()" class="btn btn-grey m-r-20">CANCEL</span>
                                    </div>
                                </div>
                            </div>
                            <br>

                        </form>
                    </div>
                </div>
                <div class="page-bar">
                    <div class="page-title-breadcrumb">
                        <div class=" pull-left">
                            <div class="page-title">Course Marking</div>
                        </div>
                    </div>
                </div>
                @if (session('error'))
                    <div class="alert alert-danger alert-dismissible show" role="alert">
                        <strong>{{ session('error') }}</strong><a href="#" class="alert-link"></a>
                        <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close">
                            <span aria-hidden="false"></span>
                        </button>
                    </div>
                @elseif(session('success'))
                    <div class="alert alert-success alert-dismissible show" role="alert">
                        <strong>{{ session('success') }}</strong><a href="#" class="alert-link"></a>
                        <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close">
                            <span aria-hidden="false"></span>
                        </button>
                    </div>
                @endif
                <div class="row">
                    <div class="col-md-12">
                        <div class="card">
                            <div class="card-body ">
                                <button onclick="upload()"
                                    class="btn btn-success btn-rounded waves-effect waves-light m-t-20">Upload
                                    Marks</button>
                                <div class="table-scrollable">
                                    <table id="example1" class="display" style="width:100%;">
                                        <thead>
                                            <tr>
                                                <th class="center">Date</th>
                                                <th class="center"> Student ID </th>
                                                <th class="center"> Course </th>
                                                <th class="center"> Year </th>
                                                <th class="center"> Session </th>
                                                <th class="center"> CA Marks </th>
                                                <th class="center"> Exam Marks </th>
                                                <th class="center"> Total Marks </th>
                                                <th class="center"> Grade </th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @foreach ($student_marking as $student_marks)
                                                <tr>
                                                    <th class="center">
                                                        {{ date('d/m/Y', strtotime($student_marks->created_at)) }}</th>
                                                    <th class="center">{{ $student_marks->student_id }}</th>
                                                    <th class="center">{{ $student_marks->course_name }}</th>
                                                    <th class="center">{{ $student_marks->academic_year_name }}</th>
                                                    <th class="center">{{ $student_marks->academic_session_name }}</th>
                                                    <th class="center">{{ $student_marks->ca_exam }}</th>
                                                    <th class="center">{{ $student_marks->final_exam }}</th>
                                                    <th class="center">{{ $student_marks->mark }}</th>
                                                    <th class="center">{{ $student_marks->grade }}</th>
                                                    </th>
                                                </tr>
                                            @endforeach
                                        </tbody>
                                    </table>
                                    {{ $student_marking->links() }}
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            @endif
        </div>
    </div>
    <!-- end page content -->
    <script>
        // Get the modal
        var modal = document.getElementById("upload");

        // When the user clicks the button, open the modal 
        function upload() {

            modal.style.display = "block";
        }

        function clsupload() {
            modal.style.display = "none";
        }
    </script>
@endsection