@extends('layouts.main')

@section('content')

<!-- end breadcrumb -->
<!-- begin row -->
<div class="row">



    <div class=" col-sm-2 ">

        @include('modules.finances.menu')

    </div>


    <div class="col-md-10">

        <!-- begin row -->
        <div class="row">
            <div class="col-md-4 ">
                <h1 class="m-0" style="font-size: 20px;font-weight: 900; text-transform:uppercase">{{
                    $classeActive->cl_niveau}} > {{ $classeActive->cl_cycle}} {{ $classeActive->cl_nom}}</h1>
            </div>
            <div class="col-md-4 ">
            </div>
        </div>
        <!-- end row -->

        <!-- begin row -->
        <div class="row">
            <div class="col-md-4" style="padding: 10px; background: #f9f8f8;padding: 10px;border-radius: 5px; ">
                <div class="row">
                    <div class="col-sm-12" style="  background: #f2f2f2; padding: 5px;  ">
                        <h5 class="m-0"><i class="fal fa-md fa-fw m-r-0 fa-users"></i> Liste des élèves (<strong>{{
                                count($etudiant_inscrit) }} Elèves inscrits</strong>) </h5>
                        <table id="" class="table table-bordered table-hover table-striped w-100">
                            <thead>
                                <th>ID</th>
                                <th>Nom</th>
                                <th class="text-center">Date naissance</th>
                                <th class="text-center">Sexe</th>
                                <th></th>
                            </thead>
                            <tbody>
                                @foreach ($etudiant_inscrit as $et )
                                @if($etudiant->et_id == $et->et_id) <tr style="cursor: pointer;background: lightblue ">
                                    @else
                                <tr style="cursor: pointer;">
                                    @endif

                                    <td>{{ $et->et_id }}</td>
                                    <td>{{ $et->et_civilite }} {{ $et->et_prenom }} {{ $et->et_nom }}</td>
                                    <td class="text-center">{{ date('d-m-Y', strtotime($et->et_datenaissance))}} </td>
                                    <td class="text-center">{{ $et->et_civilite }}</td>

                                    <td><a
                                            href="{{URL::route('etudiants_detailscaisse', ['cl_id' => encrypt($classeActive->cl_id),'id' => $et->et_id])}}">
                                            <i class="fal fa-eye"></i> Détail</a> </td>
                                </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>

                </div>

            </div>
            <div class="col-md-8" style="  background: #deeef3;padding: 20px;border-radius: 10px; ">
                <div class="row">
                    <div class="col-md-4" style="border: 1px solid lightgray; padding: 20px; ">
                        <div class="row">
                            <div class="col-sm-12 p-0 m-0">
                                <label class="col-form-label col-md-12 text-center">
                                    <img id="imgshow"
                                        style="display: block; margin-left: auto; margin-right: auto;    height: 120px; max-height:120px"
                                        src="{{ asset('etudiants/'.$etudiant->et_photopath) }}">

                                    <h1 class="m-0"> {{ $etudiant->et_civilite}} {{ $etudiant->et_prenom}} {{
                                        $etudiant->et_nom}}</h1>
                                </label>

                                <p class="p-0 m-0"><strong>Nom de la mère :</strong> {{ $etudiant->et_nom_mere}}</p>
                                <p class="p-0 m-0"><strong>Né(e) le,</strong> {{ date('d-m-Y',
                                    strtotime($etudiant->et_datenaissance))}} </p>
                                <p class="p-0 m-0"><strong>Situation :</strong> {{ $etudiant->et_situation_pro}}</p>
                                <p class="p-0 m-0"><strong>Profession :</strong> {{
                                    $etudiant->et_situation_pro_travail}}</p>
                                <p class="p-0 m-0"><strong>Portable :</strong> {{ $etudiant->et_portable}}</p>
                                <p class="p-0 m-0"><strong>Email :</strong> {{ $etudiant->et_email}}</p>

                                <p class="p-0 m-0"><strong>Personne de contact :</strong> {{
                                    $etudiant->et_personne_contact}} ( {{ $etudiant->et_tel_contact1}})</p>


                                <br>
                                <p class="p-0 m-0"><strong>Classe actuel :</strong> </p>
                                <p class="p-0 m-0" style="color: red;"><strong>Inscrit depuis le,</strong> {{
                                    date('d-m-Y h:i:s', strtotime($etudiant->et_date_inscription))}} </p>




                            </div>

                        </div>
                    </div>
                    <div class="col-md-8">

                        @if($inscriptions)

                        <div class="row">

                            <div class="col-sm-12">


                                <table id="" class="table table-bordered table-hover table-striped w-100"
                                    style="background: white;">
                                    <thead>
                                        <th>ID</th>
                                        <th>Classe</th>
                                        <th class="text-right">Mensuel</th>
                                        <th class="text-right">Total à payer</th>
                                        <th class="text-right">Payer</th>
                                        <th class="text-right">Reste à payer</th>
                                        <th class="text-center"></th>
                                    </thead>
                                    <tbody>


                                        @foreach ($inscriptions as $insc )
                                        <tr style="cursor: pointer;">
                                            <td> <a
                                                    href="{{URL::route('et_inscription_factures', ['id' => encrypt($insc->insc_id)])}}">
                                                    {{ $insc->insc_id }} </a> </td>
                                            <td>{{ $insc->cl_cycle }} {{ $insc->cl_nom }}</td>
                                            <td class="text-right">{{ $insc->insc_montant_mensuel }}</td>
                                            <td class="text-right">{{ $insc->insc_montant_total }}</td>
                                            <td class="text-right">{{ $insc->insc_montant_totalpaye }}</td>
                                            <td class="text-right">{{ $insc->insc_montant_totalpaye -
                                                $insc->insc_montant_total }}</td>


                                            <td class="text-center">
                                                @if(($insc->insc_montant_totalpaye - $insc->insc_montant_total) == 0)
                                                @else
                                                <a href="#modal-reglement{{ $insc->insc_id }}" data-toggle="modal"
                                                    class="btn btn-warning  btn-xs"
                                                    style="font-weight: 900;font-size: 11px;padding: 1px;margin-top: 2px;">
                                                    <i class="fal fa-file"> Nouveau Réglement</i> </a>
                                                @endif
                                            </td>
                                        </tr>







                                        <div class="modal fade" id="modal-reglement{{ $insc->insc_id }}">

                                            <form method="POST" action="{{ route('et_paiements_crea') }}">
                                                @csrf

                                                <input type="hidden" name="p_idetudiant"
                                                    value="{{ $insc->insc_idetudiant }}">
                                                <input type="hidden" name="p_usercrea"
                                                    value="{{ Auth::user()->name }}[{{ Auth::user()->id }}]">
                                                <input type="hidden" name="username"
                                                    value="{{ Auth::user()->name }} [{{ Auth::user()->id }}]">
                                                <input type="hidden" name="usercrea" value="{{ Auth::user()->id }}">
                                                <input type="hidden" name="p_inscription" value="{{ $insc->insc_id }}">
                                                <input type="hidden" name="cl_id" value="{{ $insc->insc_idclasse}}">

                                                <div class="modal-dialog">
                                                    <div class="modal-content">
                                                        <div class="modal-header">
                                                            <h4 class="modal-title"><i
                                                                    class="fas fa-md fa-fw m-r-0 fa-user"></i> Nouveau
                                                                réglement
                                                            </h4>
                                                            <button type="button" class="close" data-dismiss="modal"
                                                                aria-hidden="true">×</button>
                                                        </div>
                                                        <div class="modal-body">




                                                            <fieldset class="scheduler-border">


                                                                <div class="row">
                                                                    <div class="col-sm-12">




                                                                        <div class="form-group row m-b-0">
                                                                            <label
                                                                                class="col-form-label col-md-5 text-right">Montant
                                                                                payé <small> FDJ</small> :</label>
                                                                            <div class="col-md-7">
                                                                                <input type="number" value=""
                                                                                    class="form-control  text-right"
                                                                                    name="p_montant"
                                                                                    style="font-size: 28px;font-weight: 900;"
                                                                                    required>
                                                                            </div>
                                                                        </div>

                                                                        <div class="form-group row m-b-10">
                                                                            <label
                                                                                class="col-form-label col-md-5 text-right">Type
                                                                                paiement :</label>
                                                                            <div class="col-md-7">
                                                                                <select class="form-control"
                                                                                    name="p_moyen" required
                                                                                    id="div_select">
                                                                                    <option id="cheque" value="CHEQUE">
                                                                                        CHEQUE</option>
                                                                                    <option id="especes"
                                                                                        value="ESPECES">ESPECES</option>
                                                                                </select>
                                                                            </div>
                                                                        </div>



                                                                        <div style="border: #ffd9a6 1px solid;padding: 10px;background: #f8f7f5;"
                                                                            id="div_cheque">
                                                                            <div class="form-group row m-b-0">
                                                                                <label
                                                                                    class="col-form-label col-md-5 text-right">CHèque
                                                                                    N° :</label>
                                                                                <div class="col-md-7">
                                                                                    <input type="number" value="00000"
                                                                                        class="form-control"
                                                                                        name="p_numcheque">
                                                                                </div>
                                                                            </div>
                                                                            <div class="form-group row m-b-0">
                                                                                <label
                                                                                    class="col-form-label col-md-5 text-right">CHèque
                                                                                    Date :</label>
                                                                                <div class="col-md-7">
                                                                                    <input type="date"
                                                                                        value="{{ date('Y-m-d') }}"
                                                                                        class="form-control"
                                                                                        name="p_datecheque">
                                                                                </div>
                                                                            </div>


                                                                            <div class="form-group row m-b-0">
                                                                                <label
                                                                                    class="col-form-label col-md-5 text-right">Banque
                                                                                    :</label>
                                                                                <div class="col-md-7">
                                                                                    <select class="form-control"
                                                                                        name="p_bankcheque">
                                                                                        <option value="BOA">BOA</option>
                                                                                        <option value="BCIMR">BCIMR
                                                                                        </option>
                                                                                        <option value="CAC">CAC</option>
                                                                                        <option value="IIB">IIB</option>
                                                                                        <option value="EXIM">EXIM
                                                                                        </option>
                                                                                        <option
                                                                                            value="EAST African Bank">
                                                                                            EAST African Bank</option>
                                                                                        <option
                                                                                            value="SALAAM African Bank">
                                                                                            SALAAM African Bank</option>
                                                                                        <option
                                                                                            value="SABA African Bank">
                                                                                            SABA African Bank</option>
                                                                                        <option value="ICB BANK">ICB
                                                                                            BANK</option>
                                                                                    </select>
                                                                                </div>
                                                                            </div>

                                                                        </div>




                                                                    </div>
                                                                </div>
                                                            </fieldset>







                                                        </div>
                                                        <div class="modal-footer">
                                                            <a href="javascript:;" class="btn btn-white"
                                                                data-dismiss="modal">Fermer</a>
                                                            <button type="submit"
                                                                class="btn btn-success">Enregistrer</button>
                                                        </div>
                                                    </div>
                                                </div>

                                            </form>
                                        </div>



                                        @endforeach

                                    </tbody>
                                </table>
                            </div>
                        </div>

                        <legend class="scheduler-border h4" style="text-align: left;"> Liste
                            des paiments effectués
                        </legend>
                        <table id="" class="table table-bordered table-hover table-striped w-100"
                            style="background: white;">
                            <thead>
                                <th>ID</th>
                                <th>Réf.</th>
                                <th>Période</th>
                                <th>Moyen de paiement</th>
                                <th>Date </th>
                                <th>Montant</th>
                                <th></th>
                            </thead>
                            <tbody>

                                @php $pmontant=0; @endphp
                                @foreach ($paiements as $p )
                                @php $pmontant=$pmontant + $p->p_montant; @endphp
                                <tr style="cursor: pointer;">
                                    <td>{{ $p->p_inscription }}</td>
                                    <td>{{ $p->p_ref }}</td>
                                    <td>{{ $p->cl_cycle }} {{ $p->cl_nom }} </td>
                                    <td>{{ $p->p_moyen }} {{ $p->p_numcheque }} {{ $p->p_bankcheque }}</td>
                                    <td>{{ $p->p_datecrea }}</td>
                                    <td class="text-right"> <span><strong>{{ $p->p_montant }} </strong><small
                                                style="font-size: 8px;">FDJ</small> </span> </td>
                                    <td class="text-center"> <button class="btn btn-danger btn-xs"><i
                                                class="fal fa-trash"></i></button></td>
                                </tr>
                                @endforeach



                                <tr style="cursor: pointer;">
                                    <td colspan="5" class="text-center">TOTAL Payé</td>
                                    <td class="text-right"> <strong> {{ $pmontant }} </strong> <small
                                            style="font-size: 8px;">FDJ</small></td>

                                </tr>

                            </tbody>
                        </table>
                        <p class="text-right"> <strong> {{count($paiements)}}</strong> Paiment(s)</p>


                        @else
                        <h1 class="text-center text-danger">
                            <i class="fal fa-exclamation"
                                style="font-size: 78px;font-weight: 900;padding-bottom: 25px;"></i> <br>
                            {{ $et->et_civilite}} {{ $et->et_prenom}} {{ $et->et_nom}} n'est inscrit à aucun filière
                        </h1>
                        @endif
                    </div>
                </div>
            </div>
            <div class="col-md-4">
                {{--
                <div class="alert alert-secondary">

                </div> --}}



            </div>




        </div>

    </div>
    <!-- end row -->




    <div class="modal fade" id="modal-dialog">



        <div class=" modal-dialog-md">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title"><i class="fas fa-md fa-fw m-r-0 fa-user"></i> {{ $et->et_civilite}} {{
                        $et->et_prenom}} {{ $et->et_nom}}</h4>
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                </div>
                <div class="modal-body">

                    <div class="modal-body">



                    </div>




                </div>
                <div class="modal-footer">
                    <a href="javascript:;" class="btn btn-white" data-dismiss="modal">Fermer</a>
                </div>
            </div>
        </div>

    </div>



    <script>
        $('document').ready(function () {
    $("#imgload").change(function () {
        if (this.files && this.files[0]) {
            var reader = new FileReader();
            reader.onload = function (e) {
                $('#imgshow').attr('src', e.target.result);
            }
            reader.readAsDataURL(this.files[0]);
        }
    });




  $("#div_select").change(function() {
    var val = $(this).val();
    if(val === "cheque") {
        $("#div_cheque").hide();
    }
    else if(val === "especes") {
        $("#div_cheque").show();
    }
  });
});
    </script>
    @endsection