@extends('layouts.base', [
	"breadcrumb" => [  // see partials/breadcrumb.blade.php for default options
		"title" => "CRÉATION DU STATUT DE L'ÉTUDIANT",
		// "showNav" => true,
		"nav" => [
			"Dashboard" => route("home"),
			"Statut de l'étudiant" => "",
			],
		"btnText" => "GestStudent v17.04",
	]
])

@section('title', "Création du statut de l'étudiant | GestStudent Admin")

@section('content')
    @if(session()->has('error'))
        <div class="alert alert-danger alert-dismissible fade show" role="alert">
            <strong>{{session('error')}}</strong>
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
        </div>
    @endif
    <div class="row">
        <div class="col-3"></div>
        <div class="col-6">
            <div class="card">
                <div class="border-bottom title-part-padding bg-info">
                    <h4 class="card-title mb-0" style="color: white">Veuillez sélectionner les données s'il vous plait.</h4>
                </div>
                <div class="card-body">
                    <form class="needs-validation" novalidate action="{{route('etudiants.statut.create')}}"
                        id="statut-form"
                    >
                        <div class="form-group mb-3 row">
                            <div class="col-3" style="text-align:right;">
                                <label>Année d'obtention du BAC</label>
                            </div>
                            <div class="col-9">
                                <select name="annee_bac" class="form-control" required>
                                    <option value="">Sélectionner l'année d'obtention du BAC</option>
                                    @foreach ($periodes as $p)
                                        <option value="{{$p->annee}}">{{$p->annee}}</option>
                                    @endforeach
                                </select>
                                <div class="valid-feedback">Ok!</div>
                                <div class="invalid-feedback">Le champ est requis</div>
                            </div>
                        </div>
                        <div class="form-group mb-3 row">
                            <div class="col-3" style="text-align:right;">
                                <label>Numéro de table au BAC</label>
                            </div>
                            <div class="col-9">
                                <input type="text" name="num_table" class="form-control" required>
                                <div class="valid-feedback">Ok!</div>
                                <div class="invalid-feedback">Le champ est requis</div>
                            </div>
                        </div>
                        <div class="form-group mb-3 row">
                            <div class="col-3" style="text-align:right;">
                                <label>Filière</label>
                            </div>
                            <div class="col-9">
                                <select name="field" class="form-control" required>
                                    <option value="">Sélectionner la filière</option>
                                    @foreach ($filieres as $f)
                                        <option value="{{$f->idFiliere}}">{{$f->intituleFilieres . '(' . $f->sigleFilieres . ')'}}</option>
                                    @endforeach
                                </select>
                                <div class="valid-feedback">Ok!</div>
                                <div class="invalid-feedback">Le champ est requis</div>
                            </div>
                        </div>
                        <div class="form-group mb-3 row">
                            <div class="col-3" style="text-align:right;">
                                <label>Niveau formation</label>
                            </div>
                            <div class="col-9">
                                <select name="niv_formation" class="form-control" required>
                                    <option value="">Choisir le niveau de formation</option>
                                    <option value="1">Licence</option>
                                    <option value="2">Master</option>
                                    <option value="3">Doctorat</option>
                                </select>
                                <div class="valid-feedback">Ok!</div>
                                <div class="invalid-feedback">Le champ est requis</div>
                            </div>
                        </div>
                        <div class="form-group mb-3 row">
                            <div class="col-3" style="text-align:right;">
                                <label>Statut de l'étudiant</label>
                            </div>
                            <div class="col-9">
                                <select name="status" class="form-control" required>
                                    <option value="">Sélectionner le statut de l'étudiant</option>
                                    @foreach ($statuts as $s)
                                        <option value="{{$s->idStatut}}">{{$s->intitule . '(' . $s->statut . ')'}}</option>
                                    @endforeach
                                </select>
                                <div class="valid-feedback">Ok!</div>
                                <div class="invalid-feedback">Le champ est requis</div>
                            </div>
                        </div>
                        <div class="form-group mb-3 row">
                            <div class="col-3" style="text-align:right;">
                                <label>Matricule </label>
                            </div>
                            <div class="col-9">
                                <input type="text" name="matricule" class="form-control">
                                ( <span style="color: red">Pour les anciens étudiants</span>)
                                <div class="valid-feedback">Ok!</div>
                                <div class="invalid-feedback">Le champ est requis</div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-4"></div>
                            <div class="col-8">
                                <button class="btn btn-success mt-3 rounded-pill px-4" type="submit">Valider</button>
                                {{-- <button class="btn btn-danger mt-3 rounded-pill px-4" type="submit">Annuler</button> --}}
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
        <div class="col-3"></div>
    </div>
@endsection

@section('script')

    <script>
        const swalWithBootstrapButtons = Swal.mixin({
            customClass: {
                confirmButton: 'btn btn-success',
                cancelButton: 'btn btn-danger'
            },
            buttonsStyling: false
        });

        $("#statut-form").submit(function (e) {

            let form = document.getElementById('statut-form');
            if(form.checkValidity() === false) {
                form.classList.add('was-validated');
                return false;
            }

            e.preventDefault();

            Swal.fire({
                title: "Confirmer l'oprération ?",
                text: "Bien vouloir confirmer l'opération.",
                showCancelButton: true,
                showLoaderOnConfirm: true,
                confirmButtonText: "Oui",
                cancelButtonText: "Annuler",
                confirmButtonColor: "#8000ff",
                preConfirm: () => {

                    // Donnees du formulaire a envoyer
                    let formData = new FormData(form);

                    // Requete AJAX
                    return fetch($('#statut-form').attr('action'),{
                        method: "POST",
                        headers: {
                            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                        },
                        body: formData
                    })
                    .then(response => response.json())
                    .then(response => {
                        if(response.success == true){
                            return response;
                        }else{
                            Swal.showValidationMessage(
                                response.message
                            )
                        }
                    })
                },
                allowOutsideClick: () => !Swal.isLoading()
            }).then((result) => {
                if (result.isConfirmed) {
                    swalWithBootstrapButtons.fire(
                        'Opération enregistrée!',
                        result.value.message,
                        'success'
                    ).then((result2) => {
                        if (result2.isConfirmed) {
                            location.reload();
                        }
                    })
                }
            })
        });
    </script>

@endsection