@extends('layout.template')

@section('intitule')
    <h4 class="text-uppercase mb-0">INSERTION DES NOTES: {{ $data['ecues']->first()->intituleUnite }}</h4>
@endsection

@section('breadcrumb')
    <li class="breadcrumb-item active" aria-current="page">Insertion notes</li>
@endsection

@section('styles')
    <link href="{{ asset('assets/libs/jquery-steps/jquery.steps.css') }}" rel="stylesheet">
    <link href="{{ asset('assets/extra-libs/datatables.net-bs4/css/dataTables.bootstrap4.css') }}" rel="stylesheet">

    <link href="{{ asset('assets/extra-libs/toastr/dist/build/toastr.min.css') }}" rel="stylesheet">
    <link rel="stylesheet" type="text/css"
        href="{{ asset('assets/extra-libs/datatables.net-bs4/css/responsive.dataTables.min.css') }}">
    <link href="{{ asset('assets/libs/jquery-steps/steps.css') }}" rel="stylesheet">
    <link href="{{ asset('assets/my_css/style.css') }}">
@endsection

@section('main')
    <div class="row justify-content-center mt-4" style="min-height: calc(85vh - 60px)">
        <div class="col-lg-12">
            <div class="bg-white" style="padding: 25px">
                <h3 class="box-title m-b-0">Notes des étudiants: Reprises</h3>
                <p class="text-muted m-b-30 font-13"> Ce formulaire permet de renseigner la note des étudiants...</p>
                <div class="col-12">
                    <div class="card">
                        <div class="card-body wizard-content p-0">
                            <h6 class="card-subtitle mb-3"></h6>
                            <form action="{{ route('insertion.reprise.note1') }}" class="tab-wizard wizard-circle">
                                <!-- Step 1 -->
                                <h6> {{ $data['ecues']->first()->intituleUnite }}</h6>
                                <section>
                                    <div class="row justify-content-center py-3"
                                        style="padding-left: 15%!important;padding-right:15%!important;">

                                        <table id="datatable" cellpadding="10px" style="border: 1px solid #e9ecef"
                                            class="table table-striped table-hover table-bordered " role="grid">
                                            <thead class="text-info">
                                                <td>#</td>
                                                <td>Matricule</td>
                                                <td>Noms &amp; Prénoms</td>
                                                @foreach ($data['ecues'] as $ecue)
                                                    <td style="width:150px">
                                                        Notes ({{ $ecue->intituleEcu }})</td>
                                                @endforeach
                                            </thead>
                                                                                        <tbody>
                                                @foreach ($data['students'] as $student)
                                                    
                                                    <tr>
                                                        <td style="width:75px!important">{{ $counterEtu }}</td>
                                                        <td style="width:150px!important">{{ $student->matricule }}</td>
                                                        <td>{{ $student->nomPrenom }}</td>
                                                        @for ($i = 1; $i <= count($data['ecues']); $i++)
                                                            <td><input type="number" min="0" max="{{$data['echelle']}}"
                                                                    step="0.1" name="noteEC{{ $i . '_Etu' . $counterEtu }}"
                                                                    id="noteEC{{ $i . '_Etu' . $counterEtu }}"
                                                                    value={{ $data['noteEC' . $counterEC][$counterEtu - 1]->noteReprise }}
                                                                    style="width:200px;border: 1px solid #e9ecef;" required>
                                                                <span style="display:none">Entrer une valeur valide</span>
                                                            </td>

                                                                                                                    @endfor
                                                    </tr>
                                                                                                    @endforeach

                                            </tbody>
                                        </table>
                                    </div>
                                </section>
                            </form>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('scripts')
    <script src="{{ asset('assets/libs/jquery-steps/build/jquery.steps.min.js') }}"></script>
    <script src="{{ asset('assets/extra-libs/datatables.net/js/jquery.dataTables.min.js') }}"></script>
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11.4.29/dist/sweetalert2.all.min.js"></script>
    <script src="{{ asset('assets/extra-libs/toastr/dist/build/toastr.min.js') }}"></script>
    <script src="{{ asset('assets/extra-libs/datatables.net-bs4/js/dataTables.responsive.min.js') }}"></script>

    <script src="{{ asset('dist/js/pages/datatable/datatable-basic.init.js') }}"></script>
    <script>
        $(document).ready(function() {
            $('#datatable').DataTable({
                "lengthChange": false,
                "scrollcollapse": true,
                "paging": false,
                "scrollY": "450px"
            });
        });
    </script>

    <script src="https://cdn.datatables.net/buttons/1.5.1/js/dataTables.buttons.min.js"></script>

    <script src="https://cdn.datatables.net/buttons/1.5.1/js/buttons.flash.min.js"></script>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.32/pdfmake.min.js"></script>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.32/vfs_fonts.js"></script>

    <script src="https://cdn.datatables.net/buttons/1.5.1/js/buttons.html5.min.js"></script>

    <script src="https://cdn.datatables.net/buttons/1.5.1/js/buttons.print.min.js"></script>

    <script src="{{ asset('dist/js/pages/datatable/datatable-advanced.init.js') }}"></script>
    <script src="{{ asset('assets/libs/jquery-steps/build/jquery.steps.min.js') }}"></script>
    <script>
        //Custom design form example
        $(".tab-wizard").steps({
            headerTag: "h6",
            bodyTag: "section",
            transitionEffect: "fade",
            titleTemplate: '<span class="step">#index#</span> #title#',
            labels: {
                finish: "Submit"
            },
            onFinished: function(event, currentIndex) {

                if ( /*allCaseValid()*/ 1) {
                    Swal.fire({
                        title: 'Confirmer cette opération?',
                        text: "Cette opération ajoutera les notes des étudiants dans la base",
                        icon: 'info',
                        showCancelButton: true,
                        confirmButtonColor: 'rgb(44, 208, 126)',
                        cancelButtonColor: '#d33',
                        cancelButtonText: 'Annuler',
                        reverseButtons: true,
                        confirmButtonText: 'Confirmer l\'opération',
                        backdrop: true,
                        preConfirm: () => {
                            let url = "{{ route('insertion.reprise.note1') }}";
                            let allNotes = [];
                            let allEC = [];
                            let allMatricules = [];

                            for (let i = 1; i < {{ $counterEC }}; i++) {
                                allNotes[i - 1] = [];
                                allEC.push(JSON.parse('')[i - 1]["code_ecu"]);
                                for (let j = 1; j < {{ $counterEtu }}; j++) {
                                    allNotes[i - 1].push($("#noteEC" + i + "_Etu" + j).val());
                                    if (i == 1) {
                                        allMatricules.push(JSON.parse('')[j - 1][
                                            "matricule"
                                        ]);
                                    }
                                }
                            }
                            
                            let token = document
                                .querySelector('meta[name="csrf-token"]')
                                .getAttribute("content");

                            let options = {
                                headers: {
                                    "Content-Type": "application/json",
                                    Accept: "application/json, text-plain, */*",
                                    "X-Requested-With": "XMLHttpRequest",
                                    "X-CSRF-TOKEN": token,
                                },
                                method: "post",
                                credentials: "same-origin",
                                body: JSON.stringify({
                                    code_unite: "